[sly04]

Привет, ребят!

Верстаю лендинг и тут встал вопрос. Есть 6 блоков, на 4-х из них есть свой фон в виде картинки. Хочу реализовать это следующим образом: поставить картинку 1366х768 разрешением, позиционировать ее по центру. Края у изображения слева и справа плавно перевести от картинки к однородному цвету, например, к черному. И весь блок заполнить этим цветом. Так если зайти со стандартного ноутбука, в экран влезет целая картинка. А если зайти с экрана разрешением fullhd или выше, то увидим картинку по центру, а весь остальной блок заполнен цветом.

Но гуляя по множеству других лендингов обнаружил, что все добавляют картинку размером 1920х1080 и не парятся. Такой фон хорошо смотрится абсолютно на всех разрешениях, но картинка при этом весит поразительно много. Почти 500 кило. 4 такие картинки - это 2 метра, что обязательно скажется на скорости.

Так скажите, я правильно мыслю, или есть причина, по которой необходимо в лендинге добавлять именно изображения с full hd размером?

[Леонид Каруна]

Вы в корне не правильно мыслите. В данный момент актуальный инструмент при верстке это - адаптивность.
Ваша картинка и ваши блоки должны одинаково отображаться на разных мониторах.
Другое дело как она будет отображаться в мобилке или планшете, но дело точно не в размере картинки. Надо ставить максимально хорошее качество картинки на задний фон вашего адаптивного блока, тогда на гигантских мониторах картинка 1920х1080, будет выглядеть лучше чем картинка 1366х768.

[sly04]

Леонид Каруна, причем здесь адаптивность? Стоит вопрос целесообразности использования огромных изображений. Стоит ли ради того, чтобы картинка была отлично видна на full hd жертвовать скоростью загрузки сайта? Она и так будет хорошо смотреться, я же писал, что картинка плавно переходит в одноцвет. И я не вижу смысла использовать подобную картинку с максимальным разрешением, когда можно пустое место заполнить обычным цветом.

Я стараюсь понять, может есть какой-то все же в этом смысл? Адаптивность присутствует в любом случае. Картинка - простая текстура, там нет ничего такого, что необходимо было бы разглядывать на больших мониторах.

[grazer]

sly04, если картинка это текстура, то почему не воспользоваться заполнением всего фона одним элементом текстуры? Маленькой картинкой заполните весь фон. Если в вашем случае так нельзя сделать - найдите другую текстуру, в интернете полно.

А по поводу использования большого изображения, например 1920х1080, то:

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

[sly04]

grazer, текстурка не из стандартных, она шовная. Ее не зарепитишь( Да, про сервисы знаю, пользуюсь, 500кб это уже после всех сжатий, еще и с качеством в 70% jpg. Если разместить 4 такие фона на лендинге, нормально? Я, конечно, видел, что люди и видео целые грузят на фон, но как-то всегда был за скорость.

Другими словами вполне нормально использовать 4 фона с размером 1920х1080, верно?