デザイン解説
テクノロジー領域で活躍中の起業家・経営者のインタビュー記事を配信するメディア。デザインや動きのクオリティが非常に高く、数あるデザインをまとめてきた中でも、トップクラスにクオリティが高い。
一覧ページ
連載記事、通常の記事、イベント記事などの一覧でデザインのテンプレートを分けており、アイキャッチ画像のクオリティが高いためか、ビジネス感のあるオシャレなデザインに仕上がっている。
通常記事の一覧のデザイン
連載記事の一覧のデザイン
イベント記事の一覧のデザイン
詳細ページ
詳細ページでは、背景画像の設定や目次の動きなどを非常に凝っており、通常の記事と連載記事、イベント記事で動きが微妙に変わっており、最適化した作りになっている。
通常の記事と連載記事のデザインと動作
アイキャッチ部分は左側に日付、作成日、タイトル、投稿者が表示され、右側に画像が表示される。左側の背景画像は右側の画像をぼかした画像を使っており、CSSで表現している。
本文にはそれぞれ目次が割り振られ、その目次(h2)直下に画像が表示されているが、その目次に移動した際に、その画像が背景画像として使われる仕様になっている。
制作会社としては、こういったデザインはブラウザ間で挙動が異なったり、スマホ対応が面倒だったり、バグを誘発したりしがちなので、積極的に提案する所は少ないと思うが、あまり見たこともない構成なので、インパクトがデカく、印象に残るデザインになっている。
イベント記事のデザインと動作
イベント記事では右側に開催日情報と参加受付のリンクが固定配置され、左側のメインエリアでは目次がそれぞれ固定される仕組みになっている。
総括
全体的にデザイン・動作のどちらもクオリティが高く、先進的なメディアに仕上がっている。
あまり例を見ない挙動を取るため、閲覧者によっては使いづらいと思う場合もありそうだが、テクノロジー領域の記事を閲覧するユーザ層を考えれば、そこまで問題ではないような気もします。
ただ私自身、デザイン・動きは100点満点に近いですが、少し使いづらいように感じます…。
掲載会社の情報
会社名 | FastGrow |
---|---|
URL | https://www.fastgrow.jp/ |
住所 | 東京都港区南青山2-11-17 |
このようなホームページを作成したい方へ
「ホームページ制作見積もりシミュレーター」を使うと、どのくらいの費用・料金でホームページが作成できるのかがわかります。個人情報の入力をせず、無料ですぐに利用できますので、お気軽にご活用ください。
弊社、合同会社オルトベースは税理士・弁護士に特化したホームページ制作を行っており、今期で5年目となります。お手頃価格で高クオリティをテーマにWeb制作をしておりますので、まずはこちらのフォームからお気軽にお問い合わせください。
ホワイト・白色のデザイン事例
- パパママハウスギャラリー
木の温もりを感じることができる住宅施工会社のホームページ。 「Only One & Art」のキャッチコピーが注文住宅感があり、背景の住宅に関連する写真がスライドで切り替わるようになっている。ファーストビュー上はロゴ、Gナビ、キャッチコピー...
- 株式会社レアル
清水寺の青と緑の配色が美しい写真を全面に出した、京都の街づくりを行う不動産会社のホームページ。 ファーストビュー左下にニュースを、右下には2つの事業を見せ、スクロールすると、縦書きを活用したコンセプトが表示される。和風なあしらいがあり...
- 余白の使い方が美しい先進的なデザインのコーポレートサイト
余白を活かし、文字の形に写真を切り取った処理が印象的なトップページ。 ファーストビューにはナビゲーションが入らないように調整されており、キャッチコピーを強く印象付ける。スクロールしていくとグローバルナビゲーションが現れ、サイト内の各コ...
- 型にはまらないユニークなデザインのコーポレートサイト
サイトを開いてまず目に入るのは、自社商品が提供する価値を伝える動画。動画の上にキャッチコピーが乗り、切り替わり流れる動画に合わせてコピーライティングも変更するという工夫がされている。 トップページを訪れたユーザーは、次々と展開されるメ...
- 縦書きの文字を活用したオシャレな税理士のホームページデザイン例
オリジナルの写真が多く、キャッチコピーに視線を誘導するようレイアウトが工夫されているサイト。デバイスフォントでなく画像内に直接文字を書くことで、雑誌のように自由なレイアウトを実装している。 縦書きの文字や、縦長の写真が比較的多いのも特...