こんにちは、穏やか暮らし計画ライターのあらです。
前回では、掲示板サイトを作るにはHTML・CSSを学ばないといけないということで、TechAcademy（テックアカデミー）の『はじめてのHTML入門講座』を見て、実際にコードを書いた感想と成果をこのブログでお見せしました。
ですので、今回も同じくTechAcademyのCSS版『はじめてのCSS入門講座』を見て、CSSを学んだ感想を述べていきます。
CSSとは
はじめに、CSSとはどんなプログラミング言語なのか私なりの見解を話したいと思います。
CSS【Cascading Style Sheets】とはHTMLで基盤を作り、その基盤に大きさや色・配置をパソコンに指定することができるプログラミング言語になります。
ですので、プログラミングを学ぶならHTML→CSSの順に学ぶことが鉄則になっているようです。CSSを学ぶ段階で当たり前のようにHTMLのコードが出てくるので、先にCSSから学ぼうとするとちんぷんかんぷんで、すぐ挫折すると思います。
もし、HTMLだけでサイトを作ろうとすると、とても質素なサイトになってしまうので、おしゃれなサイトを自分で作ってみたいという方は両方習得必須な言語です。
CSSの入門講座を学んだ時間・期間
入門講座は全部で34本。合計約200分でした。前回と同様、倍速機能を使って、進めたので動画を見る時間は200分もかからなかったと思います。
ですが、よくわからない箇所は巻き戻したり、コードを書いたり、エラーを直したりするので実際にはもっと時間がかかります。私は、1日4、５時間。4日で合計20時間前後でCSS講座を見終えました。
他の方のCSSを学ぶ期間もだいたい10時間〜20時間ぐらいだったので、必要最低限のCSSはTechAcademyの無料講座で十分なのかなと思います。
TechAcademyの無料講座で学べること
TechAcademyのYouTubeでは下記のようなCSSを学ぶことができました。
- CSSの概要
- 基本・よく使うセレクタ
- 大きさ、太さ・色・文字。様々な指定方法
- サイト背景の指定方法
- サイトを作る上で必要な要素...etc
※セレクタ 何かを指定するときに使う単語
音声もとても落ち着いた声で聞きやすく、あれ？この部分やったことないなと思ったところがあっても、簡潔に説明してくれますし、説明がない場合は次章で解説されていたりしてなるほど！というポイントが多かったです。
その感動ポイントがあるのもモチベーションにも繋がりました。ですから、分からない箇所はいずれ出てくることが多いので、分からなくても一旦真似してみて、実行結果が同じなら次章に進む形でいいと思います。
今回CSSを学ぶ上で作ったファイルになります。
index(数字).htmlはCSSを実行する上で作ったhtmlコード、style(数字).cssはcssコード、スタイルシートになります。htmlコードで指定のスタイルシートを実行させ、連結させています。
コードを書いて実行して成功したら削除でもよかったですが、残っていたほうが後々確認できますので、私はあえて残しています。
プログラミング勉強方法は独学かスクールか
プログラミング勉強方法は様々あると思います。
- 本/参考書
- サイト
- スクール
- 専門学校
- YouTube/動画
ちょっと考えただけでこんなにあります。どれを選べばいいかは人によって適正があると思うので、まずは安価で済むもので選ぶべきだと思います。（本/参考書、サイト、動画)
独学で1番大変なところは、分からなかったときに教えてくれる人がいない・モチベーションの保持の2つになります。それを少しだけカバーしてくれるのがスクールだと思っています。
ですから、モチベーションがどれくらい持てるかで独学かスクールか選べばいいのかなと思います。しかし、分からないところ切り抜ける力はプログラミングにおいてとても重要なスキルだと私は思っているので、やはり一旦は自分でやってみることをおすすめします。
CSSを独学で学習する2つの方法
私が知っている学習方法は2つあるのですが、1つはもちろん今回学習したTechAcademyのYouTubeです。
CSS版の入門講座は7-2の「背景の指定の応用」だけスタイルシートを見せてくれなくて、できませんでしたがそれ以外は普通に学習できました。スタイルシートが見られなかった7-2はふーんそうやるんだって感じで飛ばしました笑
もう１つは「ドットインストール」です。CSSはドットインストールで学習しようと考えていましたが、HTML講座で書いたコードの続きをそのまま使っていて、分かりにくかったのでテックアカデミーのYouTubeに変えました。
ネットでもよく名前があがりますし、HTMLから始めるならドットインストールでもありかなと思います。
どっちも最初の動画#１を見て、分かりやすそうな方を選べばいいと思います。
次の課題＆まとめ
入門講座が終わり、ある程度実力ついたかなと思い、そこらへんのホームページを真似てサイトを作ってみよう！ と思ったところ、コードが書けない...書いてもエラーばっかりで配置したいところにうまくプログラムできない...
思ったより、コードを真似るのとサイトを真似して自分でコードを書くというのは別物だということを痛感させられました。ですから、次回までに
- 簡単なホームページにはどんなものが必要なのか
- 必要なものに対してどんなHTMLコード、CSSコードが必要なのか
- 必要なコードを今まで習ってきたもので復習
こういった手順で、簡単なホームページ制作からやって行こうと思います。入門講座やってすぐ理想のホームページのコードを書こうとしたことがちょっと無謀でした笑
今回『はじめてのCSS入門講座』を見てコードを書いただけなので理解力50%、CSSの基本の「き」を学んだだけですし、CSSがこれで習得した！なんてことは言えませんが、ちょっとしたサイトをちゃちゃっと作れるように勉強していきたいです。
もしこの記事を読んでプログラミングを学び、サイトを作ってみたいという方は、環境構築のやり方→HTML講座編→CSS講座編（本記事）の順にみるとできると思います。一緒に頑張って行きましょう。
