奈良のデザイン事務所、しろくまデザインです。

ホームページってどのように制作するの?

website

photo by:@leecampbell/unsplash.com

「ホームページは24時間、365日働いてくれる営業マン」と例えられることがあります。
集客ができるホームページを手に入れる事が出来れば、
営業マンを雇ったのと同じ、又はそれ以上の成果を出してくれる場合もあります。

昔は固定電話が無いと信用されないと言われてきましたが、
今や「ホームページが無いと(インターネットで検索して情報が出てこないと)実体が分からない」と言われる時代になりました。

今日は、そんなホームページ制作の流れ(工程)について書いてみようと思います。
すでにホームページをお持ちの方にも有益な情報になるように書いてみますね!

打ち合わせをする

打ち合わせ

実際の制作に入る前に、お客さんと掲載する内容について打ち合わせをします。

・誰に向けたホームページなのか
・どんな雰囲気や外観がよいか
・どんな行動をとってもらいたいか(お問い合わせ?申し込み?)
・どんな悩み、要望を解決できるのか

などの内容をしっかりと打ち合わせをして、原稿を作ります。

ホームページ制作には、お客様の協力が不可欠です。
制作会社はホームページ制作のプロですが、お客様の業界のプロではありません。
業界や競合の事、自社やお店の魅力をどのように伝えるか、しっかりと一緒に考えさせてください。
見る方に行動をとっていただくためには、説得力のある文章と、魅力的な写真が必要不可欠です。

ここで作成する文章のクオリティが、集客はもちろん、検索順位(SEO)にも非常に重要になります。
Googleなどの検索サービスは、図書館のように世界中のホームページを保存しています。
どんなに綺麗なホームページでも、どこかのコピー&ペーストで作った文章では、上位に表示されることはありません。

そのため、原稿作りにはコピーライターに。
写真撮影はプロのカメラマンに依頼する場合もあります。

掲載する内容やページ数が決まったら、いよいよ実際の制作に入ります。

見た目のデザインを作ります

Photoshopを使って見た目のデザイン

お客様との打ち合わせ内容を踏まえて
見る方にとって分かりやすいように、成果ににつながるように動線を考えながら
写真や文言を入れてデザインします。
Webデザイナーの腕の見せどころですね。

何度か打ち合わせと修正を加えたのち、デザインが決まります。

しかし、この時点ではまだデザインは1枚の画像の状態なので
コンピューターにとってはどれがボタンで、何がどこにリンクするのか分かりません。

インターネット上でホームページとして機能するように、プログラミング(コーディング)の作業に移ります。

画像の切り出しとhtmlコーディング

デザインからロゴマークや画像を切り出します

スライス
スライスした画像

そして、
文章はこれだよ、ここは画像を読み込むよ、ボタンはこれだよ
ということがコンピューターに分かるようにhtmlと呼ばれる言語でプログラミング(コーディング)してゆきます。

htmlコーディング
さあ、htmlのコーディングができました。

これでコンピューターには理解できる形になりましたが
これだけではレイアウトができておらず、ただ要素が並んでいるだけです。
htmlだけで表示した画面

見た目のデザインを整えます

デザインと同じ見た目になるように
CSSと呼ばれる別のプログラミングでレイアウトを作ります。

CSSを使う事で、文字の色や大きさ、背景の色や要素の大きさなど
見た目のデザインができるようになります。

スマートフォンに対応させるのもこのパートです。
こんな画面サイズで見た時は、このサイズで表示してね。
というプログラムを書き込みます。
CSSでレイアウト

ここまで出来たら、インターネット上でボタンやリンクが機能する状態でデザインが再現されます。
HTMLとCSSで作った画面

世界に公開する

これらのデータを「サーバー」と呼ばれるインターネットに繋がっている
専用のデータ格納場所にアップロードすることで、ホームページは世界中から見れるようになります。

http//○○○.jpといったURL(ドメイン)は、電話番号と同じようにドメイン会社と契約します。
サーバーは、データ改ざんや情報漏洩に対するセキュリティ対策・アップデートなどがしっかりした
サーバー会社と契約してホームページのデータを格納してもらいます。

どこのWeb制作会社でも毎月又は年間で保守費用がかかる大きな理由は、これらを契約する必要があるからです。

公開したらすぐ成果が上がるわけではありません。
適宜内容を見直し、情報の更新や加筆修正を加える事で、
ホームページをベストな状態に保つことができます。

(無料でホームページが作れるサービスもありますが、
広告が表示されたり、有料会員にならないと編集機能が使えなかったり、
といったデメリットもあるので、注意してくださいね。)

おおまかな流れですが、このような流れでホームページは出来ています。

ホームページ制作の知識が無くても内容を更新できる
「CMS」と呼ばれるシステムを組み込む場合もあるのですが、今回は割愛します。

流行が変わっても変わらない事

ホームページのデザインにも流行があります。
時代はどんどん移り変わっていくので、いつかは古く見えてしまいますが、
見た目が最先端でも全然集客ができないホームページもあれば
見た目は古くなっても、今も集客できているホームページが世の中にはたくさんあります。

その差は、やはり内容です。

「どや!ウチの製品(お店)は凄いやろ!」ではお客さんの心にはなかなか刺さりません。

今、この瞬間、あなたが提供しているサービスを検索している人が必ずいます。
そのお客さんの悩みや欲求を、あなた・御社なら解決、提供できる事をホームページで伝えてください。

それが時代が変わってもホームページに必要な事だと言えます。


デザイン依頼をご検討中の方へ

しろくまデザインでは、各種デザインのご依頼を承っております。
お問い合わせはこちらです。