SEO термин

sizes attribute (Атрибут sizes)

Атрибут в HTML (обикновено с srcset), който казва на браузъра колко голямо ще бъде изображението на екрана.

sizes attribute е HTML атрибут, който казва на браузъра каква приблизителна ширина ще заеме изображението в различни условия на екрана. Най-често се използва заедно със srcset, за да може браузърът да избере подходящ файл, вместо да зарежда прекалено голямо или твърде малко изображение.

Какво означава sizes attribute?

Атрибутът sizes описва визуалния размер на изображението в layout-а, а не физическите размери на самия файл. Например изображение може да заема цялата ширина на екрана на мобилно устройство, но само 50% от ширината в десктоп изглед. Когато браузърът знае това предварително, той може да сравни наличните варианти от srcset и да избере ресурс, който е достатъчно ясен, но не излишно тежък.

Защо е важно за SEO?

Правилната употреба на sizes помага за по-добра производителност, защото намалява риска от зареждане на изображения с ненужно голям размер. Това влияе върху потребителското преживяване, мобилното зареждане и показатели като Largest Contentful Paint, когато основното съдържание включва голяма снимка. Атрибутът не е самостоятелен фактор за класиране, но е част от техническата оптимизация, която прави страниците по-бързи и по-стабилни.

Пример

Ако изображението е 100% от ширината на екрана при малки устройства и 600 пиксела при по-големи екрани, sizes може да опише точно това поведение. Така браузърът няма нужда да гадае и няма да изтегли голям десктоп вариант, когато потребителят е на мобилен телефон.

Чести грешки

  • Използване на srcset без sizes, когато изображенията имат различна layout ширина.
  • Задаване на стойности, които не отговарят на реалния CSS layout.
  • Приемане, че атрибутът променя самия дизайн, вместо да описва как дизайнът вече работи.

Свързани понятия

Темата е свързана с responsive images, srcset, lazy loading, Core Web Vitals, оптимизация на изображения и мобилна производителност. Заедно тези техники помагат страницата да зарежда точния ресурс за конкретния екран.

Каква е ролята на sizes?

Той описва колко голямо ще бъде изображението на екрана, за да може браузърът да избере подходящ вариант от srcset.

Може ли sizes да се използва без srcset?

Технически може да присъства, но практическата му стойност идва основно когато има няколко варианта на изображението чрез srcset.

sizes влияе ли директно на класирането?

Не директно. Ползата е в по-доброто зареждане и по-доброто потребителско преживяване, които са част от техническото качество на страницата.