ホームページの作り方(HP作成法)を解説

ホームページの作り方(HP作成法)

アクセス解析の導入

昔はninjaツールを筆頭に外部の解析ソフトを使用するのがメジャーでしたが、画面4隅のどこかに必ず小さな広告が入ってしまうデメリットがありました。

今はGoogleAnalyticsの独壇場となっているのが現状です。

無料で利用できる上、広告も入らず、何よりも性能に優れているのだからこれを選ばざるを得ないといえるでしょう。

GoogleAnalytics

アカウントを取得しログインしたら、アナリティクス設定→トラッキング情報→トラッキングコードを取得→全ページに貼り付けます。

javascriptの記述場所

GoogleAnalyticsのトラッキングコードはjavascriptとしてサイト内に埋め込みます。

<!-- HTML -->
<!-- scriptで囲んだ空間はjavascript空間となる -->
<script type="text/javascript">
var a = 0;
document.write(a);
</script>

<!-- 上の囲んだ領域をabc.js(外部ファイル)に記述しそこから読み込む方法 -->
<script type="text/javascript" src="abc.js"></script>

htmlへのjavascript埋め込みは昔head内にと習ったものですけど、今は違います。描画速度を重視するため、</body>直前におくことが多いです。

ブラウザがHTMLファイルをレンダリングするときに、途中にscript文があるとそれを実行しながら(またはそれをjsファイルに読み込みに行きながら)ウェブサイトを描画します。そのため、jsファイルが重いファイルだったとしたら、その行の後に記述されているhtmlの文章はいつまでたっても表示されず、ブラウザは白い画面で固まってしまいます。

それを防ぐため、まずはhtmlのレンダリングを先に行い、ブラウザの描画が完了した後にjsファイルを読み込むといった方法が主流となっています。

特にアクセス解析のようなサイトの描画にまったく関係ないようなjsファイルをhead内で読み込んでしまえばサイト描画が遅くなるだけですので、</body>直前がいいです。

逆に、サイト描画に影響を与えるjsファイル(jsを利用して色を変えたり、文字を表示させるような場合)はhead内で読み込むことが推奨されます。後はスコープや関数リテラル文での定義を考慮する場合等。

ページトップへ