アイコンフォント

パソコンのデスクトップ画面や各種ソフトウェアの画面には、メニューやタスクバーやツールバーなどにアイコンが使われています。これのおかげで、直感的に何の機能が使えるのかが分かるようになっていますが、複数設置していますと、却って、画面が見にくくなるというデメリットがあります。

Webデザインにおいても、アイコンはページの見易さを高めたり、コンテンツがどこにあるのかを示す為に使われる事がよくあります。しかし、複数のアイコンを設置し過ぎますと、これ自体が画像データである為、ページの読み込み時間に悪影響を与えます。

このアイコンの設置のし過ぎによって、発生するデメリットを減らしていくには、代替になる方法を導入すると改善します。

近年では、アイコンフォントと呼ばれるフォントが登場しています。アイコンフォントは、Webページのレイアウトや背景色や文字色などのデザインを設定する時に使われるCSSで調整する事が可能です。

通常のフォントのように扱う事が出来ますので、サイズや色を調整したい時には、CSSから手軽に調整出来ますので、Webページを制作している者にとってはメリットが大きいでしょう。

アイコンフォントを導入すれば、ページの読み込みも早くなります。アイコンフォントは画像データではありませんので、複数設置してもスムーズにページの読み込みが行えます。

また、サイトへの訪問者がスマートフォンユーザーである場合、スマートフォン向けのページで表示させるケースが多いですので、モバイル回線が速度制限になっていても、普段と変わらない速度でページを表示出来るのは、サイト管理者とサイト閲覧者の双方に利点があります。

アイコンフォントの設定は、HTMLにフォント名を示すクラスを追加するだけで済みます。従来のアイコンのように、画像編集を行わなくても済む点は、Webサイト制作者にとっては制作の手間を減らせて、コンテンツ作りに一層専念出来るので優れています。