これだけ独学!HTML&CSS プログラミング プレコース

これだけ独学!

こんにちは、あんどう(@ando_engineer)です。お読みいただきありがとうございます。

これだけ独学(コレドク)シリーズでは、0から独学で学習するプログラミング未経験の方向けに、技術習得までにやるべき学習内容を掲載しています。

本編はHTML&CSSのプログラミングを学ぶためのプレコース(事前学習)編です。

この記事を学ぶことによる「BEFORE & AFTER」は以下のとおりです。

HTML&CSSを使用したプログラミングを初めて経験する。
HTML&CSSを使用して、動きのないシンプルなWebページを作成できる。

Progate HTML&CSS 有料プランを申し込む

まずはHTMLとCSSのプログラミングを実際に体験してみましょう。

ここでは、Progateというオンライン学習サービスを使用します。

プログラミングを行うためには、開発環境の構築が必須です。しかし、Progateは難しい開発環境の構築が不要なプログラミング学習サービスです。

Progate有料プラン(980円+税)への申込みが必要なコースを含みます。

Progate HTML&CSS 学習方針

HTML&CSSコースに限らず、Progateで学習する時に意識してほしいことをスライドでまとめています。

Progateを最初に使用する時は、一度ご覧いただいて、これを意識して学習を進めましょう。

Progate HTML&CSS 初級編

初級編では、HTML&CSSの基本的な書き方を学び、簡単なWebページを作成します。

所要時間は3時間50分です。無料で利用できます。

HTML & CSS 学習コース 初級編 | Progate
Progateはオンラインでプログラミングを学べるサービスです。プログラミングを学んでWEBアプリケーションを作ろう。

初級編を始める前に知っておいたほうがいい知識を以下にまとめています。

「基本」と「初級編」に分かれていますので、こちらを先に参照いただき、Progateを始めていただくと理解が深まります。

Progate HTML&CSS 中級編

中級編では、初級編の知識を活用して、ランディングページと呼ばれる1枚の長いWebページを作成します。

所要時間は4時間30分です。このコース以降は有料プランとなります。

HTML & CSS 学習コース 中級編 | Progate
Progateはオンラインでプログラミングを学べるサービスです。プログラミングを学んでWEBアプリケーションを作ろう。

中級編を始める前に知っておいたほうがいい知識を以下にまとめています。

こちらを先に参照いただき、Progateを始めていただくと理解が深まります。

Progate HTML&CSS 道場コース初級編

道場コース初級編では、初級編の知識を活用して、仕様書をもとに自力でWebページを作成します。

道場コースが「確認テスト」の位置づけなので、難しいですが頑張って進めましょう。

所要時間は2時間30分です。

HTML & CSS 道場コース 初級編 | Progate
Progateはオンラインでプログラミングを学べるサービスです。プログラミングを学んでWEBアプリケーションを作ろう。

Progate HTML&CSS 道場コース中級編

道場コース中級編では、中級編の知識を活用して、仕様書をもとに自力でWebページを作成します。

道場コースが「確認テスト」の位置づけなので、難しいですが頑張って進めましょう。

所要時間は3時間20分です。

HTML & CSS 道場コース 中級編 | Progate
Progateはオンラインでプログラミングを学べるサービスです。プログラミングを学んでWEBアプリケーションを作ろう。

Progate HTML&CSS 上級編

上級編では、中級編で作成したランディングページをスマートフォンやタブレット端末でもきれいに表示されるように修正します。(レスポンシブデザイン)

Webサイトへのアクセスの半分以上がスマートフォン経由である現在では、レスポンシブデザインは必須ですので、しっかり学習しましょう。

所要時間は2時間です。

HTML & CSS 学習コース 上級編 | Progate
Progateはオンラインでプログラミングを学べるサービスです。プログラミングを学んでWEBアプリケーションを作ろう。

上級編を始める前に知っておいたほうがいい知識を以下にまとめています。

こちらを先に参照いただき、Progateを始めていただくと理解が深まります。

Progate HTML&CSS 道場コース上級編

道場コース上級編では、上級編の知識を活用して、中級編で作成したWebページのレスポンシブ対応を行います。

道場コースが「確認テスト」の位置づけなので、難しいですが頑張って進めましょう。

所要時間は1時間40分です。

HTML & CSS 道場コース 上級編 | Progate
Progateはオンラインでプログラミングを学べるサービスです。プログラミングを学んでWEBアプリケーションを作ろう。

最後に

本内容を完了された方、おめでとうございます。

これでHTML&CSSのコードは一通り書けるようになりました。

もしかしたら全然覚えられてないと不安に思われるかもしれませんが、コードはたくさん書き続けることで意識しなくても手が覚えていきます。

この次のステップに進み、全てを通して学習し、経験してみることが大切です。

何を知ることで就きたい仕事につけるのかを広く浅く経験することで、全体像が見えてきますので、このまま次のステップに進みましょう。

参考情報

Progate : https://prog-8.com/

オンラインメンターサービス
プログラミング習得はもちろん、システム開発ノウハウや業界トレンドニュース、現場の雰囲気も伝える「オンラインメンター」サービスを運営しています。

月1回1時間の個別メンタリングと質問が無制限可能なSlackが利用可能です。

厳選ITニュースを解説つきでお届け
「オンラインメンター」サービスでシェアするITニュースを解説付きでLINEオープンチャットでお届けします。

もちろんメンターサービスへの質問も個別に可能です。
これだけ独学!
この記事をシェアする
しなやかエンジニアラボをフォローする
しなやかエンジニアラボ
タイトルとURLをコピーしました