Webサイト(ホームページ)の作り方
「Webサイト」についての基礎知識
「公式サイトで予約」や「詳細はWebサイトで公開」など、日常的に目にする「Webサイト」という言葉ですが、そもそも「Webサイト」とは何なのでしょうか？
ある1つのテーマについて説明されていたり、商品を紹介していたりする画面をインターネットで見ることがあると思います。そのような画面のことを「Webページ」と呼びます。つまりWebサイトとは「Webページの集合体」とも言えるもので、例えば「ヘッドホン」を扱うWebサイトは「ワイヤレスヘッドホン」「有線ヘッドホン」「メーカー別ヘッドホンの特徴」などの各Webページを束ねたもの、ということになります。
「ホームページ」と「Webサイト」はどう違うのか？
「Webサイト」と似た意味で「ホームページ」という言葉を使う人もいますが、厳密に言うと「ホームページ」と「Webサイト」は少し異なります。
「ホームページ」は「Webサイト」にアクセスした時に一番最初に訪問者が見ることになるページのことで「トップページ」とも呼ばれることがあります。「Webサイト」を表しているつもりで「ホームページ」という言葉を使う方もいますが、厳密には「ホームページ」とは「Webサイトのトップページ」のことだいうことは覚えておきましょう。
Webサイトを作るための言語「HTML」と「CSS」
Webサイトを作るために必要なものはいくつかありますが、必要不可欠とも言えるのが「HTML」と「CSS」です。この2つはいわゆる「プログラミング言語」の1種で、Webページに表示させる内容やレイアウト、スタイルなどを取り決める役割を果たすことから「マークアップ言語」とも呼ばれます。世の中のほぼ全てのWebサイトやWebページはHTMLとCSSを使って作成されています。
HTMLとCSSのタグの種類は非常に多く、全てを覚え切るのはベテランでも至難の業です。そのため近年ではHTMLやCSSの入力を補完して行うためのツールも数多くリリースされており、実際の制作現場でも使われることが増えています。しかしHTMLとCSSの基礎知識があると、実務をこなす際にの基礎となるため、他のWeb系業務でも応用がきくようになるため、覚えておく又は使えるようになっておくのが必須と言っても過言ではありません。
「Webサイトの作り方」＝Webサイトはどのように作られるのか？
では実際のWebサイトの作り方はどのようなものなのでしょうか？いくつかの作り方はありますが、ここでは代表的なWebサイトの作り方について一例を紹介していきます。
作り方の手順
一般的な作り方の手順としては、「設計」の工程でWebサイト全体のコンセプトやページ数、トップページからの導線などを決めます。サイト全体のデザインなどもこの段階で決められることが基本です。次にコーディングです。このコーディングの段階でHTMLやCSSを中心にしたプログラミング言語を使い、プログラマーが実際のWebページを作り込んでいきます。
設計
Webサイトの設計は、実はWebサイトの作り方の中でも最重要と言えるものです。サイト設計が固まらず、コンセプトやテーマ、各Webページへの繋がり方がきちんと組み立てられていないサイトはユーザーにとってわかりにくいものになってしまうからです。
サイト設計はWebサイトそのものの方向性を決定付けます。設計段階でサイトコンセプトとして盛り込まれなかったものが後から登場するとサイトの方向性がブレてしまいますし、その結果として本当に伝えたいことがユーザーに伝わらなくなってしまうこともあり得ます。そのため、サイトの設計を行う工程は最も慎重に行うことが求められます。
コーディング
サイトの設計が出来上がったとしても、形にできなければWebサイトを有効に利用することはできません。Webサイトをユーザーに公開できる「形にするための工程」がコーディングです。Webサイトの作り方としては、設計と並んで必要不可欠な工程になります。
多くの方が想像するWebサイトの作り方はPCのキーボードに向かってITエンジニアが文字列を打ち込んでいるシーンだと思いますが、あの場面が「コーディング」だと思って頂ければわかりやすいでしょう。コーディングをしなければWebサイトは一般ユーザーが目視可能な形にはできないので、コードを打ち込む＝コーディングするのは必須です。コーディングを行うエンジニアのことは「Webプログラマー」や「マークアップエンジニア」と呼んだりします。コーディングの工程でHTMLやCSSなどの言語を使うことになります。
バグチェック
設計が終わり、コーディングで形を整えた後に必要となるのが「バグチェック」です。Webサイトを含めたプログラムを組む場合に避けて通れないのがバグを見つけ出し、取り除く作業です。例えば「設定したはずのリンクが開かない」「再生されるはずの音声や動画が再生されない」「トップページに戻るはずなのに戻らない」などなど、例をあげればいくらでも出てきます。
バグが残っているWebサイトはユーザーの使い勝手も悪く、サイト自体の評判にも関わります。Webサイトの作り方として基本になるのはサイト設計、コーディング、バグチェックの3つだと言っても過言ではありません。バグチェックのやり方としては、コーディングの工程をいくつかの段階に分けておき、各工程ごとにバグチェックを行い、さらに全体のコーディングが終わってからサイト全体の構成を見直しながらバグチェックを行う手法があります。
公開
サイト設計が完了し、コーディングを行い、バグチェックも終わったらいよいよWebサイトを公開します。公開されなければユーザーは作成されたWebサイトを見ることはできませんし、公開の手順を踏んでおかなければせっかく宣伝してもユーザーがサイトを訪問することはできません。
バグチェックまではWebサイトの作り方手順としては「準備段階」とも言えるもので、実際にWebサイトがユーザーの目に触れ、評価されるようになるのは「公開」されてからが本番です。
Webサイトを公開するために必要なもの
では、実際にWebサイトを公開するために必要なのはどんなことでしょうか？
ドメイン
インターネットを見ていて「こちらのURLへどうぞ！〜〜.com」や「〜〜.net」などの宣伝文を見たことがあると思います。有名サイトで言えば「www.youtube.com」や「google.com」などがあげられますが、この「.com」などの前に書かれているものが「ドメイン」です。
ドメインはインターネット上の住所を示す「表札」のような役割を担っていて、ユーザーが「どこの、何のWebサイトを見ているか」がわかる役割を果たします。特に独自のWebサイトを作成し公開する場合にはドメインの取得は必須だと言えるでしょう。
サーバー
Webサイトの公開に必要なものとしてドメインと同じく重要なのが「サーバー」です。サーバーはWebサイトのデータを保存し、ドメインを設定しておく場所です。例えとしては、ドメインという「表札」を頼りにユーザーがWebサイトを訪れ、クリックするという動作でドアを開けてサーバーという「部屋の中」に入ってくるというイメージです。
サーバーは自前で用意することもできますが、サーバー用のワークステーションという専用PCは高額なため、レンタルサーバーを使う企業や個人も増えています。
Webサイト公開後に必要なもの
Webサイトは公開したらそれで終わりとは言えません。Webサイトの作り方としては公開後のことも考えておく必要があります。具体的にはどのようにWebサイトを運営していくのか、ということを考えなければなりません。
運用
Webサイトの「運用」は、具体的に言うと「Webサイトにトラブルが起きないように」することです。予期せぬ突発的なエラーが起きないようにする。設定した動画がきちんと再生されるようにしておく。サイト設計で規定された動きが常に実現されておくようにしておくことが「Webサイトの運用」だということになります。
保守
しかし、場合によっては不慮の事態が発生しエラーやバグなどトラブルが起きることはあり得ます。そんな時に誰も手当ができない状態ではユーザーに迷惑がかかってしまいますし、Webサイトの評判も下がってしまいます。
保守業務は、トラブルが起きた際にも復旧を可能な限り早く行い、トラブルが起きそうな兆候を見つけたらそれを未然に防いだりするための業務です。
更新
Webサイト公開後、情報が古いままではユーザーが飽きてしまいます。一度訪れてくれたユーザーにまたサイトを訪問してリピーターになってもらったり、新規のユーザーに来てもらうためには新しい情報やこれまで公開していた情報を更新することが必要になります。
Webサイトで紹介している商品が変わっていなくても、付随する情報や事例は新しいものを紹介することが可能です。何か少しでも変わったり付け加えられる情報がある場合は積極的にWebサイト内容を更新することが必要です。情報が更新されているWebサイトは検索エンジンからも「新しい情報を載せているサイトである」と評価され、検索結果に反映してもらえる可能性も高まるからです。
まとめ
Webサイトの作り方、Webサイト作成後の重要なポイントについて紹介してきました。現代社会ではWebサイトを使った活動が基本になりつつあります。確かにゼロからWebサイトの作り方を検証したり運用していくのは大変なこともありますが、やり方がわかればとても有効に使えるツールがWebサイトです。
この記事をきっかけにWebサイトの作り方を理解し、活用のチャンスを探ってみましょう！