【旧版】HTML入門【第2版】
ウェブページを記述するためのマークアップ言語HTMLの基本を学習しよう。
お知らせ:旧版のコースのためメンテナンス及びサポートを終了しています。動画は引き続きご視聴いただけます。
プレミアム
合計時間:02:37:41
コース紹介動画
学習内容
■ 主な学習トピック
- HTMLとはなにか理解できるようになります。
- テキストエディタのVisual Studio Codeをセットアップできるようになります。
- 初めてのHTMLを記述してウェブページに表示できるようになります。
- よく使うHTMLのタグを使えるようになります。
- HTMLのエラーを自力で取り除く方法を理解できるようになります。
■ 講座内容
ウェブページを記述するためのマークアップ言語HTML(エイチティーエムエル)の基本を学習します。
ハイパーテキストを記述するためのマークアップ言語です。簡単に言うと、HTMLとはウェブページの文書構造を定義するための言語とも言えます。
HTMLはプログラミング言語ではありませんが、今後ウェブサイトを制作するための、必須の基礎知識となりますので、使い方をマスターしておきましょう。
ウェブページを記述するためのマークアップ言語HTML(エイチティーエムエル)の基本を学習します。
ハイパーテキストを記述するためのマークアップ言語です。簡単に言うと、HTMLとはウェブページの文書構造を定義するための言語とも言えます。
HTMLはプログラミング言語ではありませんが、今後ウェブサイトを制作するための、必須の基礎知識となりますので、使い方をマスターしておきましょう。
■ 学習に必要な要件
基本的なパソコンの操作ができること。
基本的なパソコンの操作ができること。
■ このコースのターゲット
- HTMLは未習得
- ウェブページが制作できるようになりたい方
- 将来的にウエブアプリケーションエンジニアへ転職したい方
■ バージョン情報
- HTML5
レクチャー一覧
- 新HTML入門
-
1. イントロダクション - HTML入門無料プレビュー
- コースの学習内容の概要について説明
-
2. HTMLの歴史02:26 無料プレビューHTML の歴史について学習します。
- HTML の開発経緯について
- 主要な HTML のバージョン
- W3C について
-
3. HTMLの基本構文01:56 無料プレビューHTML の基本構文について学習します。
- HTML の基本構文について
- 構文について
- 具体例について
-
4. HTML文書の基本構造03:31 無料プレビューHTML 文書の基本構造について学習します。
- 概要について
- 実例
- 要素の入れ子とドキュメントツリー
-
5. Google Chromeをインストールしよう
-
6. 【macOS】Visual Studio Codeのインストール02:46
- macOSにVisual Studio Codeをインストールする方法を解説します。
-
7. 【Windows】Visual Studio Codeのインストール03:30
- WindowsにVisual Studio Codeをインストールする方法を解説します。
-
8. 【macOS】はじめてのHTML13:29【macOS】はじめてのHTMLについて学習します。
- はじめての HTML を書いて、ウェブブラウザで表示
- macOS ご利用の方向けレクチャー
- Windows をご利用の方はスキップ
-
9. 【Windows】はじめてのHTML12:17【Windows】はじめての HTML について学習します。
- はじめての HTML を書いて、ウェブブラウザで表示
- Windows をご利用の方向けレクチャー
- macOS をご利用の方はスキップ
-
10. 技術ドキュメント MDN02:57技術ドキュメント MDN について学習します。
- MDN とは
- 実際の活用例
- 検索について
-
11. HTML文書のインデントと改行03:19HTML 文章のインデントと改行について学習します。
- HTML 文章のインデントと改行について
- 動作について
- 確認について
-
12. 【macOS】Visual Studio Codeの設定09:39【macOS】Visual Studio Code の設定について学習します。
- macOS 版レクチャー
- Visual Studio Code の基本的な設定
- 時間短縮について
-
13. 【Windows】Visual Studio Codeの設定09:28【Windows】Visual Studio Code の設定について学習します。
- Windows 版のレクチャー
- Visual Studio Code の基本的な設定
- 時間短縮について
-
14. よくあるHTMLの記述間違い05:05よくある HTML の記述間違いについて学習します。
- よくある HTML の記述間違い
- 全角スペース【macOS】
- 復習
-
15. 構文チェック03:16HTML の構文チェックが行えるウェブサイトについて学習します。
- HTML の構文チェックが行えるウェブサイトについて
- 料金
- URL
-
16. 演習:HTMLのエラーを取り除く01:58HTML のエラーを取り除く演習です。
- HTML のエラーを取り除く演習
- 記述間違いのある HTML ファイル
- 修正について
-
17. 演習回答:HTMLのエラーを取り除く02:43HTMLのエラーを取り除く演習の回答です。
- 演習の解答
- プラグイン
- 構文チェック
-
18. よくあるご質問:要素の書き順02:04HTMLの構文チェックが行えるウェブサイトについて学習します。
- コンテンツを先に書いて、タグで書く
- タグを書いてから、コンテンツを書く
- 余談
-
19. HTMLのコメント05:19HTML のコメントの使い方について学習します。
- コメントとは
- 注意点
- コメントアウトとは
-
20. 改行03:08改行について学習します。
- 改行を行う要素
- br とは
- 復習
-
21. 区切り線02:04区切りについて学習します。
- 区切りを表す hr 要素 について
- hr とは
- 注意点
-
22. リスト04:23リスト表示について学習します。
- 順序なし ul 要素
- 順序あり ol 要素
- 余談
-
23. 入れ子になったリスト04:03入れ子になったリストについて学習します。
- ネストしたリスト
- 補足
- 結論
-
24. 演習:リスト01:11リストに関する演習です。
- 各自制作
- 見出し
- HTML ファイル
-
25. 演習解答:リスト02:01リストに関する演習の回答です。
- 回答
- ファイルの保存【mac】
- ファイルの保存【Windows】
-
26. 説明リスト05:26説明リストについて学習します。
- 説明リストとは
- コードについて
- よくあるご質問
-
27. 見出し03:53見出しについて学習します。
- 見出し要素について
- 見出し要素のツリー構造
- 注意点
-
28. 属性と画像の表示05:33属性と画像の表示について学習します。
- 属性について
- 属性の基本構文
- 画像の表示について
-
29. リンク08:41リンクについて学習します。
- リンクとは
- 構文: a 要素について
- リンクの3つの種類について
-
30. 強調02:11強調について学習します。
- strong 要素とは
- 重要な語句について
- 注意点
-
31. 著作権表記03:00著作権表記について学習します。
- small 要素とは
- 構造と表現の分離の原則について
- 注意点
-
32. 情報のグループ化09:47情報のグループ化について学習します。
- 情報のグループ化について
- グループ化のメリット
- よく頂くご質問
-
33. span要素05:20span 要素について学習します。
- span 要素とは
- 実例
- div と span の違い
-
34. 演習 : HTML基礎03:11HTMLの基礎演習です。
- ウェブページ参照
- HTML 基礎の演習問題
- 補足
-
35. 演習回答 : HTML基礎08:06HTMLの基礎演習解答です。
- 解答例
- 情報のグループ化
- よくあるご質問