Awesome」で解決です。具体的な設定方法をサンプルコードで紹介。Awesome」で揃います。アイコン画像の作成や準備がとっても簡単になります。Awesome」を利用される方は次節からがおすすめです。Awesomeのトップページから「icons」のメニューを開くと利用できるアイコンの一覧を見ることができます。以下のリンクからダイレクトにURLを開いてください。IconsCheatsheet使い方を覚えてしまえば、マークを差し替えればいろいろと使えます。メニューの位置がわかりにくいので、よく利用する場合は、ブックマークをしておくと便利です。手順1:事前確認WordPressのテーマなど、環境によっては事前に設定してあるものがあります。試しに以下をbodyタグの中に入れてみてください。(WordPressの場合は、投稿してみてください。aria-hidden="true"></i>マークが出れば設定済の環境です。次の手順を飛ばして次へ進んでください。AwesomeをWebで利用できるようにするには、3つの方法があります。CDNから読み込む方法サーバにインストールする方法プラグインを利用する方法(WordPressの場合)方法1:CDNから読み込む方法こちらのページからメールアドレスを登録すると、以下のメールが届きます。この手順に従い、Scriptをヘッダーに登録すればOKです。方法2:サーバーにインストールする方法トップページからフォントセット(font-set)をダウンロードし、Webサーバにアップロードします。htmlのheadの中に以下のように記述をします。href="path/to/font-awesome/css/font-awesome.min.css">もし、うまくいかない場合は、以下の記事も参考にしてみてください。方法3:プラグインを利用する方法(WordPressの場合)WordPressの場合は、プラグインをインストールしてしまうのが一番簡単です。Awesome」がおすすめです。インストールするだけでOKです。Awesomeのコードを使うIconsのページから好きなマークを探します。CSSに組み込む場合は、font-familyを”FontAwesome”にし、Unicodeの部分に書かれているコードを利用します。箇条書きの「・」を「マーク」にするときには、font-familyを「FontAwesome」にし、contentを「\f00c」にします。詳しくは次節のサンプルコードをご覧ください。Awesomeのサイトから、コードをコピー&ペーストします。Awesomeを使ったサンプルです。fa-fw"></i>見出しの前のチェックマークマークを見出しの前に入れる場合の例です。Awesome」に辿り着きました。最初はアイコン画像でもいいのではないかと思っていたのですが、フォントだと色や大きさの変更などの編集のしやすさがあり、とても便利だということに気がつきました。今は小さなモバイル画面から大きなデスクトップ画面まで連続的なデザインにする必要があるので、このようなフォントは非常にありがたいです。簡単に軽くて美しいサイトを作るために必要な技術です。「いい情報を広めるためにはどうしたらいいの?」をテーマにSEOの研究をしています。「素晴らしい製品・サービスがもっとみんなに伝われば・・・」という思いに少しでも貢献できればと思います。SEO白書をご覧頂きありがとうございます。これからもどうぞよろしくお願いします。【WordPress】セキュリティ上の理由によりこのファイル形式は許可されていません。【解決・Facebook】入力されたメールアドレスが無効なものです。