ホームページ制作コースのお申し込み受付を終了させていただきました。
ソフトの操作方法を効率的に覚えていただくために、当スクールではテキストに加え、動画教材をご用意。実際にご自分の目で操作の流れを見て視覚的に学習することで、頭の中で操作の流れをイメージしながら覚えていくより、効率的に学習を進めていただくことが可能です。
本コースでは、テキスト学習で学んだ基礎力を踏まえ、応用レベルの課題制作を実施します。課題制作では、仮想クライアントとの取引というシチュエーションの中で、クライアントからの要求・実務を想定した仕様・納品形態に基づいて、ご自分で企画・提案をした課題作品を制作します。この応用レベルの課題制作により、制作力にとどまらず、創造力と企画力の向上をも図っています。
Dreamweaverとは
Dreamweaverは、Web サイトの作成に使用するプロユースのソフトウェアです。Webページを作成するには、HTMLの知識が必要となりますが、Dreamweaverでは自分がデザインしたレイアウトで、HTMLを記述します。Dreamweaverのツールを使用することにより、 プログラムを呼び出すフォームの挿入やJavaScriptの記述も可能になります。またデザインを視覚的に確認しながら、自分でHTMLを直接記述することもできますので、HTMLの学習用として Dreamweaver を使用することもできます。
FLASHとは
FLASHは、アニメーションの作成に使用するプロユースのソフトウェアです。最近では、FLASHで作成したトップページやナビゲーションボタンなどを適用したWebサイトが多く見られ、すでに「見るWebサイト」から、「利用するWebサイト」が定着したWebの世界では、必須の知識レベルとなります。FLASHを再生するには、Flash Playerが必要ですが、Flash Playerは普及率が非常に高いことから、自分が作成したアニメーションを多くの人に見てもらえる、という可能性も広がります。
FLASHでは、アニメーションを構成するコンテンツの描画、文字の入力からアニメーションの作成まですべてを行うことが出来ます。
ホームページ制作コースでは、Web標準を短期間に効率よく学習するためのカリキュラムとなっております。Webデザインの土台をなす知識としてWebデザインはもちろん、W3C勧告に準拠した（X）HTML+CSSによるコーディング、SEO対策のための基礎知識と効果測定の方法を理解し、知識を活用しながらアクセスアップのためのアクセス解析を行う方法を学習します。さらにWebサイト制作には欠かせない、DreamweaverとFLASHを使用したWebサイトの制作や管理、FLASHアニメーションの作成方法も学習し、Web業界で活躍するために必要な基礎力を養った上で、実務を想定した応用レベルの課題制作を行います。
Webサイト構築、FLASHアニメーションの作成を行う上での関連技術におけるその用語と概念を理解しながら、DreamweaverとFLASHの基本操作を習得し、Dreamweaverを使用してHTMLを視覚的にレイアウトできる、FLASHを使用してWebコンテンツ、アニメーションの作成ができるレベルを目標とします。
- 未経験からWebデザイナーを目指す方
- WebデザイナーやプログラマーなどのWeb系の開発に携わる方
- Webデザインのスキルを習得されたい方
- 業務経験のない内定者や新入社員への教育として利用したい企業の方
- DreamweaverとFLASHを基本から学習したい方
- ホームページ制作に興味のある方
パソコン、インターネット、ファイルの圧縮、解凍、ソフトのインストール等を問題なく利用できる方
ホームページ作成の基本知識
ホームページには、大きく分けて画像、イラスト、ロゴ、ナビゲーションボタン、アイコンなどのさまざまなグラフィックコンテンツと文字（原稿）、そしてこれらをホームページの中に組み込むためのHTMLという言語で構成されています。このHTMLに関連するSEOも検索エンジン対策として重要です。さらに、HTML中心の静的なホームページを動的なものにする要素として、FLASHアニメーションやJavaScriptなどがあります。さらに多くのデータを扱うホームページはWebデザインとプログラムの両輪で成り立っていますので、Webサイト制作を行う上でWebデザインとプログラム、データベースとの連動が必要になります。
ここでは、ホームページの作り方と題して、初心者の方向けに次のホームページの作り方を段階的に分けて紹介します。
目次
文字だけのWebページ
HTML（HyperText Markup Language）
次のWebページは、文字だけを入力したページです。このように文字だけが表示されているページは、とてもシンプルですが、ホームページとしては見てもらうためのアピールができていないページです。
この文字だけのページがどのように作られているのか、ページの中身を見てみましょう。
このように<html><title><body>などと記述されているのが、HTMLです。文章をホームページの中に組み込むためにこのHTMLが必要になります。
文字だけのページをアレンジしよう！
CSS（Cascading Style Sheets）
このように文字だけのページでは物足りませんので、より良いホームページにするためにちょっとアレンジをしてみましょう。
このページがどのように作られているのか、ページの中身を見てみましょう。
このように p、h2 などに対して文字のサイズや文字の色を指定しているのが、CSSです。このCSSにより多少見栄えのあるホームページにすることができます。
画像やボタンを追加しよう！
Illustrator
CSSを使って見栄えを良くしましたが、それでも物足りません。ホームページを象徴するロゴやボタンを追加して、もっと華やかなホームページにしましょう。
次の画像は、Illustratorで作成したコンテンツです。ロゴは、ホームページを象徴する必要不可欠なコンテンツです。ホームページで注目してもらいたい部分を、Illustratorで作成することでホームページにメリハリをつけることができます。さらにここではホームページに動きをもたらせるためにナビゲーションボタンを2種類用意しておきます。
Photoshop
次の画像は、Photoshopで補正・加工した画像です。補正や加工は、画像をホームページで使用できるように必要な作業です。
上記の画像は、背景にある余分なグラスを除去し、グラスの傾きと色調を修正した画像です。
上記の画像は、あじさいの花びらをイラスト風に加工し、花びらと葉の間にガラス窓挿入した画像です。このように現実離れした画像に加工することができます。
上記の画像は、本来の紅葉のように蘇らせた画像です。これにより、被写体が持つ本来の特徴を表現することができるようになります。
上記の画像は、花びらのみを抽出した画像です。これにより、花びらだけを使用したさまざまな画像を作成することができるようになります。
FLASH
次の画像は、FLASHで作成したアニメーションです。文章だけでは表現しきれないホームページのアピールポイントをFLASHアニメーションで訴えることができるようになります。
ホームページを完成させよう！
Dreamweaver
ホームページで使用するコンテンツが揃いましたので、これらを1つのページとして仕上げましょう。
上の画像は、Dreamweaverの編集画面です。このような細部にわたるレイアウトを行う場合には、Dreamweaverが必要になります。Dreamweaverを使用することによって作業の効率化やミスの回避を図ることができるようになります。
JavaScript
さらにJavaScriptを使用してホームページに変化をもたせます。
これでホームページ制作は終了です。
ホームページを制作するには．．．
最低限のスキルとして次のスキルが必要になります。
- インターネット
- ホームページ制作を行うための前提知識とスキル
- HTML
- ホームページを構成するHTMLタグを記述するための知識とスキル
- CSS
- ホームページをレイアウト・デザインするための知識とスキル
- Photoshop
- 画像をホームページで効果的に表現するための知識とスキル
- Illustrator
- ナビゲーションボタンやイラスト、アイコン等を作成するための知識とスキル
- Dreamweaver
- コンテンツの組込、ホームページ全体の管理を行うための知識とスキル
- FLASH
- FLASHムービーやFLASHコンテンツを作成するための知識とスキル
- JavaScript
- ホームページに動きをもたらすための知識とスキル
Webデザイナーにあると望ましいスキルとは．．．
Webデザイナーとして実務に従事する場合、次のスキルがあることが望ましいです。
- SEO
- 検索エンジン対策のための知識とスキル
- Webデザイン
- Webデザインの特性を把握し、ユーザビリティを考慮したWebサイト制作するための知識とスキル
- Webデザイン設計
- Webサイトを制作する上でデザインに関わる「サイトマップ設計(リンク構成)」「ナビゲーション設計」「レイアウト設計」「色彩設計」のための知識とスキル
- XML
- HTMLが抱える問題の解決と幅広いホームページ制作を実施するための知識とスキル
- プログラミング
- PHPやJAVA等を用いてシステム構築を実施するための知識とスキル
- ネットワーク
- クライアントの幅広い要求、要望に対応するための知識とスキル
