Как посоветуете поступить с фоном в лендинге?

(Ответов: 4, Просмотров: 316)
  1. full-stack developer Аватар для sly04
    • Регистрация: 01.11.2012
    • Сообщений: 511
    • Репутация: 71
    Привет, ребят!

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

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

    Так скажите, я правильно мыслю, или есть причина, по которой необходимо в лендинге добавлять именно изображения с full hd размером?
    • 0
  2. Набираю обороты Аватар для Леонид Каруна
    • Регистрация: 27.08.2013
    • Сообщений: 490
    • Репутация: 81
    • Webmoney BL: ?
    Вы в корне не правильно мыслите. В данный момент актуальный инструмент при верстке это - адаптивность.
    Ваша картинка и ваши блоки должны одинаково отображаться на разных мониторах.
    Другое дело как она будет отображаться в мобилке или планшете, но дело точно не в размере картинки. Надо ставить максимально хорошее качество картинки на задний фон вашего адаптивного блока, тогда на гигантских мониторах картинка 1920х1080, будет выглядеть лучше чем картинка 1366х768.
    Предоставляю услуги по созданию сайтов.
    Не дорого и качественно.
    • 0
  3. full-stack developer Аватар для sly04
    • Регистрация: 01.11.2012
    • Сообщений: 511
    • Репутация: 71
    Леонид Каруна, причем здесь адаптивность? Стоит вопрос целесообразности использования огромных изображений. Стоит ли ради того, чтобы картинка была отлично видна на full hd жертвовать скоростью загрузки сайта? Она и так будет хорошо смотреться, я же писал, что картинка плавно переходит в одноцвет. И я не вижу смысла использовать подобную картинку с максимальным разрешением, когда можно пустое место заполнить обычным цветом.

    Я стараюсь понять, может есть какой-то все же в этом смысл? Адаптивность присутствует в любом случае. Картинка - простая текстура, там нет ничего такого, что необходимо было бы разглядывать на больших мониторах.
    • 0
  4. Super Moderator Аватар для grazer
    • Регистрация: 03.09.2009
    • Сообщений: 5,190
    • Записей в дневнике: 83
    • Репутация: 2377
    • Webmoney BL: ?
    sly04, если картинка это текстура, то почему не воспользоваться заполнением всего фона одним элементом текстуры? Маленькой картинкой заполните весь фон. Если в вашем случае так нельзя сделать - найдите другую текстуру, в интернете полно.

    А по поводу использования большого изображения, например 1920х1080, то:
    1. Есть сервисы которые позволят ужать размер изображения практически без потери качества
    2. Для лендинга картинка в 500 кб это не проблема для загрузки, тем более для фона, который можно подгружать после загрузки всех остальных элементов.
    Через тернии... ну вы поняли :)
    • 0
  5. full-stack developer Аватар для sly04
    • Регистрация: 01.11.2012
    • Сообщений: 511
    • Репутация: 71
    grazer, текстурка не из стандартных, она шовная. Ее не зарепитишь( Да, про сервисы знаю, пользуюсь, 500кб это уже после всех сжатий, еще и с качеством в 70% jpg. Если разместить 4 такие фона на лендинге, нормально? Я, конечно, видел, что люди и видео целые грузят на фон, но как-то всегда был за скорость.

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

Похожие темы

Темы Раздел Ответов Последний пост
Помогите с редиректом в лендинге
Вопросы от новичков 2 18.02.2016 11:44
Подскажите решение с приемом оплат на лендинге (как реализовать быстро)?
Финансовый раздел 4 16.12.2015 17:52
Как поступить
Вопросы от новичков 2 28.05.2013 15:51
Как поступить с запросом?
Вопросы от новичков 2 13.04.2013 00:18
Как создать квадрат с фоном в css?
Web программирование 6 15.07.2012 23:51

У кого попросить инвайт?

Вы можете попросить инвайт у любого модератора:

Информеры