Webスクールレベルの授業が格安で学べるWebデザインのオンライン講座。Illustratorでロゴやパーツを作り、PhotoshopでWebデザイン、その後、HTML・CSSでのコーディングまでの現場レベルのWeb制作を効率的に学べる実践編 Webスクールレベルの授業が格安で学べるWebデザインのオンライン講座。

HOME >> Webデザイナースクール体験記スタンダードテクニックユニット

Webスタンダードテクニックユニット 教程7 ブラウザとソースコード

【教程7 ブラウザとソースコード】

今回から、いよいよHTML。
Dreamwerverを使用してHTMLの基本を覚えていきます。

前半は、前回の続きでIllustratorでポストカードの仕上げ。
後半が、HTMLの基本。
という授業内容でした。

初心者 ウェブデザイナー"Webスタンダードテクニックユニット 教程7 ブラウザとソースコード"の詳細はこちら

Webスタンダードテクニックユニット 教程8 テーブルレイアウト

【教程8 テーブルレイアウト】

今日は、テーブルレイアウトです。
テーブルを構成するHTMLタグの細かな設定の前に、Dreamwerverの操作に慣れる、感覚をつかむという内容。

テーブルレイアウトにも様々なやり方があるので、Dreamwerverの操作方法のシュミレーションを兼ねて、どんどんテーブルでレイアウトしたページを作っていきテーブルと仲良くなるというスタンスで授業は進みます。

初心者 ウェブデザイナー"Webスタンダードテクニックユニット 教程8 テーブルレイアウト"の詳細はこちら

Webスタンダードテクニックユニット 教程9 テーブルレイアウト、テーブルタグの詳細、FFFTP

【教程9 テーブルレイアウト テーブルタグの詳細、FFFTP】

今回も先週に続いて、テーブルレイアウトです。
先週は、Dreamwerverの操作に慣れる、感覚をつかむという感じでテーブルレイアウトをやりましたが、今回はテーブルを構成するHTMLタグの細かな解説を受けながらの授業でした。

またファイル転送ソフトFFFTPを使って受講生用に準備されているサーバーへのアップロードも行いました。

初心者 ウェブデザイナー"Webスタンダードテクニックユニット 教程9 テーブルレイアウト、テーブルタグの詳細、FFFTP"の詳細はこちら

Webスタンダードテクニックユニット 教程10 テーブルレイアウト データ用テーブル、入れ子テーブル

【教程10 テーブルレイアウト データ用テーブル、入れ子テーブル】

今回も先週に続いて、テーブルレイアウトです。
テーブルを構成するHTMLタグの細かな解説を受けながらレイアウトのためのテーブルを理解していくという授業内容でした。

初心者 ウェブデザイナー"Webスタンダードテクニックユニット 教程10 テーブルレイアウト データ用テーブル、入れ子テーブル"の詳細はこちら

Webスタンダードテクニックユニット 教程11 実践的レイアウト、デザイン

【Webスタンダードテクニックユニット 教程11 実践的レイアウト、デザイン】

今週からいよいよ本格的なデザイン、レイアウトを実践していきます。
今後、Webデザイナーとして作成するホームページの基本となる技です。

【実践的レイアウト、デザインの課題】
Fireworksで作ったパーツをスライスを切って書き出し、Fireworksでデザインした通りにDreamwerverと連動させ、1ピクセルも違わずにブラウザで表示させる技術を身につけること。

これは、実践のために身につけたい技術のひとつであり、これができればあとは、デザイン、レイアウトのセンスを磨き、どんどん作品を作っていくことができるとのこと。

初心者 ウェブデザイナー"Webスタンダードテクニックユニット 教程11 実践的レイアウト、デザイン"の詳細はこちら

Webスタンダードテクニックユニット 教程12 実践的レイアウト FireworksとDreamwerverの連動

【Webスタンダードテクニックユニット 教程12 実践的レイアウト FireworksとDreamwerverの連動】

今週は、前回の続き。
自分のデザインしたレイアウトをブラウザで確実に表示させる超実践的な授業です。

初心者 ウェブデザイナー"Webスタンダードテクニックユニット 教程12 実践的レイアウト FireworksとDreamwerverの連動"の詳細はこちら

【Webスタンダードテクニックユニット 教程13 実践的レイアウトその2】

【Webスタンダードテクニックユニット 教程13 実践的レイアウトその2】

今週から、もう一歩進んだ「実践的レイアウト、デザイン」に入ります。
目的は、ナビゲーションの役割や考え方を踏まえながら、0から自分のデザインでホームページを作る訓練。

初心者の実践的レイアウト、デザイン練習のコツは、

初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程13 実践的レイアウトその2】"の詳細はこちら

【Webスタンダードテクニックユニット 教程14 実践的レイアウトその3】

【Webスタンダードテクニックユニット 教程14 実践的レイアウトその3】

前回からの続きです。

表示させたボタンの対となるボタンを作りロールオーバーイメージを作ります。
Fireworksの同一画面でロールオーバーボタンを作成するミソは、レイヤーを整理して上手く使いこなすこと。

初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程14 実践的レイアウトその3】"の詳細はこちら

【Webスタンダードテクニックユニット 教程15 実践的レイアウトその4】

【Webスタンダードテクニックユニット 教程15 実践的レイアウトその4】

Fireworksでスライスをきり、書き出したパーツをDreamwerverで実装して、デザインしたパーツを1pxも違わずブラウザで確実に表示させるというサイト作り。
現在はこれらを完璧にできるようにとその過程を反復練習しながら、Fireworks、Dreamwerverの操作に慣れるという流れです。

今週は、先週、先々週に習った作業を反復練習、CSSの解説、キャッチコピー、テキストの配置などをしました。

初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程15 実践的レイアウトその4】"の詳細はこちら

【Webスタンダードテクニックユニット 教程16 実践的レイアウトその5】

【Webスタンダードテクニックユニット 教程16 実践的レイアウトその5】

ウェブデザイナースクール ヒューマンアカデミーWeb講座先週作成したトップページを活かしながら複数ページ展開の方法を学びました。
コンテンツとしてCDジャケットと関連情報をテーブル(表組み)で入れていきます。あくまでのWeb2.0的なWeb制作のための準備という考え方です。


初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程16 実践的レイアウトその5】"の詳細はこちら

【Webスタンダードテクニックユニット 教程17 実践的レイアウトその6】

【Webスタンダードテクニックユニット 教程17 実践的レイアウトその6】

Webデザイナースクール ヒューマンアカデミーWeb講座先週の複数ページ展開の続きです。
ホームページの基本となるレイアウトとコンテンツの関連情報を入れるフォーマットができたらあとは複製していくだけです。
後半は、トップページのポイントとなるアイコンを作成しました。


初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程17 実践的レイアウトその6】"の詳細はこちら

【Webスタンダードテクニックユニット 教程18 Flash】

【Webスタンダードテクニックユニット 教程18 Flash】
Webデザイナースクール flash今週はいよいよFlashに入ります。
Flashをさわるのは初めてなので、ちょっとワクワク・・・。

Flashは、アニメーションのように1コマ1コマ作らなくても、人が設定することで勝手に計算しながら動いてくれるのが大きな特徴。
初めての「Flash」の授業の方針は、あえてローテクから。
まずは、3つの基本をマスターしていきます。

初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程18 Flash】"の詳細はこちら

【Webスタンダードテクニックユニット 教程19 Flash】

【Webスタンダードテクニックユニット 教程19 Flash】

flashのレイアウト今週はFlashの2回目。
ナビゲーションのエリアを使い文字の表現の仕方を交えながらFlashの基本を身につけていきます。
FireworksからWebサイトのヘッダー部分をコピーして、Flashにペースト。
タイトル部分に透明感をもたせ、動きの変化をつけていきます。
完成ファイルはこちら

初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程19 Flash】"の詳細はこちら

【Webスタンダードテクニックユニット 教程20 Flash】

【Webスタンダードテクニックユニット 教程20 Flash】
Webデザイナースクール名古屋 Flash講座Flashの3回目。
先週の続きで、今週はヘッダー右側の「会社概要」などの5つのボタンにボタンタイプをつくり、ここに動きを入れていきます。
ページが表示された時、タイトル部分の動きが止まると同時くらいに上部から5つのボタンが順番におりてくるように設定。
マウスオーバー時のカラーにも変化をつけます。
完成ファイルはこちら

初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程20 Flash】"の詳細はこちら

【Webスタンダードテクニックユニット 教程21 Flash・HTML・CSS】

【Webスタンダードテクニックユニット 教程21 Flash・HTML・CSS】
Webデザインスクール 名古屋 Flash・HTML・CSSDreamwerverでFlash(swfファイル)をhtmlに組み込み、複数ページ展開していきます。
これにCSSの適用も取りいれながらCSSの基本とDreamwerverでの操作方法も練習しました。
テーブルを使ったレイアウトからCSSレイアウトへの移行する過渡期の方法論。
簡素なテーブルに、CSSレイアウトを組み合わせてコーディングを行います。

初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程21 Flash・HTML・CSS】"の詳細はこちら

【Webスタンダードテクニックユニット 教程22 Flash・Fireworks】

【Webスタンダードテクニックユニット 教程22 Flash・Fireworks】
Webデザイナースクール 名古屋 Flash・FireworksDreamwerverでswfファイルをhtmlに組み込み、複数ページ展開していく上で各ページが同じヘッダーだとつまらない・・
ということで今日は、Fireworksでの各ページ用のヘッダー画像(Flash swfファイル)のリサイズ、作成方法とFlashとの連動を学びました。

初心者 ウェブデザイナー"【Webスタンダードテクニックユニット 教程22 Flash・Fireworks】"の詳細はこちら


Webデザイナースクール探しのコツ

ウェブデザイナースクールを探す時、まずあなたはどんな情報を重視しますか?

Webデザイナーと一言でいっても、 Webプロデューサー、Webディレクター、Webプログラマー、派遣でWeb制作、企業内でWeb担当・・といったように就職先や職種など様々な道があります。

無駄なく、すべてを学べる最適な学習プランを見つけるコツはWeb講座専用の資料を入手することです。

Web講座専用の資料を請求すると、Webデザイナーとして目指すクリエイターになるには、何を勉強し、どんなスキルを習得すればよいのか?
また、それには費用はいくらかかるのか?
など無駄なく、すべてを学べる最適な学習プランをチェックできます。

また、講座の詳しい説明はもちろん、修了生の感想や活躍状況など ネットや広告には書かれていないプロならではの業界最新事情なども手に入ります。

ヒューマンアカデミーには、無料資料が用意されていますので、スクール探しの情報収集として、まずは最新情報を無料で取り寄せてみましょう!!


ウェブデザイナー スクール ヒューマンアカデミー名古屋


ウェブデザイナー スクール ヒューマンアカデミー名古屋ヒューマンアカデミWeb講座資料請求(無料)>>>

ウェブデザイナー スクール ヒューマンアカデミー名古屋Webのお仕事とは?

ウェブデザイナー スクール ヒューマンアカデミー名古屋Web講座コース料金一覧

ウェブデザイナー スクール ヒューマンアカデミー名古屋Web講座の特徴・講師紹介

ウェブデザイナー スクール ヒューマンアカデミー名古屋Web関連試験資格情報


ウェブデザイナー スクール ヒューマンアカデミー名古屋ヒューマンアカデミーWeb講座資料請求(無料)はこちらから>>>