});

HTMLとCSSって簡単とか言われてるけど初見のときは普通に難しいと感じた話

おっすおっす。もちころです

6月に入ってから、一気に暑くなった気がする今日このごろ。

休み中はほとんど資格勉強か、サイト制作の勉強、龍が如くシリーズをひたすらやったり、たまに近所のビデオ屋でDVDを借りるなど割と好きなことして過ごしています。

 

さて、今回はWeb制作を行っていく上で必要なHTMLとCSSを学んでみて、「やっぱり初見だと難しいな」と感じた話をしていきたいなと思います。

 

あくまで学習者のつぶやきみたいなものなので、暇つぶしで参考にしてもらえれば幸いです。

 

Web制作の基本中の基本であるHTMLとCSS

Webサイトを作る上で、必ず学ばないといけないと言われているのが「HTML」と「CSS」。

 

わからない人のために簡単に説明しておくと、「HTML」はサイトの骨組み・「CSS」はちょっとした装飾(文字の色の変更やヘッダー・フッターのレイアウトなどの作成)をするのに必要なものです。

 

これから仕事を続けていく中で身につけておかない無いとなー、あわよくばそれで副業して稼ぎたいなーという思いから始めてみました。

 

グーグルで実際に調べてみると、「HTMLとCSSは基本中の基本、なので初心者でも簡単にできます」みたいな記事が結構目立つので「お、じゃあ全くの初心者の私でもできんじゃね」と思ってやってみたんですよ。

 

簡単とか言われてるけど普通に難しいと感じた件について

まあ、案の定難しかった。

 

HTMLに関しては、仕事でよく使うのである程度見慣れていましたが、問題はCSS。
書き方も結構独特だし、そもそもHTMLファイルとの関連付けをミスったら全然反映されないし…。

 

そんなこんなで結構苦戦しました。
また、HTMLの方も「div」「id」「class」といった見慣れない単語が出てきたりしたので、この辺も結構苦戦しました。

 

ある程度テキストエディタで書くのに慣れてくれば問題はありませんが、全くの初心者(しかも独学の場合)は結構しんどいなと感じました。
(あくまで個人の感想です)

 

まあ、何が言いたいかというと「基本だからといってなめていると挫折しやすい」ということです。

 

個人的にやらかしていたミス

HTMLとCSSを最初に学んでいて、いろいろな部分をミスってなかなかCSSが反映されないなんてことも珍しくなかったです。

結構やらかしていますが、その中でも特にやらかしていたものが2つあります。

はじめてWeb サイト制作に独学でチャレンジしようと思っている人は、参考にしてみてください。

 

(この2つのミスを事前に防げば、独学でも結構はかどるかも…。)

 

その1 ファイルのパス名をミスっていた

個人的に一番やらかしているのが、ファイルのパス名をミスっていたというところ。

サイトを制作する上で、大まかに分けて2つのファイルが必要になってきます。

 

一つは、さっきも言ったとおりHTMLを記述したHTMLファイル。

もう一つは、CSSファイルです。

 

この2つをリンクで関連付けることで、はじめてWebサイトとして成り立つんです。

 

ただ、私の場合このリンクのスペルをミスっていたり、そもそもパスの場所が全然違う場所にあって反映されないといったポカをやらかしました。

 

最初の頃に結構ミスりやすい部分なので、要注意です。

 

その2 単純にプロパティやタグのスペルが間違ってた

意外と間違えていたのが、プロパティやタグのスペルミスです。

基本的にHTMLもCSSも英字で書くため、慣れていないと結構スペルミスします。

 

 

  • 「<div class=”h1″>サンプル</h1>」のはずなのに「<iv class=”h1″>サンプル</h1>」になっていた
  • paddingと書いたはずなのに、padingになっている
  • <img src…>ではなく、<image src…>になってしまった

 

などなど…。

スペルミスをすると、CSSが適用されなくなり、サイト自体もうまく反映できなくなってしまいます。

「なんか全然適用されないんだけど…」と思ったら、スペルミスをしていないかチェックしておきましょう。

 

「習うより慣れろ」この言葉を痛感した

最初の頃はマジで難しく感じ、途中で挫折してしまうこともありましたが、本を読んだり学習サイトを使ってやって模写コーディングを続けていくうちにだんだん慣れてきました。

 

今も勉強中ですが、2ヶ月前と比べたら一人で骨組みを立てられるようになったり、文字サイズの変更やヘッダー・フッターのレイアウト作成・カラーの変更など簡単なものはできるようになってきました。

 

ミスってもいいから、一つひとつ覚えて徐々に慣れていく。

「習うより慣れろ」という言葉を、今回の学習で改めて痛感しました。

 

今後やっていきたいこと

HTMLとCSSも初歩的なことはできてきたので、スマホのレイアウト(レスポンシブデザイン)の勉強をしたり、模写コーディングをしてより美しいサイトを作れるように頑張っていきたいなと思います。

 

あとは、jQueryやJavaScriptを学習し、動きのあるサイトも作っていきたいです。

ある程度学習が進んできたら、ポートフォリオ用のサイトをいくつか作っていく予定です。

 

時間に余裕があるときは、PhotoshopやIllustratorを使ったWebデザインの基礎も学んでいきたいなと思っています。

 

まとめ

最初は難しいですが、慣れてくると結構やりやすいHTMLとCSS。

まだまだ不慣れなところはありますが、学んで実践をしてポートフォリオ用のサイトを作れればと思います。

慣れてきたら、WordPressのデザインも自分で変えれるようにしたいなとも考えています。

定期的に進捗をブログにアップしていきたいなと思いますので、興味のある方はぜひ読んでみてください。

  • もちころ
  • 就労経験全くなしの状態で、フリーのWebライターになっちゃった人。
    FP3級保持/HTMLとCSSで簡単なサイトは作れるようになった/メンタル心理カウンセラー勉強中/FP2級を今年中に取得したい