株式会社Link’s

外部ページURL

無彩色の配色と明朝体の英字見出しで
住まいの総合力を伝えるサイト

宮城県仙台市に拠点を構える株式会社Link’sの公式サイトは、色数を大きく絞った画面づくりによって、住まいに関わる工事をまとめて相談できる会社であることを伝えています。Webデザインの見本として眺めると、写真以外の要素からほとんど彩度を取り除き、明度の差だけで情報の階層を組み立てている点がいちばんの特徴です。

この記事では、キャプチャから確認できる配色や余白、見出しの組み方、写真の使い方、そして問い合わせまでの導線を順番に読み解いていきます。仙台で内装リフォームや外構工事を手がける住宅系サイトの設計を考えている方にとって、参考にしやすい構成になっています。

無彩色でまとめた配色が生む静かな印象

このサイトの第一印象を決めているのは、色を徹底的に絞った配色です。背景やボタン、帯として使われている面はいずれも赤・緑・青の値がそろった無彩色で、色みは写真の中だけに現れます。にぎやかさよりも落ち着きを優先した判断が、全体のトーン&マナーを支えています。

白・淡いグレー・チャコールの三段構成

面の色は、白、淡いグレー、チャコールという三段階でほぼ組み立てられています。基調は白で、セクションが切り替わるところに淡いグレーの面を挟み、要所ではチャコールの濃い帯を敷いて画面を引き締めています。同じ無彩色でも明度が三段階に分かれているため、スクロールしていくと区切りを自然に感じ取れます。

ボタンは中間の濃さのグレーでそろえられており、背景が白でも淡いグレーでも同じ強さで浮かび上がります。押せる場所の見た目を統一しておくと、読み進める人が次の一歩で迷いにくくなります。

色は写真だけに担わせるという割り切り

彩度のある色は、屋根の上に広がる青空、庭に敷かれた芝生の緑、積み上げられた木材の色みなど、すべて写真が担当しています。文字は濃いグレーでそろえられ、装飾のための差し色はほとんど使われていません。

この割り切りによって、写真に写った住宅や外構がそのまま画面のアクセントになります。仕上がりを見せたい住宅系のサイトでは、素材そのものを主役に立てられる有効な考え方だと言えます。

ファーストビューが示す一社完結という価値

トップページを開いて最初に目に入るのは、全幅で敷かれた住宅写真と、その上に重ねられた白い文字です。会社の説明を並べる前に、まず伝えたい価値を短い言葉で置く組み立てになっています。

太陽光パネルを載せた住宅写真と明朝体のコピー

背景写真には、屋根に太陽光パネルを設置した住宅が大きく写されています。青空の面積が広く取られているため、上に重なる白い文字がつぶれずに読めます。写真そのものが太陽光発電の施工内容を語っている点も、無駄のない選び方です。

主コピーは字間を広げた明朝体で二行に組まれ、住まいの相談をひとつの窓口で受け止めるという趣旨が短くまとめられています。その下には英文のタグラインが小さく添えられ、和文と英文で視線にかかる重さを変えています。

余白に効かせた図形と線画

コピーの左右には、大きさをそろえない半透明の白い四角形が置かれています。写真の上に軽い抜け感をつくり、文字のまわりに視線をとどめる役割を果たしています。

画面の左下には、直線と小さな円をつないだ線画が薄く重ねられています。住宅の写真だけでは出しにくい技術的な印象を、控えめに足すための装飾です。

迷わせないための情報設計

ヘッダーからヒーローの下までの並びを見ると、閲覧者が取りたい行動を先回りして置いていることが分かります。連絡先と問い合わせの入口が、スクロールを始める前の段階で二度現れる構成です。

二段のヘッダーと横並びのグローバルナビ

ヘッダーの最上部には、サイトの内容を説明する小さな一行が右寄せで置かれています。その下の段には電話番号と問い合わせのボタンが並び、左側には線の細い手書き風のロゴが配置されています。

グローバルナビは、ホーム、当社について、事業内容、製品紹介、お客様の声、よくある質問、会社概要、ブログ、お役立ち情報という九つの項目が横一列に並びます。字間を広げた和文で組まれているため、項目数が多くても窮屈に見えません。

ヒーロー直下に置いた連絡先の帯

ヒーローのすぐ下には、左右で色を分けた帯が敷かれています。左側は淡いグレーの面に電話番号と営業時間、定休日をまとめ、右側はチャコールの面に問い合わせの導線を置いています。

同じ帯の中で明度を変えることで、どちらが行動を促す側なのかが一目で分かります。連絡手段を電話とフォームの二つに絞り、それ以外の情報を混ぜていない点も分かりやすさにつながっています。

事業内容を一望させるカードレイアウト

FEATUREと名付けられたセクションでは、扱っている工事の分野をカード形式で並べています。文章で長く説明する前に、対応できる範囲の広さを面積で見せる組み立てです。

三列二段に並ぶ六つの分野

カードは横三列、縦二段の合計六枚で並び、外構、造成工事、塗装、内装工事、太陽光発電、そのほかのサービス全般という分野が示されています。それぞれの写真には暗いオーバーレイがかけられ、その上に白い文字で分野名と短い説明が重ねられています。

写真の明るさがばらついていても、オーバーレイの濃さをそろえておけば文字の読みやすさは保たれます。素材の条件に左右されにくい、実務的な処理だと言えます。

形をそろえたボタンと英字に和文を添えた見出し

各カードの下には同じ大きさ、同じグレーのボタンが置かれ、左端に小さな山括弧が添えられています。六つとも見た目が同じなので、どの分野も同じように詳しく読めることが伝わります。

セクションの見出しは、大きな英字を明朝体で置き、その下に短い罫線と和文の小見出しを重ねる二層構造です。INTRODUCTION、CONCEPT、PRODUCT、BLOG、ABOUTなど以降のセクションでも同じ型が繰り返され、縦に長いページ全体の統一感を支えています。

中盤以降で変化をつけるレイアウトの工夫

見出しの型は繰り返す一方で、本文まわりのレイアウトはセクションごとに変えられています。単調になりがちな縦長のトップページに、リズムを与えるための工夫です。

パネルを左右に並べたCONCEPTとCOLUMN

会社の考え方を伝えるCONCEPTと、記事を案内するCOLUMNは、淡いグレーのパネル二枚を左右に並べる形で置かれています。パネルの隅にはわずかな明度差の斜め模様が入り、平坦になりすぎないように処理されています。

どちらのパネルにも、続きを読むためのボタンが一つずつ置かれています。並列に見せながら行き先を分けることで、会社を知りたい人と情報を読みたい人の両方を受け止められる形になっています。

縦組みのラベルを添えたVOICEとFAQ

お客様の声とよくある質問のセクションでは、チャコールのパネルの左外側に英字のラベルが縦向きで置かれています。文字を回転させることで、限られた幅に見出しを収めながら独特の表情をつくっています。

パネルの下には同じ幅の写真が続けて重ねられ、背面には左右へはみ出す淡いグレーの帯が敷かれています。三つの面が少しずつずれて重なるため、四角い箱が整列するだけの構成から抜け出しています。濃い面の上では、英字のラベルをほぼ白、説明文をわずかに落とした明るいグレーにして、明度だけで階層を作っている点も丁寧です。

透過パネルを重ねたPRODUCT

取り扱い商品を紹介するPRODUCTでは、住宅の写真を薄く敷いた上に、白い半透明のパネルが重ねられています。背景に文脈を残しながら、文字の読みやすさを確保するための処理です。

その中に、人工芝、防草シート、水回りの設備、木材という四枚の写真が横一列で並びます。工事中の写真が続いたあとに素材そのものの写真を挟むことで、扱う範囲が施工だけにとどまらないことが伝わります。

サイトが伝えている事業と会社の情報

デザインの土台にあるのは、掲載されている情報の幅の広さです。トップページと下層ページを合わせて読むと、建物と土地の両方に関わる工事を受けていることが分かります。

内装から外構、造成までの守備範囲

会社概要のページには、内装や外装のリフォームをはじめ、塗装や外構の工事、太陽光発電と蓄電池の設置、建築資材の販売、テナントの工事、宅地の造成、給排水や電気の設備工事、そして不動産の売買仲介や買取までが事業として挙げられています。

内装のページでは、キッチンや浴室、洗面所、トイレといった水回りの入れ替え、壁紙や床材の張り替え、照明の位置の見直しなどが説明されています。段差の解消や手すりの設置、引き戸への変更といったバリアフリー化、家族構成の変化に合わせた間取りの見直しにも触れられています。

製品紹介のページでは、人工芝と防草シートを自社ブランドとして展開していることが示されています。施工を請けるだけでなく、使う素材そのものにも関わっている点が、掲載内容から読み取れる特徴です。

会社情報を一覧できるABOUT

ページ下部のABOUTでは、電話番号、FAX番号、所在地、代表者名、営業時間、定休日、事業内容が一覧表にまとめられています。項目名を左、内容を右に置き、行ごとに細い罫線で区切る素直な組み方です。

所在地は仙台市若林区荒井で、会社概要のページでは荒井駅から近い場所に拠点を構えていることが説明されています。代表者は大山 力也様、営業時間は9時から17時まで、定休日はお盆期間と年末年始と記載されています。宮城県内に加えて山形県や福島県でも内外装や外構の工事に対応していることも、同じセクションで示されています。

最下部のフッターは、五列に分けたリンクの一覧と、右端に置いた手書き風のロゴでまとめられています。ヘッダーのナビには入り切らない各分野のページも並ぶため、読み終えた位置からでも目的のページへ移動できます。

まとめ:仙台の住まいの相談窓口として整えられたサイト

株式会社Link’sの公式サイトは、無彩色でそろえた面の設計と、英字に和文を添えた見出しの型によって、落ち着いた印象を最後まで保っています。色を写真だけに持たせているため、施工した住宅や外構、扱っている素材が自然と主役になります。

情報設計の面でも、ヘッダーとヒーロー直下に連絡先を置き、カードで事業の全体像を見せてから各分野の詳細へ進ませる流れが整理されています。縦に長いトップページでも読み進めやすいのは、セクションごとに背景の明度とレイアウトを変えているからです。

住宅の工事を扱うサイトをどう設計するかを考えるうえで、参考になる部分の多い一例だと感じます。配色の落ち着きや写真の重ね方は実際の画面で確かめるのがいちばん分かりやすいので、仙台で内装リフォームを手がける株式会社Link’sの公式サイトもあわせてご覧ください。