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

HOME >> Webデザイナースクール体験記スタンダードテクニックユニット >> Webスタンダードテクニックユニット 教程7 ブラウザとソースコード

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

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

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

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

前回の続き・・・

Webデザイナースクール

テキストボックスにテキストと画像を配置。
テキスト配置時に注意することは、行間と両端の揃え方。
文字パレットで、「行送りを設定」でバランスを整える。

Illustrator 文字パレット

画像を配置してポストカードの出来上がり。

Illustrator

IllustratorとPhotshopの基本操作を学ぶユニットはこれで終了です。

全6回、IllustratorとPhotshopの基本中の基本をふまえながらWebデザイナーとして現場ですぐに使える必要最低限の技を教えてもらいました。

これらを自分のものにするには、パスの練習、メニューボタン、アイコン、地図やポストカードなど小さな物から手を動かして作ること。
わからない、できないことを発見すること。

この訓練がIllustratorとPhotshopと仲良くなれる近道。

Webデザイナーに求められる技術
「限られた面積の中でいかにカッコよくレイアウトするか」という訓練には、
例えば、テキストボックスのレイアウトやデザインはWebのデザインに直結することからポストカードや名刺作りなどがよいそうです。

Webスタンダードテクニックユニット

さて、後半はDreamwerverを使用してHTMLの基本です。

ここからが、Webスタンダードテクニックユニットコースに入ります。
「Web標準を実践課題に沿って体系的に学んでいく」というコースです。

私のホームページ作りの始まりはホームページビルダーでした。
HTMLというものが、何なのか、まったくわからない状態でしたが、
ホームページビルダーで何度も何度もホームページを作って更新していくうちにすっかりタグを覚えることができました。

そして、MT(Movable Typeというブログ作成ソフト)を覚えはじめてから、さらにCSSもマスターすることができました。

しかし、Webデザイナーとして仕事をしていくには、どこの求人情報を見てもDreamwerverの操作は必須。
市販の専門書を見ながら何とか使うことはできますが、プロはこのソフトをどのように使いこなしているかが知りたい。
(これが、Webデザイナースクールに通い始めた理由の一つです。)

IllustratorとPhotshopと違い、この教程7からは、HTML、DHTML、CSSがある程度わかる状態からのスタートなので授業もどんどん吸収していけそうな気がします。

DreamwerverとHTMLの基本 後半の授業内容

後半授業内容:
環境設定、サイトの管理、ファイルの新規作成と保存方法、タイトルタグの重要性、
イメージ画像とテキストの配置、代替テキストの説明、プロパティインスペクタの使い方
一番簡単な「テーブルレイアウト」

Dreamwerverを起動させ、ページ作りをしていくわけですが、初めからいきなり直接HTMLを打ち込むことはしません。
それは、もう少し進んだ段階で覚えることになります。

今後の授業のスタンスは

何かを作りながらHTMLタグの解説をしていき、HTMLタグと友達になりながら、ササッとイメージしたものが作れるようになること。

今どきに技術でスピードと生産力のある人になる。

プロの手口でサイトをデザイン、作成していく。

基礎ばかり重視しても、イメージしたものを作ることができなければ語れない。

ということで、ライトな取り組み方で授業がすすみます。
Dreamwerverの操作の確認には、デザインビューとコードビューがあります。
授業では、主にデザインビューで操作確認し、その後コードビューでHTMLタグの解説をしていきます。
人間の視覚的なところから入るわけです。

講師によると

「とにかく、授業で覚えたことを繰り返し復習しながら、たくさんものを作る。
そして、たくさん褒めてもらう。
これが、エネルギー源となりいいものが作れるようになる。」とのこと。

IllustratorとPhotshopを忘れないよう練習しつつ、Dreamwerverも完璧にマスターしたいと思います。


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

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

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

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

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

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

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


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


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

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

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

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

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


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

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

【Webデザイナースクール体験記スタンダードテクニックユニットカテゴリーの関連記事】

【Webスタンダードテクニックユニット 教程22 Flash・Fireworks】
【Webスタンダードテクニックユニット 教程21 Flash・HTML・CSS】
【Webスタンダードテクニックユニット 教程20 Flash】
【Webスタンダードテクニックユニット 教程19 Flash】
【Webスタンダードテクニックユニット 教程18 Flash】
【Webスタンダードテクニックユニット 教程17 実践的レイアウトその6】
【Webスタンダードテクニックユニット 教程16 実践的レイアウトその5】
【Webスタンダードテクニックユニット 教程15 実践的レイアウトその4】
【Webスタンダードテクニックユニット 教程14 実践的レイアウトその3】
【Webスタンダードテクニックユニット 教程13 実践的レイアウトその2】
Webスタンダードテクニックユニット 教程12 実践的レイアウト FireworksとDreamwerverの連動
Webスタンダードテクニックユニット 教程11 実践的レイアウト、デザイン
Webスタンダードテクニックユニット 教程10 テーブルレイアウト データ用テーブル、入れ子テーブル
Webスタンダードテクニックユニット 教程9 テーブルレイアウト、テーブルタグの詳細、FFFTP
Webスタンダードテクニックユニット 教程8 テーブルレイアウト
Webスタンダードテクニックユニット 教程7 ブラウザとソースコード


HOMEへ   ▲画面上へ
Hatenaブックマークに追加 このエントリーをHatenaブックマークに追加

Yahoo!ブックマークに登録 Yahoo!ブックマークに登録  ブックマークに追加する

トラックバック

このエントリーのトラックバックURL:
http://www.pro-web.info/mt/mt-tb.cgi/14

コメントを投稿

(いままで、ここでコメントしたことがないときは、コメントを表示する前にこのブログのオーナーの承認が必要になることがあります。承認されるまではコメントは表示されません。そのときはしばらく待ってください。)