千貫りこのHTML/CSS中級講座
「コーディング」という作業は「ビジュアルデザインを実装すること」とイコールであると捉えられがちです。しかしHTMLは本来、デザインの影響を受けるべきではありません。あなたは、デザイン実装に気をとられるあまり「デザイン前提のHTML」を記述していませんか？
本講座では「CSSレイアウトにある程度慣れている方」または、「 千貫りこのHTML/CSS入門講座 」の履修相当の理解がある方を対象にしています。
無理のないHTMLを土台としてデザインを実装するためのCSSや、複雑なレイアウトを実現するためのCSSを、実習を通して習得します。HTML5とCSS3を見据えたコンテンツ制作にもふれながら解説していきます。
またトラブル発生時の対処方法や、知っておくと便利なCSSファイルの管理方法など、サイト制作にまつわる実践的なテクニックを習得します。
講座レベル
■カリキュラム概要
1."正しい"HTMLを記述する
- 要素の判断方法
- ケーススタディ
2.ワンランク上のHTML
- 画像のaltについて
- 情報の並び順
- マークアップする（実習）
- バリデーションについて
3.実践的CSSのあれこれ
- ボックスモデルについておさらい
- スタイルの優先順位
- CSSシグネチャ
- CSSファイルを分割して管理する
- ルールづくり
- チェックポイント
- トラブル発生時のデバッグ方法
4.CSSを記述する（実習）
- 段組
- 横並びのボックスの、見かけの高さをそろえる
- 横並びのボックス内にあるアイテムの縦位置をそろえる
- displayプロパティのつかいどころ
- jQueryで作業負荷を軽減する
- 印刷用CSS
＊カリキュラムの進度および内容は、受講者全員の理解度・習得度によって変更される場合があります。
- 使用アプリケーション
- Adobe Dreamweaver CS5
- 講師
- 千貫りこ
- 定員
- 6名
- 対象
- 「 千貫りこのHTML/CSS入門講座 」の履修相当の理解がある方。
マークアップの基本は知っているが、さらに理解を深めたい方
より効率的にHTML+CSSでサイトをつくる方法を知りたい方
CSSレイアウトの基本は知っているが、さらに活用方法を知りたい方
本ページ下の 受講対象レベルチェック問題 を理解できる方。 - 料金
- 29,800円（税込み）
■受講対象レベルチェック問題
＊全問正解が受講の必須条件ではなく、受講対象レベルの具体的な目安とお考えください。
問1：
以下のHTMLのp要素に装飾をほどこしたいとき、CSSのセレクタはどのように記述しますか？
ただし、IE6以上のモダンブラウザにスタイルを適用できることが条件です。3つお答えください。
<body>
<div class="section">
<h2>セレクタ</h2>
<p class="text">セレクタにはいろいろな記述方法があります。</p>
</div>
</body>問2：
以下のHTMLに問題点はありますか？あるとすれば何が問題なのでしょうか？
<a href="sample.html" target="sample">サンプルページへの<div style="color:red">リンク</div></a>答1：
p、div p、div.section p、
div.section p.text、.section .text など
答2：
インライン要素であるa要素の内側に、ブロックレベル要素であるdivが配置されていること。
千貫りこ
Webデザイン講座
HTML/CSS講座
JavaScript講座
WordPress講座
Movable Type講座
PHP講座
電子書籍講座
Flash講座
Androidアプリ講座
Gainer・Arduino講座
Dreamweaver講座
アクセシビリティ講座
写真講座
講座レベルの比較
開講日カレンダー
すべての講座一覧
67WSカレンダー共有