こんにちは、尾道ミントです。
最近Webデザインを勉強しはじめました。
Webデザインとは、パソコンやスマートフォンなどの電子機器上で表示されるもののレイアウト、デザインを決めることを指します。
ホームページのデザインも、ウェブサービスのデザインも、ランディングページのデザインも一概にWebデザインと呼ぶことができます。
ぼくが勉強しているのは「HTML」「CSS」という言語で、ざっくり言うと「Webサイトを1からつくれるようになるよ!」って感じ。
勉強をはじめた理由はシンプルで、なんとなくモテそうだったからです。
ぼくは文章を書くライターの仕事もしているんですが、「Webデザイナー兼ライター」ってめちゃくちゃかっこよくないですか!?
Webデザイナー兼ライターってめちゃくちゃモテそうなので勉強します。
【プログラミング学習のProgate】HTML & CSSのレベルが5にUPしました!pic.twitter.com/bCFbN3vILM https://t.co/TkoqVzaxsX— 尾道ミント@ブログ男子 (@ikkotweet) 2016年12月20日
そんなわけで日々パソコンと格闘しているぼくですが、勉強に使っている「Progate」というサイトがめちゃくちゃおすすめなので紹介させてください。
プログラミング学習サイト「Progate」

Progate(プロゲート)は、オンライン上でプログラミング・Webデザインを基礎から勉強できる学習サイト。
▼HTML&CSS、JavaScript、Ruby、PHP、Swift…など、主要なプログラミング言語を好きなだけ勉強することができます。

Progateで学べる言語の例
各レッスンの初級編は無料で受講できるので、「ちょっと試してみようかな」って人でも気軽に利用できます。(初級編といってもけっこうボリュームある)
全てのレッスンが受け放題の有料プランでも980円/月なので、何冊も本を買って勉強するよりもはるかにお得。
ぼくも有料プランを利用中です。
Progateでの勉強風景
▼Progateでの勉強はこんな感じで進んでいきます。
- スライドを見てコードを確認
- 実際に自分でコードを書いていく
- 答え合わせ
この1〜3を何度もくり返すことによって、ちょっとずつプログラミング、Webデザインを勉強していく仕組み。
ぼくが勉強しているHTML.CSSの画面で説明してみます。
1、スライドを見てコードを確認する

HTML.CSSコースでは、自分でコードを書きながら、お手本のWebサイトと同じものをつくっていきます。
レッスンの最初には解説のためのスライドがあり、それを見て「どんなコードを書くのか」を確認します。
2、実際に自分でコードを書いていく

スライドを見終わったら、実際に自分でコードを書いていきます。
画面左に手順が示されているので、それに従って真ん中のエディタにコードを入力。
画面右上には書いたコードが反映されるので、画面右下の完成図と見比べながら、お手本と同じサイトをつくっていきます。
3、答え合わせをして次のスライドへ

コードが書けた!と思ったら、エディタ右下の「確認して次へ」ボタンを押して答え合わせ。
お手本通りにできていたら次のスライドへ移ります。
ここまでかかった時間は約5分〜10分程度。
項目が細かく分かれているので、ゲーム感覚でさくさく進めていくことができます。
Progateのいいところ
1、スライドで勉強するから自分のペースで進められる
実はぼく、以前にもWebデザインを勉強するぞ!って意気込んだものの、挫折したことがあるんです。
そのときは動画を見て勉強するドットインストールというサイトを使っていたんですが、これがイマイチ自分に合わなかったんですよね…
動画を見ながらの勉強だと、「ややこしい部分は時間をかける」「簡単なところはサクッと飛ばす」みたいに、自分のペースで進められません。
でもProgateではスライドを見ながらの勉強なので、誰にも急かされずに自分のペースを守ることができます。
プログラミングとかWebデザインってやっぱりややこしいので、ちゃんと理解できるまで時間をかけられるのは嬉しいところ。
2、項目が細かく分かれていて飽きない
さっきも書きましたが、Progateのレッスンでは1項目がめちゃくちゃ細かく分かれています。
スライドは1枚だけ見てすぐ実践!なんて項目もたくさんあるので、飽きる暇がないんですよね。
5分で終わるミニゲームを何度も繰り返しているイメージなので、どんどん次に進めたくなっちゃうんです。
「Webデザインとか難しそう…」って最初は思うんですけど、ゲーム感覚で楽しく勉強できますよ。
3、レッスンが豊富すぎる
学べる言語も多いんですが、そのそれぞれに豊富すぎるレッスンが用意されています。
▼ぼくが勉強しているHTML&CSSだとこんな感じ。
- 学習コース
- HTML & CSS 初級編
- HTML & CSS 中級編
- HTML & CSS 上級編
- 道場コース
- HTML & CSS 初級編
- HTML & CSS 中級編
- HTML & CSS 上級編
- 実践コース
- HTML & CSS Ⅰ
- HTML & CSS Ⅱ
しかも初級編は無料、全レッスン受けられる有料プランも980円/月と激安です。
ぼくはとりあえずHTML.CSSを制覇しようと思います!
ってことでProgateがおすすめ

プログラミングとかWebデザインって、言葉だけ聞くとめちゃくちゃ難しそうで身構えますよね。
でも実際やってみると、ゲーム感覚で案外楽しくできちゃいます。
「なんかスキル身につけたいな…」って人、Progateを試してみてはどうでしょう!
ひとりじゃ続かない…って人は
「プログラミングを勉強してみたいけど、ひとりじゃ続くか不安…」という人は、プログラミングスクールに通ってみるのもおすすめです。
▼代表的なプログラミングスクールはこちら
どこのプログラミングスクールも「1ヶ月みっちり学習してスキルを身につける」というものが多く、短期集中で勉強したい人にはおすすめ。
料金はけっこうかかりますが、講師のサポートを受けながら勉強できるので習熟度は高いです。
学生は半額になるスクールも多いので、「就活に向けてスキルを高めたい!」って受講生もたくさんいますよ。
どこのスクールも無料体験、説明会を開催しているので、気になる人はぜひ!

尾道ミント(おのみちみんと)

最新記事 by 尾道ミント(おのみちみんと) (全て見る)
- 【肌の手入れ・男性編】全部1500円以下で買える、俺のベストコスメまとめ。 - 2019年1月7日
- 新卒で上京したけど友達がいない… 24歳男子が寂しい日々を振り返る。 - 2018年12月16日
- 社会人になりたくない大学生に向けて、24歳新卒が1年目のリアルを教える。 - 2018年12月10日