以前、「デザインの参考にしたい「和風」テイストの良質サイト5選」と言う記事を書きました。その中で紹介したサイトにも縦書きのテクニックは取り入れられておりましたが、「和風デザインじゃない」サイトでも縦書きを取り入れているデザインの優れたサイトはたくさんあります。
今回は「縦書きを取り入れたデザインの優れたサイト」を集めてみました。
1.和風デザインで縦書き
まずは王道の和風デザインで縦書きを取り入れたサイトです。
あきた舞妓 -akitamaiko-
ファーストビューが和紙のような背景にロゴマークのみ。ファーストビューは色々盛り込みたくなりますがこのいさぎよいシンプルさがグッド。こちらのサイトは縦書きは画像で表示しています。
【公式】灯屋 迎帆楼
ロゴも縦書きのデザインなのでサイト内の縦書きも全体の雰囲気とマッチしています。こちらはHTML・CSSで縦書きを表示しています。
書画・掛け軸・古美術｜満つ美
ファーストビューの縦書きのナビゲーションが印象的です。スクロールして行くとナビゲーションが横書きナビゲーションに変わり、使いやさを考慮した設計となっています。
山梨県富士川町で120年前に幻となった銘酒「本菱」が復活
サイト全体的に縦書きで表示されています。富士山の背景の上に表示される縦書きテキストはまるでポストカード。素敵です。
-iroha caruta- KOTOWAZA BOOK
「いろは」、「かるた」、「ことわざ」。和をイメージするキーワードですからやはり和風のデザインがベストです。日本語の縦書きと、英文の横書きの対比のレイアウトが面白いアイデアです。
2.和風じゃないデザインで縦書き
何も縦書きは和風デザインだけのものじゃない！ということで和風デザイン以外のサイトです。
採用情報 | 株式会社リブセンス
サイト全体がとてもスタリッシュなんですが、ファーストビューのすぐ下のリードテキストが縦書きになっています。このサイトではここだけが縦書きで、テキストが際立っています。レイアウトを崩して配置している手書き文字もまたいいです。
絵本仕立てのEHONICA
画像で縦書きを表示しています。「絵本仕立てのプロフィールムービー制作」というサービスを提供しているエホニカ。手書き風イラストと縦書きのテキストが絵本を想起させます。
KIDORI -キドリ-
メイン画像に重ねられた縦書きのテキスト。自然と目がいきます。トップページでは全体的に画像にコンテンツのボックスを重ねたレイアウトとなっていて、シンプルだけど単調ではない印象になっています。
ベイク チーズタルト
全体的に斜めのレイヤーが多様されていて、レイアウトが見ていてとても面白いです。縦書きはポイントポイントでタイトルやリードテキストで使用されています。
ウエディング｜ノバレーゼ
ウエディングと和風、一見釣り合わない印象ですが、ファーストビューの素敵な写真の上に表示された縦書きのテキストが読みやすい文字間隔、サイズになっていて良い感じです。ナビゲーション以外はほとんどのテキストが縦書きになっています。（BGMが流れますので注意）
縦書きの実践編をアップしました
合わせて読みたい
まとめ
縦書きもHTML・CSSで表現できるようになってきて、WEBの進化は改めてすごいなぁと思いました。今後、「縦書き」ならではのアニメーションやレイアウトを取り入れたサイトもどんどん出てくるんでしょうね。サイト集めがライフワークな私にとってはそんなサイトを発見できるのがとても楽しみです。
それでは良いWEBデザイン日和を！Have a nice WEBDESIGNDAY!
