むぎろぐ

仕事に行きたくないアラサー会社員の雑記ブログ

ブログを楽しく続けていくためにHTML&CSSの勉強を始めることにしました

初めて当ブログに訪れた人におすすめの記事をPick Up!1. 自己紹介やお問い合わせ
2. 当ブログのトップページ⇦まずはこちらから
3. Amazonで買ってよかったおすすめの物をご紹介

 f:id:nmugi:20170903143641j:plain

「HTMLとかCSSってなんか難しそう」

どうも、「HTMLとかCSSなんて全然分からないけど興味がある」むぎです。

 

当ブログも運営開始から約9カ月が経ちました。

僕はかなり飽きっぽい性格で、ここまで長い期間続いているのが正直不思議でなりません。

最近は記事の更新が滞ってしまっていますが、別にブログに飽きてしまったわけではないですし今でも楽しく続けることができています。

 

ただ最近、ふと「今よりもっとブログを楽しく続けるために何かできることはないか」と考えるになりました。

そんなことを考えているうちに、ブログのカスタイマイズや記事の装飾とかに興味を持つようになっている自分がいるのに気づきました。

 

「それなら、HTMLやCSSの勉強をしよう」

単純ですが、そんなことを思いついたのがこの記事を書いているきっかけです。

 

今回はHTMLとCSSについて書いていきます。

これから勉強を始めようようと考えている方や初心者の方に参考になれば嬉しいです。

 

ちなみにこの記事を書いている僕自身も勉強を始めたばかりで記事の内容に誤りがあるかもしれません。

見つけた方は教えて頂けると嬉しいです。

 

HTML&CSSとは

それではまず、「HTMLとCSSとは何なのか」ということについて書いていこうと思います。

HTMLとは

HTMLとはHyperText Markup Languageの略で、直訳すると「印をつけるための言語」という意味です。文章にHTMLタグと呼ばれる印をつけてあげることで、文章全体を「構造化された情報」として発信することができるようになります。

 

文章で書くとすごく難しい言葉のように思えますが、すでにブログで記事を書いている方は見慣れているはずです。

この記事を読んでいるあなたがはてなブログユーザーであればこの画面。

f:id:nmugi:20170930201256j:plain

「HTML編集」とありますね。

HTMLタグには記事の中の見出しや段落等たくさんの種類のタグが用意されており、読む人が記事を読みやすくなり、性格に情報を受け取ることができるようになります。

CSSとは

CSSとは、Cascading Style sheetsの略で、サイトのスタイルを指定するための言語のことです。

また言葉にすると難しいようですが、簡単に言うと文章や画像の見た目を指定するための情報を記述したものです。

 

はてなブログユーザーの方はブログデザインのカスタマイズの際におなじみですね。

f:id:nmugi:20170930201320j:plain

少し分かりづらいかもしれませんが、左下に「デザインCSS」という場所があります。

HTMLとCSSの違い

似たようで違うHTMLとCSSですが、違いについて簡単に説明したいと思います。

 

HTMLはサイトのページの中の要素の意味や情報の構造つまり大枠を定義しているのに対して、CSSはHTMLと組合せて使用します。

 

HTMLで記事の構造を決めて、CSSで装飾する

そのようなイメージだと思います。

 

HTML&CSSは独学でも理解できるのか

僕も勉強を始めたばかりで正直まだなんとも言えません。

 

ただ、はてなブログには独学で勉強してテーマを作っている方もたくさんいますよね。

当ブログのスマホ版のテンプレートの作者であるこどみすさんやPC版のテンプレートの作者であるシロマティさん等々……挙げればきりがありません。

 

僕自身、ブログを運営して半年以上が経ちますが「コピペOK」に甘えてきたばかりに、HTMLやCSSに関してはほぼ知識がない状態からのスタートです。

 

「そんな状態から勉強始めて大丈夫なのか?」と聞かれれば、正直「全然自信ありません」としか答えることができませんが、まぁ自分がやりたいと思ったことなのでやってみようと思います。

 

はてなブログではシロマ(id:shiromatakumi)さん、Wordpressではサルワカ さん等、HTMLやCSSの勉強で参考になる記事を書いている先輩方はたくさんいますし、その記事を読めば少し勇気が湧いてきます。

 

背中を押してほしいあなたのために、「HTMLやCSSの勉強をしよう」と実際に読んで感じたオススメの記事を載せておきます。

参考①:全くの未経験が独学でWEBデザイナーに転職するまで - NO TITLE

参考②:超初心者のためのHTML・CSS入門講座 - NO TITLE

参考③:HTML&CSS入門:イチからWebデザインを習得する講座

 

HTML&CSS学ぶために最初に読むべき本や記事

「独学で勉強するのはいいけど、参考になる本とか記事はあるのかな」と感じているあなたのために、色々と調べてみました。

初心者が最初に読んだ方がいいオススメの本や記事を紹介したいと思います。

HTML&CSSを学ぶために最初に読むべき本

HTMLやCSSを学ぶために最初に読むべき本はこちらです。

この本はあのサルワカさんがオススメしていたこともあって読むことを決めました。

 おそらく日本で(現時点で)発売されているHTMLとCSSの解説書の中では一番分かりやすい本です。本当にこれ以上なく、丁寧に親切に解説されています。手に取ったときには「これは敵わんなぁ…」と敗北感を感じたほど。

出典:HTMLとCSSの勉強におすすめの本8冊(初心者〜中級者向け)

サルワカさんがここまで言われているともう読まずにはいられません。

まだ読んでいる途中ですが、画像も多く内容も分かりやすい丁寧に作られたのが分かる本です。

 

「HTMLやCSSについて勉強したいけど、何を読んだらいいのかわからない」という方はまずこの本を読んでみることをオススメします。

HTML&CSSを学ぶために最初に読むべき記事

もうここまで読んだあなたはお分かりでしょう。

僕がサルワカさんの猛烈なファンであることに。

 

サイトをみて頂ければわかるはず。

記事の内容もさることながら、サイトのデザインが「なんと美しくも分かりやすい」ことといったらですよ。

 

先ほども紹介していますが、そんなサルワカさんがCSSやHTMLについて詳しく解説した記事を書いておられます。

参考:HTML&CSS入門:イチからWebデザインを習得する講座

内容もですが、画像や装飾で直感的にも分かりやすい記事ばかり。

 

「HTMLやCSSについて勉強したいけど、お金はかけたくない」という方はぜひサルワカさんの記事を読んでみることをオススメします。

 

まとめ:HTML&CSSの勉強をします

f:id:nmugi:20170918192441j:plain

この記事のまとめになります。

 

今回の記事では僕がHTMLやCSSを勉強しようと思ったきっかけや、最初に読むべき本と記事を紹介しました。

 

記事の冒頭でも書いていますが、僕はかなり飽きっぽい性格なのでいつまで続くのか分かりませんし途中で辞めてしまうかもしれません。

でも「やってみよう」と思ったからには挑戦してみようと思います。

 

HTMLやCSSの勉強を始めてみて気付いたことや感じたことは今後も記事にしていけたらと思っているので、その時は読んでもらえたら嬉しいです。

 

長々と書いてしまいましたが記事の内容は以上です。

最後まで読んで頂いてありがとうございました。

ではまた!