こんにちは!クリエイト事業部の杏です!今回は前回の続きで「WEBサイトができるまで」のSTEP3~5を解説したいと思います!

 

WEBサイトができるまで②


STEP3:サイト設計

3-① ワイヤーフレーム制作

STEP2で作成したサイトマップをもとにワイヤーフレームを作成します。ワイヤーフレームとはサイトのレイアウトや情報の流れなど配置を表した設計図で、デザインが制作しやすくなります。
デザイナーと完成後のイメージを共有し、情報に齟齬が生まれないようにする役割もあるため、ワイヤーフレームによる整理はとても重要になります。

 

STEP4:デザイン制作

4-① 素材の用意

最初のデザインコンセプトに合わせた、使用するテキスト(原稿)や画像、イラストなどを準備します。クライアントの方で資料や画像が用意できない場合、撮影や画像素材の購入等が必要なため、素材の有無を事前に確認しておくとスムーズにデザイン制作を進めることができます。

4-② デザインの作成

集めた素材とワイヤーフレームをもとにデザインを作成します。できあがったデザイン完成見本をデザインカンプといいます。制作目的やコンセプトと違和感がないかを確認しながら進めます。

 

STEP5:実装(コーディング)

5-① コーディング

デザインが決定後、コーディングを進めます。コーディングとは、HTMLやCSS、JavaScriptなどの言語を使ってプログラムを構築する作業を指します。コーディングを行う方はコーダーと呼ばれます。

5-② システム構築

CMS(専門的な知識がなくてもWebサイト内の記事やページ更新ができるシステム)やECサイトのショッピングカート機能などの構築・設定を行います。

5-③ テストアップ

サーバーにアップロードし、インターネット上で問題なく見られるか、テキストや画像に修正がないかなどを確認します。ブラウザやデバイスには種類があり、インターネットを見る環境は様々あるため、どういった環境でも仕様通りに動いているかを確認する必要があります。
その後、問題がなければ公開になります。

 


説明しきれていないところもありますが、Webサイト制作の大まかな流れになります。準備から公開まで2~3ヶ月程、大規模なものは半年かかるものもあります。

次回もWebに関する情報をお届けするので、見ていただけたら嬉しいです。弊社ではホームページ制作からPR動画制作まで様々なご要望にお応えしておりますので、ご気軽にご相談ください!