ヘッダをJavaScriptで追加する方法

質問

個人のWebサイトを運営している者です。

今まですべてのページのヘッダにナビゲーションバーを逐一記述していたのですが、これだとコンテンツの追加・削除があるたびにすべてのページのナビゲーションバーを書き直さないといけないのでめんどうです。
SSIを使えばよいのでしょうが、私が借りているサーバはSSIやCGIが使えないので、JavaScriptで代用できないものかと考えています。

JavaScriptのdocument.createElementを使えばタグの追加はできるようですが、HTMLの追加はできるのでしょうか？

ちなみに、ナビゲーションバーは
<div id="header">
<ul>
<li><a href="aaa.html">あああ</a></li>
（中略）
<li><a href="iii.html">いいい</a></li>
</ul>
</div>
という感じです。

回答No.5

tracer

No.3です。
私が書くべきことは、No.4さんが簡潔にまとめられておりますが、ひとつだけ補足しますと、SEOは、直接的にアクセスを増やすためのものではなく、検索結果上位を獲得するための方法論でもなく、単に検索エンジンにサイトの構造を正確に渡すためのものだと認識しています。SEOという言葉を使った私が悪かったのかもしれませんね。ともあれ、検索エンジンにサイト構造を渡す必要がないサイトであれば、考慮する必要もありません。

回答No.4

mohumohu23

＞DreamWeaverというソフトウェアは使用したことがないのですが、調べたところ、ナビゲーションバーをテンプレートとして登録しておけば、すべてのページに一括してテンプレートを適用できるという感じなのでしょうか。

ここにこのテンプレ埋める。と、コードに入れることでプレース指定することができる。

＞> SEOの効果がなくなりますよ？
これは、JavaScriptにナビゲーションバーを記述すると、HTMLソースからサブページへのリンクや名前がなくなってしまうからですよね？
確かにSEO効果は失われますが、ナビゲーションバーってSEOではなくアクセシビリティのためのものではないでしょうか？
ナビゲーションバーにそこまでSEO効果があるとも思えませんし。

seoてのは、ボットがサイトをクロールするときに、リンクを辿って行くのですから、もしそのナビゲーションとされる物以外にそこにたどり着くリンクが無ければ辿りつけない。
そうすると場合によってはトップページ以外全く評価されない。ということになるので。
当然ｓｅｏに響きます。

回答No.3

tracer

JavaScriptでできますが、その部分に関してはSEOの効果がなくなりますよ？
No.1さんがおっしゃってるように、サーバーでできないなら、HTMLを書いているソフトウェアの機能を使えばいいと思います。たとえば、DreamWeaverにはテンプレートという機能があります。

お礼

回答ありがとうございます。
No.1さんと同様の回答のようなので、こちらでまとめてお礼申し上げます。

DreamWeaverというソフトウェアは使用したことがないのですが、調べたところ、ナビゲーションバーをテンプレートとして登録しておけば、すべてのページに一括してテンプレートを適用できるという感じなのでしょうか。

> SEOの効果がなくなりますよ？
これは、JavaScriptにナビゲーションバーを記述すると、HTMLソースからサブページへのリンクや名前がなくなってしまうからですよね？
確かにSEO効果は失われますが、ナビゲーションバーってSEOではなくアクセシビリティのためのものではないでしょうか？
ナビゲーションバーにそこまでSEO効果があるとも思えませんし。

回答No.2

yambejp

その内容であればajaxで処理するのが簡単かも

お礼

回答ありがとうございます。
ajaxについて調べてみましたが、確かにこれを使ったほうが簡単かもしれません。

回答No.1

dscripty

サーバサイドでジェネレートできないならローカルでジェネレートしたファイルをサーバにコピーするといいと思う。