• HOME
  • ブログ
  • 【WEBデザイナー志望必見!】WEB制作の工程を一挙公開!

【WEBデザイナー志望必見!】WEB制作の工程を一挙公開!

制作工程を一挙公開
ブログ

こんばんは!駆け出しWEBデザイナーの、みさまるです!
いつも目にするWEBサイト。
何気なく眺めていますが、一体どう作られているか知っていますか?
”ワイヤーフレーム” ”コーディング”
これらがどんな作業か、どの段階で行うものか知っていますか?
私はこの業界に入って仕事をするまで知りませんでした。
これからWEBデザイナーになりたいと考えている方の中には、そういった疑問がある方もいるのではないでしょうか。
ということで今回は、WEBデザインの制作工程について書いていきます!

WEBデザインの製作は大きく分けて4工程

工程① コンテンツのプランを立てる

コンテンツとは、情報の中身のこと。適切なコンテンツプランは、WEBデザインにおいて何より重要な工程と言えます。
最も時間のかかる工程でもありますが、十分に時間をかける価値があります。
適切なコンテンツプランは、サイトの存在感を高め、閲覧者の利用を促進するだけでなく、WEB製作も高速化します。
プランを立てる上で、大切なポイントは、
・対象ユーザーを知ること
・短く簡潔なほど良いこと
・対象ユーザーがどのような言葉でサイトを検索するのかを考えること(SEO対策)
・コンテンツを論理的に整理すること

です。

工程② デザインのワイヤーフレームを作成

ワイヤーフレームとは抽象的に視覚化したWEBサイトの設計図のことです。
設計とプランの工程で、チーム全体が共同作業しやすいように作成します。
ワイヤーフレームを作成するには、いくつか方法があります。
・紙にペンでイメージを書く
・無料または有料のワイヤーフレームアプリを使用
・Photoshopなどのcreative cloudアプリを使用

製作チームやクライアントに適した方法を選ぶといいでしょう。

工程③ WEBページを作成

工程①、②で十分に練ったデザインとプランを実行に移します。
プランを実現するには、WEBデザインに使用する以下の言語を理解することが重要です。
・HTML
WEBサイトの各ページについて全体構造とコンテンツを作成するのに使用する言語
・CSS
WEBサイトのコンテンツについて視覚的プロパティをスタイル設定し、レイアウトをカスタマイズする際に使用する言語
・JavaScript
WEBページにの選択に応じて、表示される画面など情報の内容が刻々と変化する機能を加える際に使用する言語

工程④ WEBサイトの公開

WEBサイトを公開する準備が整ったら、取得すべきものがあります。
・ドメイン
WEBサイトのアドレスとなるもの
・レンタルサーバー
サーバー(PCやスマホなどからの要求に基づいて、自分の持っている情報を提供するコンピューター)をレンタルする

これらは支払い等の入力手続きがあるため、クライアントに取得してもらいましょう。

最後に

いかがでしたでしょうか?
クライアントが求めているもの、そしてユーザーが求めているものを製作しなければなりません。
制作には時間も手間もかかり、決して簡単なものではありませんが、完成したサイトを見て喜ぶ姿をみれた際にはとてもやりがいを感じられると思います。
私自身も製作はまだこれからですが、喜んでいただけるようなものを作っていきたいです。
これからWEBデザイナーになる、または駆け出しWEBデザイナーの皆さま!
色々学び、最高のサイトを作っていきましょう!

みさまる。

18,101 views

賢くて可愛いノマドワーカーママになるため、日々奮闘する23歳。

プロフィール

ピックアップ記事

関連記事一覧