アーキテクチャ
- アーキテクチャ(Architecture)とは、建築学、建築様式、構造などの意味がある。建築学の用語だが、IBMの研究員が論文の中で「アーキテクチャ」という用語を使用した(1964年)。その後、コンピュータ業界の用語として使用されるようになった。コンピュータアーキテクチャ、システムアーキテクチャなど。
[chapter 4]アートディレクター
- アートディレクター(Art Director)とは、グラフィックデザインやコピー、レイアウトなどのデザイン表現、技術について総合的に判断し、現場のデザイナーを指導する人のこと。デザインの現場の責任者である。なお、映画やテレビ、演劇などの現場でもアートディレクターが存在する。
[chapter 2]アクセシビリティ
- アクセシビリティ(accessibility)とは、高齢者や障がい者を含むあらゆる人が製品やサービス、施設、交通機関などを利用できるかどうかの容易度を表すこと。高齢者や障がい者だけを対象としたバリアフリーとは異なる。Webの分野では、Webアクセシビリティと呼ぶ。一例として、(視覚障がい者などが利用する)音声読み上げソフトに適切な情報を提供するサイトの構築などがある。
[chapter 1]アクセシブル
- アクセシビリティ(accessibility)は、高齢者や障がい者を含むあらゆる人が製品やサービス、施設などを利用できるかどうかの容易度を表すこと。このようなアクセシビリティに配慮したWebサイトのことを「アクセシブル」なサイトと呼ぶ。具体的には、音声読み上げソフトを使ったときに、正し順番、内容で読み上げられる等。
[chapter 3]アクセスマップ
- アクセスマップ(Access Map)とは、案内地図のこと。企業サイトでは、会社情報のページに掲載されている場合が多い。交通アクセス(電車、バス、徒歩のルート)や周辺マップなどが表示されている。Googleマップにリンクしているサイトもある。
[chapter 4]アフィリエイト
- アフィリエイト(affiliate)とは、Webサイトに設置された商品やサービスの広告を閲覧者がクリックし、購入もしくは登録した場合に成功報酬を与える仕組みのことである。個人サイトやブログでは、Amazonアソシエイト(アフィリエイト)や楽天アフィリエイトなどが多い。
[chapter 1]
一貫性
- 一貫性(consistency)とは、矛盾がない状態のことである。たとえば、Webサイトの異なる階層からページを選び、一覧表示したとき、違和感なくすべてのページを見ることができれば、そのWebサイトのデザインには「一貫性がある」といえる。逆に、ページごとにバラつきがある印象なら「一貫性がない」ということになる。
インターフェイスデザイン
- インターフェイスデザイン(Interface Design)には、ハードウェアインターフェイス、ソフトウェアインターフェイス、ユーザーインターフェイスの3つがある。Webデザインでは、「ユーザーインターフェイスデザイン」が重要となる。ユーザーインターフェイスデザインは、人間がコンピュータなどの機器を利用可能にするための装置、もしくは規格をデザインすること。
[chapter 2]インターネットサービスプロバイダ(ISP)
- インターネットサービスプロバイダ(Internet Service Provider)は、インターネットに接続するサービスを提供している企業のことである。略して「ISP」と呼ばれることもある。国内企業では、1993年にサービスを開始した「IIJ(株式会社インターネットイニシアティブ)」が最初のISPである。
[chapter 1]インフォメーションアーキテクト
- インフォメーションアーキテクト(Information Architect)とは、情報設計を専門とする人のことである。1990年後半から登場した新しい職種。アーキテクトは、建築家のことだが、インフォメーションアーキテクトは、情報を整理してわかりやすく伝えるための「情報の設計」を担う仕事。
[chapter 4]
請負契約
- 請負(うけおい)契約とは、受注者(請負人)がその仕事を完成させ、発注者が(その仕事の結果に対して)報酬を与えることを定めた契約のことである。小規模なプロジェクトでは、契約を交わさず、口約束で進められることが多い。トラブルを避けるために、契約書を交わしておくことが望ましい。
[chapter 2]運用
- 運用とはシステムを稼働させながら、安定的にサービスなどを提供すること。Webサイトの構築が完了し、公開後から運用がスタートする。たんにサイトを維持するための作業ではなく、アクセス解析やユーザーからの問い合わせや苦情などにも対応する。
[chapter 2]
エディトリアル
- エディトリアル(editorial)とは、社説および論説の意味だが、ここではエディトリアルデザイン(editorial design)と同義。出版物(新聞、雑誌、書籍など)の編集のことである。実際に現場で編集をする人を「エディトリアルデザイナー」と呼ぶ。
[chapter 4]
オーサリングソフト
- オーサリングソフトは、さまざまなタイプのデータを使って編集(デザイン、プログラミング)する一連の作業を支援するためのソフトウェアのこと。Webオーサリングソフトは、Webサイト構築、およびWebデザインの作業に特化したソフトウェア(代表的なオーサリングソフトは、Adobe Dreamweaver)。
[chapter 1]
階層構造
- 階層構造とは、下から上への層の重なりでつくられる総体。パソコンのデスクトップ上ではフォルダでファイルを管理するが、親フォルダの中に、子フォルダがあり、その中にファイルがある場合、階層構造として理解することができる。たとえば、「トップ > 製品 > 家電 > 冷蔵庫」では、左方向に階層が深くなっていく。
[chapter 4]画像解像度
- 一般的な「解像度」は、ディスプレイや画像の総ピクセル数(画面全体の画素数)のことを表し、640x480、1024×768のように表記される。「画像解像度」は、1インチあたりのピクセル(ドット)数で、dpi(dot per inch:ドットパーインチ)という単位で表わす。
[chapter 5]拡張技術
- 拡張技術(エクステンション)は、Webブラウザの既存機能では困難な表現や仕組みを実現するための小さなプログラムのこと。PDFを表示したり、Flashを再生するには、プラグインと呼ばれるプログラムを追加する。
[chapter 5]可読性
- 可読性とは「読みやすさ」の度合いのことである。文字が小さく、行間の詰まった文章(記事)で構成されているサイトは、多くの人が”読みづらい”と感じる可読性の低いページだといえる。一行の文字数が多い文章も可読性を低下させる。文字サイズや行間、マージンなどを調整することで可読性を向上させることが可能。
[chapter 1]カラーリング
- カラーリング(Coloring)とは、彩色もしくは着色のことである(カラーリングブックは塗り絵帳のこと)。Webデザインのプロセスには、Webサイト全体の配色やトーンを決めていく作業(色彩計画)がある。具体的な色指定のことをカラーリングプランと呼ぶ場合もある。
[chapter 3]仮コーディング
- 仮コーディングとは、Webページのダミーなどを作成する場合に実行される。テキストやビジュアルなどの構成要素はすべてダミーで配置し、レイアウトだけを忠実に組む。Adobe Dreamweaverには、ダミーの画像を挿入する「イメージのプレースホルダー」という機能が搭載されている。
[chapter 4]
行間
- 行間とは、文章の「行」と「行」の間隔のこと。行間が狭いと圧迫感が強くなり、読みづらくなる。Webデザインでは、行間ではなく「行高(line-height)」で指定する。行高とは、行ボックスの高さのことである。
[chapter 5]行属性
- 行属性とは、行が持つ属性(固有の性質)のことである。文字の間隔(文字間)、行の間隔(行間)、字下げ(インデント)などの属性がある。
[chapter 5]
クラウド
- クラウド(cloud)は、「雲」のことだが、IT分野ではインターネット上のコンピュータを自分のパソコンのように利用できるアプリケーションサービスなどを指して用いられる。「クラウドコンピューティング」と呼ばれる。Googleが提供しているGmailなどが代表的なサービス。
[chapter 3]クラス
- クラスは、class属性のことである。要素にクラス名を付けて、分別することができる。id属性とは異なり、1ページに複数のclass名が使える(重複可能)。同じ体裁の記事が並ぶ場ページなどで活用できる。
[chapter 3]グローバルナビゲーション
- グローバルナビゲーション(global navigation)とは、Webサイトのすべてのページに共通表示されるリンクのまとまりのこと。メインナビゲーション、もしくはメインメニューと呼ぶ場合もある。カテゴリの最上位に位置する項目がメニューに並ぶ。通常は、ページの上部に配置される。
[chapter 4]
検証
- 検証とは、事実を確認し、真偽を確かめることだが、Webサイト運用のプロセスでは、アクセスログの解析や広告の効果測定などを確認すること。Webサイトは、公開されてから「運用」、「検証」、「評価」、「改良」を繰り返しながら、目的を達成させていく。
[chapter 2]
コーデック
- 映像の分野で用いられるコーデック (Codec)とは、ビデオのデータを圧縮したり伸張するためのソフトウェアのことである(伸張を「解凍」と表現する場合もある)。画像や音声も同様にコーデックの技術が使われている。
[chapter 5]
コンポーネント
- コンポーネント(component)は、構成要素、部品のことである。ソフトウェアやハードウェアの構成部品などを指して使用される。Webデザインの場合は、CSSファイルを分割、部品化したものやJavaScriptの(小さなプログラムの)ライブラリをコンポーネントと呼ぶ。
[chapter 3]
最終成果物
- Webサイト構築のプロジェクトでは、上流から下流までの各工程でさまざまな成果物(企画書から仕様書、ガイドライン、スケッチ、プロトタイプなど)を生み出すが、 最終成果物というのはクライアントに納品されるWebサイト全体のことである。
[chapter 4]彩度
- 彩度(Saturation:サチュレーション)は、色味の強弱である。色味が強いと「彩度が高い」、弱いと「低い」と表現する。たとえば、青の色味を強くすると「真っ青」になり、弱めていくと無彩色に近くなっていく。
[chapter 5]
視覚化
- 視覚化とは、人が目で見て理解できるようにすることである。「可視化」とも呼ばれる。具体的には、図や表、グラフなどを描いて、誰が見てもすぐに理解できるように情報を編集する作業である。新聞や雑誌などには、わかりやすい図で表現したインフォメーショングラフィックが使われる。
[chapter 4]字間
- 字間とは、文章の「文字」と「文字」の間隔のこと。通常、デフォルトのままで使用される場合が多い。Webデザインでは、letter-spacingプロパティで指定できる。
[chapter 5]
色相
- 色相(Hue:ヒュー)は、色味(赤、青、黄など)の性質のこと。Adobe Photoshopなどの画像処理ソフトでは、帯状の色相環や色相バーから任意の色を選択できるようになっている。
[chapter 5]視認性
- 視認性は「見やすさ」の度合いのことである。一目で欲しい情報がすぐに見つかるページは視認性が高い。情報の密度やグループ分けすることで、視認性を向上させることが可能だ。情報の優先度が曖昧で、どこに何の情報があるのかすぐに把握できないページは視認性が低い”見づらい”、”使いづらい”ページになってしまう。
[chapter 1]上位工程・下位工程
- 上位工程(もしくは上流工程)は、Webサイト構築における初期の段階のことである。企画や計画の立案などの作業がある。下位工程(もしくは下流工程)は、実制作が進められる段階のこと。ビジュアルデザインやコーディング、テスト、公開などの作業がある。
[chapter 2]情報設計
- 情報設計とは、情報を分類・整理してわかりやすく伝えるための表現手段のことである。Webの分野では、インフォメーション・アーキテクチャと呼ばれることが多い(「IA」と略される場合もある)。具体的なデザイン作業に進む前に実行され、サイトストラクチャと呼ばれるWebサイトの設計図(構造図)などが作成される。
[chapter 1]情報デザイン
- 情報デザインとは、情報を伝えるための手法や考え方を体系的に身に付けた上で、実践されるコミュニケーションデザインのことである。ビジュアルコミュニケーションデザイン(視覚伝達デザイン)は、情報デザインに含まれる。
[chapter 1]ショートハンド
- ショートハンドとは、CSSプロパティの一括指定のことである。たとえば、マージンの指定「margin-top: 0; margin-right: 10px; margin-bottom: 20px; margin-left: 10px; 」をショートハンドで「margin: 0 10px 20px 10px; 」のように記述することができる。
[chapter 3]
スクリーンメディア
- スクリーンメディアは、パソコンやテレビ、携帯電話、スマートフォン、携帯ゲーム機など、ディスプレイが搭載されている機器、デバイスとそこで提供されるコンテンツのこと。Webサイトは、パソコンだけではなくモバイルデバイスでも閲覧されるため、デバイスごとにページを最適化しておくことが多い。
[chapter 1]スコープ
- スコープ(scope)とは、範囲もしくは領域のことだが、Webサイト構築ではプロジェクトの目標を達成するために作成しなければいけない成果物とそのタスク(課せられた仕事)について定義すること。プロジェクトの期間中、スコープは必要に応じて修正される。
[chapter 2]スマートフォン
- スマートフォン(Smartphone)は、携帯電話にPDA(携帯情報端末)の機能を融合させたモバイルデバイスである。Apple iPhoneやGoogle Android搭載のスマートフォーンが急速に普及している。スマートフォンの画面に最適化されたWebサイトも増えている。
[chapter 3]スライス機能
- スライス機能とは、大きな画像を分割するための機能である。90年代後半に流行った、画像を分割して配置するHTMLレイアウトで普及した機能だが、現在はWebページのモックアップやプロトタイプ制作に使われている。FirewoksなどのWebグラフィックス用のソフトには標準搭載されている。
[chapter 4]
セーフティゾーン
- セーフティゾーン(safety zone)とは、安全領域もしくは安全地帯のことである。Webデザインでは、ページの左上の領域がセーフティゾーンと呼ばれる。ブラウザのウィンドウは、左上を基点に伸縮可能な仕様になっているため、ウィンドウの大きさに影響しにくい左上の領域が安全だといわれている。
[chapter 4]
装飾画像
- Webデザインにおける装飾画像とは、ページの背景パターンやグラフィカルな罫線など「意味を持たない」装飾目的の画像のことである。音声読み上げソフトなどでページの内容を読み上げた場合に、これらの画像は無視される。HTMLではなくCSSを使うため、背景画像として扱われる。
[chapter 5]素材
- 素材(material)とは、もとになる材料のことだが、Webデザインでは(Webページを構成する)テキストや写真、グラフィック画像、ビデオ、アニメーション、サウンドなどのデータを「素材」と呼ぶ。無料で使用できるロイヤリティーフリーの素材集(写真、グラフィック、ビデオ)なども市販されている。
[chapter 2]
代替テキスト
- 代替テキストとは、イメージ情報の代わりになるテキスト情報のことである。Webサイトに配置されている写真などのイメージに対して、テキストで記述する。HTMLでは、<img src="画像ファイル名" alt="代替テキスト">のalt属性の値に記述。配置されている写真が富士山であれば、「富士山の写真」などと記述し、Webページを音声で読み上げても、意味が伝わるようにする。
[chapter 3]
調整可能なデザイン
- ユニバーサルデザインにおける「調整可能なデザイン」とは、(選択肢が与えられない)完璧なひとつのデザインではなく、できるだけ多様なニーズに対応できるよう柔軟性を持たせたデザインのこと。たとえば、イスであれば、何の調節もできない完璧なデザインではなく、高さや角度を簡単に変えられるデザインがユニバーサルだといえる。
[chapter 3]
テクニカルディレクター
- テクニカルディレクター(Technical Director)とは、技術について専門的に関わり、総合的に判断し、現場の技術者を指導する人のこと。業界によって職務内容が異なる。Webデザインの場合は、システム開発やプログラミング系の仕事になる。
[chapter 2]ティム・バーナーズ=リー
- ティム・バーナーズ=リー(Tim Berners-Lee)は、英国出身の計算機科学者である。1989年にCERN(欧州合同素粒子原子核研究機構)でWWWを提案。1991年には、世界初のWebサイトを公開した。現在はW3C(Webの標準技術を策定する組織)のディレクターとして活動中。
[chapter 1]デフォルトスタイル
- デフォルトスタイル(default style)とは、最初から設定されているスタイルのことである。ブラウザには、あらかじめ大まかなスタイルが設定されており、CSSが記述されていないHTMLファイルを開いても、見出しは大きく、本文には適度な行間、ページ周辺にもマージン(余白)などが表示されるようになっている。
[chapter 3]手戻り
- 手戻りとは、前の工程に戻って、同じ作業を繰り返すことである。たとえば、CSSデザインの作業が終わってから、ページの構造化に問題があった場合、HTMLのマークアップ作業まで戻って、修正作業を実行しなければいけない。
[chapter 2]
特定商取引法
- 特定商取引法(特定商取引に関する法律)とは、訪問販売や通信販売、電話勧誘販売など特定の取引類型を対象とした法律。Webサイトやブログで通信販売をする場合は、特定商取引法に基づく表記が義務付けられている。
[chapter 1]トピックパス
- トピックパス(topic path)とは、現在閲覧しているページがサイト内のどこなのかを示すリンクのまとまりである。「トップ > 会社情報 > アクセスマップ」のように、階層構造を示し、各階層のページにリンクされている。ブラッドクラムリスト(breadcrumbs list)あるいは、パンくずリストと呼ぶこともある。
[chapter 4]
ナビゲーション
- ナビゲーション(navigation)とは、経路誘導のことである。Webデザインでは、利用者(ユーザー)が欲しい情報をすぐに得られるよう誘導するための機能を示す(ナビゲーションメニューなど)。
[chapter 2]ブランドサイト
- ブランドサイトは、製品やサービスのブランド価値をWeb上で高めるために構築されたサイトである。企業のブランドサイトは、化粧品や自動車、ファッションなどの分野が多く、Adobe社のFlashがよく使われる。「見やすさ」、「使いやすさ」より、ビジュアル表現(美しさ、かっこよさ、高級感など)を優先するサイトが大半である。
[chapter 1]
ヒアリング
- ヒアリング(hearing)とは、「聞き取り」のことだが、Webサイト構築のプロジェクトでは、発注者(クライアント)から「訊く(質問する)」作業になる。不明な点を明確にするために実施される。
[chapter 2]
フィックスドレイアウト
- フィックスドレイアウト(fixed layout)とは、ページのコンテンツ領域の幅をピクセルで指定し、完全に固定したレイアウト手法のことである。ソリッドレイアウト(solid layout)とも呼ばれる。現在公開されているWebサイトの大半は、フィックスドレイアウトで作られている。
[chapter 4]付加可能なデザイン
- ユニバーサルデザインにおける「付加可能なデザイン」とは、(他の要素を追加できない)完璧なひとつのデザインではなく、できるだけ多様なニーズに対応できるよう柔軟性を持たせたデザインのこと。長期的に変化していくニーズにあわせて、後から改造したり、新しい要素を取り付けることが可能なデザイン。
[chapter 3]物理マークアップ
- HTMLの要素を使って、Webページの見栄えを整えることを物理マークアップと呼ぶ。たとえば、<b>見出し</b>は、ブラウザ上で「太く」表示するのが目的なので、物理マークアップである。 文字サイズやスタイル、文字色などの視覚表現は、CSSで指定しなければいけない。
[chapter 3]プロジェクト
- プロジェクト(project)とは、新しいことを考え出し、期間を設定して実用化するための研究や事業のことである。目標を設定し、達成するための「計画」と捉えることもできるため、仕事の大小問わず、プロジェクト化することで効率的に進めることができる。
[chapter 2]プロトタイプ
- プロトタイプ(prototype)とは、製品開発などで実験的に作られる原形モデルのことである。Webデザインでは、ラフスケッチ、ワイヤーフレームなどのプロセスを経て、実際のWebページに限りなく近いものを検証目的で作成する場合がある。その試作がプロトタイプである。
[chapter 4]プロパティ
- プロパティ(property)とは、「属性」のことである。CSSは、「セレクタ { プロパティ:値 ; }」のように記述するが、「本文を赤くする」という指定の場合、「p { color: red;}」になる。セレクタが「p(段落)」、プロパティが「color(文字の色)」、値が「red(赤)」となる。
[chapter 3]フルブラウザ
- フルブラウザは、携帯電話の高機能ブラウザのことである。パソコン用につくられたWebサイトを閲覧することができる。携帯電話に標準搭載されている簡易ブラウザは、ケータイサイトを閲覧することしかできない。フルブラウザには、NetFront Browser、Opera mobile、Internet Explorer Mobile、jigブラウザなどがある。
[chapter 1]フローチャート
- フローチャート(flow chart)とは、処理の手順などを流れ図で表したもの。仕事の流れを図式化したワークフローやプログラミングの処理、組織図などがある。フローチャート作成ソフトには、Windows版のMicrosoft Visio(ビジオ)やNac OS X版のOmniGraph(オムニグラフ)などがある。
[chapter 3]
マネジメント
- マネジメントもしくはマネージメント(management)とは、管理することである。管理者はマネージャーと呼ばれる。Webデザインでは、プロジェクト全体を管理し、進捗状況やスケジュール、コストなどをチェックするプロジェクトマネージャーがいる。
[chapter 2]マルチメディア
- マルチメディア(Multimedia)とは、複合媒体のことで、テキストや画像、音声、動画などを統合しながら、1つのデータとして扱うことが可能。
[chapter 5]
明度
- 明度(Lightness:ライトネス)は、色の明るさである。明度を高くすると「白」、低いと「黒」に近づいていく。色の強さは「彩度」なので違いを理解してほしい。
[chapter 5]
メディア管理ツール
- メディア管理ツールとは、画像(写真やイラストなど)や動画ファイルなどを効率よく管理するためのアプリケーションソフトのことである。プレビューや分類・検索機能などが充実している。
[chapter 5]
モーショングラフィック
- モーショングラフィック(Motion Graphics)とは、グラフィックデザインに動的な表現を加えた作品のことである。コマーシャル映像などで採用されることが多い。制作には、Adobe After Effectsなどの特殊効果を得意とするビデオ編集ソフトがよく使われる。
[chapter 5]モックアップ(mockup)
- モックアップ(mockup)とは、工業製品などの外観をそのまま再現した模型のことである。実際の製品を展示できない携帯電話などはモックアップが使われる。電子機器などは、製品が搭載する「機能」を実際に試せるようになっており、外観は省力されている。
[chapter 4]モデレーター
- モデレーターとは、進行役のことである。Webサイト構築のプロジェクトでは、ユーザーテスト(ユーザビリティテスト)の進行を担当する。モデレーターは協力者と一緒にテストルームに入り、堅苦しい雰囲気にならないように注意しながら進行する。
[chapter 4]
ヤコブ・ニールセン
ユーザー視点
- ユーザー視点とは、ユーザーの立場になって考えることである。ユーザー視点でデザインしていくことを「ユーザー中心設計(User Centered Design)」と呼ぶ。デザイナーだけの作業ではなく、実際に製品やサービスをユーザーに使ってもらいながら、確認していくプロセス(ユーザービリティテスト)も含む。
[chapter 2]ユーザーテスト
- ユーザーテストとは、ユーザビリティテストと同義。実際にWebサイトを使ってもらい、ユーザビリティ(使いやすさ)などをチェックするテストのことである。対象とするユーザーと同じ属性を持つ被験者を集めて、実施される。人数は、プロジェクトの規模によって異なる。
[chapter 4]ユーザビリティ
- ユーザビリティ(usability)とは、製品やサービスなどの「使いやすさ」を表すときに用いられる。Webの分野では、Webユーザビリティと呼ぶ場合もある。探したい情報がなかなか見つからないサイトや誤操作を繰り返してしまう使いづらいサイトは、ユーザビリティが低いと判断される。
[chapter 1]ユーザビリティテスト
- ユーザビリティテストとは、実際にWebサイトを使ってもらい、ユーザビリティ(使いやすさ)などをチェックするテストのことである。ユーザーテストと呼ぶ場合もある。対象とするユーザーと同じ属性を持つ被験者を集めて、実施される。人数は、プロジェクトの規模によって異なる。
[chapter 2]ユーティリティ
- ユーティリティ(Utility)は、役に立つ道具というイメージで捉えてかまわない。Webページ内に配置されている検索ボックスやページのカスタマイズ機能、メインコンテンツとは直接関係ない情報提供の機能などがある。
[chapter 5]
要件定義書
- 要件定義書とは、必要な条件を定義したドキュメントのことである。システム開発では、どのような機能をどう実装しなければいけないのか明文化される。Webサイト構築のプロジェクトでは、システムの要件、デザインの要件、コンテンツの要件などがある。
[chapter 2]
ラフスケッチ
- ラフスケッチ(rough sketch)とは、大まかに描かれたスケッチのことである。美術やデザイン分野の用語だが、実際にはさまざまな分野で使われている。Webデザインでは、サイトの構造を表したり、ページのレイアウトなどをラフスケッチで描き、プロジェクトのメンバーと共有する。
[chapter 4]
リキッドレイアウト
- リキッドレイアウト(liquid layout)とは、ページのコンテンツ領域をパーセント(%)やエム(em)で指定する「ブラウザウィンドウの可変に対応する」レイアウト手法のことである。ディスプレイの解像度が低いデバイスでも、情報が隠れないため横スクロールを発生させない利点がある。
[chapter 4]
ローカルナビゲーション
- ローカルナビゲーション(local navigation)とは、グローバルナビゲーションに参照されている各項目(第二階層の)ページに配置されているリンクのまとまり。企業サイトであれば、グローバルナビゲーションの「会社情報」をクリックして表示されるページに表示されている(会社概要、企業理念、アクセスマップなどの)ナビゲーションのこと。
[chapter 4]論理マークアップ
- 文書を構造化するためのマークアップ。大見出し、中見出し、小見出し、段落、引用など、文章の構造的意味を持たせるのが目的である。文字サイズやマージン、背景色など、視覚表現はCSSで指定する。HTMLの要素でページの見栄えを整える「物理マークアップ」は非推奨となっている。
[chapter 3]
ワークフロー
- ワークフロー(workflow)とは、プロジェクトの仕事の流れのことである。各工程の作業内容や順番が一覧できる「流れ図」を作成し、プロジェクトに関わる人たちで共有する。開発用のアプリケーションソフトには、(作業を効率化するための)ワークフロー機能が搭載されているものがある。
[chapter 2]ワイヤーフレーム
- ワイヤーフレーム(wire-flame)は、三次元コンピュータグラフィックスの用語として使われているが、Webデザインでは「Webページの骨組み(設計図)」になる。ラフスケッチから作図ソフトを使って描画されたものまで、表現方法はさまざまである。完成したワイヤーフレームは仕様書に組み込まれる。
[chapter 3]
ActionScript
- ActionScript(アクションスクリプト)は、Adobeのアプリケーションソフト「Flash」で使われるオブジェクト指向のスクリプト言語である。複雑なアニメーションやWebアプリケーションの開発などが可能になる。
[chapter 5]Adobe Dreamweaver
- Adobe Dreamweaver(アドビ ドリームウィーバー)は、アドビシステムズが発売しているWebデザインのオーサリングソフトである。一般ユーザー層には、IBMホームページビルダーが普及しているが、Web業界ではDreamweaverが標準ツールになっている。
Adobe Dreamweaverの情報ページ (http://www.adobe.com/jp/products/dreamweaver/)
[chapter 1]
Designing Web Usability: The Practice of Simplicity
- Webユーザビリティの第一人者であるヤコブ・ニールセン(工学博士)によって書かれた1999年出版の書籍。Webデザインにおけるユーザビリティの重要性を説き、世界中のWebデザイナーに影響を与えた。邦題は「ウェブ・ユーザビリティ 顧客を逃がさないサイトづくりの秘訣」。
[chapter 3]div要素
- div要素は「division」 (分離、区分)するときに使用できるブロック要素である。div要素は、意味を持たないが、「<div><h1>見出し</h1><p>本文</p></div>」のように複数の要素をグループ化することが可能だ。ヘッダ領域、コンテンツ領域、フッタ領域など、Webページを複数の領域に分けることができるためレイアウトには欠かせない要素になっている。
[chapter 3]
Fireworks
- Fireworks(ファイアーワークス)は、Adobe社が発売しているWebグラフィックス用のアプリケーションソフトである(ベクトルモードとビットマップモードを搭載している)。PhotoshopよりもWebデザインに特化しており、配置用のWeb画像も詳細に設定することができる。
[chapter 4]Flash Lite
- Flash Lite(フラッシュライト)は、携帯電話やスマートフォンなどのモバイルデバイスで利用するための「Flash」の仕様である。iモードのメニュー画面(iMenu)にもFlash Liteが採用されている。
[chapter 5]
Flash Video
- Flash Video(フラッシュ ビデオ)は、Adobeが開発した動画圧縮方式。拡張子は「.flv」。Flash Videoの動画を再生するには、Flash Player 6以降がブラウザにインストールされている必要がある。YouTubeやニコニコ動画などの多くの動画共有サービスで採用されている。
[chapter 5]
GIF
- GIF(Graphics Interchange Format:ジフ)は、米国のパソコン通信サービスCompuServeが開発した画像フォーマットである。拡張子は「.gif」。可逆圧縮形式で、256色以下の制限がある。背景を透明にしたり(透過GIF)、複数の画像を連続表示することも可能(アニメーションGIF)。
[chapter 5]Googleカレンダー
- Googleカレンダーは、Googleが提供するカレンダーサービスである。登録をすれば無料で利用できる。スケジュールを一元管理でき、複数のメンバーでカレンダーを共有することが可能。
URL: http://www.google.com/google-d-s/hpp/hpp_ja_jp.html
[chapter 3]Googleドキュメント
- Googleドキュメントは、Googleが提供する文書、スプレッドシート、プレゼンテーション作成・管理サービスである。登録をすれば無料で利用できる。Microsoft OfficeのWordやExcel、PowerPointに近い機能を搭載し、DOC、XLS、ODT、ODS、RTF、CSV、PPT などのファイル形式をサポートしている。複数のメンバーで情報を共有し、共同編集することが可能。
URL: http://www.google.com/calendar/
[chapter 3]
ID
- IDは、id属性「identifier」 (識別子)のことである。 要素を識別するために使用する。たとえば、「<div id="container"><div id="main">メイン</div><div id="sub">サブ</div></div>」のようにid属性を割り振り、識別することが可能になる。id属性は、1ページに1つのid名しか使えない(重複できない)。
[chapter 3]
JIS X 8341-3
- 2004年6月20日に公示されたWebコンテンツのJIS(日本工業規格)アクセシビリティガイドラインである。通称「ウェブコンテンツJIS」と呼ばれている。ウェブコンテンツJISは、「一般的原則」、「開発及び制作に関する個別要件」、「情報アクセシビリティの確保・向上に関する全般的要件」の3パートに分かれている。
高齢者・障害者等配慮設計指針-情報通信における機器,ソフトウェア及びサービス-第3部:ウェブコンテンツ (http://www.jisc.go.jp/app/pager?id=32354)
[chapter 1]JPEG
- JPEG(Joint Photographic Experts Group:ジェイペグ)は、非可逆圧縮形式で、フルカラーに対応。拡張子は「.jpgもしくは.jpeg」。デジタルカメラで撮った画像は、JPEGで記録される場合が多い。
[chapter 5]
Microsoft Office Visio
- Microsoft社がWindows向けに販売しているビジネス用のグラフィックアプリケーションソフトである。フローチャートやレイアウト図などを描くことができるため、ワイヤーフレームの作図にも利用されている。
URL: http://office.microsoft.com/ja-jp/visio/default.aspx
[chapter 4]MP3
- MP3(MPEG Audio Layer-3:エムピースリー)は、インターネットで最も普及している音声圧縮方式である。拡張子は「.mp3」。非可逆圧縮方式を採用している。
[chapter 5]MP4
- MP4(Moving Picture Experts Group 4:エムペグフォー)は、AppleのQuickTimeフォーマットをベースに標準規格として策定された動画圧縮方式の一つである。拡張子は「.mp4」。
[chapter 5]
NetFront
- NetFront(NetFront Browser:ネットフロントブラウザ)は、携帯電話やゲーム機、PDA、カーナビ、セットトップボックスなどに採用されているWebブラウザのこと(株式会社ACCESSが開発)。パソコン用のブラウザとは異なり、処理能力の低い携帯電話などでも軽量かつ軽快に動作する。
NetFront Browser (http://jp.access-company.com/products/nf_mobile/browser/index.html)
[chapter 1]
OmniGraffle
- OmniGraffle
Mac OS X向けのビジネス用グラフィックアプリケーションソフトである。ステンシル(アートオブジェクト)が充実しており、Webデザインで活用できるUIパーツなども多数用意されている。
URL: http://www.omnigroup.com/products/omnigraffle/
[chapter 4]OS(オペレーションシステム)
- OS(Operating System:オペレーティングシステム)とは、コンピュータ全体を管理する基本ソフトウェアのことである。WindowsやMac OS X、Linuxなどがある。パソコンのOSには「GUI(Graphical User Interface:グラフィカルユーザインタフェース)」が搭載されており、直感的な操作が可能になっている。
[chapter 4]
Pencil
- Pencil
ワイヤーフレームを作成できるFirefoxのアドオンである。UIパーツをドラッグしながら画面を構成していくことができる。
URL: http://www.evolus.vn/Pencil/
[chapter 4]PNG
- PNG(Portable Network Graphics:ピング)は、可逆圧縮形式で、フルカラーに対応。拡張子は「.png」。GIFと同じ可逆圧縮形式だが、圧縮率はGIFより高い。背景を透明にすることが可能(透過PNG)。
[chapter 5]
SEO
- SEO(Search Engine Optimization:検索エンジン最適化)とは、検索結果で上位表示するためのテクニックやノウハウ、技術のことである。検索キーワードを大量に記述し、ページ上では非表示にするなど、上位表示だけを目的としたテクニックなどは、スパム行為と判断され、(ペナルティとして)検索の対象から外されてしまうことがある。
[chapter 1]Skype
- Skype(スカイプ)は、P2P(ピアツーピア)の技術を利用した音声通話、ビデオ通話、インスタントメッセージなどを提供するサービスである。Skypeの利用者同士であれば、世界どこでも無料でコミュニケーションすることができる。Skypeは、固定電話や携帯電話と通話することも可能(ただし、有料)。
URL: http://www.skype.com/intl/ja/
[chapter 2]SWF
- SWF(Small Web Format:エスダブリューエフもしくはスウィフ)は、Adobeのアプリケーションソフト「Flash」のインターネット公開用フォーマット。拡張子は「.swf」。
[chapter 5]
Twitter(ツイッター)
- Twitter(ツイッター)とは、米国Twitter社(旧Obvious社)が2006年7月にスタートしたコミュニケーションサービスである。140字以内の短いテキスト(ツイートと呼ばれる)を投稿するだけのシンプルなサービスだが、すべての投稿にパーマリンクが付与され、参照可能になっている(ブログの機能)。さらに、気になった人をフォローし、リアルタイムでコミュニケーションすることもできる(チャットの機能)。
[chapter 1]
Ustream.tv
- Ustream.tv(ユーストリーム)は、 個人が無料で利用できるライブビデオストリーミングサービスである。パソコンとWebカメラ、ブロードバンドの環境があれば、誰でも簡単に生放送することができる。また、専用のアプリをインストールすれば、スマートフォン(iPhone、Androidなど)でも生放送することが可能。
URL: http://www.ustream.tv/
[chapter 2]
W3C
- W3C(World Wide Web Consortium:ワールド・ワイド・ウェブ・コンソーシアム)は、Webの標準技術を策定している非営利団体(標準化団体)である。通称、W3C(ダブリュースリーシー)と呼ばれる。MITコンピュータ科学・人工知能研究所(米国)、欧州情報処理数学研究コンソーシアム(フランス)、慶應義塾大学(日本)が共同で運営している。
W3C (http://www.w3.org/)
[chapter 1]WCAG
- WCAG(Web Content Accessibility Guidelines:ウェブコンテンツ・アクセシビリティ・ガイドライン)は、高齢者や障害のある人でも等しく情報にアクセスすることが可能な「アクセシブルなサイト」をつくるためのガイドライン(指針)のことである。WCAG 1.0はW3Cで1999年5月、WCAG 2.0は2008年12月に勧告された。
Web Content Accessibility Guidelines (WCAG) 2.0 (http://www.w3.org/TR/WCAG20/)
[chapter 1]
このサイトは、境祐司が運営する実験用(個人)サイトです。更新期間:2010年1月1日~12月31日(現在はテスト期間)