【HTML・CSS入門】初心者向けHTML・CSS学習サイト4選

Web制作

【HTML・CSS入門】初心者向けHTML・CSS学習サイト4選

Webサイトは、基本的に「HTML」というマークアップ言語と、「CSS」というスタイルシート言語で書かれています。ほかにも、Web制作に使うプログラミング言語に「Java」「PHP」「Rudy」「C#」「C++」などがありますが、最低限覚えなければいけないのはHTMLとCSSです。この二つを理解できれば、誰でもWebサイトを作れるようになります。

HTML・CSSについて学べるサイトはたくさんありますが、今回は「とにかく早くWebサイトを作れるようになりたい」「わかりやすく解説している所で学びたい」という方にぴったりな学習サイトを、4つに厳選してご紹介します。

HTML・CSSの基礎を学ぶ

ドットインストール

ドットインストール
http://dotinstall.com/

HTMLとCSSの基礎を「動画」で学びたい人向けのサイトです。

「3分動画でマスターできる」というコンセプトの通り、動画の長さはひとつにつき3分以内。HTML入門は全24回、CSS入門は全23回なので、47回×3分=141分、つまり2時間半もあればすべて学べることになります。

HTML・CSSのほかにもJavaScript、Ruby、PHPなどの講座があり、Web制作に関する知識はほとんどすべてここで身に付けることができます。

会員登録しておくと、「3回目まで完了、4回目以降は未完了」という風に学習状況を記録しておくことができるので便利です。講座自体は登録しなくても受けられます。

ほんっとにはじめてのHTML5とCSS3

ほんっとにはじめてのHTML5とCSS3
http://honttoni.blog74.fc2.com/

HTMLとCSSの基礎を「テキスト」で学びたい人向けのサイトです。

HTML・CSSの基礎が文章と画像でわかりやすく解説されています。テキストを読みながら自分のペースで少しずつ進みたいという人向けです。

スポンサーリンク

「はじめてのHTML INDEX」と「はじめてのCSS INDEX」にそれぞれHTML・CSSについての記事タイトルが一覧で表示されていて、読みたいタイトルをクリックするとその解説ページに移動します。HTMLについてが150記事以上、CSSについてが30記事以上掲載されています。かなりのボリュームですが、記事タイトルを見て「これはあまり使うことがなさそうだな」と思ったら読み飛ばしても良いと思います(私の場合、「テキストのルビ」や「上付き文字・下付き文字」は使ったことがありません)。

HTMLタグ・CSSプロパティの書き方や意味を調べる

以下の二つは、HTMLタグ・CSSプロパティの書き方や意味がわからなくなったときにサッと確認できるリファレンスサイトです。上でご紹介したサイトが教科書だとすると、この二つは常に持ち歩きたい辞書のようなもの。「○○がしたいときはどんなコードを書けばいいんだっけ?」「○○ってどういう意味のコードだっけ?」と思ったときに活用しましょう。

TAG index

TAG index
http://www.tagindex.com/

HTMLタグ・CSSプロパティを「テキスト」「リンク」「イメージ」などのカテゴリーや、ABC順で検索することができます。サブコンテンツとして、テーブルタグ自動生成などの便利ツールや、Webサイトの基礎テンプレートがあります。

HTMLクイックリファレンス

HTMLクイックリファレンス
http://www.htmq.com/

HTMLタグ・CSSプロパティを目的別・ABC順で検索することができます。シンプルな構造なので知りたい情報をすぐに見つけられます。

おわりに

今回は、初心者向けのHTML・CSS学習サイトをご紹介しました。

基礎については動画かテキストか、自分に合う学習形式のサイトを選択してください。HTMLタグやCSSプロパティの書き方がわからなくなったときは、適宜リファレンスサイトで調べましょう。すべてを完璧に頭に入れておく必要はありません。

Webサイトの作り方を覚えるための一番の近道は「実際にWebサイトを作ってみること」です。今回ご紹介したサイトで一通り学んだあとは、「こういうコードを書いたらこうやって表示される」と覚えるまでひたすらHTML・CSSを書いていきましょう。

スポンサーリンク

PAGE TOP