|CSSを使ってのWEB講座|スタンダードWEB講座|CSS講座|
CSSを使ってのWEB講座 計17回
従来のWEB講座にCSS講座を盛り込んで、これからのWEBレイアウトの主流になってくるCSSのマスターを目指します。本格的に取り組みたい方にお薦めです。
ドリームウィーバー 9回
1.ホームページ作成の準備、新規ページへ文章入力、画像の配置
2.リンク設定、テーブルを使ってレイアウトする
3.フォーム作成、ビヘイビア
4.CSSでの準備、レイアウトの概念
5.CSSの書式設定、ボックス作成
6.リスト、タイトル作成
7.ナビゲーション
8.CSSでレイアウト作成@
9.CSSでレイアウト作成A、FTPでのアップロード、SEO対策
ファイアーワークス 3回
1.パスの描画、、カラー設定、ストロークの設定、オブジェクトの設定
2.写真処理、レイヤー操作
3.スライス、ポップアップメニュー、書き出し
フラッシュ 5回
1.グラフイックを描いてみる、簡単なアニメーション
2.グラフィックツールを使いこなす
3.面白いアニメーションの作り方
4.ボタン作成、ナビゲーションページ、HTMLに変換
5.アクションスクリプトを使って動かしてみる
講習時間 2時間×17回
講習料金 11.0,500円
WEB講座の生徒さん作品をご覧ください。
スタンダードWEB講座 計14回
テーブルでのレイアウトデザインをメインにしたWEWB講座です。
このレイアウト方法はホームページ初期の頃から現在まで使われている、オーソドックスな手法です。
ドリームウィーバー 5回
1.ホームページ作成の準備、新規ページへ文章入力
2.画像の配置、リンク設定
3.テーブルを使ってレイアウトする
4.フォーム作成、ビヘイビア
5.総合、FTPでのアップロード、SEO対策
ファイアーワークス 4回
1.パスの描画、、カラー設定、ストロークの設定
2.オブジェクトの設定、ライブエフェクト、オブジェクトの設定
3.写真処理、レイヤー操作、アニメーション
4.スライス、ポップアップメニュー、書き出し
フラッシュ 5回
1.グラフイックを描いてみる、簡単なアニメーション
2.グラフィックツールを使いこなす
3.面白いアニメーションの作り方
4.ボタン作成、ナビゲーションページ、HTMLに変換
5.アクションスクリプトを使って動かしてみる
講習時間 2時間×14回
講習料金 91,000円
CSS講座 計6回
1.CSSでの準備、レイアウトの概念
2.CSSの書式設定、ボックス作成
3.リスト、タイトル作成
4.ナビゲーション
5.レイアウト作成@
6.レイアウト作成A
講習時間 2時間×6回
講習料金 39,000円
WEB講座
- ドリームウィーバー
- ファイアーワークス
- フラッシュ
- CSS
データ処理コース
WINコース
- Windows初級
- ワード
- エクセル
- パワーポイント
CSSとは
CSSで何故WEBページのレイアウトをしていくのか?
先ず、HTMLがスリムになります。スリムになると容量を減少させ、表示速度も速くなります。世の中エステが大流行ですが、WEBもエステが必要になってきています。
従来はTableタグにピクセルサイズを入力してレイアウトをしていましたが、CSSではコンテンツをブロック化してHtmlを作成し、レイアウトのサイズ等はCSSで作成します。
そうするとメンテナンスも楽になり、左右のブロックの入れ替えなども簡単にできます。

上のレイアウトサンプルを、tableタグとCSSでHtmlを作成したものが以下です。見比べてみてください。
tableでのhtml
<body>
<div align="center">
<table width="760" height="478" border="0" cellpadding="0" cellspacing="0">
<tr><td height="100" colspan="2" bgcolor="#DDDDDD"> </td></tr>
<tr><td width="160" height="460" bgcolor="#66CCFF"> </td>
<td width="500" height="460" bgcolor="#FFFF33"> </td></tr>
<tr><td height="50" colspan="2" bgcolor="#FFE8CC"> </td>
</tr>
</table>
</div>
</body
CSSでのレイアウト
html部分
<body>
<div id="wrapper">
<div id="header">文章</div>
<div id="main">文章</div>
<div id="sub">文章</div>
<div id="footer">文章</div>
</div>
</body
CSS部分
#header {
background-color: #33CC00;
height: 125px;
width: 760px;}
#sub {
background-color: #66CCFF;
float: left;
height: 435px;
width: 160px;}
#main {
float: left;
margin-left: 0%;
background-color: #FFFF33;
height: 435px;
width: 600px;}
#footer {
background-color: #FFE8CC;
clear: left;
height: 50px;
width: 760px;}