ブログデザイン101：結果をもたらすブログ要素をデザインするための完全なガイド

公開: 2016-07-12

ブログのレイアウトを最初からデザインしようとしている場合、最終的な目標は、読者のニーズと要件に最適なデザインを作成することです。

あるブログでうまくいくかもしれないことは、別のブログではまったく役に立たないかもしれないので、他の誰かのデザインスタイルをコピーすることにあまり熱心ではありません。代わりに、基本的な原則とガイドラインに焦点を当て、それらがあなたを独自に表現するデザインの開発に役立つようにします。

ブログのデザインとは、さまざまな要素やパーツを組み合わせて、読者にメッセージを効果的に配信するWebサイトを作成することです。以下では、これらの要素の中で最も重要なものと、それらを独自の設計に含める方法を分析します。

入門

ブログを始めている人の多くは、どこに行きたいのかわからないので、どの方向に進んでいくかを決める上で大きな問題になります。ただし、この1つで安心できます。必要なものがまだわからない場合もありますが、いつ取得するかは確実にわかります。これらの3つの質問に答えることで、設計パスを計画することができます。

あなたのインスピレーションは何ですか？ デザイン、色の選択、プリントに関するインスピレーションを探しましょう。これらはどこにでもありますが、Pinterestは始めるのに最適な場所かもしれません。
あなたの好きなブログはどれですか？ あなたが夢中になっている5つのブログを見つけて、それらについて正確に何が好きかを判断し、そのアイデアを自分のブログに外挿できるかどうかを判断します。 Pinterestのインスピレーションボードを作成して、インスピレーションを与える要素を1つの屋根の下に集めることができます。
何があなたを差別化しますか？ あなたのブログはあなたが誰であるかを反映しているべきです。持ち込みたい側面を活用して、他の側面との差別化を図ります。
どんな色が好きですか？ あなたの配色を選ぶとき、あなたを幸せにする色だけでなく、あなたが運営しているブログの種類に対するあなたの選択の重要性についても考えてください。あなたは他の人をあなたのブログに引き付けたいと思っているので、あなたはあなたが望むものだけに集中することはできません。

1.ヘッダー

ヘッダーは、視聴者に第一印象を与える場所であり、ブログとのやり取りのトーンを設定します。真面目なブログには真面目なヘッダーを、楽しいブログには楽しくクリエイティブなヘッダーを用意します。自分の言葉を意識して選び、簡潔に使いましょう。

ニッチなブロガー（特定のことについて話している）はこれでより簡単な時間を過ごすかもしれません、しかし誰もが彼らのブログが関係している何か-一つのこと-を見つけることができます。あなたが個人的なブログを持っている場合、そのブログはあなたに関するものであり、あなたは創造的な方法であなた自身について何かを共有することができます。

ヘッダーの高さを150〜250ピクセルにして、折り畳み上の領域（スクロールする前のWebページのスペース）を最大化できるようにします。 250ピクセルを超えるヘッダーが必要な場合は、次のことを考慮してください。

機能要素の追加–ナビゲーション、ソーシャルメディアアイコン、RRSフィードアイコンなどの機能要素をヘッダーに統合して、スペースを最大限に活用します。多くのプレミアムWordPressテーマには、すでにヘッダーウィジェット部分が配置されています。 Bloggerでは、でヘッダーウィジェットボックスをコーディングする必要がある場合があります。
グラフィックの作成–イラストから写真まで、高品質のグラフィックに投資します。優れたグラフィックスを使用するか、まったく使用しない方がよいでしょう。それは非常に深刻です。あなたはウェブ上で多くの画像やイラストを見つけることができます。 Photoshopをご存知の場合は、画像を微調整してより多くの画像を作成できます。そうでなければ、賄賂を贈ることができる友達がいると思います。ヘッダーを正しく取得すると、他のすべての側面の配置と設計がはるかに簡単になります。

2.フォントとタイポグラフィ

フォントは、Webサイトやブログ投稿のトーンを設定するのに役立ち、使用頻度の低いフォントを無料で入手できます。シック、楽しい、気まぐれな、真面目な、現代的な、ゴスなど、オンラインで使用できる選択肢はたくさんあります。特定のフォントを選択する前に、次のことを考慮してください。

読みやすく、文字は他の要素とうまく機能する必要があります。
フォントを組み合わせる場合は、互いに補完する必要があります（最大3つのフォントを使用します）。
本文のフォントはシンプルにしてください。それはきれいで目に優しいはずです。フリルのある楽しいメインフォントを使用すると、読みにくくなり、頭が疲れます。サイドバー、署名、ヘッダー、投稿タイトルに楽しいフォントを使用できます。
PapyrusやComicSansは使用しないでください。お願いします。
小さすぎてもファンキーすぎてもいけません。あなたの読者はそれを通して苦しむことはありません。

サイト本体のフォントを選択するときは、すべてのコンピューターで同じフォントがレンダリングされるかどうかを検討してください。一部のフォントは、他のコンピューターには含まれていません。たとえば、Century Gothicは、Macコンピューターには含まれていない優れた読み取りフォントです。ブログへのアクセスに使用されているマシンに特定のフォントがない場合に備えて、同じように優れたバックアップフォントを含めるようにしてください。

また、すべてのデバイスで見栄えがよく、句読点をすべて表示するWeb対応フォントを使用する必要があります。一部の特殊文字は特定のフォントのレジスタに存在しません。つまり、それらを使用すると、一部の情報が表示されません。 Googleには、無料で使いやすく、Web対応のフォントがたくさんあります。また、dafontまたはKevin and Amandaサイトで、エンドウ豆（手書きベース）およびスクラップブックフォント（従来のフォント）用のその他のフォントを確認することもできます。

3.フッター

フッターには、著作権表示以上のものが必要です。 tは、実際、Webページで2番目に重要なデザイン要素です。読者を完全に倒したので（よくできました！）、次に読者を導くための明確な道筋が必要です。

読者があなたのウェブページの一番下に到達した場合、彼らはおそらくあなたに非常に感銘を受けており、あなたの他のカテゴリーをチェックすることに興味があるかもしれません。あなたのページを通過した後、彼らはあなたのサイトフィードやメーリングリストを購読したり、ソーシャルメディアであなたをフォロー/いいねしたりすることをいとわないかもしれません。サイト外で接続するために必要なすべての機能と、ナビゲーションまでスクロールして戻ることなくサイトの他のすべての部分にアクセスする方法を提供します。

また、フッターに最も人気のある3つまたは4つの投稿を含めて、読者があなたの最高の作品のいくつかと対話できるようにすることもできます。フッターを使用して、サイトのその他の興味深い点やすばらしい点を強調します。

4.ソーシャルメディアアイコン

読者がインターネット上の他の場所であなたを見つけて接続しやすいようにする必要があります。これは、ブログの外でも視聴者を増やすことができるので素晴らしいことです。ソーシャルネットワーキングはブログの成功に不可欠です。そのため、ソーシャルアイコンを追加することが重要です。アイコンの配置を開始するには、次の操作を実行できます。

アイコンの検索– Googleでソーシャルアイコンの検索を開始します。これにより、ここに移動する場合があります。よりクリエイティブな傾向がある場合は、Photoshopを使用して独自のアイコンを作成できます。理想的なサイズは全体で60ピクセルです。
アイコンのアップロード–これをブログに直接行うか、flikr、photobucket、その他の写真サイトを使用して、コードに画像へのリンクを含めることができます。
HTMLコードを追加する– Bloggerでは、次のコード行をHTMLウィジェット領域に追加する必要がありますが、WordPressではテキストウィジェット領域に追加します。

[xhtml]
<a href=”http://www.linkgoeshere.com” target =” _ blank”> <img src =” http://www.imageurlhere.com”> </a>
[/ xhtml]

この単純なコード行は、ブログに任意の画像を挿入します。

5.ブログフィード

RSSフィードは、ブロガーが他のブログを簡単にフォローするための一般的な方法です。ほとんどのブログは通常、自動フィードを提供するように設定されていますが、これには重要な統計を追跡するための自動オプションが付属していません。これは、今後のブロガーにとって非常に便利です。

Feedburnerを設定するには：

feedburner.google.comにアクセスし、フィードアドレスまたはブログをボックスに入力してフィードを設定します。
URLが確認されると、次のページが表示されます。フィードアドレスとブログ名を確認する必要があります（非常に重要です！）。将来フィードアドレスを変更する場合は、リーダーに通知する必要があります。リーダーは自動的に更新されないためです。

それでおしまい！これでフィードができました。 Bloggerで、[ダッシュボード] >> [設定] >> [サイトフィード]に移動すると、「フィードバーナーフィードアドレスを挿入する必要がある」というタイトルのボックスが表示されます。 WordPressでは、FeedburnerFeedsmithプラグインをダウンロードする必要がある場合があります。このプラグインはここにあります。これは、WordPressの更新でも一貫性を保つため、このタスクに最も推奨されるプラグインです。

結論

ブログのデザインは、特にデザインの経験がまったくない場合は、意味のある偉業ではありません。考慮すべき多くの重要な側面と、実行する手順があります。初心者の方は、すべてのチュートリアルを持っていても、サイト全体を一から設計することはできないかもしれません。代わりに、カスタマイズできる優れたテーマを見つけて、そこから始めてください。 WordPressとBloggerの両方で取得できる無料とプレミアムの両方のテーマが何千もあります。コーディングとデザインに習熟するにつれて、ブログのさまざまな要素をゆっくりとカスタマイズして、他の人のように見えないようにすることができます。

覚えておくべき最も重要なことは、それは多くの時間と労力を要するということです。正しく理解する前に、何十ものチュートリアルをくまなく調べる必要があるかもしれません。しかし、一度やれば、ユニークなブログの報酬は努力する価値が十分にあります。

ではごきげんよう！