タグ

ブックマーク / www.suzukikenichi.com (5)

  • Chromeがネイティブlazy-loadをサポート、JSなしで画像を遅延読み込み可能に

    [レベル: 上級] Google Chrome 76 がネイティブ lazy-load をサポートするようになりました。 JavaScript のライブラリを利用することなく、ブラウザの標準機能として画像の遅延読み込みが可能になります。 ネイティブ lazy-load は開発版 Chrome (Canary) で試験運用されていました。 自動で遅延読み込み 次の動画は子の画像だけを掲載したデモ用ページをスクロールした様子です。 デベロッパーツールの Network パネルで見ると、スクロールに応じて画像が順に読み込まれているのがわかります。 この遅延読み込みは JavaScript で実装しているわけではなく、Chrome の標準機能として実装された lazy-load の機能で実現しています。 loading 属性でネイティブ lazy-load ネイティブ lazy-load を利用

    Chromeがネイティブlazy-loadをサポート、JSなしで画像を遅延読み込み可能に
  • PWA版Googleマップが正式公開、ネイティブアプリ不要になる日がGマップにも来るのか?

    [レベル: 上級] PWA 版の Google マップが正式にリリースされました。 新興国で販売されている低スペックのスマートフォンでも無理なく動く軽量版として、PWA 対応したウェブサイトの Google マップを Google は試験的に公開していました。 今は、google.com/maps?force=pwa  にスマホからアクセスすればだれでも利用できます。 【補足】アプリがインストールされていると、URL にアクセスしてもブラウザではなくアプリが開くかもしれません。その時はシークレットモードで試してください。 ウェブ版 Google マップで Service Worker が動いてる Chrome のデベロッパーツールで見ると Service Worker がインストールされているのがわかります。 ホーム画面アイコンやオフラインファイルといったベーシックな PWA の機能を今の

    PWA版Googleマップが正式公開、ネイティブアプリ不要になる日がGマップにも来るのか?
  • Googleがウェブマスター向けガイドラインを大幅改定 ―― いったい何が変わったのか?

    [レベル: 初・中・上級] Googleは、ウェブマスター向けガイドラインを大幅に改定しました。 この記事では、主だった変更点を抽出して解説します。 認識しておきたい変更点が数多くあります。 新しいウェブマスター向けガイドラインの主だった変更点 セクション分け 以前は、次の3つのセクションに大きく分かれていました。 デザインとコンテンツに関するガイドライン 技術に関するガイドライン 品質に関するガイドライン 現在は、2つに分かれています。 一般的なガイドライン 品質に関するガイドライン 内容が減ったわけではなく、「デザインとコンテンツに関するガイドライン」と「技術に関するガイドライン」の2つが、「一般的なガイドライン」にまとめられた感じになっています。 「一般的なガイドライン」はさらに次の3つのサブセクションに分かれています。 Google がページを検出できるよう手助けする Google

    Googleがウェブマスター向けガイドラインを大幅改定 ―― いったい何が変わったのか?
  • Googleが推奨するSEOに適した無限スクロールの構成方法

    [対象: 上級] Google英語版ウェブマスター向け公式ブログで、検索エンジンが処理しやすい無限スクロール(Infinite Scroll)の推奨構成を説明しました。 細かな話は後回しにして、その推奨構成をさっそく日語で紹介します。 なお逐一の訳ではなく、理解しやすくするために表現や構成を原文とは多少変えてあります。 構成の概要 無限スクロールからリンクされている個々のアイテム(記事やコンテンツなど)を検索エンジンが確実にクロールできるように、利用しているシステムが、無限スクロールとともにページネーションしたページも作成できるように必ずしておく(無限スクロールで、1つのURLに収めるのではなく、分割して複数のページに分けるということ)。 ※拡大画像はオリジナルのURLで表示します(もう1つの画像も同様) 無限スクロールは、分割したページに変換されることで検索エンジンが処理しやすくなる

    Googleが推奨するSEOに適した無限スクロールの構成方法
  • Google、パンくずリストでのURL表示にマークアップを利用可能に

    Googleは、検索結果に出たウェブページのURLの代わりにパンくずリストを表示する機能を昨年の11月に導入しました。 今ではSERPでのパンくずリスト表示を目にする機会が増えてきました。 URLの代わりにパンくずリストを表示するかどうかや表示する場合の階層はGoogleのアルゴリズムで自動化されていて、サイト管理者は設定できません。 そんななか、リッチスニペットのためのマークアップでパンくずリストの情報を適切にGoogleに知らせることができるようになりました。 microdataかRDFaのいずれかのマークアップで記述されたパンくずリスト情報をGoogleは認識できます。 詳しいことがヘルプで説明されています。 すでにパンくずリストが表示されているサイトは何もする必要はありません。 またパンくずリスト情報をマークアップしたからといって、リッチスニペットの一部としてパンくずリストが必ず表

    Google、パンくずリストでのURL表示にマークアップを利用可能に
  • 1