サイト模写備忘録 HTML上級編

こんにちは、関西在住で主夫歴5年越のYUJIです。

家事や子育てで、皆さんも毎日忙しい日々をお過ごしですか?

それでは、今回は、有名な「Code-step」という学習サイトの模写における「HTML上級編」のうち、「HTML」言語のコード入力時によくあるミスをお伝えします。具体的には、「index.html」と呼ばれるファイル構成のコード作成時における発生しやすいミスを書いていきます。

今回の入力ミスについて(備忘録)

今回の入力時におけるミスは以下の通りです。


  • faviconがico端子ではなくpngデータとなっている。(これはプラウザにより処理可能)
  • js/jquery.inview.min.js を読み込むscript抜け → inviewクラスが走らない
  • header.logoのaタグリンクの”#”を”index.html”と誤記
  • main>div.#mainvisualのクラスにinview, fadeinが不足
  • main>section要素のクラスにinview, fadeinが不足
  • section#informationのpタグ内にクラスを使い分けるためのspanタグが不足
  • サイドボタンのdivその他のコードが不足
  • section#galleryのクラスにinview, fadeinが不足
  • section#gallery liのクラスに inview, fadein が不足
  • section#accessのpタグにspanタグは不要(クラスでcss対応)
  • section#accessのbtnクラスはaタグで処理(pタグは不要)
  • section#contactのクラスにwrapperが不足
  • body>main内にdiv.bgが不足(section#accessの背景画像処理を行うため)
  • section#contact>ul.sns>li aのリンクにtarget:”_blank”が不足
  • ul.copyright内liにpタグは不要

コーディング学習サイト「Code-step」です。ほんとにお世話になっています。

  

今後について

今回の「HTML上級編」については、これまで私が取り組んできたHTML/CSS言語のスキル習得に関する総決算のような位置づけと思っています。

ですので、これをマスターできるようであれば、一定のリクエストにも対応できる一般的なスキルが身についたと(勝手に)思えるレベルにまで到達してきたかな、という印象です。

この辺り、これまでの数ヶ月において、何ができるようになったのかを、このブログで整理してみようかと思っています。           

  

  

次回は、引き続き「HTML上級編」の「JavaScript」言語におけるミス入力をお伝えする予定です。

それでは、また。 

 

 

コメントを残す