Apakah ini pendekatan yang baik untuk gambar Pemuatan Malas untuk SEO?

14

Untuk gambar yang dimuat melalui AJAX, atau yang saya tidak ingin diindeks, gunakan pendekatan atribut data- *:

<img data-src="path/to/image.jpg" class="js-lazy-load" />

Javascript memetakan atribut data-src ke atribut src :

<img src="path/to/image.jpg" />

Tapi untuk gambar dalam HTML yang saya lakukan ingin diindeks:

<a href="path/to/image.jpg" class="js-lazy-load">Image alt text here</a>

Javascript menggantikan jangkar dengan tag gambar :

<img src="path/to/image.jpg" alt="Image alt text here" />

Tampaknya itu akan menjaga kemampuan indeks dan maksud halaman (untuk aksesibilitas) tanpa mempengaruhi SEO (semoga). Tetapi akan menyukai pendapat kedua.

Sunting: Umpan balik apa pun tentang bagaimana pendekatan ini - halaman dengan tautan ke gambar versus halaman dengan tag IMG sebaris - akan dibandingkan dalam hal peringkat halaman. Saya menduga tag IMG sebaris akan lebih baik karena setiap tautan keluar akan mengurangi peringkat halaman secara keseluruhan (kecuali mereka memiliki rel = "nofollow" yang akan menjadi kontra produktif).

seo google javascript

— Aeron
sumber

Tautan keluar tidak mengurangi peringkat halaman Anda. Itu bukan cara PR bekerja.

— Lèse majesté

Apakah jumlah total tautan keluar akan mengurangi PR yang dimiliki masing-masing tautan? Jadi jika awalnya halaman memiliki 5 tautan - masing-masing dengan 20% PR - tetapi dengan pendekatan ini akan ada 50 - masing-masing sekarang akan memiliki 2%?

— Aeron

Itu benar. Jumlah PR yang dilewati adalah dibagi dengan jumlah link pada halaman, namun karena PR mematung, nofollowlink sekarang juga termasuk ketika membagi PR antara link. Jadi, bahkan jika Anda memiliki 45 tautan nofollow dan 5 tautan reguler, 5 tautan reguler masih akan hanya melewati 2% dari jus tautan. Meskipun jika Google cerdas, mereka akan memperlakukan tautan gambar secara berbeda dari tautan HTML, karena solusi Anda valid untuk kemudahan penggunaan dan aksesibilitas, dan itu tidak boleh dicegah dengan mengurangi aliran PR Anda.

— Lèse majesté

10

Itu pendekatan yang bagus. Pendekatan lain yang dapat Anda lakukan adalah menggunakan <noscript />elemen untuk menyimpan versi imgtag yang normal , yang akan diindeks oleh Google, dan menggunakan JS untuk membuat versi pemuatan malas.

Atau, Anda dapat menggunakan konvensi AJAX hashbang Google yang dikombinasikan dengan API riwayat HTML5 untuk membuat status halaman yang dapat bookmark dan indeks. Ini terutama lebih disukai jika Anda melakukan semacam halaman gulir yang tak terbatas, karena menyediakan bentuk pseudo-pagination — sesuatu yang paling dibutuhkan oleh implementasi gulir yang tak terbatas ( :: cough :: Gambar Google :: cough ::) .

Sunting: Menggunakan tautan sebagai placeholder untuk gambar dapat menyebabkan aliran PR dari halaman dibagi di antara lebih banyak tautan, meskipun PR selalu dilestarikan kecuali jika Anda menggunakan nofollowdemikian secara teori ini akan meningkatkan PR dari gambar tersebut untuk pencarian gambar.

Jika Anda tidak menginginkannya, atau Anda ingin halaman tersebut terdegradasi dengan anggun untuk pengguna non-JS, Anda bisa pergi ke rute yang berlawanan dan mulai dengan gambar biasa tetapi menggunakan pemblokiran JS untuk menggantikan srcatribut gambar pada pemuatan halaman (atau bahkan hapus saja elemen gambar dan simpan srcatribut dalam antrian pemuatan malas Anda). Jika Anda melakukannya dengan benar, Anda bisa menyelesaikannya sebelum salah satu gambar mulai diunduh.

— Lèse majesté
sumber

2

Saya akan senang melihatnya - Google tidak melihat <noscript>dan saya belum menemukan cara untuk memblokir pemuatan gambar di Firefox; mengganti src(bahkan dengan <script>tag segera setelah <img>tag) sepertinya tidak mencegah gambar mengunduh dalam versi terbaru Firefox. Jika Anda tahu cara lain untuk melakukannya, silakan bagikan!

— mindplay.dk

@ mindplay.dk: Google dapat memilih untuk tidak menggunakan noscriptteks dalam cuplikan, tetapi semua yang saya baca membuat saya yakin itu mengindeks noscriptkonten secara umum. Namun, Anda benar tentang penggantian src. Pikiran asli saya adalah untuk meletakkan script sebelum gambar pertama, sehingga memblokir pemuatan gambar sampai setelah skrip dimuat dan dieksekusi. Tetapi pada pemeriksaan lebih lanjut, ini tidak akan berhasil karena gambar tidak akan muncul di DOM pada saat itu. Anda dapat memblokir unduhan dengan memaksimalkan koneksi konkuren ke host, tetapi itu tidak praktis akhir-akhir ini.

— Lèse majesté

Sebuah kotor hack orang lain datang dengan adalah dengan menggunakan JS untuk komentar pada gambar JS-bebas seperti begitu (ada versi lama yang berhubungan dengan spekulatif parsing): <script>document.write('<'+'!--');</script><img src=...>. Anda harus memutuskan sendiri apakah itu pendekatan yang dapat diterima.

— Lèse majesté

2

Saya telah melihat gambar dimuat dengan pola ini:

<img data-src="path/to/image.jpg" class="js-lazy-load" />

dijemput oleh Google dan Pencarian Gambar Google dan orang lain juga melihatnya . Karena Google sekarang mengeksekusi javascript pada halaman Anda, mungkin tidak perlu memasukkan gambar yang sebenarnya ke atribut src. Mengabaikan atribut src mungkin mengarah ke batas abu-abu di sekitar gambar Anda, jadi mungkin yang terbaik adalah dengan sesuatu seperti:

<img src="placeholder.gif" data-src="path/to/image.jpg" class="js-lazy-load" alt="Image alt text here" />

Nb. ini tidak berlaku untuk mesin pencari lainnya.

— Willster
sumber