SyntaxHighlighterの読込みを最適化する 2019/05/212020/06/24SyntaxHighlighterの読込みを最小限にします。概要は次の通りです。 <pre> なしならば読み込まない 必要なブラシは、最低限読み込む 遅延読込みも合わせて更に高速化する 元ネタは、下記の記事です。不必要な強い同期処理を簡易なものに置き換えてます。その他...
初回ユーザイベントで発火する:onLazy.js 2019/05/202020/06/24関数の遅延呼び出しです。loadイベント以降の、初回ユーザイベント後に発火します。各種遅延読み込みのトリガーとして利用することを想定しています。 仕様 lazy のカスタムイベントを発信します loadイベント以降の初回ユーザーイベントの後で発火します loadイベント以前にユー...
ウェブページのページ表示速度を高速化する 2019/05/182020/03/16Bloggerの表示速度を高速化する からウェブページ共通の部分を分離しました。 ウェブページが早くなる(遅くなる)要素 HTML解析 HTMLファイルを解析して表示するページを作成します これが終わらないとページは表示されません これを最速で行うことが一番重要です レイアウト時...
Bloggerの空テンプレートを作成する 2019/05/172020/03/07Bloggerの自作テンプレート作成に向けての第一歩です。 空テンプレート Bloggerテンプレートの最小構成です。 空テンプレートの基準は以下の通りです。詳しくは参考の資料を参照してください。 <b:skin> を含む <b:section> を含む ...
画像のないimgタグのSEO対策 2019/05/152020/03/22画像のない <img> のSEO対策です。 問題 画像のない <img> を配置して、alt属性がないと警告を受ける。画像には、alt属性を付けましょう…。 だが、alt属性をを付けるとalt属性の文字列が表示されてしまう。alt属性の文字列が画面上に表示...
FontAwesome を SVG で使用する【JavaScript なし】 2019/05/102023/03/14はじめに 「FontAwesome を JavaScript なしで使用する方法」または、「FontAwesome の一部のアイコンを使用する方法」です。 JavaScript 無効環境で FontAwesome を使用したページを閲覧すると文字化けしたような表示になるのを目にし...
動的読込みのGoogleAdSense広告のブロックを判定する 2019/05/062020/04/20Google AdSenseの遅延読込みでページ表示速度を改善 の記事で書いたスクリプトの追加機能です。 当ブログでは、関連記事をGoogleアドセンスの関連コンテンツに依存しています。そのため、広告をブロックされると関連記事が表示されず、ユーザのサイト内周遊に大きな問題が発生し...
GoogleAdSenseの遅延読込みでページ表示速度を改善 2019/05/022021/08/04GoogleAdSenseの読込みの遅さを改善する。 問題点と目標 問題点 GoogleAdSenseは、JavaScript/画像/フォント/設定ファイルなどの複数データを読込むため、非常に低速です。そのため、広告を導入したページは、広告のないページに比べてページ表示速度が低速...
Bloggerの投稿とページについての忘却録 2019/04/112020/04/25Blogger投稿とページ関連の忘却録です。 URL Blogger投稿のURL例 http://bugbugnow.blogspot.com/2019/04/blog-post.html http://bugbugnow.blogspot.com/yyyy/MM/blog-ti...
ブログカードジェネレータを作ってみた 2019/01/032020/02/29 完成品 ブログカードジェネレータ https://www.bugbugnow.net/p/app-blogcard-generator.html 機能 指定URLからOGP情報を取得する 指定の情報からブログカードを作成する サンプル ...
GoogleAppsScriptでお問い合わせフォームを作成する 2018/11/222020/10/07GoogleAppsScriptでお問い合わせフォームを作成する。 概要 GoogleAppsScriptを使用して、自由な外観のお問い合わせフォームを作成する サーバレスでお問い合わせフォームを作成する お問い合わせフォームにはJavaScriptが不要 ただし、GoogleA...
怪しげなサイトの大量のトラフィックを調べてみた 2018/09/292020/10/06怪しげなサイトから当サイトに大量のアクセスがあったので調べてみた。 状態 以下のサイトを参照元にするトラフィックが大量に発生する。 ただし、 /h/(数字列).html へのアクセスでページは存在しないため404エラーのページを表示している。しかも、流入してくるのは海外からのアク...
簡易にGoogleAnalyticsを使用する 2018/08/122020/10/07本記事の対象者 少しでもサイトを高速化したい人 Google Tag Manager(gtag.js)を使いたくない人 Google Analytics(analytics.js)のサンプルコードが欲しい人 タグマネージャーを使用しない理由 タグマネージャー( gtag.js )...
Bloggerのコメント欄を改善する 2018/08/112020/10/06この記事は、既に最新ではありません。最新の関連記事は、「 Blogger用の関連記事表示機能:FeedRelatedPosts.js 」を使用しています。 「 Bloggerに関連記事を表示する 」の続きです。 「A Simple Related Posts Widget For...
Bloggerの表示速度を高速化する 2018/08/082021/12/03忘却録です。Bloggerの高速化です。 結果 次の結果になりました。画像が古いため、現在は更に高速化しているはずです。 PageSpeed Insights GTmetrix Lighthouse (Audits) ウェブページ共通の高速化 長くなったため、記事を分割しました。...
Bloggerの関連記事表示を強化する 2018/07/232020/03/21この記事は、既に最新ではありません。最新の関連記事は、「 Blogger用の関連記事表示機能:FeedRelatedPosts.js 」を使用しています。 「 Bloggerに関連記事を表示する 」の続きです。 「A Simple Related Posts Widget For...
BloggerのHTTP/HTTPS共存で躓いたこと(canonical) 2018/07/062019/01/08注意:本記事は、問題解決を諦めた経緯を記載します。問題は解決されておりません。 問題は解決しました。 うまくいかなかったこと Bloggerの独自ドメインでHTTPS設定ができるようになりました。なので、HTTPS設定したのですが、サーチコンソールで確認するとアクセスの殆...
Bloggerのサイトマップ(投稿一覧)を自動作成する 2018/07/012020/10/06完成品 サイトマップ 作成目的 ブログ全体に存在する記事/ページを簡易表示したい。ブログの全体を簡易に閲覧可能なページを作成したい。ただし、記事作成毎に更新するのは大変なため、自動更新としたい。 作成経緯 Blogger 記事 を 一覧 表示 する ページ の 作成方法 - ga...