入門Webデザイン ch1 Webデザインへのアプローチ

CG検定勉強メモ資格勉強

Webデザイン

インターネットとWeb

インターネットの歴史としくみ

  • 1969s ARPAnet: Advanced Research Projects Agency Network

    • ARPA: Advanced Research Projects Agency (国防省・先進研究計画局)
    • 冷戦時代の軍事用途の分散型ネットワーク

      • 特定の拠点が破壊されても大丈夫
    • パケット交換システムも採用

      • 効率的なデータ送受信
      • エラー回避
    • 【補】DNSなどにその名残がある。arpa TLDなど
  • 1970s-1980s TCP/IPがARPAnetに採用
  • 1980s NSFnet: National Science Foundation Network

    • NSF: National Science Foundation (全米科学財団)
    • 現在のインターネットに発展
  • 1989 ティム・バーナーズ・リーがWWW: World Wide Webの原型考案

    • 回線の高速化に伴いインターネットは高速で普及することになる

Webの特性

これまでのメディア インターネット
アクセス リニア(直線的)・シーケンシャル(逐次的)) ノンリニア via ハイパーリンク
コミュニケーションの方向 インタラクティブ(双方向)
コミュニケーションの多重度 一対多、多対多

Webサイトの目的とデザイン

  • コンセプト

    • なにを伝えたい?
    • ユーザの目標は?
  • デザインとコミュニケーション

    • 情報をどう組織化してどう伝えるか
    • Webデザインはユーザとのコミュニケーションのデザイン

Webページの表現方法

  • コンテンツ

    • HTML
  • 動き

    • GIF
    • JavaScript
    • Flash
  • コミュニケーション

    • フォーム
    • サービス固有のリンク

      • 【補】はてなブログのトラックバックとか
  • CDNによるWebサイトの簡易制作

Webサイトの種類

コンセプトに応じていろいろ

種別 求められるもの
ポータルサイト Yahoo! JAPAN 多くのユーザに交換をもたせるデザイン、わかりやすく使いやすい構造とナビ
検索サイト Google (ロボット型) 広告収入増加のため、多くのユーザを獲得する — 独自アプリもこの一環
ECサイト 個人情報保護、BtoB: 機能性、toC: 商品に合ったデザイン等
コーポレートサイト 情報の網羅性、迷子にならないこと
キャンペーンサイト 訴求性
コミュニティサイト 掲示板、mixi、facebook
ブログ

Webサイトの制作フロー

Webサイト構築の流れ

  1. プランニング

    1. コンセプトメイキング
    2. 情報の収集・分類・組織化
    3. 情報の構造化
    4. Webサイトの設計
  2. 制作

    1. 素材の制作
    2. Webサイトの構築
    3. テストと修正
  3. 運用

    1. 評価
    2. 更新とメンテナンス
    3. ユーザとのコミュニケーション

後のchapterで掘る

Webサイト構造の設計図

  • Webサイトはツリー構造型とハイパーテキスト型を組み合わせた複雑な構造となる
  • 設計図が必要

    • フローチャート
    • 絵コンテ