こんにちは。デザインのセンスが欲しい@dgtubeです。
さて、今回はブログデザインの変更について。きっかけはもちろん「コグレ・するぷのプロブロガー養成セミナー」に参加したこと。みなさんのブログがすごすぎて、見せるのもこっぱずかしかったので、少しでもましになればとスタイルシートについて調べたり、ロゴを作ってみたりとしてみました。
結局センスがないので納得いくようなページにはならないんですが、とりあえず一段落したので記事にしてみます。
ちなみに肝心のセミナーの方の記事は、なかなかまとまらなくて今書いている途中です。終わり次第アップしたいと思います。
タイトルロゴの変更
なにより気にいてなかった「タイトルロゴ」から手をつけました。
使用したソフトは「inkspace」です。
Inkscape 自由に描く。
Inkscape は、Illustrator、CorelDraw、あるいは Xara X と同種の機能を持つ、W3C 標準の Scalable Vector Graphics (SVG) ファイル形式 …
イラストレーターを買うお金もないので、フリーのこのソフトでがまん。イラストレーター買ったところでそれを活かせる技術もデザインセンスもないし、これで全然おっけーです。
フォントと図形を単純に組み合わせてできたのがこれ。
つっこみところは満載だと思うんですが、まあこんなところが精一杯です。センスがないからシンプルなのが一番。全部の字に縦長の点が２つずつついてるのがこだわりポイントでした。
ちなみにInkscapeでは、日本語の入力ができません。今回はテキストエディットで文字を書き、コピー＆ペーストでInkscape上に取り込み、編集しました。参考まで。
グローバルナビをつける
次にグローバルナビです。別に見せたい固定ページがあるわけではないんですが、タイトルと本文とを分割する意味でつけました。以前はページ一番上にあったものを、タイトル下へ。Wordpressのテーマそのものについているものでもよかったんですが、「CSS Menu Generator」でメニューバーを作成しました。
CSS Menu Generator
カンタン操作でクールなメニューバーを作れる
これをindex.phpのhead内に設置して満足していたんですが、それだとトップページにしか反映されない。ここからかなり時間を要しました。各記事を表示するphpファイルや、固定ページのphpファイルにそれぞれ追加していきます。このことに気づくのに時間がかかり、途中で投げ出しそうになりました。
サイドバーの見出しをオシャレに
サイドバーが味気なさ過ぎるので、スタイルシートを使ってリボンのような見出しをつけました。
メニューバーともマッチしていてページが締まった気がします。
ファビコンを作った！
次にInkspaceで「ファビコン」を作りました。
お気に入りに登録した時や、ブラウザのアドレスバーにでてくるあのちっちゃいアイコンです。
１６×１６ピクセルという非常に制限の多い状態なので単純なものにしました。
これです。一応カタカナで「デ」と書いてあります。タイトルロゴと同じ書体。
ブックマークに入れてくれた人、RSSで読んでくれる人に対して、これでちょっとは個性が出たかと思います。
まとめ
それでは、before afterです。
まずBefore
次にAfter
うーん、あらためて並べてみると進化したのかわからなくなってきた（笑）。
まあとりあえず色々勉強になったのでいいとします。
次の目標
プロブロガー養成講座をふまえ、次の目標。
１ Facebookページと連動する（作りっぱなしで放置状態）
２ 人気の記事パーツなどを使ってブログを彩る
３ プロフィールをもっと具体的にする
こんなところでしょうか。Facebookは設置したんですが、「いいね！」の人数が少なすぎて逆に微妙でしたので今は外してしまいました。勇気を出してつけてみようと思います。いろいろやってきましたが、デザインなんかより記事を書き続けることの方が重要。そちらを中心にがんばっていきたいと思います。コグレ氏いわく、「単純に記事をたくさん書けばページビューは上がる」ということなので。
それにしてもブログ書いたりいじったりが楽しくなってきたなぁ。
記事を最後までお読みいただき、ありがとうございます。
もしよろしければ「でじつべ」をRSS登録してあげてください。
Twitterのフォローやいいね！もお待ちしています。
コメント