ブラウザの広告ブロックを検出してサイトのコンテンツをブロックするJavaScriptプログラム
今年の二月からアドセンスの収益化の方式がサイト広告のクリック課金からインプレッション課金に変更された。これにより、広告ブロックのブラウザが多くのサイトで、直接、減益を齎すようになっている。つまり サイト広告を表示しないことはアドセンスを始めとしたインプレッション課金の収益化を妨害していることに他ならない。 理想的にいえ…
Googleの2024年3月のコアアップデート
今月五日にGoogleの検索アルゴリズムを根本的に改変するコアアップデートが開始された。普段ならば二週間で終わるものが一ヵ月くらいかかると発表されて大掛かりだと驚かされた。 Googleが複数のシステムで役立つコンテンツを評価する 私たちは信頼できる情報を特定するために複数のシステムを用いるのと同様に革新的なシグナルとア…
サイトのコンテンツの位置を変更するJavaScriptプログラム
サイトのコンテンツの配置を決めた後に上から下へ、あるいは下から上へ移動して元々の位置を変更するための方法としてJavaScriptプログラムを紹介する。 コンテンツの位置変更のソースコード プログラムの内容について 元の場所にあるコンテンツをHTMLのhidden属性で、非表示にしておいてブラウザが全て読み込んた後に当のコ…
2023年9月のヘルプフルコンテンツアップデートでブログのアクセスが落ちた原因を考える
先月の9月14日から28日にかけて行なわれたGoogleのヘルプフルコンテンツアップデートで、ブログのアクセスが、三割以上、落ちてしまった。 ブログのGoogle検索によるアクセスダウンの状況 悲しいブロガー by 結城永人 Search Consoleで調べるとGoogleの検索結果でのブログの表示回数が、三割、落ちいて…
サイトのアクセスの平日と土日祝日（正月休み・ゴールデンウィーク・盆休み）の増減について
ブログのアクセスがゴールデンウィークに入ったら三割くらい落ちて 死に損ないブロガー に逆戻りと ヴィヨンの 首吊り人のバラード が聞こえて来るような感じがして本当に参った。 日によってサイトのアクセスが増減することがある 参考書を持ってほほえむ女子高生 by まんだむ Google検索からのアクセスが普段よりも多く落ちていることが直…
サイトのCLSがJavaScriptで後から挿入するコンテンツによって上昇するのを防ぐにはどうするか
サイトのHTMLに最初から記載されてないコンテンツを後からJavaScriptで挿入するとそのときにページが新しいスペースを取られて動いてしまう。初回画面だと既存のコンテンツが押し下げられるのが、一瞬、見えたりもするけど、これがサイトのCLS（Cumulative Layout Shift／累積的な配置の変動）を上げ…
position:fixedのコンテンツの横幅を指定する方法
テンプレートの Imaginary theme にポップアップの表示を付けようとしてCSSのposition:fixedを使おうとしたら横幅が画面から突き抜けてしまって困った。 調べるとposition:fixedのコンテンツの位置指定の基準が普通とは異なることに起因している。 固定位置指定は絶対位置指定に似ていますが、要素…
HTMLのemとstrongとiとbの使い分けについて
サイト作成でHTMLのemとstrongはHTML5／Living Standardで強調と重要性の違いがあるもののどちらも使い方が似ていて分かり辛い。そして初期のデザインが斜体と太字なのがそれぞれにiとbと同じなので、見た目からどちらを使っても良いのかと混乱してしまう。 em／強調タグとは何か strong／重要性タグ…
Dropboxで直リンクのURLを取得する方法
iframeの縦横比を一発でレスポンシブに指定できるaspect-ratio
サイトで他のページを表示するiframeタグはYouTubeの埋め込み動画などで良く使われるけれども画像のimgタグと異なり、コンテンツの縦横比をレスポンシブで維持することができない。なのでデバイスの画面幅に一杯で表示するようにすると訪問者の異なるデバイスの画面幅によってコンテンツの縦横比が変わってしまうのが厄介だっ…
サイトのGoogle検索へのインデックスを向上して検索結果に表示し易くしよう
サイトがGoogle検索に表示されない原因は大きく分けて二つある。 一つはインデックスされず、Googleにサイト内容が把握されてない。もう一つはランキングが低く、インデックスされたページがあってもサイト評価が低くて検索結果の順位を落とされるか消されている。 ランキングの向上に関しては余りはっきりしたことはいい難いし、G…
無限スクロールを作成する：JavaScriptのIntersection ObserverにFetchを組み込んだプログラム
サイトの無限スクロールのプログラムのアイデアは大きく二つの部分に分けられる。一つは要素判定で、今のページが画面のどこまで来たら次のページを表示するように動作するかを決める。もう一つは生成処理で、次のページをAjax通信でサーバーから読み込んで今のページに実際に追加する。JavaScriptのプログラムで前者に正しく画…
iframeタグのコンテンツの画像比をCSSのcalc()でレスポンシブに整える
HTMLのiframeタグのコンテンツは画像比がデバイスの画面幅に レスポンシブ で統一できない。およそスマホで画面の横幅一杯に表示したりすると縦幅が変わらないためにコンテンツの画像比が変わってしまうのが厄介なんだ。YouTubeやドライブなど、Webサービスの埋め込みコードにはiframeタグが良く使われるけれども画面…
CSSのpositionのstickyでコンテンツをサイトの一定の範囲内にフローティングする
ブログの記事／追加ページの本文の右下に フローティングの戻るボタン を付けた。 当初、方法は分かったけれども画面のスクロールからアドセンスのサイト広告に重なるとポリシー違反の恐れがあるので、用心してやらなかったんだ。 ところが記事／追加ページの本文のところだけとかアドセンスのサイト広告を避けられるブログの一定の範囲内に表示す…
JavaScriptの画像などの読み込みが遅い場合に使いたいpreloadのソースコード
ボタンで複数の画像を切り替える方法 をやってみたら二枚目以降の画像の読み込みが遅くて参った。何とかならないかと調べてみたらHTMLの「rel="preload"」を使うと助かると分かった。ファイル毎のブラウザの先読みを可能にするからJavaScriptで後から必要な画像などが直ぐに表示できるようにな…
JavaScriptの繰り返しボタン：押した回数を数えて実行結果を元に戻すプログラム
サイトのボタンはHTMLのinputやbuttonとJavaScriptのonclickを組み合わせて実装できる。後者のプログラムが前者を押して発動するようになる。JavaScriptのonclickはイベントハンドラと呼ばれてHTMLのinputやbuttonの開始タグに他の属性と同じように記載すれば機能する。 on…
