まず一歩！ HTML・CSSの勉強の備忘録・雑感

HTML・CSSの勉強を始めて今日で10日目です。

備忘録的に僕がやったことを書きたいと思います。

準備したもの

• HTMLレッスンブック
• HTMLデザインブック
• できる大辞典　HTML&CSS

以上３点、とパソコンです。

まずは書籍から始めようと思い「HTMLデザインブック」をAmazonで購入したのですが、HTML・CSSに関しては全くの素人の自分には内容が合ってないことに気づき「HTMLレッスンブック」を改めてポチリ。

「HTMLレッスンブック」のことを調べていると「Progate」というHTML・CSSの勉強がブラウザだけでできるWebサービスの存在を知り、書籍で学ぶ前に「Progate」で始めることにしました。この「Progate」で入門して良かったと後々気づくことになります。

kaihajime.hatenablog.com

Progateで始めて良かったこと

Progate → 書籍の順でやった感想ですが、全くの素人が書籍で一から学ぶとなると「これわかりにくいな〜」と感じることがありました。

入門編でもボリュームがあり、今はいらない！ということも有

書籍だと序盤からブラウザの仕様やレンダリングエンジンがどうだみたいな、いい意味でも悪い意味でも「丁寧に細かく」情報があり過ぎです。テキストエディターの準備やサーバーのことまで書かれています。重要なことですが、サーバーなんて後からでもなんとでもなります。テキストエディターもネットで検索すれば自分の環境に合ったモノはすぐ出てきます。今から始めようという時に「後からでも済むこと」は出来るだけ排除したいところ。

やっていること（書いたコード）が正解かどうかの判断が難しい

「Progate」だと書いたコードが間違っていたら先へ進めません。正解するまでヒントをみたりHTML・CSSの辞書で調べたり、ネットで調べたりしながら進めました。時にはギブアップで答えを見たりしながら。書籍でもいろいろ調べながらできると思いますが、最終的に次のスッテプに進むには「Progate」の中の先生がOKというまで進めません。この先生がいるというのは初心者にとってかなり重要で助けにもなります。

スタートもアカウント登録するだけです。途中で作業を止めても再度始めるときは止めたところから始めることができます。これ以外と便利です。

今後の勉強の進め方

今日で10日目、現在「Progate」の基礎編を２周（２周目は復習のつもりで）と「HTMLレッスンブック」が「CHAPTER ３」まで終了。

残り本が３CHAPTERなので３日間（１日１CHAPTER）と「Progate」応用編」を一日でやるとして合計４日間で一区切りつきます。その後４月の上旬末までには「HTMLデザインブック」へ進んで右往左往してる感じが良いかなと思います。

素直に楽しんでる！

サクサクとはいきません。だけど少し慣れると「ここはこんな感じに変えても良いんでない？」という具合にコードを書き換えたり、値を変えてみたり。色々試してみて思ったように表示されるとメチャメチャ達成感あります。まだまだスタートしたばかりで試行錯誤の連続ですが面白いから全然苦になりません。

補足というか疑問点

「Progate」と「書籍」では多少違う点があります。CSSで「.」ドットや「；」セミコロンを入れたり、入れなかったり、、、一応どちらのパターンも試してみて、念の為入れる方でコードを書くようにしてますが、HTML・CSSのバージョン的な問題でしょうか？

まあ細かいことは後から修正するとして、ここは駒を先に進めることに集中します。

おすすめのテキストエディター

僕は入力補助がついたフリーソフトの「Atom」を使っています。コードを書くと次に予想されるコードの候補が小窓に出てきます。「初心者のウチはコードは全て打ったほうがイイかな？」と思いましたが、ここはスピード重視です。どっちみち間違った時など手打ちしているので良しとします。

atom.io

コチラのブログで詳しい使い方が載ってます。僕も参考にさせていただいています。

この場を借りてありがとうございます。

blog.codecamp.jp

とにかく毎日少しでも書く！　ということで

読んでいただいた方へ

ありがとうございました。

Kai Hajime

HTML5&CSS3レッスンブック

HTML5&CSS3デザインブック (ステップバイステップ形式でマスターできる)

できる大事典 HTML & CSS