01の10
研究
潜在的なクライアントがあなたにウェブサイトをデザインするよう依頼しましたが、どこから始めますか？ プロジェクトが順調に進んでいるかどうかを確認するための手順があります。 これは、標準的なグラフィックデザインプロセスを反映しています。
グラフィックデザイナーとして、あなたはコーディングを含め、あなた自身がデザイン全体を取り入れることができます。 しかし、詳細を手助けするためにチームを集めることもできます。 あなたのプロジェクトには、Web開発者とSEOのエキスパートが貴重な情報を提供するかもしれません。
すべてが研究から始まります
ほとんどのデザインプロジェクトと同様に、ウェブサイトを作成する最初のステップは、研究を行うことです。 この研究の一部は、顧客のニーズを理解するためにクライアントと一緒に行われます。 また、業界と競合他社についてさらに知る必要があります。
クライアントとの会合では、サイトの概要を作成して最終的に設計するのを助けるためにできるだけ多くを発見する必要があります。 これには、ターゲットオーディエンス、目標、クリエイティブの方向性、予算やデッドラインなど、クライアントに提供できるものに影響を与える可能性のあるその他の変数についての質問が含まれます。
あなたの業界と市場調査は同時に行われます。 あなたのクライアントに会う準備をするためには、業界のアイデアが必要です。 彼らのニーズを見つけたら、少し深く見てみたいです。
実施される研究のレベルは、クライアントの予算と業界の既存の知識に依存します。 それは、フィールド内の他のウェブサイトがどのように見えるかを見るのと同じくらい簡単なことができます。 より大きなプロジェクトでは、フォーカスグループを使った詳細な調査のようなものかもしれません。
02の10
ブレインストーミング
プロジェクトの内容が分かれば、アイディアを集める時期です。 ブレーンストーミングは始めるのに最適な場所です。 あなたの最初のアイデアを見つけるのではなく、ウェブサイトのすべてのアイデアやコンセプトを放棄してください。 後でいつでも絞り込むことができます。
一部のWebサイトでは、ナビゲーション（ボタン・バー）とユーザーが期待する可能性が最も高いコンテンツ・エリアを備えた標準的なWebインターフェースが必要となる場合があります。 他のものは、コンテンツを提示するために独特な概念を必要とすることがある。
結局のところ、コンテンツはデザインを推進します。 たとえば、ニュースサイトには、写真家のウェブポートフォリオとはかなり異なるアプローチがあります
03/10
技術要件の決定
ウェブサイトの開発の初期段階では、プロジェクトの技術的要件に関する決定が必要です。 このような決定は、予算、時間枠、場合によってはサイトの全体的な雰囲気に影響します。
主な決定事項の1つは、サイトの基本構造がどのようなものであり、どのソフトウェアを使用するか、どのシステムがサイトを「機能させるか」を決定することです。
あなたのオプションは次のとおりです：
- 基本HTML：各ページを手動で編集する標準的なHTMLサイト。 これは開発が比較的早いかもしれませんが、ほとんどの柔軟性と多くの継続的なメンテナンスが残りません。 HTMLサイトはHTMLだけではなく、CSS、JavaScript、その他の関数用のプログラミング言語も含めることができます。
- コンテンツ管理システムを使用する： CMSを使用すると、一般的に、クライアントが定期的なコンテンツ更新を実行できるようになりますが、デザイナーはサイト全体のルック・アンド・フィールを制御します。 一部のシステムは、ゼロから開発され、購入され、クライアントのニーズに合わせて調整されるシステムもあります。 BloggerやWordPressなどのオンラインシステムは無料で、基本的なCMSも含まれています。
04/10
アウトラインを書く
必要な情報を集め、いくつかのアイデアをブレーンストーミングしたので、これをすべて紙面に貼り付けることをお勧めします。
ウェブサイトの概要には、各ページに表示されるコンテンツの種類に関する説明とともに、サイトに含める各セクションのリストが含まれている必要があります。 また、ユーザーアカウント、コメント、ソーシャルネットワーキング機能、ビデオ、またはニュースレターのサインアップなど、サイト上のどのような機能ができるだけ詳細に記述されるべきです。
プロジェクトの編成を支援する以外にも、プロジェクトが続行される前にクライアントがウェブサイト提案の 概要 を提示して承認する必要があります。 これにより、セクションや機能を追加、削除、調整することができます。
これらのすべてが最終的に予算と時間枠を開発し、サイトを構築するのに役立ちます。 承認された概要に基づいてウェブサイトプロジェクトの価格を合意することは、プロジェクトの後半に追加料金や意見の相違を避けるのに役立ちます。
05の10
ワイヤフレームを作成する
ワイヤーフレームは 、ウェブサイトのレイアウトの単純な線画です。これにより、あなた（およびクライアント）は、色とタイプではなくエレメントの配置に集中できます。
これは、どのコンテンツが最も重視されるべきか、それらの要素のためにページ上で使用されるスペースの割合を決定するので非常に役立ちます。 他のビジュアル要素に惑わされることなく、承認されたワイヤフレームは、設計の枠組みを提供します。
いくつかのプロジェクトでは、さまざまな種類のコンテンツに使用できるワイヤフレームのコレクションを用意することを検討することがあります。 連絡先、about、および多くのテキストを含む他のページは、ギャラリーやショッピングページとはレイアウトが異なる場合があります。
1つのワイヤフレームから次のワイヤフレームに移行する際に、Webサイト全体にわたって一貫した外観を維持することが重要です。
06の10
ウェブサイトをデザインする
あなたとあなたのクライアントがワイヤフレームに満足したら、サイトの設計を始める時です。
Adobe Photoshopは、最初のデザインを作成するための最も一般的なツールです。 サイトデザインの焦点はコンテンツを提示することであり、実際のWebページを作成するために使用されます。
今のところ、 基本的な要素をデザインして遊んで、クライアントが見て承認するものを作成してください。
- 派手なデザインやアニメーションには魅力がありますが、ユーザーが探しているものを圧倒してはいけません。
- 一貫性のあるナビゲーションは、訪問者が主要なコンテンツ領域をすべて見つけるのに役立ちます。
- タイプのきれいな使用（テキスト駆動サイトの場合）は、訪問者が読書を続け、より多くのものを返すようになります。
- サイトデザインの実際のコンテンツを取得する前に、 Lorem Ipsumのテキストは、クライアントの注意をそらさずにスペースを埋めるのに役立ちます。
07/10
ビルドWebページ
デザインが承認されたら、モックアップからHTMLやCSSで書かれた実際のWebページにページを変換する必要があります。
経験豊富なデザイナー/開発者はすべてのコーディングを選択することができますが、Webのデザイン面に焦点を当てている人は、開発者と密接に協力してサイトを人生に導くことができます。 その場合、開発者は最初から関与する必要があります。
開発者は、デザインが現実的で効果的なWebレイアウトであることを確認するのに役立ちます。 彼らはまた、あなたがサイトを実行したり有益なものにすることができないかもしれないので、クライアントに約束した機能について相談するべきです。
Adobe Dreamweaverなどのソフトウェアは、デザイナーがドラッグアンドドロップ機能、事前ビルド機能、およびリンクや画像を追加するためのボタンを備えたモックアップを作業中のWebページに変える手助けをします。
ウェブサイト構築には多くのソフトウェア選択肢があります。 あなたが仕事を楽しむものを選択してください。ページの詳細とコーディングを実際に理解できるようにしてください。
08の10
ウェブサイトを開発する
レイアウトがHTMLとCSSで完了したら、選択したシステムと統合する必要があります。 これが機能するウェブサイトになる点です。
これは、コンテンツ管理システムによって読み込まれるテンプレートを開発したり、WordPressテンプレートを変更したり、Dreamweaverを使用してページと高度なWeb機能とのリンクを作成したりすることを意味します。 これはまた、別のメンバーまたはチームのメンバーに任せることができるステップです。
あなたはまた、ウェブサイトのドメイン名を購入し 、ホスティングサービスを並べる必要があります 。 これはクライアントとの議論の一環であったはずであり、現実にはプロセスの初期段階で行われるべきです。 サービスがアクティブになるにはしばらく時間がかかることがあります。
あなたやあなたの開発者がウェブサイトの徹底的なテストを行うことも非常に重要です。 あなたは、「大きな暴露」をしたくないし、正しく機能しない機能を持つことを望んでいません。
09/10
ウェブサイトを宣伝する
あなたのウェブサイトをオンラインで、それを促進する時間です。 人々がそれを訪問しなければあなたのすばらしい設計はいいことをしません。
サイトへのトラフィックを増やすには、
- 検索エンジン用に最適化します。 ベストプラクティスが絶えず変化しているため、これが専門領域でない場合は、SEO専門家を雇うこと。
- ニュースレターを送信して新しいコンテンツをハイライトします。 ニュースレターのデザインは、ブランドメッセージの一貫性を保つためにウェブサイトのデザインに関連するものでなければなりません。
- GoogleのPPC広告、または他のサイトのバナー広告を使った広告。
- 印刷広告や口コミなどの一般的な方法。
10の10
それをフレッシュに保つ
人々をあなたのサイトに戻すための最善の方法の1つは、コンテンツを最新に保つことです。 すべての作業をサイトに入れて、起動後何ヶ月も同じままにしたくはありません。
新しいコンテンツ、写真、ビデオ、または音楽を投稿し続ける。 ブログは、あなたのサイトに関連したトピックに関する長さの投稿を使って、サイトを更新された状態に保つ素晴らしい方法です。
クライアントがCMS Webサイトの更新を処理する場合は、CMS Webサイトを使用するようにトレーニングする必要があります。 あなたが設計したウェブサイトを更新することは、定期的な収入を得る良い方法です。 あなたとあなたのクライアントが更新作業の頻度と料金に同意していることを確認してください。