ここのところ何度か目にしているので記事にしようと思います。
そのJSはちゃんと正しく動いていますか？
サービス自体がまだ有るのかどうか
JS = JavaScript
ページ上に何らかの動きをつける、あるいは他所のサーバーから情報を取得してくる、あるいはhtmlに書かれていない内容を書き出す、など。
FC2ブロガーさんがJSを追加する機会は アクセス解析 が多いのではないかと思います。
そのアクセス解析がFC2純正ではなく第三サービスのものであった場合、現在でもサービスが提供されているのか はチェックした方が良いですね。もしかしたら既に閉鎖しているかもしれません。
アクセス解析以外でも、例えば数年前は関連記事の取得に Google Feed API というのが汎く使われていましたが、GoogleがAPIの提供を終了しましたので現在では無効なJSとなっています。
Googleでも思い切ったサービス廃止を行うのですから、一般サービスも当然「終了」「撤廃」などは大いに可能性があります。
つか、アプリでもゲームでもブログサービスでもなんでもそうですよね (´・ω・｀)
ブラウザアドレスバーのスピナーのグルグルが終わらないのはJSエラーのサイン
絶対にJSだ、とは言いませんが、9割がたそうです。
「ページを読み込んでいますよ」という状況をお知らせしてくれるのが ローディングスピナー(円形) あるいは ローディングバー(棒状) なわけですが、これがいつまで経っても動いているような時はブラウザが「JSの解釈に相当苦労しているな」と思えば大体合ってます。
というか皆さんね、常にアドレスバーは気にしてくださいね ^^;
自身のブログのローディング異常に気がついていない、というのはアドレスバーを気にしていないからに他なりません。
SSL未設定の「保護されてない通信」にしてもそうです。
これに気づかないとなればもう「アドレスバーを見ていない」以外に考えられない(笑)
JSは並列処理ができない
例えば上から
aaa.js
bbb.js
ccc.js
と3つ並んでいた場合(html内の書き順・記述順序のことです)
仮に aaa.js が何らかの原因で「読み込みができない」とします。原因は「サービス自体の閉鎖」かもしれませんし、直書き(インライン, インターナル)なら「構文が正しくない」のかもしれませんし、外部ファイル化(エクスターナル)ならば「ファイル消失」かもしれませんしそれは不明ですがともかく何らかの異常があってブラウザ側が解釈できないとします。
まだ後続 bbb.js と ccc.js がありますが、aaa.jsの処理をしている間は後続のJS内容は手付かず です。
aaaにちょっと時間がかかってるから先にbbbをやっとくか…
といったことはできません。ですからaaaに時間がかかればかかっただけ、bbbもcccも解釈や実行が遅れることになります。
また、その対象JSがhtmlの中途にあった場合、つまり </body> の直前ではなく <head> 内やhtmlの中途にある場合などは、htmlのパースも中断される ことになります。
「ページ」の体をなす見た目はhtmlとCSSの仕事ですからhtmlのパースが遅くなれば「このページの表示は遅いなぁ」「なかなか表示されないなぁ」となるわけです。
JSをhtmlの最後方であるbody終了タグ直前にまとめる風潮はそのためです。htmlのパースを終えてからJSの仕事に入れば、目に見える内容は素早く届けられるというわけですね。
読み込めないJSをいつまでも頑張っても仕方がありませんので、通常は タイムアウト が設定されています。詠んで字の如く「時間切れ」の設定です。
タイムアウトを迎えるとそのJS解釈は強制終了し、次に進みます。
6秒から10秒といったところでしょうか。言い換えるとその6〜10秒経過するまで待たないとページ全体のローディングも終わらない、ということです。
で、アクセス解析の話しを出しましたけども、アクセス解析というのは通常htmlの前方に記しますよね。
ページを開いて即バック・即クローズされた場合でも足跡として取得できるように前方に記します。
ということは、アクセス解析にエラーがあった場合は？言わずもがなですよね。
aaaがアクセス解析、bbbがページ送り、cccがスライダーだとします。
その場合にはaaaのタイムアウトを迎えるまでページ送りとスライダーは表示が行われません。
実際に第三サービス製アクセス解析でローディングエラーになっている方からご相談があったのですが、サービス名をメモるのを忘れてしまいました ←
第三サービスアクセス解析を利用している、という方はこの機会に一度ローディングスピナーの状態をチェックしてみてください。
FC2ブロガーはスマホ版をもっと重要視すべき
スマホ版がおざなりになっている方が非常に多いのですが、今後最も重要視されるのはPCの見た目ではなくスマホでの見た目 です。
それがGoogleによる MFI(モバイル ファースト インデックス) です。
「サイトの顔はスマホ版」というわけです。
で、レスポンシブデザインを採用し、レスポンシブ設定(スマホ版「非表示」設定)も行っているという方は良いんですが、スマホ版を使用している方の場合(PCがレスポンシブデザインでもスマホ版を「表示」設定にしている方はこれに含みます)、PCテンプレートに何かを追加してスマホでもそれが必要ならばスマホ版のhtmlにも同じ作業を行うことになります。
ただし PC版とスマホ版は全く別のhtml, CSS, JS なのですから、PCで動作しているからといってスマホでも同じように動くとは限りません。
PCでしかまともに動かないJSならば採用しない 方が良いですね。だってみなさんの代表ページはスマホの方なんですから。
念の為ですが、レスポンシブテンプレート使用・レスポンシブ設定済 のユーザーさんはPCとスマホが同じhtml, CSS, JSですから、PCを大事にすることがそのままスマホを大事にすることに繋がります(例外はあります)のでご安心を。
いやホントにね、スマホ版のナビゲーションが展開できない人・ローディングが完了しない人とかすっごい居ますよ。気づいてないから直さないのでしょうが、閲覧者は気づいてます(笑)
それからSSL設定をONにした方はJSファイルがhttpsスキームになっているか確認を。httpスキームの場合は混在コンテンツなので そのJSは動きません。
スマホ版併用者はPCテンプレートとスマホテンプレート双方のチェックが必須です。
まとめ
原因の特定というのはなかなか難しいのですが、とりまスピナーのチェックをすることで「ブラウザが何かに苦しんでいる」という状況は察知できるかと思います。
その原因の大半はFC2ブログでは「JS」ですよ、ということですね。
テンプレートに何かを追加する際には、いくつかある追加事項をまとめて放り込むのではなく、ひとつ入れたら目視確認、次を入れたら目視確認、といった具合に一つづつ順を追ってください。まとめて一気にやってしまうと原因がわからなくなってしまいますよ。
There are no comments yet.