Axia Japan税理士法人の公式サイトは、白と砂色を土台にした静かな画面に、縦組みの日本語コピーと大きな風景写真を組み合わせたトップページが目を引きます。士業のサイトでありながら文字を詰め込みすぎず、写真と余白で第一印象を決めている点が、デザインの見本として参考になります。
ここでは、ファーストビューの組み立てから配色、取扱い領域の見せ方、下層ページへ送り出す導線までを順番に読み解いていきます。情報量が多くなりがちな事務所サイトを、どのように整理すれば読みやすくなるのかを考える材料になるはずです。
ファーストビューは縦組みのコピーと風景写真の対比で見せています
トップページで最初に目に入るのは、画面の左端に立てられた縦書きの日本語コピーと、その右側に大きく広がる風景写真です。文字の領域と写真の領域を左右できっぱり分け、境目をまっすぐな縦のラインでそろえているため、開いた瞬間に落ち着いた印象が伝わります。
白い帯に立てた縦書きの見出し
左端の帯は写真と重ならない独立した白い面として確保されています。そこに明朝体の縦組みでコピーが置かれ、経営者への語りかけとして読ませる構成になっています。
縦書きは1行の長さを目で追いやすく、日本語の書籍に近い落ち着いた読み心地を生みます。背景を白のままにして装飾を足していないので、右側の写真が持つ情報量に負けずに文字が立って見えます。
写真の下端に重ねた相談窓口のまとまり
写真の下側には、濃いチャコールグレーの四角いブロックと、そこに続く4つの枠が重ねて置かれています。左のブロックが見出しの役割を担い、右側に窓口が並ぶという関係が、色の濃淡だけで読み取れるようになっています。
4つの枠はメール、電話、LINE、Chatworkの順に2行2列で並び、それぞれの下に受付時間などの補足が小さな文字で添えられています。LINEとChatworkにはサービスのアイコンが付いているため、文字を読み込まなくても連絡手段の違いが判別できます。
白・砂色・チャコールの3色でサイト全体のまとまりを保っています
配色は、面積の大きい順に白、砂色に近いベージュ、そしてほぼ黒に見える濃いチャコールグレーという3色で構成されています。色数を絞ったうえで、区切りたい場所にだけ色の違う帯を差し込むという考え方が徹底されています。
帯の色でセクションの切り替えを知らせる
ベージュの帯は、ファーストビューのすぐ下に置かれた1行見出しの並びと、ページ後半にある2枚の横並びカードの背景に使われています。離れた2か所で同じ色を繰り返すことで、間に挟まれた白い領域がひとまとまりに見え、ページ全体に大きなリズムが生まれます。
白い背景の区間では、写真や濃い色のパネルが自然と主役になります。背景そのものは主張せず、置かれた要素の形と余白だけでセクションを分けているため、スクロールしても視覚的な疲れが出にくい作りです。
ゴールドを効かせた小さなアクセント
取扱い領域のカードに重なる大きな連番と、お知らせ行の左端にある小さなラベルには、くすんだゴールドが使われています。使う面積を小さく保っているので、派手にならずに視線が止まる場所だけを作ることができています。
写真そのものが持つ青や紺も、実質的な差し色として働いています。空と海の青、スーツの紺が繰り返し現れることで、色を細かく指定しなくてもサイト全体のトーンがそろって見えます。
取扱い領域は連番付きの2列カードで一覧できます
事務所が扱う分野は、写真を背景にしたカードを2列に並べる形で一覧化されています。同じ大きさ、同じ文字組みのカードが12枚続くため、特定の分野だけを目立たせずに対応の幅そのものを印象づける見せ方になっています。
英字ラベルと日本語名を2段で重ねる
各カードは、上に小さな英字ラベル、下に大きな日本語名という2段構成で統一されています。英字は文字間を広げた明朝系、日本語は太めのゴシック体という組み合わせで、どちらを先に読むかが自然に決まります。
税務顧問や会社設立支援、年一確定申告、相続税対策・申告といった項目が同じ体裁で並ぶので、訪問者は自分の目的に近いカードを探すだけで済みます。写真の上には暗い膜が重ねてあり、どの写真でも白い文字がしっかり読めるように処理されています。
大きな連番が一覧の中の位置を示す
カードの右下寄りには、01から12までの連番が半透明の大きな数字で置かれています。数字は写真の一部のように沈んでいて、読ませるためというよりも、一覧のどのあたりを見ているのかを感じさせる目印として働いています。
カード同士の間隔は上下左右ともゆったりと取られ、罫線を引かなくてもひとつずつのまとまりが分かります。画像を主役にしたグリッドでは、余白の量そのものが読みやすさを左右することがよく分かる作りです。
左右を入れ替える分割レイアウトでページに変化をつけています
取扱い領域の前後には、画面の幅いっぱいに広がる分割レイアウトのセクションが置かれています。写真と濃い色のパネルを左右に並べ、セクションごとにその位置を入れ替えることで、同じ型を繰り返しながらも単調さを避けています。
写真とパネルの位置を反転させる
事務所の紹介では写真が左、テキストのパネルが右に置かれ、続く税理士紹介では反対にパネルが左、写真が右へ移ります。さらにその次の相談の流れでは再び写真が左に戻り、左右が交互に入れ替わっていきます。
視線の出発点が交互に変わるため、スクロールが進んでも同じ景色を見せられている感覚になりません。パネル側は見出しを中央にそろえ、上下に広い余白を残しており、写真と向き合っても内容が窮屈になっていない点も特徴です。
「詳しくはこちら」を共通のパーツとして繰り返す
各パネルの下部には、下線の付いた「詳しくはこちら」という同じ形のリンクが置かれています。下線の右端には小さな三角の印が添えられ、この先に続きがあることを示す記号として機能しています。
形と位置をそろえたリンクを繰り返すと、訪問者は一度覚えた操作をそのまま使えます。セクションごとに違うボタンを作らない判断が、画面の静けさと分かりやすさの両方を支えています。
ページ後半は一覧とフッターを整理して締めくくっています
後半には、2枚の横並びカード、記事の一覧、そして問い合わせのまとまりが順番に置かれています。上から下へ進むほど、読み物から連絡手段へと役割が移っていく組み立てです。
2枚のカードはいずれも、左に小さな写真、右に英字ラベルと日本語見出しという同じ型でそろえられ、片方はよくあるご質問への入口になっています。並べる数を2枚に絞ったことで、細かな見出しが続く区間でも画面が混み合っていません。
記事の一覧は4枚のカードが横一列に並び、サムネイル、小さなラベル、タイトル、日付という順に情報が積み上がります。サムネイルにはロゴを載せた共通の画像が使われているため、一覧全体の見た目がそろい、タイトルの文字が読み比べやすくなっています。
フッターでは、ファーストビューと同じ4つの窓口が細い二重枠の大きなボタンとして並び直され、その下に英字のメニューが2段、さらにロゴと所在地、地図へのリンクが続きます。最後にたどり着く場所へ連絡手段をもう一度置く構成は分かりやすく、税理士へのオンライン相談を考えている方はAxia Japan税理士法人の公式サイトへ進むと実際の並びを確認できます。
静岡や浜松で税理士のサイトを見比べるときの視点
ここまで見てきた作りは、静岡や浜松で税理士を探している方がサイトを見比べるときの視点にもつながります。地域名と業種を組み合わせて検索した人は、扱っている分野と相談の進み方を短い時間で確かめたいと考えるためです。
会社設立や確定申告のように、初めて依頼する場面では専門用語そのものが壁になりがちです。分野ごとにカードを分けて英字と日本語を併記する見せ方は、自分の相談がどこに当てはまるのかを絞り込みやすくします。
相談の流れを独立したセクションとして持たせておくと、問い合わせの前後に何が起こるのかを想像しやすくなります。連絡手段が複数ある場合も、同じ形と同じ並びでまとめて見せるほうが、選ぶ側の迷いは少なくなります。
静岡市のように事務所が集まる地域では、載せている情報の多さよりも探しやすさの差が印象を分けます。写真と余白で速く読ませ、詳しい説明は下層ページに預けるという配分は、その意味でも理にかなった設計です。
まとめ：落ち着いたトーンで信頼感を伝えたいときの見本になります
Axia Japan税理士法人の公式サイトは、縦組みのコピーと風景写真で入口の印象を決め、連番付きのカードで扱う分野を一覧させ、分割レイアウトで下層ページへ送り出すという流れが最後まで一貫しています。色数と書体の種類を絞り、余白を広く取ったことで、扱う分野が多くても窮屈さを感じさせません。
写真の選び方、帯の色でセクションを区切る方法、同じ形のリンクを繰り返す作法は、業種を問わずコーポレートサイトに応用しやすい工夫です。堅さを保ちながらも冷たく見せない配色の作り方として、参考にできる部分が多くあります。
配色や余白の取り方は、説明を読むよりも実際の画面を見たほうが早く伝わります。デザインの参考にしたい方にとっても、相談先を探している方にとっても、確かめてみる価値のある一例です。
