ホームページ（Webサイト）制作で参考にしているサイト

Googleが公開しているSEOのガイドラインです｡

コーダー､デザイナー､ディレクターなどWeb制作にかかわる人すべてに知っておいてもらいたい内容がまとめられています｡

集客手段としてGoogle検索をあてにせず､SNS(Instagram､Xなど)を使う場合は､気にしなくてもいいこともありますが､検索上位表示する裏技的なことだけでなくユーザーファースト､ユーザビリティを基本にしているので､知っておいて損はないと思います｡

ホームページ制作会社「BRISK」のブログに書かれた解説です｡

Webデザイナーさん必読です｡

Webデザイナーがこれを知っているか､知らないかでコーディングの手間が格段に異なります｡

知らないデザイナーさんは､Webで実現できないことに手間をかけていることが多いです｡
例えば､1文字ずつていねいにカーニングをするなど｡

日常的にコーダーからのフィードバックがあるデザイナー(制作会社)であればいいですが､そうでない場合はこの記事がコーダーの気持ちを代弁してくれていると思います｡

これを理解しデザインに反映することにより､コーディングの効率化､制作期間の短縮､更新しやすいコーディングをすることができます｡

コーディングの代行･外注をしている「クロノドライブ」がまとめているコーディングのガイドラインです｡

よくまとまっているので､個人的に参考にしています｡

自己流でコーディングしているコーダーや､コーディングの外注をコーダーにおまかせにしてしまっている制作会社は参考にしてみると､コーディング品質の向上､統一ができます｡

Webメディア「ジャム」のブログです｡

コーダーのなかでもアウトラインを意識してコーディングしている人のほうが少ないかもしれません｡

具体的には､見出しと内容を意識して､ひとつの見出しの内容はここからここまでということが一目でわかることが理想です｡

これはコーダーだけが知っていればいいというわけではなく､ディレクター､デザイナーも知っていないと､アウトラインを意識したコーディングができません｡

アウトラインを意識することで､デザインをコーディングしていく時点で､自然と目次ができあがっていきます｡

Chrome拡張機能のHTML5 Outlinerをインストールしておくと､かんたんにアウトラインを確認できるので便利です｡

ファビコンを知らない制作会社もあります｡

ブラウザのタブやデスクトップに表示される正方形サイズで表示されるアイコンです｡

デザイナーがつくっていない場合は､コーダーが勝手につくることもあります｡

ファビコンはフォーマットがたくさんあるので､いろいろなものやサイズに対応させたい場合はジェネレーター(Webツール)を使うとかんたんにできます｡

OGP画像を知らない制作会社もあります｡

かんたんにいうとSNS投稿にリンクを埋め込むときに表示される画像です｡

デザイナーがつくっていない場合は､コーダーが勝手につくることもあります｡

サイズは複数ありますが､基本ルールは決まっているので､より魅力的に見える､また､おかしなトリミングがされないようにデザインする必要があります｡

OGP画像シミュレータを使うと､つくったOGP画像がどのようにトリミングされるかがわかり便利です｡