コース概要
最新のHTML5を70以上のレッスン、7時間かけてしっかり学びます
youtube動画の貼り付けや番号入力フォームなど、基礎的な内容だけでなく、実践的な内容も充実しています。
1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供しています。
★こんな人におすすめ★
- Webサイト制作をこれから学びたい方
- 最新のHTMLを勉強したい方
★特徴★
- 最新のHTML5を70以上のレッスン、7時間かけてしっかり学べる
- 1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供
- 5分程度の動画が70レッスン以上 充実した内容ですが、無理せず学べる
★内容★
HTMLの入門セクションを3つこなした後、パートに分けて実践的な内容を行います。
(1)HTML入門 第1回
初めてHTMLを学ぶ方向けに、HTMLの基本の書き方から便利なツールまでをレクチャーします。 HTMLを学ぶ上での環境をここで整えるので、みなさん必ず受講してください。 簡単なWebサイト制作を通してレクチャーしていきますので、楽しみながら学習して頂けます。
(2)HTML入門 第2回
HTMLファイルを記述するにあたって、まずは必ず記述しなければならない「基本構造」の必須コードや、超基本的な文字の表示方法をレクチャーしていきます。 HTMLファイルは、文字にタグを付与していくのが基本の書き方ですが、その前にまず「基本の構造」をルールに基づいて記述しなければいけません。初めてHTMLを学ばれる方は必ず受講してください。 この章は、「HTML入門 第1回」の続きの章です。初めてご覧になる方は、まずこの前の章から挑んで下さい。
(3) HTML入門 第3回
簡単なWebサイトの制作を通して、HTMLの基礎をマスターできる章です。 リストタグを使って箇条書きリストを作成したり、Webサイトレイアウトを組むためのタグの記述方法について学びます。 「HTML入門 第3回」の続きの章になりますので、初めてこの章をご覧になる方はまず「HTML入門 第1回」から順番に挑んで頂くことをオススメします。
(4)フォーム
文字の入力フォームやチェックボックス、ラジオボタンや送信ボタンなど、フォームを形成する上で必須のHTMLの書き方についてをレクチャーします。 初心者向けに解説していますが、やや難しいので、初めての方はまず「HTML入門」の章から取り組んで頂くことをオススメします。 この章をマスターすれば、実際に送信等の機能はつけれませんが、簡単なお問い合わせフォームを作れるようになるので、みなさん頑張って下さい!
(5)テーブル
テーブルタグを使って、表組みを作成する方法を初心者向けに解説しています。 ひと昔前までは、テーブルタグを使ってWebサイトのレイアウトを組んでいました。 Webサイトレイアウトを組む際のテーブルタグはNGなのですが、表組みを作成する上ではテーブルタグは今でもたくさん使用されています。
(6)テキストとリスト
テキストには、「見出し」「段落」だけでなく、「引用」「リンク」など 様々な意味を付与していく必要があります。文章の構造を意識して、正しいマークアップを行うためには「どんなHTMLタグがあるのか」をどれだけ知っているか、にかかっています。 ここでは、簡単な制作物を通して、様々な文字に関するHTMLタグについて学んでいただきます。
(7)リンクと画像・動画・オーディオ
テキストにリンクを貼ったり、画像や動画を表示させる方法などを学びます。 HTML最大の特徴は、ファイルとファイルをリンクさせる事です。ファイル同士をリンクさせる事で、クリックで指定のページへジャンプさせる事ができます。
(8)HTMLテクニック
リンクのクリックでメールソフトを起動させたり、ファイルをダウンロードさせたりといった、少し上級者向けのテクニックを学びます。 リンクを貼るタグを多く利用しますので、よくわからない方は先に「リンクと画像・動画・オーディオ」の章を学習してから、この章に挑んで頂くとより理解が深まります。
(9)要素のセクショニング
Webサイトをグループ化して、レイアウトを組むためのタグを記述する方法について学びます。 Webページは、ヘッダーやコンテンツ、フッターなど様々なセクションに分かれています。ただ単純にテキストをマークアップするだけでなく、文書構造に沿ってグルーピングしないと、レイアウトを組む事が出来ないので、注意が必要です。
必要条件
- PC
- Sublime Text (テキストエディター)
Course Curriculum
Lesson 1
Webページを設計する方法
Lesson 2
Webサイト制作の言語、HTMLとは
Lesson 3
Webページがブラウザに表示される仕組み
Lesson 4
HTML制作に必要なアプリケーションをインストールする...
Lesson 5
HTMLファイルを新規作成する方法
Lesson 6
ゼロから学ぶHTMLタグの書き方入門
Lesson 7
[実践]HTMLを書いてみよう:簡単なテキストのマークア...
Lesson 8
HTMLファイルをブラウザで表示させるには
Lesson 9
Web製作者が知っておくべき、ブラウザの種類と特徴
Lesson 1
HTML5を宣言するDOCTYPEの書き方
Lesson 2
HTMLの基本構造を記述する方法
Lesson 3
文字エンコードの種類と記述方法
Lesson 4
Webページにタイトルを付けるタグの書き方
Lesson 5
Webサイトの情報を示すタグの書き方
Lesson 6
見出しである事を示すの書き方
Lesson 7
段落である事を示すタグの書き方
Lesson 8
画像を表示するためのタグの書き方
Lesson 9
タグに情報を付加するための属性の書き方
Lesson 1
文字の色を変える、属性の書き方
Lesson 2
レイアウトのためのタグを記述してみよう
Lesson 3
リストタグを使ってナビゲーションを作ってみよう
Lesson 4
メイン画像を表示させてみよう
Lesson 5
コンテンツをマークアップしてみよう
Lesson 6
フッターをマークアップしてみよう
Lesson 7
CSSファイルを読み込むタグの記述方法
Lesson 8
コメントアウトを書く方法
Lesson 9
[実践]アバウトページを作ってみよう
Lesson 1
フォームを作成するためのタグの書き方
Lesson 2
タグでテキスト入力フォームを作る方法
Lesson 3
タグで長文向けフォームを作成する方法
Lesson 4
タグで送信・リセットボタンを作る方法
Lesson 5
タグでフォームにラベルを付ける方法
Lesson 6
タグでフォームをグループに分ける方法
Lesson 7
タグでセレクトメニューを作る方法
Lesson 8
タグでラジオボタンを作る方法
Lesson 9
タグでチェックボックスを作る方法
Lesson 10
フォームに関するタグを使って、ログインページを作ろ...
Lesson 1
テーブルを作成するためのタグの書き方
Lesson 2
テーブルに項目名を設定するタグの書き方
Lesson 3
テーブルに説明を加える3つのタグの書き方
Lesson 4
行をグループ化する3つのタグの書き方
Lesson 5
隣り合う複数のセルを結合させるタグの書き方
Lesson 6
テーブルタグを使って、企業概要ページを作ろう!
Lesson 1
見出しをつける~の書き方
Lesson 2
段落タグと改行タグの書き方
Lesson 3
語句を強調、ハイライト表示させるタグの書き方
Lesson 4
引用するときのタグの書き方
Lesson 5
改行や余白をそのまま表示させるタグの書き方
Lesson 6
連絡先や問合わせ先、省略文字、改行位置を示す方法
Lesson 7
箇条書きリストを作成する方法
Lesson 8
定義型リストを作成する方法
Lesson 9
文字構造を意識したHTMLテキストのマークアップをして...
Lesson 10
テキスト系タグを使った、カフェメニューページを作ろ...
Lesson 1
指定のページへリンクさせるタグの書き方
Lesson 2
指定のHTMLファイルへリンクさせるタグの書き方
Lesson 3
ページ内ジャンプさせるリンクの書き方
Lesson 4
画像を表示するタグの書き方
Lesson 5
横罫線を表示するタグの書き方
Lesson 6
youtube動画をサイトに埋め込む方法
Lesson 7
ページの中に別のページを表示させるの書き方
Lesson 8
google mapを表示させる方法
Lesson 9
youtube動画を使った、映画情報サイトを作ろう!
Lesson 1
リンクのクリックでメールソフトを起動させる方法
Lesson 2
件名や本文を入力している状態でメールソフトを起動さ...
Lesson 3
ユーザーに親切なお問い合わせメールを作成してみよう
Lesson 4
ファビコンを設定する方法
Lesson 5
サイトでPDFファイルをダウンロードさせる方法
Lesson 6
秒数を指定して自動的に特定のページへジャンプさせる...
Lesson 7
素材ダウンロードサイトを作ってみよう
Lesson 1
Webページレイアウトの基礎を学ぼう
Lesson 2
ヘッダーとナビゲーションを作成する方法
Lesson 3
メインコンテンツ、サイドバー、フッターの作成方法
Lesson 4
Webサイト全体を真ん中寄せにするためのタグの記述方...
Lesson 5
sectionタグとarticleタグの違い
Lesson 6
文書構造を意識した正しいグルーピングをしてみよう
Lesson 7
Webページにタイトルを付ける