Насколько велика слишком велика при переходе на фоновые изображения? - PullRequest
5 голосов
/ 07 февраля 2011

У меня тут маленькая проблема. Я - специалист по веб-разработке, и в настоящее время я создаю этот сайт для проекта, который мне необходимо сделать. Я хотел, чтобы это выглядело красиво с фоновым изображением. Я создал изображение в Photoshop и сохранил его в Интернете в формате .jpg, а его размер составил 58.8k.

Я все для сайтов, которые быстро загружаются для пользователя, но мне интересно, если менее 60 КБ это нормально? Я проверил его на расширении yslow firefox, и он загружается для меня через 96 мс (немного плохой объект для теста - http://www.speedtest.net/result/1146275377.png)

60к - это слишком много, лучше ли иметь изображения только 10-20К? Я НЕНАВИЖУ это, когда я вижу загрузку изображения ... это просто ... даже не стоит графика в тот момент. Есть ли более быстрые способы загрузки изображения такого размера? CSS или тег? Или мне даже не стоит об этом беспокоиться?

Ответы [ 2 ]

1 голос
/ 07 февраля 2011

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

1 голос
/ 07 февраля 2011

Большинство браузеров загружают фоновое изображение последним по умолчанию, поэтому у вас не должно возникнуть проблем.

Величина слишком велика, зависит от настроек вашего хостинга, объема трафика, который получает ваш сайт, и типичной скорости передачи ваших посетителей.

60k кажется мне разумным для среднего сайта с не слишком большим количеством одновременных посетителей. Однако пропускная способность стоит денег, и по этой причине вы редко видите фоновые изображения такого размера на больших сайтах. С другой стороны, YouTube регулярно передает потоковое видео, которое в тысячи раз превышает фоновое изображение, которое вы предлагаете. Невозможно дать вам точный совет, не зная намного больше о вашем сайте, его хостинге и статистике использования.

Скорее всего, если вы задаете этот вопрос, 60k вполне подойдет.

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

<script type="text/javascript"> 
bgimage = new Image(); 
bgimage.src = "http://www.olhovsky.com/img/cdf97/256fwt1_eg.png"; 
</script>

Поместите этот код над тегом body, чтобы предварительно загрузить фоновое изображение. Поместите его ниже в свой HTML-документ, чтобы загрузить его позже (например, после тега </body> для последней загрузки фона).

А потом в теге body:

<body onload="document.body.background=bgimage.src;">
...