2009年11月21日
■JavaScript外部ファイル化の基準は「効率」。外部ファイル化で＜body＞出現位置を押上
テーマ：■共通＜SEO対策
HTMLファイルに記述したJavaScriptを外部ファイル化するかどうかの判断基準は「効率」で決めれば良い。
「何？JavaScriptの外部ファイル化はSEO対策の定石？」
確かに、JavaScriptの外部ファイル化はSEO対策の定石だ。
通常、HTMLにJavascriptを記述する場合、HTMLファイルの上部、つまり<head></head>内に記述する。
我々が普段目にするWebページは皆このHTMLファイルで出来ているが、ここでHTMLファイルの構造のおさらい。
<html>
<head>
</head>
<body>
</body>
</html>
HTMLファイルは<html>で始まり</html>で終わるファイルである。
<head></head>部分は人の目に触れる事の無い情報。
<body></body>部分は人の目に触れる情報。
単純にHTMLファイルを捉えるとこうなる。
私達が普段目にするブラウザ上のテキストはこのHTMLファイルの<body></body>部分に記述されている。
Javascriptは、この<body></body>部分より上部の<head></head>部分に記述される。
一応、誤解されないように申し上げておくが、<body></body>部分にもJavascriptは記述できる。
<head></head>部分への記述は実際こんな感じで行う。
<html>
<head>
<script type="text/javascript">
<!--
function msg() {
window.alert("Yahoo・GoogleのSEO対策業者と言えば？「SEO職人トンちゃん」");
}
//-->
</script>
</head>
<body>
</body>
</html>
Javascriptは<head>部分に記述するため、その分だけ<body></body>部分が押し下げられてしまうのが上記例から分かると思う。
検索エンジンはHTMLファイルの上部にくる情報ほど重視し、下部の情報ほど軽視するというSEO情報が事実である場合、当然Javascriptの記述により<body>部分が押し下げられた分だけ<body>セクションのテキスト情報は軽視される事になる。
検索エンジンがJavascriptの記述により、押し下げられた<body>セクションのテキストを軽視するのであれば当然、検索順位も落ちる事になる。
SEO対策は、「検索順位を上げる」為の対策である。
ゆえに、Javascriptは外部ファイル化し、<body>部分が押し下げられるのを防ぐのがSEO対策の定石として語られるわけだ。
「検索エンジンがHTMLファイルの上部ほど重視し、下部ほど軽視する」というSEO情報に関してトンちゃんも異論は無い。
細かい部分ではトンちゃんの見解は異なるが、大きく見ればまぁその通りだ。
検索エンジンから自ページが高く評価されるように、HTMLファイルの異物であるJavaScript等はドンドン押し出してしまえば良い。
JavascriptはHTMLファイルで無く、Javascriptファイルに記述すれば良いのだ。
基本的にHTMLファイル（.html）にはHTMLを、JavascriptはJavascriptファイル（.js）に、CSSはCSSファイル（.css）に記述すればそれ自体がSEO対策になると言える。
上記Javascriptの記述の例ならこうすれば良い。
先ず、Javascript部分を外部ファイル化する。
先ほどHTMLファイルに記述したJavascriptのソースをそのまま移動するだけである。
Javascriptファイルの例
function msg() {
window.alert("Yahoo・GoogleのSEO対策業者と言えば？「SEO職人トンちゃん」");
}
Windowsのメモ帳等に上記3行だけのファイルを作り、ファイル名javascript-seo-pig.jsで保存する。
保存する時は文字コードの指定もするわけだが、UTF-8にしておけば無難。
.jsファイルも.cssファイルも.htmlファイルも文字コードはUTF-8で統一するのがトンちゃん流。
.jsより前は自分で好きに決めれば良い。
seo-buta.jsでも何でも良い。
しかし、ファイル名の最後の.jsや.cssや.htmlはそのファイルが何のファイルかを示す為のものなので必ず付けねばならない。
Javascriptのファイルなら、ファイル名の最後に必ず.jsを付ける。
CSSのファイルなら、ファイル名の最後に必ず.cssを付ける。
HTMLのファイルなら、ファイル名の最後に必ず.htmlを付ける。
次は、上記のjavascriptのファイルをHTMLファイルと連結させて完成。
こうする。
<html>
<head>
<script type="text/javascript" src="javascript-seo-pig.js"></script>
</head>
<body>
</body>
</html>
Javascriptの記述が減った分だけ<body></body>部分がHTML上部に押し上げられた形だ。
これが、Javascriptの外部ファイル化と呼ばれるSEO対策である。
Javascriptの記述部分を外部に押し出した為、HTMLファイルが軽量化されシンプルになった。
SEO対策を意識するなら、HTMLファイル上のJavascriptソースはドンドン外部に押し出すべきだ。
しかし、JavaScript外部ファイル化にこだわってホームページ制作等の「効率」まで犠牲にする必要は無いと思う。
ちょっとしたJavascriptの記述ならHTMLファイルで済ませてしまえば良い。
そのほうが、ホームページ制作を効率的に行えるからだ。
小さなJavascriptの記述の為にJavascriptファイルを作るのは手間である。
その時間で被リンクを一本獲得したほうがよっぽど検索順位は上がる。
Javascriptファイルの外部ファイル化をするかどうかの判断基準は「効率」で決めれば良い。
Javascriptの記述が長文になりそうなら、SEOを考慮して迷わず外部ファイル化。
ちょっとしたJavascriptのソースならそのままHTMLファイルに直接記述すれば良い。
その程度で検索順位がどうこうの問題にはならないので。
貴方にたっぷり時間があるなら、CSSもJavascriptも全て外部ファイル化すれば良い。
トンちゃんは限られた時間の中で結果を出さねばならないので「効率」で外部ファイル化するかどうか判断するが。
「何？JavaScriptの外部ファイル化はSEO対策の定石？」
確かに、JavaScriptの外部ファイル化はSEO対策の定石だ。
通常、HTMLにJavascriptを記述する場合、HTMLファイルの上部、つまり<head></head>内に記述する。
我々が普段目にするWebページは皆このHTMLファイルで出来ているが、ここでHTMLファイルの構造のおさらい。
<html>
<head>
</head>
<body>
</body>
</html>
HTMLファイルは<html>で始まり</html>で終わるファイルである。
<head></head>部分は人の目に触れる事の無い情報。
<body></body>部分は人の目に触れる情報。
単純にHTMLファイルを捉えるとこうなる。
私達が普段目にするブラウザ上のテキストはこのHTMLファイルの<body></body>部分に記述されている。
Javascriptは、この<body></body>部分より上部の<head></head>部分に記述される。
一応、誤解されないように申し上げておくが、<body></body>部分にもJavascriptは記述できる。
<head></head>部分への記述は実際こんな感じで行う。
<html>
<head>
<script type="text/javascript">
<!--
function msg() {
window.alert("Yahoo・GoogleのSEO対策業者と言えば？「SEO職人トンちゃん」");
}
//-->
</script>
</head>
<body>
</body>
</html>
Javascriptは<head>部分に記述するため、その分だけ<body></body>部分が押し下げられてしまうのが上記例から分かると思う。
検索エンジンはHTMLファイルの上部にくる情報ほど重視し、下部の情報ほど軽視するというSEO情報が事実である場合、当然Javascriptの記述により<body>部分が押し下げられた分だけ<body>セクションのテキスト情報は軽視される事になる。
検索エンジンがJavascriptの記述により、押し下げられた<body>セクションのテキストを軽視するのであれば当然、検索順位も落ちる事になる。
SEO対策は、「検索順位を上げる」為の対策である。
ゆえに、Javascriptは外部ファイル化し、<body>部分が押し下げられるのを防ぐのがSEO対策の定石として語られるわけだ。
「検索エンジンがHTMLファイルの上部ほど重視し、下部ほど軽視する」というSEO情報に関してトンちゃんも異論は無い。
細かい部分ではトンちゃんの見解は異なるが、大きく見ればまぁその通りだ。
検索エンジンから自ページが高く評価されるように、HTMLファイルの異物であるJavaScript等はドンドン押し出してしまえば良い。
JavascriptはHTMLファイルで無く、Javascriptファイルに記述すれば良いのだ。
基本的にHTMLファイル（.html）にはHTMLを、JavascriptはJavascriptファイル（.js）に、CSSはCSSファイル（.css）に記述すればそれ自体がSEO対策になると言える。
上記Javascriptの記述の例ならこうすれば良い。
先ず、Javascript部分を外部ファイル化する。
先ほどHTMLファイルに記述したJavascriptのソースをそのまま移動するだけである。
Javascriptファイルの例
function msg() {
window.alert("Yahoo・GoogleのSEO対策業者と言えば？「SEO職人トンちゃん」");
}
Windowsのメモ帳等に上記3行だけのファイルを作り、ファイル名javascript-seo-pig.jsで保存する。
保存する時は文字コードの指定もするわけだが、UTF-8にしておけば無難。
.jsファイルも.cssファイルも.htmlファイルも文字コードはUTF-8で統一するのがトンちゃん流。
.jsより前は自分で好きに決めれば良い。
seo-buta.jsでも何でも良い。
しかし、ファイル名の最後の.jsや.cssや.htmlはそのファイルが何のファイルかを示す為のものなので必ず付けねばならない。
Javascriptのファイルなら、ファイル名の最後に必ず.jsを付ける。
CSSのファイルなら、ファイル名の最後に必ず.cssを付ける。
HTMLのファイルなら、ファイル名の最後に必ず.htmlを付ける。
次は、上記のjavascriptのファイルをHTMLファイルと連結させて完成。
こうする。
<html>
<head>
<script type="text/javascript" src="javascript-seo-pig.js"></script>
</head>
<body>
</body>
</html>
Javascriptの記述が減った分だけ<body></body>部分がHTML上部に押し上げられた形だ。
これが、Javascriptの外部ファイル化と呼ばれるSEO対策である。
Javascriptの記述部分を外部に押し出した為、HTMLファイルが軽量化されシンプルになった。
SEO対策を意識するなら、HTMLファイル上のJavascriptソースはドンドン外部に押し出すべきだ。
しかし、JavaScript外部ファイル化にこだわってホームページ制作等の「効率」まで犠牲にする必要は無いと思う。
ちょっとしたJavascriptの記述ならHTMLファイルで済ませてしまえば良い。
そのほうが、ホームページ制作を効率的に行えるからだ。
小さなJavascriptの記述の為にJavascriptファイルを作るのは手間である。
その時間で被リンクを一本獲得したほうがよっぽど検索順位は上がる。
Javascriptファイルの外部ファイル化をするかどうかの判断基準は「効率」で決めれば良い。
Javascriptの記述が長文になりそうなら、SEOを考慮して迷わず外部ファイル化。
ちょっとしたJavascriptのソースならそのままHTMLファイルに直接記述すれば良い。
その程度で検索順位がどうこうの問題にはならないので。
貴方にたっぷり時間があるなら、CSSもJavascriptも全て外部ファイル化すれば良い。
トンちゃんは限られた時間の中で結果を出さねばならないので「効率」で外部ファイル化するかどうか判断するが。
