Плохо ли задавать блоки с картинками через background-images, а не тег img?

Question

[Ingernirated]

Всем привет!
При проверке сайта на скорость у гугла, было замечание, что из 7.2 сек.
6.6 пришлось на CSS файл и что следует убрать неиспользуемый код, хотя используется там весь и он вест 12 КБ.
Но почти все картинки заданы через background-image.
Или ничего не изменится и гугл эти 6.6 сек переправит в другую категорию?

И вложенность в папки, это так важно?
Он сказал минимизировать папки и как я понял, хочет убрать шрифты и картинки из папок.

Answer 1

[Alfieros]

Плохо ли задавать блоки с картинками через background-images, а не тег img?

Это как шило на мыло поменять. Что при чтении html будет задержка, что при чтении css. Разница на миллисекунды.
Если это блоки с динамическим контентом, то естественно через . Если статичные элементы, то через background-image(так как приоритет загрузки ниже).

Здесь больше вопрос к шрифтам, а не картинкам. У вас наверное полноценные ttf шрифты весом 200+ кб?
1) Замените шрифты на woff(веб).
2) Прогнать все картинки через https://tinypng.com.

Для кириллицы посоветовал бы заменить шрифт, на стандартный - 'Open sans', sans-serif. Со свойством letter-spacing: от 0.1px до 0.3px, отлично смотрится везде.

Comments

[SagePtr]

Open Sans - не стандартный. По крайней мере в Windows его нет из коробки.

[Alfieros]

SagePtr, Как минимум его читает сам хром, без скачивания. Но если от противного, тогда делаем перебор 'Open sans', 'Tahoma', 'Arial', sans-serif. И этого вполне достаточно. Подстраиваем расстояние между буквами, и высоту линий, и всё замечательно вписывается, почти в любой дизайн.