ラベル(SEO対策)が付いた投稿を表示しています すべて表示

Bloggerの投稿画像の自動的な遅延読み込みを確実に行うためのプログラム

イメージ

Bloggerの投稿画像を HTMLのloading-lazy で自動化するプログラムを紹介したけれども動作を詳しく調べた結果、AndroidのChromeで初回画面から2000pxくらい下の画面外の画像しか遅延読み込みが発動しなかった。さらにYouTube動画を止めることは全くできなかった。ブラウザの対応状況はどれも同じではないと聞くけれどもたぶん大きな違いはないかも知れない。 何れにしてもHTMLのloading-lazyによるブログの表示速度の高速化は非常に限定的だと分かったので、もはや元々の JavaScriptのIntersection Observer API を再び使って画面外の画像や動画を確実に止めてパフォーマンスをきっちり上げるためのプログラムへの書き換えを追加したくなった。 合格した監査|PageSpeed Insights PageSpee…

Bloggerの記事/追加ページの投稿画像にWebPのrwを自動的に付けるプログラム

イメージ

Bloggerで取得した画像URLに 画像パラメーターのrwを追加する と画像データを軽量化したWebP画像に変換することができる。特にjpg/jpeg画像の場合に効果が大きいようだけれどもブログの画像の表示速度を高めることに繋がる。 記事/追加ページの投稿画像に画像パラメーターのrwを自動的に付けるプログラムを開発したので、無料で提供する。 JavaScriptで記事の本文の全ての表示を止めてから投稿画像に画像パラメーターを自動的に付けて出すことになる。便利だけど、その分、投稿画像を含めた記事の本文の全ての表示速度は遅れる、ほんの僅かだとしても投稿時に画像パラメーターを手動で付けておくよりも決して速くならないことに注意して欲しい。 そしてHTMLだけで記事の本文の全てを表示しないことはGoogle検索などの読み込みを劣らせるかも知れないので、 SEO(検索エ…

Bloggerの記事/追加ページの投稿画像にloading-lazyを自動的に付けるプログラム

イメージ

以前、取り上げた 画像の遅延読み込みのloading-lazy をBloggerの記事/追加ページの投稿画像に自動的に付けるJavaScriptプログラムを開発したので、無料で提供する。 画像のある記事/追加ページの本文を全てJavaScriptで止めてから書き出すことになるので、その分だけ表示速度が遅れる。そしてHTMLだけの場合と比べてGoogle検索などの読み取りが全く劣らないとはかぎらない。年々、向上して今では殆ど差がないといわれるから大丈夫かも知れないけれども念のために注意しておきたい。デザインは変わらず、表示速度が速くなる分は有利(画面外の画像が多いほどに遅延読み込みの効果が大きい)だとしてもGoogle検索などからサイト評価が上がって訪問者が増えるかどうかは分からないので、ブログのアクセスアップに SEO(検索エンジン最適化)対策を考える場合 …

構造化データのArticleのauthorにurlを追加してリッチリザルトの警告を消す方法

イメージ

以前は大丈夫だったけれどもGoogleの構造化データの リッチリザルトテスト でブログをチェックするとauthorのurlの項目がないために警告が出されてしまった。 今年の8月6日にArticleのauthorの「url プロパティは、Google が記事の執筆者を明確化するのに役立ちます」( 最新ドキュメントの更新内容 )としてリッチリザルトの推奨項目に追加されたためだ。 たとえリッチリザルトが有効でもしっくり来ないから新しく修正しなくてはならないと感じる。 authorのurlを構造化データに追加する 些細な日常|リッチリザルトテスト JSON-LDでのauthorのurlの記載 microdadaでのauthorのurlの記載 RDFaでのauthorのurlの記載 Articleのリッチリザルトの従来の条件( Google 検索セントラル )に加えて推奨項目まで的…

サイトのGoogle検索へのインデックスを向上して検索結果に表示し易くしよう

イメージ

サイトがGoogle検索に表示されない原因は大きく分けて二つある。 一つはインデックスされず、Googleにサイト内容が把握されてない。もう一つはランキングが低く、インデックスされたページがあってもサイト評価が低くて検索結果の順位を落とされるか消されている。 ランキングの向上に関しては余りはっきりしたことはいい難いし、Google検索のサイト評価がどのように行われるかはGoogleの関係者も分からないくらい複雑怪奇な面がある。個人的に 公式の検索エンジン最適化(SEO)スターターガイドが最も信頼できる と思う。ランキングの方向性(何が良くて何が悪いか)がGoogle検索の視点から示されているからたとえランキングが更新されても付いて行けるようなサイト運営が可能になるに違いない。 本稿ではインデックスの向上を考える。ランキングと違って決められたことをやれば大丈夫…

アドセンスの自動広告でSearch Consoleのモバイルユーザビリティの問題が出た

イメージ

ブログにSearch Consoleのモバイルユーザビリティの赤い文字のエラーで、モバイルユーザビリティの問題として「コンテンツの幅が画面の幅を越えています」というのが出た。 モバイルユーザビリティ| Search Console 問題のページは一つだけで、確認してみるとスマホで画像などのコンテンツの一部が画面の端から抜けてしまっていて正しく、エラーの文言の通りの状況だった。 このエラーは、ページの CSS 宣言で絶対値を使用している場合や、ページの画像が特定のブラウザ幅(980px など)で最適に表示されるように設計されている場合に発生します。このエラーを修正するには、ページの CSS 要素に対して相対的な幅と位置の値を使用し、画像も同様にスケーリングできるようにします。 モバイル ユーザビリティ レポート| Search Console ヘルプ 原因として直…

Search ConsoleでURL検査のライブテストのスクリーンショットが途中で切れる

イメージ

Search Console が去年から大きく改変されて少しずつ機能を引き継ぎながら一年かがりで漸く以前のバージョンと遜色がないくらいまで辿り着いたところだけれどもとても気がかりな部分が一つある。ブログのURL検査のライブテストのスクリーンショットが途中で切れるから Google検索 での状況に悪影響を及ぼさないともかぎらないという。 以前のバージョンではFetch as Googleからのスクリーンショットに何の問題もなかったし、新しいバージョンでURL検査に作り替えられたゆえのバグかも知れないにせよ、Google検索にブログのサイト内容が十分に読み込まれないせいだとしたらサイト評価が下がってアクセスが減るのは間違いないと悲しまざるを得ないんだ。 URL検査|Search Console URL検索からページをチェックしてエラーがなければ「公開URLをテスト…

Bloggerの投稿の投稿の設定:ラベルとスケジュール/公開とパーマリンクと検索向け説明と場所とオプションについて

イメージ

Bloggerの投稿のHTMLモードの使い方

イメージ

Bloggerのウェブの記事/追加ページの投稿(編集)のHTMLモードはページのHTMLを扱える機能だ。HTMLとはHyperText Markup Language(ハイパーテキストマークアップランゲージ:超越文書記述言語)の頭文字四つで、ブログなどのウェブサイトをブラウザに表示するために使われるものなんだ。ブログの記事の投稿でも使ってページをどのように構成するかを個別にカスタマイズできるようにするのがHTMLモードの最大の特徴になる。 追記:2020年9月から投稿画面が変わり、投稿モードはメニューの左端の項目で「HTMLビュー」と「作成ビュー」と呼ばれて区別されるようになった。 投稿のHTMLモードの入力画面 via Blogger 通常の作成モードはプレーンテキストで入力可能で、何でも書き込んだまま、ブログに表示される。さらに入力画面にコンテンツや…