HTMLにCSS〜プログラミング初心者におすすめの無料入門サイトベスト3!

StockSnap / Pixabay

みなさん今日もプログラミングしていますか? もしくは、今日からゴリゴリとプログラミングを学んでいこうという意思はありますか?

プログラミングスキルはもはや現代の錬金術と言っても過言ではなく、それ一つ身につけるだけで未来の可能性は無限大に広がります。

有名なところだと、「GREE」の田中良和さん、「Zaim」の閑歳孝子さん、「Wantedly」の仲暁子さんなどなど、社会人になってからでも独学でプログラミングを習得し、パソコン一台で起業して大きな成功を収めている人がうじゃうじゃといますね。

ITの分野で最先端を走るアメリカの名だたる起業家達は、「プログラミングを習得すれば一生仕事に困らない」ことを保証し断言しています。

ここまで言われちゃ、もはやプログラミングを学ばない道理はありませんね。

世界の共通言語は英語ではなく、笑顔でもなく、プログラミング言語です。
というわけで、みんなで今日からプログラミングをゴリゴリ書いていくのは当たり前として、 問題は、「どっからどうやって始めればいいの?」ということですよね。

かくいう私も、恥ずかしながらプログラミングに関してはまだまだ初心者です。 HTMLが何のことかも知らない所から学び始め、CSS、Javascript、PHPと少しずつ学んできていますが、まだまだ「プログラマー」を名乗るのは忍びないヒヨッコです。

「プログラミング」という異世界への入り口に立った時の困惑と恐怖はつい昨日のことのように思い出せますし、なんなら今でもエラーが出るたびにガクブルしています。

しかし曲がりなりもプログラミングのスタートを切れたという確かな経験から、 「いったいどこから一歩を踏み出せばいいの?」と足が止まってしまっているプログラミング初心者の人達に向けて、私なりに役に立ったプログラミング学習サイトをベスト3形式でご紹介したいと思います。

もちろん、本格的にプログラミングを学ぶうえでは、オンラインのみならず体系的に学べる書籍を参考にするべきなのは確かなのですが、 まずは「よっしゃプログラミングやろう!」と(気まぐれだとしても)思い立ったその瞬間に、そのモチベーションの灯火が消えない間に素早くパソコンを開き、その場でとにかくプログラミングデビューしてしまおうということを最重要視しています。

プログラミングという未知の怪物のまえに身構えてはいけません。事前知識も装備も必要ありません。とにかく学習サイトに飛んで、肌でコーディングを体験してみましょう。

▼▼未経験から「最短最速」でプログラミングをマスターするなら『TechAcademy [テックアカデミー] 

とはいえ、無料学習サイトが多すぎて選べない!!

KlausHausmann / Pixabay

そうなのです。プログラミングを無料で学べるサイトは沢山あります。ありすぎるのです。

実はプログラミング初心者が入り口でつまずくのには、どの言語を学ぶかもそうですが、「どこで学ぶのがいいの?」という壁の存在があります。

ちなみに、プログラミングを無料で学べるサイトとしては以下のまとめサイトが参考になります。

しかし、上記まとめサイトのように10サイトも15サイトも並べられたところで、プログラミングのプの字も知らない初心者にははっきり言ってどのサイトが学ぶのに良いかなんて判別できませんよね。

さらに面倒なのは、ほぼ全てのサイトで「会員登録」が必要なため、気軽に色んなサイトを物色してみるということができないという点です。

結果的に私の場合は、10サイト前後に会員登録してどのサイトが学びやすいか体験入学とばかりにかじっていったのですが、結局プログラミングデビューに役立ったのは3サイトしかありませんでした。

これは決して他の7サイトが無駄でダメなサイトだったというわけではなく、 素晴らしい3サイトがあれば、スタートを切るには十分すぎたということです。

一度スタートを切ってしまえば、あとはレベルに合わせて参考書を購入する等、しっかりお金をかけてスキル習得に投資しましょう。(タダでスキルを習得しようという考えは甘過ぎます)
というわけで前置きが非常に長くなりましたが、 プログラミングの第一歩を踏み出すのに役立った3つの無料学習サイトをベスト3で紹介します。

評価基準としては、学びやすさももちろんですが、WEBサイトとしての入りやすさや使いやすさなど、ユーザビリティの面でとにかく「面倒くさくなく、始めやすい」ということに比重を置いています。(初心者はちょっとでも難しいと簡単に辞めちゃいますからね。私です)

スポンサーリンク

第3位 『SKILL HUB』

8791e08575c433b89d144f1f22f5b88f

公式サイトはこちらです。

■学習できる言語:HTML/CSS、 WordPress、 Illustrator、youtubeでRuby on Railsの授業動画もあり。
『SKILL HUB(スキルハブ)』は、UGUISS(ウグイス)という起業スタートアップ専門制作会社が提供している学習サイトです。

代表の吉田光利さんによる授業動画を無料で見ることができます。東進ハイスクールのプログラミング授業といったところでしょうか。

私のようなマジモンのプログラミング初心者は例外なく『HTML』から学び始めると思いますので、HTML/CSS講座のみに限ってのオススメになります。

スキルハブのHTML/CSS講座では、実際にモデルサイトを設計してコーディングしていく一連の過程を、吉田さんの解説とともに実際に作りながら学んでいきます。 授業のスピードも比較的ゆっくりとしていて、一つ一つをしっかり理解しながら進めていくことができますね。

他の学習サイトではHTMLとCSSを同時進行で解説コーディングしていくことが多いですが、スキルハブではHTMLとCSSの作業をきっちりと分け、「HTMLでまず基本設計」してから「CSSでスタイルを整える」と順番に教えてくれるので、頭がパンクすることなく学べます。

 

第2位 『ドットインストール』

img1

公式サイトはこちら。

■学習できる言語:HTML、CSS、JavaScript、jQuery、PHP、Ruby、Python、Java、Perl、Cなどほぼ全てを網羅

■プレミアム会員は有料(月額880円)
はい出ました。って感じですよね。 プログラマーの登竜門としての絶対的な地位を確立しているドットインストール大先生。

もはやドットインストールのお世話になったことのないプログラマーはいないのではないか? とすら思えてくるほど定番中の定番である超有名学習サイトです。

「株式会社ドットインストール」によって2011年より運営されており、2015年現在の登録ユーザー数は16万人を突破しています。

一つのレッスンが複数の学習動画でまとめられており、一つの学習動画が約3分という短い時間で構成されているので、お手軽に隙間時間でも学習できちゃいます。

さらにドットインストールの最大の特徴は、その膨大なレッスン(動画)量です。 その総数はなんと、全250レッスン、全3514本の動画を提供しています。さらにプログラミング言語もメジャーどころは全て網羅しているという徹底ぶりです。

一つの動画が3分と短いこともあって、動画ごとに学ぶ項目を細分化して教えてくれることがメリットです。

まさに一つ一つ、一歩ずつ着実に覚えていくカタチとなります。 動画で一方的に解説を受ける完全受動型タイプなので、最初のうちはボーッと動画を眺めて、どういう風にプログラミングが書かれていくのかを生で見学してみるのもいいかもしれません。

またレッスン項目が細分化されて管理されていることで、今後プログラミングをしていく上で技術的に分からなくなった時や忘れてしまった時などに手軽に振り返り学習しやすいのがドットインストールの特徴であり、そういった用途でもプログラマーを目指すうえで末永く重宝するサイトになるでしょう。
しかし、私が初心者ながら感じた欠点は、とにかくスピードが早すぎるという点です。

特に基本設定となっている「男性ボイス」の方は喋り方がまず早口すぎるという……笑。

スピードが早すぎるので、動画を見ながらプログラミングをしていく際には、とにかく何度も何度も何度も一時停止&巻き戻しを繰り返さなくてはならず、ユーザビリティという意味で「快適さ」は正直感じられません。

月額880円のプレミアム会員になると、「女性ボイス(比較的ゆっくりな喋り)」を選べることと、動画を文字に起こしたテキストを見ることが出来るのでその点では多少は助かるところですが、 もとより3分という非常に短い枠の中にレッスンを詰め込んでいる仕様上、早口という要素もそうですが、基本的に「必要最低限」の構成になっているように感じます。

なので、知識レベルゼロから入ると、得られる知識量としては少々もの足りず、「もうちょっとゆっくり詳しく説明してくれよ……こっちは初心者なんだ」と感じてしまう恐れがあります。(私がそうでした)

その点を鑑みてあくまで私個人の意見を言わせてもらいますと、 プログラミングの本当の第一歩としては、ドットインストールは向いていないと感じました。

完全受動型という学習タイプを考えても、ズブの素人だと結局動画を見ただけで終わってしまう可能性もあります。

なのでドットインストールは、一度プログラミングに肌で触れてみてから、第二の教科書として取り組んでみるのがベストだと私は感じました。

では、プログラミングの本当の第一歩としてはどのサイトが良いのか?

長らくおまたせしました。1位の発表です。

ダントツ優勝 『Progate(プロゲート)』

1033x649xd8356e0a07541bb7adb533b

公式サイトはこちら。

■学習できる言語:HTML、CSS、jQuery、PHP、Ruby、Ruby on Rails
ダントツの1位は、東大生が作ったという「プロゲート」です。

学習の特徴はとにかく実践型です。必要知識だけ数枚のスライドで教えてもらい、あとは問題形式でプログラミングしていく構成となっていて、とにかく自分の指でコードを打っていくというスタイルです。

課題コードをクリアしたら次の段階に進めるようになっており、もし詰まってもヒントや答えを見ることができるので安心です。 ブラウザ上でコーディングできるので、自分でテキストエディタを用意する必要すらなく、サイトを訪問したその足でいきなりプログラミングを体験できます。 HTML/CSSなら、ド素人でも1レッスン(4時間程度)でかなり知った気になれます。

「ぶっちゃけもうプログラミングできるんじゃない?」という錯覚すら起こすほど分かりやすく、入門という意味ではこれ以上ない良サイトでした。 「プロゲート」でまずプログラミングというものを肌で体感し、多少の基礎知識を備えた上で次のステップとして「ドットインストール」へ進むというのが私なりにベストな道でしたね。

「プロゲート」の唯一の欠点といえば、まだレッスン数が少ないということでしょうか。

その点については、記事執筆中の現在も新たに「Javascript」のレッスンが準備中の様子なので、時間とともに増えていくものだと期待できます。

とはいえ、現状でも「HTML/CSS」「PHP」「Ruby」など初心者オススメの項目は揃っているので、入門サイトとしては申し分ありません。

この記事を読んだプログラミング初心者の皆さんは、ぜひリンクから「プロゲート」のサイトへ飛び、プログラミングというものを体験してみて下さい。非常に分かりやすく、プログラミングに対する苦手意識はかなり解消されると思います。

まとめ

いかがでしたでしょうか?

あくまで個人的な経験によるランキングですが、紹介した3つのサイトがあれば「プログラミング入門」として十分なのは断言できます。

理想としてはランキングの通り、「プロゲート」でまず体験し、その後「ドットインストール」と「スキルハブ」でより理解を深めていくーーというイメージだとつまづきにくいと思います。

そして、その段階まで来たらしっかりと参考書を購入して体系的に知識を得ることが重要なようです。無料オンラインは確かに非常に便利ですが、やはりオンラインだけで済まそうとするのは甘いようですね。

また、重要なのはいわゆる「ノウハウコレクター」になってしまわないように、自分でコードを書くようにするという点でしょうか。 動画ばかり見て、あるいは本ばかり読んで知識だけを詰め込んでいては、一向にプログラミング出来るようにはなりません。

ありきたりな言葉ですが、プログラミングは習うより身体で覚えるものというのは真実です。 まずは無料サイトや本を駆使して1行でも多くのコードを書くこと。 そしたら次は、サンプルコードではなく「自分のコード」を書いてみること。 それがプログラミングを体得する一番の近道だと思います。

(俗にいう「写経」は、個人的にそれほど効果はないと感じています。どうせ「写経」するなら、そのコードを自分なりに弄ったりして遊んだ方が遥かに習得率は上がると思います。大事なのは、自分の中からコードを生み出す鍛錬です)

というわけで、プログラミング初心者の方は、今回紹介した無料サイトを使ってぜひ今すぐにでもプログラミングデビューしてみてはいかがでしょうか。

また、もし本気で最速でプログラミングを覚えてエンジニアになりたいのなら、下記で紹介している『テックアカデミー』でガッツリ学ぶのもアリでしょう。

【おまけ】未経験から最短最速でプログラミングを覚えるなら?

プログラミングは今の時代もはや「錬金術」とさえ言えます。

もし将来、あなたもITの分野で起業したり働きたいと考えているなら、プログラミングはなるべく早いうちから触れておいた方が確実に良いでしょう。

今ではオンライン英会話のように、プログラミングもオンラインでプロに教わることができます。

テックアカデミー

中でも短期集中型プログラミング学習の代表的存在である「TechAcademy [テックアカデミー]」は、”最短4週間で未経験からプロを育てるオンライン完結のスクール”と謳っています。

さすがにプログラミング未経験者が4週間でプロになるのは難しいと思いますが、最短最速で一定レベルまで習得するなら「短期集中の詰め込み」が最も効果的です。

ただでさえ、プログラミングは独学では7割の人はモチベーションが保てず挫折します。そう言う人は車の免許合宿のようにTechAcademy [テックアカデミー]で一気に詰め込んでしまった方が良いですよ。

スポンサーリンク
StockSnap / Pixabay