こんにちは、Webデザイナーの北川(@chikulog_tk)です。今日はブログを本気でやろうとしている人向けに「Webデザインが少し分かれば他のブロガーさんたちとの差を簡単につけられるよ」という話をしたいとおもいます。
ブログのデザインをいじるのは難しい?

ここ最近、「個人の情報発信力強化の必要性」が話題になっていますね。一億総発信者という時代になり、FacebookやTwitter、インスタ、ブログ、YouTubeなどなど、色んな手段でみんながどんどん自分の日常や意見などを発信しています。
みんながみんな情報を発信すると、当然ですが発信のやり方が上手い人、下手な人が出てきます。「ただ価値のない情報を発信するだけの人」もいれば、「価値ある情報を発信する人」がいたり、さらには「価値ある情報を解りやすく整理して発信する人」なんかも出てくるようになってきます。そしてその上手い下手は、ブログであればPV数という形で、Twitterであればフォロワー数という形で確実に表れてくるのです。
「じゃあ読者に有益な情報を、分かりやすい形で発信すればいいだけの話でしょ?」
と思われたあなた、その通りです。もしあなたがそう思ってすぐに分かりやすい記事を書けたり、読みやすいブログデザインに変更できるのであれば、何も問題はないでしょう。
でもこんな風に思っている人も案外たくさんいらっしゃるのではないでしょうか?
「もっとブログのデザインを綺麗にしたいけど、自分ではいじれない」
「ちょっとデザインをいじろうと思ったらHTMLとかいうプログラミングが必要みたいでお手上げ」
そうなんですよね。WEBデザイナーやプログラマの方ならいざ知らず、そうではない人にとってHTMLなんて「何それ食べれるの?」ってなもんだと思います。
ちなみに、少し前にTwitterでこんなアンケートをしてみたんですよ。
[voice icon=”/wp-content/uploads/2017/08/profile.jpg” name=”北川” type=”l icon_red”]今習いたいスキルはどれ?[/voice]
対象者は僕のフォロワーさん中心なので、ブロガーさんが多いと思われます。
【アンケート】
今、習いたいスキルはどれ?— キタガワ (@chikulog_tk) 2017年8月2日
僕の予想では「Photoshopが一番かな?」と思っていたのですが、蓋を開けてみると意外にも「Webデザインの基礎を学びたい!」という人がかなり多かったんです。みなさん結構同じような悩みを抱えているんですね〜。
WEBデザインの基本さえ解れば発信力は数倍アップする

さて、僕はWebデザイナーという職業柄、Webデザインの基本はしっかり押さえているんですが(当たり前ですね)、個人でブログを運営するにあたっても、「Webデザインの知識はかなり役に立つなあ」という実感はあります。
1つ目の理由は最初にも挙げたように、ブログデザインのカスタマイズが細かくできるようになるということです。ブログというのは超ざっくり言えば「メッセージを伝える手段」なわけですよ。で、メッセージを的確に伝えるためには色々な工夫が必要になってきます。いくら文章でめちゃくちゃいいことを言っていても、文字がめちゃくちゃ小さかったり行間がキチキチすぎて読みづらいと「なんか読みたくないな」と思われてしまう可能性が出てきます。じゃあ「もうちょっと文字を大きくしたいな」とか「行間をもうちょっと空けて読みやすくしたいな」と思った時に、どんな知識が必要となってくるのか。実はそれがHTMLやCSSという、Webデザインの基本的な知識なのです。
2つ目の理由は、Webデザインの基礎であるHTMLの知識があれば、検索結果で上位に上がってきやすい文章が書けるようになるということです。ブロガーの人はブログで文章を書いた後にその文章に見出しをつけたり装飾したりすると思うんですが、実はこの「見出し」や「装飾」のつけ方ひとつで検索結果の順位も変わってくる可能性があるんです。もしあなたがHTMLの基本を少しだけ理解していれば、検索結果で上に出やすい記事を狙って書くことも可能になっちゃうのです。
この2つの力が身につけば、ただ何も知らずに文章を書くだけの人よりも発信力が上がるのは言うまでもありませんね。
WEBデザイナー推薦!基本を学ぶのにオススメの書籍2冊
では「Webデザインの基礎知識ってどうやって学べばいいの?」ってなりますよね?大きめの本屋さんなんかに行くと、Webデザイン関連の書籍のコーナーには初心者向けの本がかなりたくさん並んでいます。多分何にも調べずに行くと、どれを選んでいいのか全然分からずに途方に暮れてしまうと思います。
ですが心配しないでください。わたくしWebデザイナーキタガワが、初心者の方に100%おすすめできる本を選んでみました!「これさえ読めば基礎はバッチリ!!」というものをきっちり選びましたので、自信を持っておすすめできるものばかりです。
Webデザイン、1冊で全部学びたいならこれ
これ、本当に良いです。Webデザインをする上で理解しておかなければならない基礎知識を、タイトルにある通り「きちんと」説明してあるところが素晴らしいです。Webデザインの基礎知識だけでなく、配色やタイポグラフィの基礎の説明もあったりするので、デザイン初心者にもきっと役に立つと思います。

僕も時々本棚から取り出してきてパラパラと眺めることがあります。

結構配色で悩んだりする時にも参考になるんですよね。
本当に簡単な基本のHTML・CSSだけを勉強するならこれ
さて、今ご紹介した書籍は本当に「基礎知識」であり、めちゃくちゃ有益ではあるのですが、あくまで「ベースとなる知識」であり、実際にWebデザインをする時の具体的な手段となる「HTML」や「CSS」といった言語を網羅的に学習することはできません。
ではHTMLやCSSを勉強するのに最適な書籍はどれか?
僕がおすすめするのはこちらの書籍です。基礎以上の部分はバッサリとカットされているので、とにかく初心者向けといった感じの本ですね。脱初心者レベルの人には完全に物足りない種類の本だと思いますが、本当に初心者の方にはこのぐらい簡単な方が良いのではないでしょうか。
こちらの本は実は僕は所有はしていないのですが、先日書店で初心者向けのHTML・CSS本をざっと見比べてみたところ、これが一番シンプルで優しいなと感じました。
ちなみに「HTMLとかCSSって何なのよ?」っていう人のために、簡単に説明をしておきます。
[aside]HTMLとは
HTML(エイチティーエムエル、HyperText Markup Language)は、Webページを作成するための言語です。文章や単語に特定の印をつけることで、「これは見出しだよ」とか、「ここはクリックしたら○○のページに移動するよ」なんていう意味付けや役割を与えます。 [/aside]
[aside]CSSとは
CSS(カスケーディング・スタイル・シート、Cascading Style Sheets)は、HTMLで作ったページのスタイル(見た目のデザイン)を指定するための言語です。
CSSが出てくる以前は、例えば「ページの背景色を赤にしたいな」なんて時は、HTML内に「<body bgcolor=”red”>」みたいな感じで書いていたんですよ。bodyはページの本文を書くところ、bgcolorはbackground color(背景色)のことですね。 つまり「ページの背景色を赤にしろ」という命令をHTMLそのものに書き込んでいたんです。でもサイト全体で仮に100ページとか200ページとかあったら、全部にその命令を書かなきゃいけない。頑張って全部に書いた後で「やっぱり背景色は全部ピンクにするわ」ってなったら、また全部書き直さなきゃいけない。
そんな面倒を一気に解決してくれるのがCSSなんです。CSSはいわば、色や大きさなどの情報を一括で管理しておいてくれるセンターみたいなもの。CSSで「全ページ、背景色ピンクにしてね」って書けば、サイトの中に例え1,000ページあろうが10,000ページあろうが、全てのページの背景を一気にピンクにしてくれるんです。[/aside]
今Webデザインを学ぶべき人は、どんな人…?
- Webデザインを始めたいけど、基礎知識が全くない
- ブログを思うようにカスタマイズしてみたい
- デザインはしたいけれど、デザインや配色について全く自信がない
基本的に、ブログを使って稼ぎたい人、ブログを通して影響力をつけていきたい人は、Webデザインの知識は必須級だと思います。理由は先ほども言った通り「見やすい記事や伝わる記事が書ければ、より多くの人にファンになってもらえる」ということ、そして「検索で上位に表示されやすい記事が書ければ、より多くの人がブログに集まってくる」ということです。
Webデザインを勉強したブロガーさんたちの声
では実際にブログを運営している人がWebデザインの勉強をしたら、どんな風に感じるのでしょうか?
今回はTwitterでWebデザインの勉強をしたブロガーさんを探してみました。
はてなブログで現在ブログを作成してます。今まで、独学で勉強してたhtmlとcssの知識が活きてます!行動あるのみ。
— Tomoki Sakurai (@Banbi_Cambodia) 2017年3月6日
資格勉強で身につけた
htmlの知識がブログに微妙に役にたってる
結構忘れてるけどwソース読んでなんとなくは理解できるから勉強しといてよかった⸜(* ॑꒳ ॑* )⸝
— えのきさん@dota2 TI7 (@enocinico) 2017年5月12日
《アフィリエイトで稼ぐために最も必要なもの③》
■調査力
本格的にアフィリエイトで稼ごうとするなら、無料ブログ等では様式に限界があるため、自分の手でウェブサイトを構築していくことが必須です。
ですのでHTMLやCSS、SEOといった専門的な知識をある程度勉強しなければなりません— お金を稼ぐ方法 (@okanewo_kasegu) 2016年12月7日
#SHEdesigns 2日目はHTMLとCSSの勉強?なんとなくしか知らなかった知識がくっきりとわかるようになりました✨自分が出した指示が画面に反映される楽しさ♪学んだことを早速明日ブログとホームページに活かします。濃密な2日間でした。楽しかった?大阪にも来てほしいな〜! pic.twitter.com/wqHHVXRA34
— ゆずっこ@ブロガー (@yuzukkofx) 2017年6月25日
早くにスタートすればするほど、圧倒的に有利になる
僕は2ヶ月ぐらい前に、ブロガーさんたちがたくさん集まるオンラインサロンに入ったんです。そこで色んなブロガーさんと交流をしたんですが、今ブロガーさんの間で「Webデザインの勉強をしたい!」って人がホントに多いんですよ。
ここ1〜2年ほどで「ガンガン稼いで注目を浴びるブロガーさん」が増えた影響で、新しくブログを始める人がすごくたくさん出て来ました。で、そういう人たちの中で誰が頭ひとつ抜けるかっていう競争が激しくなっているんです。
そこで強力な武器となるのがWebデザインの能力だと僕は思っています。ほんの一握りの例外を除いて、初心者ブロガーさんの記事の面白さなんてみんな同じようなものなんです。突き抜けた面白さがある人のブログは放っておいても人気が出るんですが、それ以外の人が差別化をするなら、「いかに見やすい、いかに分かりやすいブログかどうか」が大事になってくるわけなんです。
みんなが一斉にWebデザインの知識を持ち始めると、またブロガーのレベルに差がなくなってきてしまいます。なので、今僕は「できるだけ早い段階でWebデザインの勉強を始めた人が、圧倒的に有利な立場に立てる」と思っています。