Nie lubimy czekać. Wszystko w obecnych czasach mamy dostępne tu i teraz i tego samego oczekujemy od stron i sklepów internetowych. Niedawno zdało sobie z tego sprawę także Google, czyniąc z szybkości wczytywania czynnik rankingowy. Co jest jednak najczęstszym problemem stron, które cierpią na zbyt długi czas ładowania?
Tak, one. Jeden obrazek wyraża więcej niż tysiąc słów. Zajmuje także kilkakrotnie więcej miejsca. Jednak jako gatunek ludzki jesteśmy wzrokowcami, a dodatkowo gdybym zostawił niniejszy tekst jako ścianę treści – nie byłby on tak atrakcyjny, jak w momencie, w którym dodam poniżej śmieszny (w moim odczuciu) mem:
O obrazach pod kątem SEO zostało powiedziane już wiele. Ja natomiast dziś chciałbym pokazać Wam przypadek, niekoniecznie do powtórzenia czy wdrożenia u siebie w sklepie, który zaciekawił mnie na tyle, że postanowiłem odtworzyć go we własnych, kontrolowanych warunkach.
Jakiś czas temu podczas analizy jednego ze sklepów spotkałem się z brakiem plików graficznych sensu stricte na stronie. Zamiast tego, w tagu znajdował się ciąg losowych znaków, jak te poniżej:
iVBORw0KGgoAAAANSUhEUgAAAHgAAA
B4CAYAAAA5ZDbSAAAABHNCSVQICA
gIfAhkiAAAAAZiS0dEAP8A/wD/oL2nkwAAA
F96VFh0UmF3IHByb2ZpbGUgdHlwZSB
BUFAxAAAImeNKT81LLcpMVigoyk/LzEnlU
gADYxMuE0sTS6NEAwMDCwMIMDQw
MDYEkkZAtjlUKNEABZiYm6UBoblZspkpiM
8FAE+6FWgbLdiMAAAcXUlEQVR4nO2d
e5Ac1ZXmf+dmPfqt1qPpl4QESOIlAwZhJC
EJgw3rwVgeLx4vgwdw7GBm1+GJhRl71
8EOuw7weGYHPCbCDLPErheIsQ0MjDTgB4O
NkZEEehssYbAECAmpu/Vo9Ozu6u6qvGf/
te 380 znaków to jedynie wycinek z dokładnie 9970, które w ostateczności tworzą poniższą emotikonę:
Interesujące, prawda? Czym to jest? Jest to kod base64, którym ów obrazek został zakodowany. Jeśli klikniesz prawym przyciskiem myszy na rzeczoną emotkę i wybierzesz “Zbadaj element”, Twoim oczom ukaże się taki kod:
<img src=”data:image/png;base64,iVBORw0KGgoAAA
ANSUhEUgAAAHgAAAB4CAYAAAA5ZDbSA
AAABHNCSVQICAgI
fAhkiAAAAAZiS0dEAP8A/wD/[…]” />
Oczywiście będzie on zwinięty, bo jak napisałem już wyżej – cały ciąg ma blisko 10.000 znaków.