スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

    ウェブプログラミング講座

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Homeウェブデザイン基礎講座 > 2016年のウェブタイポグラフィトレンドのゆくえ

2016年のウェブタイポグラフィトレンドのゆくえ

投稿日:2016年6月10日

このチュートリアルではウェブタイポグラフィトレンドについて紹介します。


Step1:はじめに

素晴らしいウェブタイポグラフィデザインを作成するには、今のトレンドが何であるかということと、ベーシックなデザインスキルのバランスが求められます。あなたは見た目のよいものを見分ける観察眼が必要で、またタイポグラフィがサイトを訪れた人にとって読みやすいかどうかも考えなければなりません。たとえウェブサイトがもっとも美しいデサインであったとしても、訪問者がウェブサイトは何を伝えたいのかが理解できなければ、そのデザインは使われることはありません。トレンドを理解することは重要ですが、トレンドを取り入れるためにあなたが美しいデザインを犠牲にしても、それは必ずしも良いとは限りません。

これらのトレンドを考慮してください。



Step2:トレンド#1 大きなコールトゥアクション 対 小さなインフォメーションテキスト

ひとつ目のトレンドは、最近一般的になってきたコールトゥアクションテキスト対インフォメーションテキストです。コールトゥアクションテキストは視線をコールトゥアクションボタンへ引き込み、サイト訪問者に顧客かあるいは加入者へ切り替えるように促進する傾向があります。大きなコールトゥアクションテキストはさらに視線を引き動かすためにしばしば利用され、一般的に大きいテキストも小さいテキストも同じフォントですが、それは最小限で補足的な書体であるべきです。

大きなコールトゥアクション 対 小さなインフォメーションテキスト

例:www.apple.com






Step3:トレンド#2:単純化された書体

2015年秋にグーグルが新しいロゴデザインを発表し、そして2016年に向けてタイポグラフィでのおもしろいトレンドをスタートさせました。グーグルの新しいロゴはかなり単純で、そして読みやすいフォントで構成されています。しかしながら、それは多数の色で明るく、そして生き生きとしています。よりシンプルなフォントを選択することによって、機能しないかもしれないもっと複雑な書体とは違ってアニメーションやトレンディなグラフィックスのような追加要素を加える事ができます。

あなたはグーグルが特定の休日や特別な時を祝うためにしばしばそのロゴにいくつかのバックグラウンドグラフィックスを加えていることに気がついているでしょう。もし全体的な書体がシンプルであれば、これは簡単に行なうことができます。

単純化された書体

例:google.com



Step4:トレンド#3:水で薄めたフォント

ウォーターカラーは今年のデザインで大きな波を作っているように思われます、そしてフォントもこの現象の例外ではありません。ウォーターカラーフォントは外見がとても柔らかく、ウォーターカラーバックグラウンドの見た目を弱めます。このフォントはロゴやコールトゥアクションで最も良く働いてくれます。ウォーターカラーの外観はポートフォリオや芸術家のサイトなどで良く使われています。もしウェブサイトのオーディエンスがミレニアル世代で構成されているのなら、この書体が彼らの興味を掴めるかどうか考慮する必要があります。

水で薄めたフォント

例:eat-yourself-skinny.com



Step5:トレンド#4:カスタム書体

1億8,700万人以上の人々がスマートフォンでインターネットをサーフするために使うという状態で、いくつかの会社は書体をカスタマイズし、そして多数のデバイスに合ったものを選択する重要性を理解しました。例の1つが読者のためにBookerlyという書体を生み出したアマゾンです。アップルやグーグルも彼らオリジナルのカスタム書体を持っています。

カスタム書体

例:fastcodesign.com



Step6:トレンド#5:結合した書体

ときどき1つのフォントだけでは要点を理解してもらうには充分でない時があります。2016年の1つのトレンドは、ユニークなロゴやあるいは全体的なデザインコンセプトを作成するために複数のフォントを結合することです。あなたが望むことは、あなたが使っているフォントがお互いを補うフォントであるという確信を得ることでしょう。例えば、それはセリフとサンセリフを組み合わせるために機能するが、しかしサンセリフとスクリプトには機能しないといったような。もちろんあなたは2つ以上の異なったフォントを組み合わせることが可能です。しかしながら、あなたのページに多くの異なったフォントを配置する際は、サイト訪問者にとってそれが気が散るようなモノにならないように細心の注意を払ってください。

結合した書体

例:theforecaster-interactive.com



Step7:トレンド#6:強い書体が持つヒーローイメージ

ウェブサイトデザインを審査しその傾向を注視しているAwwwards.comによれば、1つのトレンドはヒーローデザインの中にあるとのことです。なぜなら多くの人々が高速回線を使用しており、デザイナーは大きなイメージをメインページ上に使うことができます。しかしながら、画面サイズに合わせた大きなバックグラウンドイメージは大胆に大きい書体を使うことが重要で、そうでなければイメージは様式として失われるでしょう。

このトレンドは全体的なデザインやグラフィックスベースの書体のロゴや各種ウェブページ、特にホームページで現れます。

強い書体が持つヒーローイメージ

例:maaemo.no



Step8:最後に

2016年はとても明快で新しいトレンドが登場する様相を呈しています。上のリストアップした要素が一般的で、そしてあなたがインターネットをブラウジングするとき、デザイナーは常に新しいアイデアを提供してきます。ウェブサイトの見た目の良さやどこに目が行くかということを知ることはなぜ重要なのかということは、自然にウェブページへ描かれています。

これを学ぶことによって、あなたは良いデザインセンスを身につけ、そして必要とされる時にルールを破り、あなたのクライアントのために一番のデザインを提供するようになるでしょう。あなたがこれまで通りにするか、あるいはこれまでにない発想をするかどうかはあなたのデザインに対する好み次第です。



引用:Web Design Library  著者:Adrienne.Erin  翻訳:山下



スポンサードリンク

コメント

ランダム記事5件

2016年5月の人気記事ランキング