WEBフォントの活用

デザインを行う上でイメージを大きく左右するのがフォント。
中でも苦労するのがテキストフォントの互換性です。

今まではOSにインストールされたフォントを使用するのが主流でしたが、ユーザーの環境によって見栄えが変わってしまうことが難点。

そこで、ユーザー環境に左右されないWEBフォントを使ってデザインの統一化を図りましょう。

 

■メリットとデメリット

例えば、デザイナーが意図したフォントをユーザーごとに統一して表現しようとする場合、 画像としてデザインを行うことが主流ですが、それゆえにSEOに不利だったり、加筆や修正が加わった際、編集の手間がかかっていました。

しかし、テキスト化することでこれらの点が大幅に改善できます。

データ量の膨大さから日本語対応しているフォントが少ないことや、バイト数の大きいWEBフォントの場合は読み込みに時間がかかることが指摘されていますが、これらの問題も徐々にクリアになりつつあるため、デザイナーとしてはぜひ使用してみることをおすすめします。

 

■活用するには?

一見すると難しいと思われがちですが、使用方法はいたってシンプル。

手順は以下。

 

①使いたいフォントを見つける
②CSS3の@font-faceでフォントファイルを指定
③CSSでWebフォントを適用させる

 

さらにGoogleが提供している「Google Web Fonts」を使えば前述の利用方法とほぼ同様かつ、フォントファイルをアップロードする手間が省け直感的に使用が可能です。
テキスト化することで作業効率アップに繋がり、本来のデザイン意図がユーザーに伝わることでデザイナーのモチベーションも高まります。
さらにページを閲覧したユーザーも統一感のあるデザインは気分が良いものです。

海外のECサイトでは、アイコンのWebフォントを作成するサービスSymbolsetなどはWebフォント提供サービスだけにサイト上がWebフォントを活用しています。
また読み込み速度が向上するのでスマートフォンなどモバイルデバイスの需要が大きいECサイトでは徐々に日本語Webフォントが充実してくる為、今後検討してみると良いでしょう。

 

WEBフォントを積極的に活用してデザイナーとしての表現の幅を広げていきましょう

 

ネットショップの運営で人材不足・ノウハウ不足でお困りの方は「EC運営代行サービス」をご検討ください。

人材はいるけどノウハウ不足でお困りの方は「ECコンサルティングサービス」をご検討ください。