この記事のポイント
・アイコンフォント作成のおすすめは「Font Awesome」
・ファビコン作成のおすすめは「Favicon Generator. For real」
・アイキャッチ作成のおすすめは「Canva」
アカイです。今回はホームページ制作で便利な編集サイトを紹介します。
ホームページ制作だけでなく、ブログ制作でも活用できますので、ぜひご参考ください!
1.おすすめのアイコンフォント作成サイト
・アイコンフォントとは?
アイコンフォントとは、Webサイト上で文字と同じように表示できるアイコンのことです。
画像の場合
- データが重くなってしまう
- 拡大すると画素が荒くなってしまう
デメリットがあります。
アイコンフォントを使えば
- 拡大しても画質変化なし
- データが軽い
- 色、サイズのカスタマイズが可能
のメリットがあります。
・アイコンフォント作成のおすすめは「Font Awesome」

「Font Awesome」の利点は以下の通りです。
- 誰でも簡単に無料で利用することが可能
- 無料版でも必要最低限のアイコンを入手可能
・アイコンフォントサイトの使い方
私の場合、
- 既存のフォントが存在(TwitterやAmazonなど)、矢印といった簡単な記号は
「Font Awesome」を活用 - 込み入ったアイコン作成が必要な場合は「Adobeのillustrator」で作成
と使い分けています。
例えば
Twitterのマーク
Lordingのようなマーク
など「Font Awesome」を使用して表示させることができます。。
2.おすすめのファビコン変換サイト
・ファビコンとは?
ファビコンとは、Webサイトにブックマークしたりタブ表示した際に、
サイト名の横にちょこんと表示されている小さなアイコンのことです。

・ファビコン変換サイトのおすすめは「Favicon Generator. For real」

「Favicon Generator. For real」の利点は以下の通りです。
- WEBサイト用のファビコンだけでなく、
- スマートフォンのホームスクリーン
- Windowsのスタートメニュー
- タスクバー用画像
- といった画像を一括で作成可能
・ファビコン変換サイトの使い方
illustrator等を用いて、ファビコン用のファイルを作成します。
このとき、縦横は正方形のサイズ、PDF形式にしておくことに気を付けます。

「Favicon Generator. For real」で対象画像を変換すると
本サイトタブに載っているようなファビコン生成されます。
3.おすすめのアイキャッチ作成サイト
・アイキャッチとは?
アイキャッチとは、サイトを表す一枚絵のことを言います。
ブログがわかりやすい例で、本記事の以下画像のことを指します。

・アイキャッチ作成のおすすめは「Canva」
「Canva」の利点は以下の通りです。
- シンプルかつ豊富なテンプレートがある。
- WEB上でアイキャッチ作成が可能。
・アイキャッチ作成サイトの使い方
初回は、できる限りシンプルなテンプレートを探すことをおすすめします。
その理由はテンプレートが多すぎるため、その探索時間に無駄が発生するためです。
- まずはシンプルテンプレートで作成、
- 気に入ったものが見つかれば、その後差し替える。
という流れがおすすめです。
テンプレート元は「プレゼンテーション」から探すと、画像比率が最適なまま気に入ったテンプレートを見つけることができます。
4.リサイズ、ファイル変換サイト
以下記事で紹介していますので、ご参考ください。
4.まとめ
・アイコンフォント作成のおすすめは「Font Awesome」
・ファビコン作成のおすすめは「Favicon Generator. For real」
・アイキャッチ作成のおすすめは「Canva」

すべてWEB上で完結できてしまうことがすごいところ!
無駄なアプリを落とさずに、効率よくサイト作成してこう!!
コメント