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

コンテンツのテーマレイアウト流し込むテンプレートサイト名が決まったらホームページの企画にとりかかります。
では自分のパソコンでサイトドラフトを作り始めて行きましょう。
ここでいう「サイトドラフト」というのは「デザイン」のことではなくコンテンツの設計図だと理解してください。サイト構成や各ページの内容(見出し強調部分段落等)をプランし設計していく作業です。

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

ホームページのアクセスアップを狙うなら見た目がきれいというだけじゃダメなのです。
機能的なデザインと検索エンジンフレンドリーな構成・記述でなければなりません。
デザインについては「デザイン講座」など他ページで説明しますので参照してください。

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

もともとホームページはテキストベースのドキュメントで作られていました。
きれいな画像など無い文字だけの情報ページです。(参考:日本最初のホームページ
ホームページの情報を収集するクローラーはこの頃の技術をベースに今日まで進化してきました。
SEOで検索結果上位表示を狙うのならすべてのページをルールに則ったhtmlの記述をしなければなりません。
HTML(= Hyper Text Markup Language/ハイパーテキスト記述言語)はWEBページを作成するための言語です。
文章を「タグ」と呼ばれる特別な文字列で囲って見出しやリンク段落表などの文書構造を記述していきます。
ホームページ・ビルダーやDreamweaverなどホームページ制作用支援ソフトがありますがもともとHTMLはテキスト記述言語ですからタグを理解すればメモ帳やSimple Textで編集できてしまいます。
まずはビジュアル要素の無い状態で伝えたい事のプランを立てるために設計図(= ラフページ)の制作から始めることをおすすめします。

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

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

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

Lynxについて

前述の通り検索エンジンのクローラーはホームページがテキストベースのドキュメントで構成されていた頃の技術をベースに作られています。
クローラーとは自動的にホームページを巡回してそれぞれのホームページの中身を解析するロボットです。
Googleの解説ページでは「Lynx(リンクス)というテキストブラウザが認識する状態」が「クローラーが認識する状態」にほぼ等しいとされています。
クローラーを知りクローラーにフレンドリーなサイト構成にしなければせっかく頑張って作ったホームページはデザインがきれいだけれどもキーワード検索に表示されないモノになってしまいます。
これも余談ですがクローラー(crawler)はcrawlするものという意味。
crawlは腹ばいで進むとかクロールで泳ぐという意味の英語です。
クモの巣のように張り廻られたネットワーク網の上を這いまわって情報収集するロボットというのがイメージしやすい説明かもしれません。
この情報収集ロボットはスパイダーとも呼ばれています。文字通り「クモ」です。ちょっとかわいいと思いませんか?

ページ構成とファイル名」へ進む
レスポンシブWebデザインとテンプレート」へ戻る