ブログやサイトをデザインする際、おそらく最初に悩むレイアウト。

どの要素をどの位置に配置するか？いろいろと悩んでしまいますね。

っちゅうわけで、本日はブログやサイトデザインに使えるレイアウトをまとめてみました。

【レイアウト・サンプル】

まずは、レイアウト・サンプル集。基本はこちらからどうぞ～。

1. CSS Layouts – Code-Sucks.com

2. NEW dynamic basic CSS TEMPLATES 07 | intesivstation

3. Layout Gala: a collection of 40 CSS layouts based on the same markup and ready for download!

【マガジン・スタイル】

なんだか、最近流行の？マガジン・スタイル・レイアウトのサンプル集。

4. 11 Free Magazine Style WordPress Themes | Epic Web Strategies

5. Creating a Magazine Style Theme – Learn by Example | Design Adaptations

【水平分割・スタイル】

こちらも最近よく見かける水平分割・スタイルのまとめ。

6. Analysis of Web 2.0 Design & Layout Trends – Part 1: Clean, Colorful and Horizontally Divided | StyleIgnite

先に大枠を決めて、順番に要素を配置して、色や飾りつけをして完成～！っと簡単に行けばいいのですが。。。

ブログのサイドバーや、記事タイトルの横などによく表示されているカレンダー。

日付も単純にテキストだけで表示するのではなく、ちょっと手を加えておしゃれ～に見せたいものですね・・・

っちゅうわけで本日は、そんなカレンダーデザインをまとめてみました。

1. Calendar and Date Picker Design Showcase

35個のカレンダーデザインがずら～っと並んでおります。どれもとってもきれいですね。

2. Calendars & Date Pickers (54 examples)

こちらは、54個！4ページに分かれて紹介されています。↑と同じ方がまとめられて用なので、結構かぶっていますが。。参考までに。

3. A CSS styled calendar

おなじみveerle’s blogさんが紹介されている、カレンダーCSSです。

仕上がりは↓こんな感じ。とってもきれいですね。。

4. MikeCherim.com – CSS: Unordered List Calendar

MikeCherimさんが公開しているカレンダーXHMLとCSSのサンプルです。

5. A validating link calendar

CSSplayさんが紹介されているカレンダーは、月のリンクにマウスがオーバーするとカレンダーが右側に表示されます。

6. Web 2.0 Date Icons For Your Blog

こちらは、記事タイトルの横などに表示されている投稿日を日めくりカレンダー風に表示させるためのアイコンです。

7. Create a Calendar style WordPress date format

ワードプレスをお使いのユーザーさんは、こちらのタグで投稿日をカレンダー風に表示できます。

8. Creating a Blog Entry Date Calendar Icon Look with CSS, Mostly

こちらも、投稿日をカレンダー風に表示するためのチュートリアル。ご参考に。

きれいなカレンダーが作れそうですね～。

先日、海外のブログの記事で、「Best Practices for Title Tags」という、タイトルについて書かれている興味深い記事を見つけました。。

記事のタイトル付けは、毎回悩ましいものですわ。。

記事のタイトルは、広告で言うキャッチコピーみたいなもの。タイトルが魅力的でないとクリックされません。。。その証拠に、はてなブックマークとかの人気記事のタイトルは、なんだかクリックしたくなりますよねぇ。。

タイトル付けは、SEOにもかなりかかわってくる大切なもの。

本日は、自分へのメモも兼ねて、「Best Practices for Title Tags」の記事を参考に、わたくしなりの意見をまとめてみた。

ブログの記事のタイトル付けについて考える。

1. ブランド戦略
タイトルにある種のルール決めをして、ブランド化をはかってみるっちゅうことでしょうか・・・人気ブログの記事のタイトルには流行りとかありそうだし・・・

2. タイトルは長すぎない
長すぎるタイトルは、逆効果？スペースも含めて65文字以内と書かれております。。まぁ、日本語では、30文字前後がちょうどよいのかな？

3. キーワードを入れ込む
最初の文字である必要はないけれど、タイトルの中にその記事の中心になるキーワードを入れ込む必要あり？

4. 複数のキーワードをフレーズに
例えば、今回の記事では「ブログ」「記事」「タイトル」っちゅうキーワードが思いついたので、それをまとめて「ブログの記事のタイトル付けについて考える。」とキーワードをちりばめたフレーズにしてみました。。。「ブログ」「記事」「タイトル」っちゅうキーワードは、それぞれこのページに関連性があるので、タイトルをより分かりやすく印象付けることができるっちゅうことですかね。

5. 区切りを入れてみる
“-”とか”|”のような区切りを入れてみると、なかなかSEO効果もあるようですわ。

6. クリック率を測定？
Google Analyticeなどのアクセス解析ツールを使うとページのどこがクリックされたか分かります。まぁ、そんなツールを使ってクリック率を測ってみる。１～２週間色々テストしてみると、どんなタイトル付けが良いか分かるらしいですわ。

7. 検索キーワード
GoogleやYahoo!などの検索エンジンに引っ掛けたいキーワードをタイトルに入れ込む。まぁ、当たり前か・・・

8. 一貫性を持たせる
一度、効果的なタイトル付けを確立したら、ページ全体に一貫性を持たせる。「1.ブランド戦略」と同じような感じかな？？

9. 見出しでも使う
タイトルで使ったキーワードをそれぞれのページ見出しとして入れ込む。タイトルをクリックして来てくれたユーザーは見出しでも同じようなキーワードを目にして安心して記事を読み続けることができる。っちゅうわけですね。。

これだけまとめてみても・・・。なかなかいい感じのタイトル付けは難しい。。。

デザインblogランキング