[ 学習動画 ] 一覧 学習の閲覧や質問の際にご利用ください 閲覧が終了した動画をチェックして 学習の進行状況を確認しましょう! 閲覧チェック Dreamweaver/HTML5/CSS3 講座 HTML/CSS リファレンス 動画タイトル 時間 ( 計 10 時 57 分 ) Chapter01

Transcription

1 [ 学習動画 ] 一覧 学習の閲覧や質問の際にご利用ください 閲覧が終了した動画をチェックして 学習の進行状況を確認しましょう! 閲覧チェック Dreamweaver/HTML5/CSS3 講座 HTML/CSS リファレンス 動画タイトル 時間 ( 計 10 時 57 分 ) Chapter01 オリエンテーション 約 40 分 01_ 学習の進め方 02_ リファレンスの紹介 約 09 分 03_ サンプルファイルの確認 04_Dreamweaverでの学習の準備 (1) 約 12 分 05Dreamweaverでの学習の準備 (2) 約 09 分 06GoogleCromeでの学習準備 Chapter02 Webの基本 01_webページを表示するしくみ 02_webページをつくるファイル 約 14 分 Chapter03 HTMLの基本 約 32 分 01_HTMLとは 02_HTMLの基本構文 03_HTMLに必須の要素 約 09 分 04_ ブロックレベル要素とインライン要素 約 08 分 05_ 属性を詳しくみる 約 06 分 Chapter04 HTMLを記述する際の注意 約 16 分 01_HTMLを記述する際の注意 約 08 分 02_ 実体参照 03_HTMLのコメント Chapter05 リンク構造を作る 約 13 分 01_aアンカー 02_ 相対パスと絶対パス 約 06 分 Chapter06 全ての要素を確認する 01_ すべての要素を確認する Chapter07 テキストコンテンツに関する要素 01_p_ 段落 02_ul_ 順序なしリスト 03_ol_ 順序つきリスト 04_dl_ 説明リスト 05_div_ コンテンツ分割 06_hr_ 主題分割 07_blockquote_ ブロック引用 08_figure_ 図表 自己完結コンテンツ 09_pre_ 整形済みテキスト Chapter08 コンテンツセクショニングに関する要素 01_h1_h6_ 見出し 02_header_main_footer 03_article_ 記事など 自己完結コンテンツ 04_section_ セクション 05_nav_ 目次 06_address_ 連絡先 07_aside_ 間接的な関係の文章 約 29 分約 04 分約 24 分約 04 分約 04 分約 04 分

2 Chapter09 画像とマルチメディアに関する要素 01_img_ 画像 02_audio_ 音声 03_video_ ビデオ 04_map_ クリック可能な領域指定 Chapter10 テーブルに関する要素 01_table_ テーブル 02_table_ 行 列の結合 03_table_ その他の要素 約 19 分約 08 分約 14 分約 04 分 Chapter11 フォームに関する要素 約 55 分 01_formフォーム 02_1 行のテキスト 約 10 分 03_1 行のテキスト _ アドレス 約 04 分 04_1 行のテキスト _ パスワード 05_ 複数行のテキスト 約 06 分 06_ セレクトボックス 07_ ラジオボタン 約 09 分 08_ チェックボタン 約 10 分 Chapter12 その他 覚えておきたい要素 01_br_ 改行 02_span_ 行内汎用コンテナ 03_small_ 注釈 04_strong_em_ 重要性 強調 05_del_ins_ 編集範囲の特定 06_iframe_ インラインフレーム 約 16 分約 04 分 Chapter13 その他 覚えておきたい要素 約 43 分 01_ 設定されているメタデータの概要 約 04 分 02_viewport_ スマートフォン対応 約 06 分 03_IE 互換モード 04_ タッチアイコン 05_ ファビコン 06_ 自動リンクの設定 Chapter14 SEO 対策 SNS 対策 01_SEO 対策とは 02_SEO 対策の設定 03_SNS 対応 OGPとは 04_OGPの設定 05_Twitter 専用の設定 Chapter15 地図 動画の読み込み 01_youtubeの読み込み 02_GoogleMapの読み込み 約 21 分約 06 分約 09 分約 04 分 Chapter16 コンテンツモデルについて 約 06 分 01_ コンテンツモデルについて 約 06 分 Chapter17 CSSの基本 01_CSSとは 02_CSSの基本構文 03_CSSを記述するところ 04_CSSの学習を始める前の準備 約 27 分約 06 分約 11 分

3 Chapter18 セレクターの種類 約 16 分 01_ セレクターの種類 02_ 要素セレクター 03_classセレクター 04_idセレクター 約 04 分 05_ 属性セレクター 06_ 全称セレクター Chapter19 擬似クラス 約 26 分 01_ 擬似クラスとは 02_hover 03_checked 04_active 05_focus 06_firstChild_lastChild 07_firstOfType_lastOfType Chapter20 疑似要素 約 11 分 01_ 擬似要素 02_before_after 03_fisrtLetter_firstLine 約 04 分 Chapter21 セレクターの組み合わせ 約 17 分 01_ セレクターの組み合わせ 02_ 複数のセレクタを同時に指定 03_ 子孫結合子 AB 約 04 分 04_ 子結合子 A-B 05_ 隣接兄弟結合子 A+B Chapter22 CSSを記述する際の注意 約 19 分 01_CSSを記述する再の注意 02_ コメント 03_ カスケード 04_ スタイルの継承 約 06 分 05_ スタイルの優先順位 Chapter23 文字 行に関するプロパティ 約 31 分 01_ フォント全般の指定 02_ フォントスタイル 03_ フォントの太さ 04_ フォントサイズ 05_ 行高の指定 06_ フォントファミリー 約 04 分 07_ 文字色の指定 08_ 文字横揃えの指定 09_ 縦揃えの指定 10_ 文字装飾の指定 Chapter24 トピックス 01_CSSでの色の指定 02_CSSでの長さの指定 (1) 02_CSSでの長さの指定 (2) 約 29 分約 14 分約 04 分約 11 分

4 Chapter25 背景に関するプロパティ 約 16 分 01_ 背景全般の指定 02_ 背景色 03_ 背景画像 04_ 背景画像のサイズ 05_ 背景画像の繰り返し 06_ 背景画像の位置 Chapter26 ボックスに関するプロパティ 約 51 分 01_ ボックスとは 約 04 分 02_ ボックスモデルとは 03_border 枠線 約 04 分 04_borderradius 枠角 05_ 影をつける 06_padding_ 内余白 07_margin_ 外余白 08_ マージンの相殺 09_ 高さの指定 10_ 幅の指定 約 04 分 11_ 高さ 幅の計り方 約 06 分 12_ アウトライン Chapter27 表示 配置に関するプロパティ 約 28 分 01_ 表示に関する指定 約 06 分 02_ はみ出しに関する指定 約 04 分 03_ 配置に関する指定 約 09 分 04_ 配置位置に関する指定 05_ 表示順に関する指定 約 06 分 Chapter28 アニメーションに関するプロパティ 約 15 分 01_ 時間変化 02_ アニメーション 03_ 変形 Chapter29 レイアウト 約 08 分 01_ フレックスボックス _flex 約 08 分 02_floatとclear 約 06 分 03_clearfix 規則について 約 10 分 01_@ 規制について 02_ 画面の種類に応じたスタイル変更 Chapter31 JavaScript 01_JavaScript

5 閲覧チェック HTML/CSS ワーク 動画タイトル 時間 ( 計 11 時 32 分 ) アプリサイト - HTML 約 156 分 01 完成形の確認と制作の流れについて 02 コードエディタと制作環境について 約 08 分 03 HTMLと使用するwebブラウザについて 約 09 分 04 HTMLを作成してみる 約 11 分 05 HTML5つの基本 約 08 分 06 HTMLの組み方の手順 (1) 約 06 分 06 HTMLの組み方の手順 (2) 約 09 分 07 ヘッダー / フッダー / メインタグ 約 10 分 08 見出しのタグ 約 12 分 09 ブラウザの確認とHTML5 outliner 10 What's tempwave? のマークアップ (1) 約 12 分 10 What's tempwave? のマークアップ (2) 約 14 分 11 ヘッダー 約 11 分 12 アプリの機能紹介部分 (1) 約 06 分 12 アプリの機能紹介部分 (2) 約 10 分 13 フッター 約 04 分 14 headタグの中身について 約 10 分 15 W3C Validation Service 約 06 分 アプリサイト - CSS - PC 約 337 分 01 CSSとは? 約 08 分 02 reset.css 03 CSSの記述ルールについて 約 12 分 04 CSSコーディングの流れについて 約 08 分 05 文字のサイズと色の設定 約 06 分 06 font familyとweb fontについて 約 13 分 07 フルードイメージについて 08 ヘッダーエリア (1) ボックスの説明 08 ヘッダーエリア (2)Margin-auto 約 08 分 08 ヘッダーエリア (3)line-height 約 08 分 08 ヘッダーエリア (4)marginとPaddingの違い 約 11 分 09 横並びレイアウト float(1) 約 06 分 09 横並びレイアウト float(2) 約 15 分 10 floatの続き (1) 約 10 分 10 floatの続き (2) 11 背景画像の調整 約 12 分 12 フッターエリア (1) 複数の背景画像の設定 約 14 分 12 フッターエリア (2) 中央揃え 約 12 分 12 フッターエリア (3) spanタグ 約 12 分 12 フッターエリア (4) 仕上げ 13 font-awesome 約 13 分 14 背景関連 約 09 分 15 flexboxの基礎 (1) 約 08 分 15 flexboxの基礎 (2) 約 09 分 16 flexboxを使った様々なレイアウト 17 特徴エリア 約 11 分 18 flex-direction 約 12 分 19 様々なセレクター 約 10 分 20 アイコン部分の設定 約 14 分 21 特徴部分の仕上げ 約 16 分 22 What's tempwave(1) 22 What's tempwave(2) 約 11 分 22 What's tempwave(3) 約 12 分 22 What's tempwave(4) 約 14 分

6 アプリサイト - CSS - SP 約 120 分 01 スマホサイトのコーディングのポイント 約 13 分 02 ヘッダーのスマホ用レイアウトの調整 約 08 分 03 スマホ用レイアウト (1)What's tempwave 約 06 分 03 スマホ用レイアウト (2)weather now 約 06 分 04 box-sizing-border-boxについて 約 09 分 05 ヘッダー細部の調整 約 12 分 06 What's tempwave 細部の調整 07 オーバーレイ細部の調整 08 weather now(1) 約 06 分 08 weather now(2) 08 weather now(3) 約 08 分 09 フッター細部の調整 約 14 分 10 文字周りの調整 約 09 分 11 タブレットで見たときの見た目の調整 約 08 分 番外編 Google Chromeの検証ツールの使い方 CSSが効かない時に確認したいこと (1) CSSが効かない時に確認したいこと (2) 約 41 分 約 18 分約 12 分約 11 分 サーバーへのアップロード FTPについて (1) FTPについて (2) サイトの公開方法 (1) サイトの公開方法 (2) 約 38 分 約 10 分約 10 分約 06 分約 12 分 閲覧チェック Web 概論 動画タイトル 時間 ( 計 0 時 51 分 ) Web 概論 01.Web ってなに? 02.Webサイトを作るのに必要なもの 03.Web 制作の流れ 約 51 分 約 21 分約 12 分約 18 分