SEO対策、WEBサイト(ホームページ)の作り方、そして時々柴犬と愛媛県

ヘッダー情報(head):HTMLリファレンス

文字化け対策

meta charset=”文字コード”

重要度★★★★★
文字コードの指定となります。英語のみのサイトならほぼ問題ありませんが、日本語の場合ファイルの保存形式などと矛盾があると思いっきり文字化けしますので、外せない記述となります。よくあるのはshift-jisですが僕はutf-8で統一しています。

記述例
<meta charset="UTF-8" />

meta charset=”文字コード”
でOKです。個人的にはutf-8が無難なような気がしますが、もし作ったサイトが文字化けする場合ここが原因なので、他の文字コードなどで試してみてください。

 

IEのバージョンによるレイアウト崩れ対策

meta http-equiv=”X-UA-Compatible” content=”IE=edge”

重要度★★★

コーダー泣かせのIE(インタネットエクスプローラー)用の記述です。IEの互換機能などによるレイアウト崩れを防ぐために、”IE=edge”と記述することにより最新のバージョンでの表示を行います。IE=数字でIEのバージョンに合わせた表示も可能ですが、この記述はcssやjavascriptの呼び込み前に記述してやる必要があります。変な小細工はせずにこのままコピペして記述したのでよいでしょう。

記述例
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

とりあえず上のソースそのまま入れとくといいかと思います。

 

スタイルシートの外部からの読み込み

link type=”text/css” rel=”stylesheet”  href=”読み込むスタイルシートの場所”

重要度★★★★
スタイルシートを外部化している場合の、外部からの読み込み方法となります。複数記述することも可能です。

記述例
<link id="master" media="all" type="text/css" 
href="http://kishinoko.lovepop.jp/wp-content/themes/wpboot/css/master.css" rel="stylesheet">

idやmediaや特に必須項目ではありませんので省略可能です。

ここで重要なことが何点かあります。
複数のCSSがある場合、一つのCSSでそれらのファイルをインクルードしてきて読み込む方法もありますが、読み込み速度の関係上、それぞれ個別に読み込んだほうが早いと言われてます。また別のCSS内で同じ要素を指定してしまった場合、後から読み込んだCSSのほうが優先されますので、一番重要でよく弄るようなCSSは最後に読み込むといいでしょう。