Apakah sprite CSS buruk untuk SEO?

Saat ini sering apa yang dicapai dengan <img>tag sekarang dilakukan dengan sesuatu seperti <div>dengan gambar latar belakang CSS menggunakan CSS 'sprite' dan offset.

Saya bertanya-tanya apa efeknya terhadap SEO, karena secara efektif kita kehilangan altatribut (yang diindeks oleh Google), dan terjebak dengan atribut 'judul' (yang sejauh yang saya pahami tidak diindeks).

Apakah ini kerugian yang signifikan?

Sprite CSS seharusnya hanya digunakan untuk elemen dekoratif karena alasan ini - gunakan <img>untuk elemen yang khusus untuk halaman dan gunakan sprite untuk elemen dekoratif yang tidak relevan secara kontekstual dengan konten yang disajikan.

Jika Anda memerlukan gambar tombol untuk item navigasi Anda, jauh lebih masuk akal untuk menambahkan gambar itu sebagai latar belakang pada tautan navigasi daripada markup seperti ini:

<a href="/">
  <img src="/images/home.gif" title="Home" alt="Home Button" /> 
  Home
</a>

(mis. di mana pun konten gambar itu berlebihan untuk konten teks pada halaman atau konten gambar yang terbaik dapat digambarkan sebagai "hiasan")

Sebagai bonus tambahan untuk memisahkan elemen templat situs sebagai sprite, Anda nantinya dapat mengubah "skin" situs dengan mengubah stylesheet alih-alih menimpa file gambar desain lama atau menulis ulang semua markup HTML Anda.

Anda dapat menggunakan <img>tag dengan sprite CSS:

<img alt="description of image" src="images/sprite.png" id="someSprite" />

sprite.png bisa berupa piksel transparan 1x1 yang dikompresi hingga <50 byte.

Gaya:

#someSprite {

     width:74px;
     height:38px;
     background:url('/images/sprites.png') left 0px top 84px;

}

Dengan begitu Anda mendapatkan pengoptimalan kinerja dari sprite - dan menyimpan alttag Anda .

The alttag berlebihan. Saya pikir terlalu banyak orang berusaha keras untuk memastikan mereka memiliki alttag pada halaman mereka. Saya tidak percaya itu menyakitkan Anda untuk tidak memilikinya. Ini hanya masalah memastikan jika Anda memiliki img, Anda memiliki alttag yang ditetapkan untuk itu.

Saya percaya waktu buka dan kinerja situs memiliki dampak yang lebih besar pada SEO secara keseluruhan daripada alttag lakukan dan untuk setiap permintaan gambar atau permintaan HTTP, situs ini akan melambat. Tujuan dari sprite CSS adalah untuk membantu meminimalkan permintaan tersebut dan untuk mempercepat waktu pemuatan halaman Anda.

Saya cenderung menggunakan sprite untuk ikon dekoratif, mereka tidak ada hubungannya dengan halaman secara keseluruhan jadi untuk SEO baik-baik saja dalam hal ini. Setiap set gambar yang Anda miliki yang semuanya memiliki dimensi yang sama yang tidak berkontribusi pada makna halaman, adalah kandidat yang baik untuk sprite CSS.