『ファビコン』は、そのサイトのシンボルマークです。
Webページを開いたときに、ファビコンがあるとわかりやすくなります。
また、ブランディングにも効果的なファビコンは、設定しておいた方がいいと言われています。
しかし、ファビコンの作り方がわからないと思った方は多いのではないでしょうか。
今回は、誰でも簡単に作れるアイビスペイントを使ったファビコンの作成方法と、また、WordPressに設定する方法もあわせて解説します。
パソコンが苦手な方はもちろん、イラスト作成が苦手な方でも大丈夫です。
ぜひ参考にしてください。
それではさっそくはじめましょう！
『ファビコン』とは？
ファビコンとは、ブラウザーのタブに表示されるアイコンのことをいいます。
ファビコンの役割とは？
Webページを何枚も開くと、どのページだったかわからなくなるときがあります。
そんなときに役立つのが「ファビコン」です。
タブに、文字よりもわかりやすい絵がついていると、ページに迷うことがありません。
また、お気に入りに登録したときも、サイトが見つけやすくなります。
つまり、「ユーザーのことを考えたやさしいサービス」といったところでしょう。
ファビコンを作る前の準備
ファビコンは簡単に作れます。
今回は、誰でも使えるペイントソフト「アイビスペイント」と「iPad」を使って、
作り方をご紹介します。
アイビスペイントは無料で使えるペイントソフトなので、まだもっていない方は、ダウンロードするといいでしょう。
また、別のペイントソフトでも、基本的なやり方は同じなので、参考にしてくださいね。
ファビコンの作成のポイント
ファビコン作成のポイントは、「シンプルで目立つデザイン」にすることです。
それでは、ポイントを参考にファビコンを作ってみましょう。
今回はこんな感じのファビコンを作ってみます。
ファビコンの作り方
それでは、実際に作ってみましょう。
今回は参考として、色のバランスを整える「カラーバランス」をしてみます。
画面中央に「文字追加」の枠がでるので、そこを押して文字を入力してください。
文字を入れな方は、この作業はスキップしてください。
アイビスペイントのフォントは、以下の設定ができます。
・サイズ＝大きさいの変更
・スタイル＝文字の色、ふちどりの追加や変更
・背景＝文字の背景の大きさ
・文字間隔＝余暇幅の間隔変更
※素材を入れる場合は、レイヤを新規追加しなくても自動でレイヤごと追加されます。
背景を入れない方は、この作業はスキップしてください。
画面右下の「←」を押して、保存を押さずに、「マイギャラリーに戻る」を選択します。
その後、左上の「戻る」を押して、ギャラリーを確認します。
それでは、作業を再開するため、 編集する絵を押して、画面が切り替わったら、右上の「編集」を押してください。
表示されているレイヤ右横の「↓」を押すごとに、上から順番に統合されていきます。
レイヤが1枚の場合はこの作業は必要ありません。
間違った場合は、戻るボタンを押せばもとに戻せます。
今回は、背景があるので、「PNG保存」を選択しました。
保存ができたら、「マイギャラリーに戻る」を選択します。
WordPressにファビコンの設定をする
今回は、WordPressに設定する方法をご紹介します。
WordPressダッシュボードを開き、左側のメニューから、「外観」→「カスタマイズ」の順で選択します。
画面が切り替わったら、「サイト基本情報」を選択します。
「サイトアイコンを選択」を押してください。
ファビコンに使いたい画像をアップロードします。
代替えテキストを入力して、右下の「選択」を押します。
「公開」を押したら設定完了です。
自分のサイトのタブにファビコンが表示されているか、確認してください。
まとめ
今回は、ファビコンの作り方とWordPressに設定する方法をご紹介しました。
応用として、スマホで撮った写真をそのまま画像として挿入するだけでも、簡単にファビコンは作れます。
重要なのは、あまり凝ったデザインにしないことです。
シンプルでわかりやすいデザインをポイントにして、ぜひ、オリジナルのファビコンを作ってくださいね。
それでは、今回はこのへんで！
ご覧いただきありがとうございました。
人気ブログランキング
コメント