Progateはブログ初心者がhtmlを1日で理解するのにオススメ!

f:id:mataro1:20150811222635j:image

皆さんProgateって知っていますか??
 
まあhtmlとcssマスターしてるぜ!って人には関係ないですけど、ブログ書いていたりする人でhtml何それ?美味しいの?って人にオススメしたいWebサービスです。
 
Progateでhtmlやcssを学べば、1日でhtmlやcssの大まかな知識を得られると思います!
 
ここから具体的にProgateについて紹介していきます。

 

 
 

Progateでは何ができるのか?!

Progateでは、htmlやcssだけでなく、php、Ruby、jQueryなどWebに関するプログラミング言語について学ぶことができます。
 
 

Progate実体験の感想

私は、htmlとcssについては断片的な知識はあり、基礎の基礎はある程度分かっていたのですが、細かいところをあまり理解していませんでした。
floatってなに?
divとspanの違いわからねえ!みたいな感じです。
 
そこで、Progateのhtml基礎編をやってみようと思い、1日(3,4時間くらい)で終えました。
 
最初始めたときは、これ続けられるのか?とか思っていました。
しかし、結構楽しいですし、分かりやすいんですよ(笑)
 
実際使ってみて思ったことは、
Webサービスならではの特徴とか利点を活かせているなー。
と素直に感心しました。
 

Progateでの勉強の流れ

Progateは見本となるテンプレートのページが用意してあり、このテンプレートのページと同じものを最終的に作るという流れになっています。
Progateでは、htmlのタグなどを紹介しつつ、どうすれば上手くコンテンツを配置できるのか、どうすれば線を引けるのか、どうすれば空白を調節できるのかなど丁寧に解説してあります。
 
どんな感じでページを作っていくのかと言うと、授業みたいな感じで、htmlやcssのタグの説明などをスライドで紹介されます。

その次に、ヒントやコメントを参考にしながら、自分でhtmlを打ち込みます。

必要なhtmlを打ち込めていたら、次のステップを学習していく流れになっています。

 

Progateの利点

Progateでは、学習段階に応じた見本が用意されており、自分が打ち込んだhtmlで作られるページと比較ができます。
つまり、自分が打ち込んだhtmlからリアルタイムでWebページを作成し、表示してくれます!!
普通の参考書のやり方だと、メモ帳でhtml打ち込んだ後、ブラウザで開いて確認です。
Progateならリアルタイムで状態を確認可能!!!!
 
また、ヒントやコメント、スライドの内容を確認できるので、1度で覚えなくてもどうするべきか確認ができます。さらに、打ち間違いがあれば、どこが間違えているか教えてくれます。
 
 

Progateの欠点

あくまで見本のテンプレートと同じものと作るので、応用力は付かないと思います。
 
その代わり、知っておくべきタグと使いかたを学べるので十分でしょう。
 
 

まとめ

Progateは自分がどんな内容を打ち込むべきかをある程度分かりやすく、勉強できます。
 
また、自分の打ち込んだhtmlやcssがリアルタイムで反映され、確認できるので面倒臭がり屋さんでも続きやすいと思います!
 
htmlに詳しくない・自信のないブロガーさんは是非一度試してみてください!