PR




SEOコンサルタント白石竜次の新作本

【note】SEO・初心者でも無料で検索上位表示する技2020
【SEOマニュアル】『初心者でも無料で検索上位表示できる技』【2020版】
【価格:500円】
SEOコンサルタント白石竜次の新作本。全くのSEO初心者向けの本です!「SEOってなに?」という方にお勧めします。2010年発売の著書をベースに大幅リライトで2020年版にしました。有料で申し訳ありませんが本1冊分の分量でかつ最低限のものにコンパクトにまとめました。

SEO

YouTubeやFacebookに『loading="lazy"』を追加するだけで「遅延読み込み(ネイティブlazy-load(レイジー・ロード))」できる!

投稿日:

YouTubeやFacebookに『loading="lazy"』を追加するだけで「遅延読み込み(ネイティブlazy-load(レイジー・ロード))」できる!

iframeもYouTube埋め込みもFacebookボタンも簡単に遅延読み込み。HTMLに14文字追加するだけ

ネイティブlazy-load(レイジー・ロード)は、JavaScriptのライブラリなしで遅延読み込みを実現できる仕組みだ。画像(imgタグ)またはiframe(iframeタグ)にloading="lazy"属性を追加するだけで実装できる。

「遅延読み込み」とは、ページ表示を高速化しUXを改善するための挙動。ページの初期表示では画像やiframeを読み込まず、近くまでスクロールした時点で読み込むようにする。

グーグルによれば、iframeを遅延読み込みさせることで次のような効果が出たそうだ(数値はすべて中央値):
●データ量を2%~3%削減
●First Contentful Paint (FCP) の時間を1%~2%短縮
●First Input Delay (FID) を95パーセンタイルで2%改善
iframeのネイティブLazy-loadのコードを確認しておこう。

<iframe src="https://example.com"
loading="lazy"
width="600"
height="400"></iframe>

iframeタグの中にloading="lazy"を追加するだけだ。

YouTube動画の場合

<iframe loading="lazy" width="560" height="315" src="https://www.youtube.com/embed/Wmd3dLj5Y1s" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

▼実際に自分のYouTube動画を埋め込んでみました。

<iframe width="560" height="315" src="https://www.youtube.com/embed/iYIoEhwaFMg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

<iframe loading="lazy" width="560" height="315" src="https://www.youtube.com/embed/iYIoEhwaFMg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

▼これが『loading="lazy"』を追加したものです。

Facebookの場合

こちらは、loading="lazy"を追加するのではなくコードをカスタマイズする。data-lazyを追加する。

<div class="fb-like"
data-href="https://example.com/your-page.html"
data-width=""
data-layout="standard"
data-action="like"
data-size="small"
data-share="true"
data-lazy="true">
</div>

※値にはtrueを指定する

SEOコンサルタントのまとめ

「遅延読み込み(ネイティブlazy-load(レイジー・ロード))」は今後重要というか、当たり前になってきますね。

[広告]おすすめ記事

Youtubeチャンネル

記事執筆/サイト管理者

記事執筆/サイト運営者


名前:白石竜次 Shiraishi Ryuji
肩書:SEOコンサルタント
高校卒業後、調理師を経て数々の職業を経験し、その後IT企業でHTMLおよびSEO対策を学ぶ。
その経験を知識を生かしながら各企業でSEO担当者となりインハウスSEOを行う。
現在ではフリーで様々な企業のSEOコンサルティングを行っている。
2011年11月 「SEO対策<検索上位にヒットする>コレだけ!技(技術評論社)」を出版。
2014年1月「世界一わかりやすいSEO対策 最初に読む本(技術評論社)」を出版。
2014年1月「たった30分でできるSEO検索エンジン最適化(秀和システム)」を出版。
2017年 書籍「DeNAと万引きメディアの大罪(宝島社)」に寄稿。


ストアカ

白石 竜次

元お笑い芸人の初心者・中小企業向けSEOセミナー

SEOコンサルタント問い合わせ

・SEOコンサルのご依頼
・SEOや誹謗中傷対策のご相談
・講演会・セミナーのご依頼

SEOコンサルタント問い合わせ

SEO漫画「ウェブマブ!」

-SEO

Copyright© SEOコンサルタント.com-SEO最新情報サイト , 2020 All Rights Reserved.

//記事ページのみに構造化データを出力 //サムネイルを取得 //ここから構造化データの記述