~ 毎日を少しだけ豊かに ~

【プログラミング本:1冊ですべて身につくHTML&CSSとWebデザイン入門講座】を見ながらサイトを作った!

※このブログはアフィリエイト広告を利用しています

どーもー!!

クラゲパパでーす!!

今日は、以前記事に書かせてもらったプログラミング記事の続編!

記事:【プログラミング本】1冊ですべて身につくHTML&CSSとWebデザイン入門講座

実際に本を見ながらやってみてどうだったか??という結果をお伝えします!!結論からいうとめちゃめちゃ良かったです!!なぜなら、いつも途中であきらめる私が、あきらめずに最後までやり遂げることができたのですから笑

目次

サイト作るまでの時間は?

この本を買って「よしっ!独学はじめるぞ!」って取り組み始めたのが

3月29日

で、完成したのが

4月30日

ということで、ほぼ1ヶ月かかってますね…汗

でも、30日丸々やってたわけではありません。

実質とりくんだ時間は

1日2時間 × 1回/2日=2時間 × 15日=30時間

できるだけ毎日取り組むようにしようと思っていたのですが、ブログの更新や複業の仕事などもあって思うように進みませんでした

でも途中でやめずに続けることで、GW前にはWEBサイトを作ることができました♪

どうやって取り組んだのか??

ちなみにこの本の概要は、「HTMLとCSSをひとつのサイトを作りながら勉強していく」というものです

本の通りに進めていくと「カフェのトップページ」「メニューページ」「問い合わせページ」が作れます!!

これだけ聞くとよくある学習本って感じなんですが、素人にも分かりやすいように

「ここのコードの間にこのコードを書きましょう」
「このコードの意味は○○です」

など、とても丁寧に解説してくれています

そして、各ページともに「文字がぎっしり詰まっていない」のが大きな魅力です!

少し脱線しました笑

じゃあそんな学習本でどうやって取り組んだのか?

私の場合は作りたいサイトイメージがすでにあったので、本の内容を進めながら「写真」と「ページの種類」を自分流にアレンジしていきながら作りました♪

結果としてはほぼイメージ通りに仕上げることができたのですが・・・

✔ 一部でスマホ表示が崩れた…
✔ タグを変えてしまったので合わせるのが大変だった…

などの壁にぶちあたりました笑

まーそりゃそうですよね。。。素人がいきなりアレンジなんかカマしてくるなよ!ってことですわ

このせいで余計な時間を使ってしまいましたが、本以外の情報を検索する必要があったり、問題の原因を探るために本の見本ソースコードと自分のコードを見比べたりと、普通に進めるよりは力が付いたのでは?と思っています♪

【プログラミング本:1冊ですべて身につくHTML&CSSとWebデザイン入門講座】でサイトを作ってみた→まとめ

本書のおすすめポイント!

1、これまでにも書いてきたように、まずは本の内容の見やすさ!

2、そして、ひとつひとつの丁寧な解説!

3、レスポンシブル対応(スマホ画面対応)の方法も網羅!

4、オシャレなサイトが完成する!

とにかくプログラミンング言語初心者の人にもわかりやすく書かれている。優しい文体で読みやすく説明も細かい点まで行き届いている。初心者が最初の1冊に選ぶならこの1冊だけで十分です!

本書が向いている人!

この本が向いているのは下記のような人だと思います!

初心者(低)・・・まったくHTMLとか知らない人
初心者(中)・・・HTMLを少し触ったり見たことがある人

あとはワードプレスとかで基礎知識があるけど、もっとWEBの知識を深めたいという方にも向いていると思います!ちなみに私はこのタイプ♪

これまでプログラミング本に何冊も挑戦してきたけど挫折しまくりだった私が、最後までやり遂げることができた唯一の本。それだけでもおすすめする理由になりますね!

本書まとめ

いまはリアルな学校のほか、オンラインスクールなんかもたくさんあるので、どうやって学んでいくのか悩むと思います!

私もオンラインスクールという選択肢があったのですが、どこまで自分が本気でやるのか怪しかったので、「まずは独学」という選択をしました!

独学でいえば「本」の他「Progate」というツールもあるのでいろんな形で取り組んでみたら良いと思います♪

ちなみに私の次のステップとしては、もう一度復習することです!!

さあ!WEBデザイナーやプログラマー、マーケティングなどの世界を目指して!今日もがんばりましょう♪

※2022年現在:このManaさんの書籍は「本書の続編」や「WordPress」など他のものも出版されているのでぜひチェックしてみて!ほんとにわかりやすい説明でおすすめだから!

よかったらシェアしてね!
  • URLをコピーしました!
目次