Folioscope

プログラミング/Unix系/デザイン/CG などのメモがもりもり

Qiitaの記事を書くときは、それっぽいアイコンを見出しに置くと、それっぽい記事に見える

最近技術的な記事は Qiita に投稿することとなり、こちらの記事はめっきりと減りました。たまにはこちらにも投稿したくて、Qiitaに関する記事を一つ。Qiitaの記事を書くときは、それっぽいアイコンを見出しに置くと、それっぽい記事に見える、という内容の記事です。

Qiitaの記事でアイコンを使う

QiitaはFont Awesomeを使用しているため、fa-*** をクラス名に持つ要素を配置すると、アイコンが表示されます。このアイコンは見出しにも使うことができます。例えば次のように記述すると、

<i class="fa fa-key"></i> Personal access tokenの発行  
-----------------------------------------------------
まずGitHubのPersonal settingsから......

このように表示されます。

f:id:ibenza:20160619215350p:plain

見出しにアイコンを追加すると見通しが良くなり、文字だらけの退屈な記事でもワクワクする記事に見えてきます。また若干、意識高い系エンジニアにも見られそうです。

f:id:ibenza:20160619215356p:plain

いいアイコンがないときは、それっぽいもので代替

Font Awesomeの豊富なアイコンであっても、いいアイコンが見つからない事がちょくちょくあります。そんなときは何食わぬ顔で適当にそれっぽいアイコンを使用します。そうすれば直接関係がなさそうなアイコンであっても、記事を読み進める上でのアクセントとなります。

例えば「はじめに」という見出し、いいアイコンが無いのでなんとなくmap-signsを使ってみます。すると「はじめに」を表現できなくても、記事全体の道標を記しているように見えます。

f:id:ibenza:20160619215403p:plain

また 「動作環境と構成」という見出しでは、サーバと関係なくてもserverをつかってみます。すると何らかの環境が説明されるかのように感じます。

f:id:ibenza:20160619215407p:plain

つぎに Basic認証の自動化」 という見出しでは、なかなか用途がわからないmagicを使ってみます。すると、まるで魔法のように手順が自動化されそうに見えます。

f:id:ibenza:20160619215411p:plain

そして最後に 「動作環境」という見出し、関係がなさそうなfighter-jetを使ってみると、ジェット機のように何を動作させる感じが出ます。

f:id:ibenza:20160619215414p:plain

完全にマッチしたアイコンでなくても、それっぽいアイコンを使用すると何故か馴染みます。また読者は筆者ほどにアイコンの意味を考えないので、思考停止でアイコンを散りばめれば良いです。