【漫画】フリーランスは“103万円の壁”にどう向き合うか?
- お金
- フリーランス/個人事業主
- 漫画
さまざまな技術やアイデアがWebデザインに取り入れられるいま、平凡なデザインではユーザーの目にとまりません。ユーザーはユニークかつクリエイティブなデザインを求めています。
こうした欲求を満たすのは、アニメーションや大掛かりな仕掛けだけではありません。とても小さな工夫が、大きな違いをうむこともあります。そうした工夫のひとつが「文字を縦に配置したデザイン」です。
今回は文字を縦にした、斬新でスタイリッシュな縦書きWebデザイン10選をご紹介します。
目次
左側のナビゲーションバーが縦になっているのがお分かりでしょうか。横書きの文字を90度回転させています。
このようにナビゲーションバーを配置することで、ヘッダーが広々として見え、サイトロゴが目立つという利点も。意匠が凝らされたデザインです。
こちらもArchi Graphiと同じく考え抜かれた縦書きデザインです。縦にした文字をアクセントとして使っています。
文字との調和を考えて、背景に縦線を配置しているところもポイントです。
Yo:Haもアクセントとして文字を縦にしています。縦になっているのは、ソーシャルメディアのリンクとホームボタンです。
画面を縦に区切ったり、縦線を配置することによってデザインの一貫性を保っています。
カタカナの「デザイン」が印象的なこちらのWebページは、個人のポートフォリオサイトです。
レイアウトを分割して余白を確保しており、全体的にセクシーな雰囲気です。文字を縦にしたナビゲーションによって、デザイン全体が美しく仕上がっています。
四隅に縦書きの文字リンクが配置されています。
このような配置は個性的なだけでなく、ヒーローエリアに注目を集めるのにぴったりです。
ナビゲーション以外が縦になっている例も見てみましょう。Prime Park SessionsのWebサイトのように、社名やキャッチフレーズなど、注目を集めたい内容を縦にするのもおすすめです。
縦にした文字で面白いのは、「下から上」に読むケースもあれば、その逆もあるというところ。こちらは「上から下」に読むデザインです。右端のナビゲーションも縦に揃えることで、Webデザインの調和を保っています。
画面左にキャッチフレーズを縦書き配置し、幅広のサイドバーのように見せています。
キャッチフレーズの上にはハンバーガーメニューが。ユニークで魅力的なデザインです。
日本のWebサイトにも、縦書きデザインが取り入れられることはよくあります。
見出しがナビゲーションの一部として、画面右側に縦書き配置されています。
Kitamura Makuraと同様、おもに見出しが縦配置になっています。
こちらはブロックの一部として配置されているのが特徴です。
ここまでにご紹介した例はいずれも文字が小さめでしたが、こちらはデザインの一部として大きな文字を縦配置しています。
文字の存在感は保ちつつ、コンテンツが優先されるようなデザインですね。
本記事でご紹介する中で、一番文字が大きいのがこのデザイン。
縦にアルファベットを並べる、比較的珍しいデザインですね。
西洋の言語には縦書きはありませんが、中国語や日本語は本来縦書きです。
こちらは縦書きの文字を使った中国語のWebサイト。モノクロで余白が大きく、シンプルでスッキリした印象です。縦書きの文字がアクセントになっていますね。
Webデザインにおいて、縦に配置した文字はマイノリティです。しかしだからこそ、ユーザーに新鮮な驚きを与えられる可能性を秘めています。
ちなみにWorkship MAGAZINEでも、文字を縦に配置したデザインを採用しています!
縦書き文字でデザインにアクセントを加え、斬新なWebサイトを作ってみてください。
(原文:Nataly Birch 翻訳:Asuka Nakajima)
あわせて読みたい!▼
おしゃれでかわいい英語フリーフォント120選【無料&商用可多数】
Workship MAGAZINE
タイポグラフィーのデザイン基本16ルール&作り方。原則は時に”破られる”
Workship MAGAZINE
タブバーのデザイン事例と、ユーザー思いなUI作り 10の秘訣
Workship MAGAZINE