Существует ли идеальный размер фоновых изображений?

Question

Например, будет ли изображение 1x1 загружаться быстрее, чем 2x2?Размер был бы меньше, но браузеру пришлось бы работать в два раза больше, верно?

Итак, существует ли идеальный размер и форма (квадрат или прямоугольник) для фоновых изображений?

Я знаю, что это, вероятно, не слишком важно, но мне интересно знать.

Спасибо

Answer 1

Я не думаю, что существует «идеальный» размер для вашего изображения.

Хотя качество изображения будет иметь значение для времени загрузки.Изображение со встроенными насыщенными цветами будет больше по размеру по сравнению с другим изображением того же размера.

Наконец выбор фонового изображения целиком зависит от ваших потребностей.Если вам нужно изображение размером 2*2, вам необходимо включить его.

Если вам нужно оптимизировать производительность сайта, используя большое количество фоновых изображений, вы можете взглянуть на

CSS-спрайты

и некоторые инструменты для оптимизации изображений

12 действительно полезных инструментов оптимизации изображений для веб-дизайнеров

Answer 2

Я заметил, что во многих браузерах размещение очень маленьких изображений (например, 1×1 или 2×2) происходит очень медленно.Поскольку в большинстве форматов сжатых изображений почти нет недостатков в увеличении размера при повторениях, я думаю, что, по крайней мере, для мозаики изображений вам следует выбирать изображения размером не менее 50 × 50 пикселей, чтобы уменьшить сложность рисования в UA.

Answer 3

Интересный вопрос.Вам придется спросить каждого из поставщиков браузеров, поскольку каждый из них имеет разные способы рендеринга изображений.

Но на самом деле, если игнорировать время загрузки, любая разница во времени рендеринга будет незначительной, поэтому имеет смысл просто использовать изображение меньшего размера, если вы можете.

Я также отмечу очевидное: если вы используете повторяющееся изображение размером 1x1, вместо этого вам следует использовать цвет фона.

Answer 4

Идеальный размер будет отличаться от одного браузера к другому, от одной системы к другой.

Не делайте его слишком маленьким или слишком большим.Фоновое изображение размером 1x1 может иметь проблемы с рендерингом в некоторых браузерах.Вы должны, по крайней мере, сделать это по несколько пикселей в каждом измерении.

Я помню, что Netscape 4 отказывался повторять изображения, если их ширина была меньше десяти пикселей.Современные браузеры менее чувствительны, но все же имеет смысл не делать изображения слишком маленькими.

Сжатие изображений (по крайней мере, для изображений GIF и PNG) основано на повторении, поэтому, если вы увеличите изображение, повторяя его, дополнительный размер изображения очень незначительно увеличит размер файла.

Answer 5

Просто отмечу:если вы пытаетесь ускорить загрузку, накладные расходы на загрузку изображения 1x1 по сравнению, скажем, 10x10 незначительны, особенно для прилично сжатых изображений — как для клиента, так и для сервера.

Таким образом, поскольку рендеринг определенно быстрее/лучше при размере 10x10, выберите больший размер изображения.