Q&A
今現在，HTMLにてウェブサイトを制作しております．ページ数も多くなる予定なので，<header>や<footer>をJavaScriptを用いてインクルード化しております．そこで，<head>に書いているコードもインクルード化しようと考えておりますが，これがGoogleなどのSEOに影響がないかを懸念しております．
以下の方法を用いて<head>の一部をインクルード化しようと考えております．
（１）下記の方法を用いることにより，SEOなどに影響等がありますでしょうか．
（２）下記の方法を用いることにより，生じると考えられるリスク又はデメリットを簡易的にご教授して頂きたいです．
（３）その他，インクルード化を行う際に注意すべき点がありましたら，ご教授頂けると幸いです．
html
1<head> 2/* 以下のような重要なコード及びページによって異なるコードは，インクルード化せず，直接書く予定です．*/ 3<meta charset="utf-8" /> 4<title>タイトル</title> 5<meta name="description" content="○○について" /> 6/* 以下はインクルード化 */ 7<script type="text/javascript">head_link();</script> 8</head>
JavaScript
1// 以下のようなICON，CSS，JavaScriptなど全てのページ共通する部分は，インクルード化する 2function head_link(){ 3 var html = ""; 4 html += '<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />'; 5 html += '<link rel="stylesheet" type="text/css" href="style.css" />'; 6 html += '<script type="text/javascript" src="script.js"></script>'; 7 document.write(html); 8}
回答1件
0
ベストアンサー
（１）下記の方法を用いることにより，SEOなどに影響等がありますでしょうか．
document.writeを使っている時点でアウトです。
Googleどころか、W3Cが、非推奨としてるため、
全てにおいてマイナスになります。
別の手法を用いましょう。
（２）下記の方法を用いることにより，生じると考えられるリスク又はデメリットを簡易的にご教授して頂きたいです．
上記の通りですが、
質問者さんの手法にメリットは何もありません。
SEOどころかの観点から考えた時、
パフォーマンスが悪く、保守性が非常に悪いWeb標準外の手法なため、
よろしくありません。
現在のSEOでは、ページ表示のパフォーマンスは非常に重要な要素となります。
自作でインクルードを用いるなら、
DOMに関してもっと勉強し、
パフォーマンスが高い構文にできるようにましょう。
（３）その他，インクルード化を行う際に注意すべき点がありましたら，ご教授頂けると幸いです．
上記のように、自作でやるならDOMに関してかなり修練と経験が必要です。
それをやる自信がなければ、
素直に、既存のフレームワーク、
React.JSや、Vue.js、Angularなどを使いましょう。
少なくとも上記はSEOもしっかりとされるフレームワークです。
（構築さえしっかりすれば）
ただし、フロントフレームワークは、少々ハードルが高いので、習得には気力と時間は必要になります。
それでも、フレームワークを自作するよりは遥かに楽と言えます。
また、コメントでもいただいている通り、
クローラーロボットの全てが、JSを実行・解釈できるわけではなく、
上記フロントフレームワークも完璧とはいかないのが現状です。
よって、SEOを気にするのならば、
メタの記載は特に、サーバーサイドによっての出力が一番確実となります。
投稿2021/02/12 20:27
編集2021/02/15 17:17
総合スコア9555
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/02/12 20:44
2021/02/12 20:51
2021/02/13 01:39 編集
2021/02/14 07:57