未分類

HTML入門者必見!HTML学習にはProgateがおすすめ

ホームページのを作りたいと思って、HTMLの学習をしようと思ったけど挫折したという方はいないでしょうか?

確かに、HTMLやCSSの初心者向けの参考書は多く出ていますが、参考書を見ながらやっていても実感が湧かずになかな続かないという方も多くいると思います。また、HTML初心者の方だと、いきなりソースコードを見ても難しいですよね。

そこで、今回はHTMLやCSSの学習サイトのProgateを紹介します。

プログラミング学習サイトのProgateを使うと、分かりやすい解説を見ながら実際にHTMLのソースコードを入力して番強ができます。実際のサイトの表示をプレビューしながら、HTMLのソースコードを入力できるので、ページを作っている実感が湧いて挫折しにくいです。

Progateの登録方法は以下の通りです。

1、Progateのページにアクセス

2、Progateに登録

FacebookやTwitterアカウントをお持ちの方は、そのアカウントでも登録できます。

その他の方は、ユーザー名・アドレス・パスワードを入力して登録してください。

3、Progateにログインする

以上です。

Progateにログインすると下記のような画面が表示されます。

SnapCrab_shintpy12  プログラミングの入門なら基礎から学べるProgate (プロゲート) - Google Chrome_2015-7-23_19-48-7_No-00

ここで、学習したレッスンとクリアしたレッスンと、今の到達レベルを見ることができます。

SnapCrab_shintpy12  プログラミングの入門なら基礎から学べるProgate (プロゲート) - Google Chrome_2015-7-23_19-48-25_No-00

レッスン自体は以下の5レッスンがあります。

  • HTML&CSS基礎編
  • HTML&CSS応用編
  • jQuery基礎編
  • PHP基礎編
  • Rubu基礎編

HTML学習をはじめとして、ホームページ制作に必要なことを一通り学ぶことができます。

これだけの内容があれば、HTMLの初心者でもウェブに強くなれると思います。

では、実際のProgateのレッスンを見てみましょう。

SnapCrab_HTML & CSS 基礎編  プログラミングの入門なら基礎から学べるProgate (プロゲート) - Google Chrome_2015-7-23_19-49-14_No-00

Progateでは、上記のように最初に説明のスライドを見て、それから実際にソースコードを入力する形式です。

スライドの方で、HTML初心者にもわかりやすく説明してあるので、理解はしやすいと思います。

SnapCrab_HTML & CSS 基礎編  プログラミングの入門なら基礎から学べるProgate (プロゲート) - Google Chrome_2015-7-23_19-49-44_No-00

上記が、実際のHTML基礎編のレッスン画面です。

左端のメニュー内の指示通りにソースコードを入力していきます。ソースコードを入力すると、実際のHTMLの表示内容がプレビューされるので、目に見えるのでHTMLでページを作っている実感が湧くと思います。

でも、どうしても分からないときは、ヒントを見てみましょう。

SnapCrab_HTML & CSS 基礎編  プログラミングの入門なら基礎から学べるProgate (プロゲート) - Google Chrome_2015-7-23_19-50-10_No-00

ここのヒントを見てから、もう一度考えて取り組みましょう。答えも見れますが、それでは身につかないので、できるだけ見ずにHTML学習を進めていきましょう。

 

 

 

 

 

スポンサーリンク

-未分類