More with Less

注力すべき20%を追及するブログ

#6 ブログのデザインがダサいので、WEBデザイナーの入門書を読みまくった

f:id:blogopen830:20160409185516j:plain

Flickr 

 かっこいいデザインのブログにしたい

尊敬するブログにLiterallyというところがあります。

そしてこの記事にもろに影響を受けたので、このブログにしたがってHTMLとデザインの勉強を今日からはじめます。

 

tsukuruiroiro.hatenablog.com

この方が作った、紹介されていたテンプレ「DUDE」を適用しました。

それっぽくはなりましたが、画面の上のほうが紺色になったことしかわかりません。

(現在はほかのテンプレです)

自分のブログにはメリハリがない

他の人のブログでも見出しや写真、目次などが作成されていて見やすいですが、この僕のブログは全く整理されていない。

色使いも黒ばっかりだし、強調がない。

ここを見出しで使いたい、こう整理したい、という衝動がない。

なので、いろんないいデザインを見たほうがいいというのは納得できる。

 ということでデザインの入門書をざっと読みました。

 

WEBデザイン入門書

どうやら、かっこいいホームページとかブログというのはWEBデザインの話らしいということが分かり、HTMLとCSSというのを使うらしいということが分かりました。

HTMLとCSS

HTMLとCSSは,Progate | プログラミングの入門なら基礎から学べるProgate (プロゲート)

こちらでまずやってみます。

4時間で入門が終わるらしいので、とりあえずやってみる。

ホントに4時間で終わりました。

ちゃんと復習しないと身につかないかな。

文字を打ってるとき、サイトのどの部分を打っているのかいまいちわからなかったので、A4の紙にレイアウトをデッサンしながら打ってみようと思います。

自分の場合は本当にわかっていないので、それを繰り返して見ようと思います。

また、

ドットインストール - 3分動画でマスターする初心者向けプログラミング学習サイト

というサイトも紹介されていました。めちゃ早口で衝撃。

そこら辺を見回した後で、一度はてなブログのカスタマイズ方法の記事やヘルプを確認してみようと思います。 

「WEBデザイン」とか言う前に、「デザイン」を学ぶ

Literallyで紹介されていた「ノンデザイナーズ・デザインブック」を買いました。

ノンデザイナーズ・デザインブック [第4版]

ノンデザイナーズ・デザインブック [第4版]

 

 記事のレイアウトなど、本当に参考になりました。

「近接」「反復」「整列」「コントラスト」・・・衝撃でした。

デザインはツールというかルールというか。

htmlの本ではこちらがとてもいいです。 

HTML5&CSS3デザインブック (ステップバイステップ形式でマスターできる)

HTML5&CSS3デザインブック (ステップバイステップ形式でマスターできる)

 

レイアウトは相当重要みたいです。

とりあえずはまだまだhtmlもレイアウトデザインも入門者です、たくさん練習しないといけません。

あとはillisratorでブログのロゴでも作れればいいかも。

ロゴばっかり練習する本もありましたが、illustratorも未体験に等しい。。。