Webデザイン スキルアップ講座 [イメディオセミナー] Webデザイン スキルアップ講座 [イメディオセミナー]『 Webデザイン スキルアップ講座 』の詳しい講座内容について紹介いたします。
講座の内容についてご質問がありましたら、r360@bb.wakwak.com までご連絡ください。
（2010年1月30日(土) 開講）
Dreamweverをオーサリングツールの中心として、ウェブ制作現場で実際に使用されている制作手順を学習します。 受注後の企画～制作～納品までの一連の流れやサイト設計についても学習します。
無計画にいきなりサイトを作り出してしまうと、絡まった糸のように分かりにくいものになりがちです。市場調査をし、企画を立て、構造や画面の設計をしてから実際の制作に取りかかるのが好ましい進め方です。講師のサイトr360studioのリニューアル例を元に制作フロー(制作の流れ)を学習します。
サイト設計の前提条件は、コンセプトです。つまり、「運営者目的」と「訪問者目的」を明確にすることです。その上で「使いやすいサイト構造」や「訪問者を誘導する導線」を組み立てていきます。ここでは、上記を踏まえたサイトマップ設計と画面設計の手法を学びます。
制作を進めるソフトを効率よく使っていますか？ ソフトの力を100%引き出して、効率よく制作を進めるテクニックを紹介します。 ※Dreamweaver CS4、Fireworks CS4、PhotoshopCS4などを取り上げます。
また、最近導入が盛んな簡易CMSを組み込んだサイトの利点についてもご覧頂きます。 ※簡易CMSソフトには、MovableTypeを取り上げます。
（2010年2月20日(土) 開講）
ありきたりなレイアウトではなく、"プロっぽい"ページデザインを作成するための実習を行います。 Webサイトデザインに大切なことは「読みやすいこと（可読性）」「使いやすいこと（ユーザビリティとアクセシビリティ）」「感興(かんきょう)を刺激すること（魅力・面白さ・興味深さ）」です。【レイアウト（配置）】【フォント（文字種）】【カラー（色）】の要素に分けて、デザインの基本的な知識・手法を身につけます。
Webサイトはサービスを顧客に伝えるための宣伝媒体です。芸術作品を作るように直観とセンスでデザインするのではなく、意図を持って情報を整理分類しわかりやすく表現する必要があります。ここでは、情報分類をするために必要な４つの基本原則、[近接]・[整列]・[繰り返し]・[コントラスト]を学びます。
タイポグラフィ(Typography)は、文字を適切に配列することです。文章の「可読性」(読みやすさ・文章の意味の理解しやすさ)、「視認性」(文字の確認しやすさ)、「誘目性」（人の目を引き付ける度合い）などを高めるためのタイポグラフィの基本を学びます。
配色もデザインを決める重要な要素です。文字と同じく「可読性」・「視認性」・「誘目性」などを高めるための適切な色を組み合わせ方法を学びます。 また、配色を考えるツールとして「Adobe Kuler」を使用します。
ここまで見てきたデザインの要素を踏まえながら、サイトのデザイン要素（ページレイアウト・リスト飾り・囲み枠…など）再検討してみましょう。また、アクセシビリティのガイドラインについて、その概要を学習します。
（ 2010年3月13日(土)開講）
サイトで動的な動きを表現するための技術として、Javascriptライブラリー（Ajaxライブラリー）があります。これは、Javascript言語を使って、ページの再読み込みせず動的コンテンツを表現する技術の総称です。GoogleがGmailやGoogle CalendarなどのWebアプリケーションの使い勝手を良くするためにAjax技術を導入したことがこの技術が注目されるきっかけとなりました。現在では、JQuery・Adobe Spryなど、非プログラマーの制作者が簡単に技術を導入できるようにしたライブラリが普及しています。ここでは、サイトでよく見かけるJavascriptライブラリーを使って、ページに動きをつける方法を学習します。
Javascriptライブラリの概要について確認し、ページに組み込む際のJavascriptソースコードの基本を学習します。
jQuery（ジェイ・クエリー）は、現在最も使用されているおり、制作者が安心して使える、将来有望なライブラリーです。ここでは、JQueryを利用したJavascriptライブラリーの「Slide Box ／ Auto Sprites 」などの組み込みを実習します。
LightBox2は、画像のサムネイルやスライド表示でよく利用されているJavascriptライブラリーです。Prototype.jsを使用したLight Box2の組み込みを行います。
Adobe Spry（スプライ）は、米Adobe Systems が開発した、JavaScriptライブラリです。DreamweaverCS4では、挿入メニューから簡単にSpryを組み込むことができます。ここでは、「タブ付きパネル ／ Spryデータ検証 ／ Spryデータテーブル」などを取り上げ、組み込み方を学習します。