サイトドラフトでコンテンツを設計! 鈴木智子のホームページのアクセスアップ企画講座

サイトドラフトを作成する

ドメインの取得、サーバー手配が済んだら、ホームページの企画にとりかかります。
もちろん、ドメイン取得やサーバー設定前に、自分のパソコンでサイトドラフトを作り始めてもよいです。

ここでいう「サイトドラフト」というのは「デザイン」のことではなく、コンテンツの設計図だと理解してください。サイト構成や各ページの内容(見出し、強調部分、段落等)をプランし、設計していく作業です。

「なぜそんなことをするの?」
「見た目できれいにデザインされていれば、いいんじゃない?」

ホームページのアクセスアップを狙うなら、見た目がきれいというだけじゃダメなんです。
機能的なデザインと、検索エンジンフレンドリーな構成・記述でなければなりません。

デザインについては、「デザイン講座」など、他ページで説明しますので、参照してください。

クローラーとhtmlの記述について

もともと、ホームページはテキストベースのドキュメントで作られていました。
きれいな画像など無い文字だけの情報ページです。(参考:日本最初のホームページ
ホームページの情報を収集するクローラーは、この頃の技術をベースに今日まで進化してきました。
そのようなわけで、SEOで検索結果上位表示を狙うのなら、すべてのページをルールに則ったhtmlの記述をしなければなりません。

HTML(= Hyper Text Markup Language/ハイパーテキスト記述言語)は、WEBページを作成するための言語です。
文章を「タグ」と呼ばれる特別な文字列で囲って、見出しやリンク、段落、表などの文書構造を記述してゆきます。
ホームページ・ビルダーやDreamweaverなどホームページ制作用支援ソフトがありますが、もともと、HTMLはテキスト記述言語ですから、タグを理解すればメモ帳やSimple Textで編集できてしまいます。
まずは、ビジュアル要素の無い状態で伝えたい事のプランを立てるために、設計図(= ラフページ)の制作から始めることをおすすめします。

余談ですが、私が若かった頃、会社にワープロが配置されました。
それはそれは初期型のもので、液晶ディスプレイは、縦3センチ横15センチくらいのもの。
作成中の文書全体のレイアウトはディスプレイに表示されるわけではありません。
「文書の見出しは、太字にしてセンタリング、下線も引きましょう」とか、「発送日時や部署名、発信者名は、右寄せにしましょう」などということを頭の中で組み立てて指定しなければなりませんでした。
タグも似たようなものですが、大きな違いが1つあります。
ワープロでの指定は文字修飾だけが目的ですが、htmlタグの場合は、クローラーが文脈の一部として解釈するという事。
正しい記述方法でクローラーフレンドリーなサイトを作りましょう!

WEBオーサリングソフト(ホームページ制作用支援ソフト)

ホームページを構成するHTML、CSSなどのファイルを編集するデザインツールです。
ワープロソフトのような感覚で、視覚的に編集するツールです。

ソフト名 価格 備考
Dreamweaver 最高値
  • 高機能
  • How To本も多く出版
  • Photoshop、Illustrator、Flashなどのソフトとの親和性が高い
  • 30日間の無料体験版有
ホームページ・ビルダー 比較的安価
  • 高機能
  • How To本も多く出版
  • 簡単モード(デフォルトのモード)を使うとブラウザによっては、崩れる
  • 30日間の無料体験版有
Aptana 無料
  • 高機能
  • How To本が少ない
  • 英語版、日本語化ファイル
  • Dreamweaverと比較されるほど評価が高い

Lynxについて

前述の通り、検索エンジンのクローラーは、ホームページがテキストベースのドキュメントで構成されていた頃の技術をベースに作られています。
クローラーとは、自動的にホームページを巡回して、それぞれのホームページの中身を解析するロボットです。
Googleの解説ページでは、「Lynxリンクス)というテキストブラウザが認識する状態」が、「クローラーが認識する状態」にほぼ等しいとされています。
クローラーを知り、クローラーにフレンドリーなサイト構成にしなければ、せっかく頑張って作ったホームページは、デザインはきれいだけれどもキーワード検索に表示されないモノになってしまいます。

これも余談ですが、クローラー(crawler)は、crawlするものという意味。
crawlは、腹ばいで進むとか、クロールで泳ぐという意味の英語です。
クモの巣のように張り廻られたネットワーク網の上を這いまわって情報収集するロボットというのが、イメージしやすい説明かもしれません。
この情報収集ロボットは、スパイダーとも呼ばれています。文字通り、「クモ」です。ちょっとかわいいと思いませんか?

では、どのように記述するのがクローラーフレンドリーなのか、「ページ構成とファイル名」から解説してゆきますね。

follow me

鈴木智子のホームページのアクセスアップ講座