HTMLやCSSをコーディングする時に作業効率を上げるためのWebサイトを紹介します。
HTMLやCSSではよく書くコーディングやデザインはパターン化されていますが、
すべてを頭の中にいれることは難しいです。
その時に直ぐに使いたいタグやマークアップ言語を検索して使えるようにするべきです。
W3C
まずはHTML・CSSを規約を作っている「W3C」です。
すべてのHTML・CSSを策定しているだけあって、全ての情報が載っています。
しかし内容量が多いのと英語であること、情報が見つけづらいという難点があります。
HTMLクイックリファレンス
HTML・CSSのリファレンスが網羅的に乗っているのが「HTMLクイックリファレンス」です。
情報が綺麗に整理されており、
簡単なサンプルも載っているので初心者の勉強サイトとしても活用することができます。
HTML逆引きリファレンス
「やりたいこと・表示させたいこと」から「HTMLタグ・CSSマークアップ方法を探す」という場合に利用できるのが、「HTML逆引きリファレンス」です。
「HTMLクイックリファレンス」⇔「逆引きリファレンス」の2つを利用すると、コーディング時にわからないことは殆どなくなります。
HTML5.jp
W3Cが公開している内容を翻訳しているのがHTML5.jpになります。
本家よりも制止されており見やすく、
要点を絞っているため非常にコーディング時にさっと検索したいときには、私も利用しています。
CANIUSE.com
HTMLやCSSが各ブラウザで対応しているのか確認できるのかを「caniuse.com」です。
最新のHTMLタグやCSSマークアップ言語はブラウザによっては利用できない場合がありますので注意が必要です。
各ブラウザで事前にベンダープレフィックスの必要有無を確認できるので大変オススメです。
LPアーカイブ
LP（ランディングページ）のデザイン作成時にイメージを膨らませるため利用できるのが「LPアーカイブ」になります。
LPアーカイブには企業ページや製品ページなど10,000以上のLPがあるため、
参考になるサイトを探すのに困ることはありません。
イケサイ
イケてるサイトがカテゴリごとに検索できるのが「イケサイ」になります。
LPアーカイブと違い企業サイトが中心に乗っており、
業種ごとにカテゴリされているためデザイン作成時に大変便利なサイトになります。
その他にオススメのWebサイトがあったら随時更新していきたいと思います。
いちばんよくわかるHTML5＆CSS3デザインきちんと入門posted with ヨメレバ
狩野 祐東 SBクリエイティブ 2016年10月28日
