Тutorиалы по мультимедиа - использование изображений в Web

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

Когда использовать изображения

Для большинства изображений одно изображение может быть лучше тысячи слов. Но все же要注意， никто не будет обращать внимания на тех, кто много болтает. В первую очередь и самое важное — использовать графику в документе в качестве визуального инструмента, а не как бездумную декорацию. Они должны поддерживать контент текста и помогать читателям navigating по документу. Использование изображений делает контент документа более понятным и позволяет добавлять комментарии или примеры. Поддерживающие контент фотографии, графики, диаграммы, карты и иллюстрации являются естественными и подходящими вариантами. Например, фотографии продуктов являются важной частью онлайн-каталогов и руководств по покупкам. Также могут быть использованы иконки и символы с гиперссылками, включая изображения с анимацией, которые могут быть очень эффективными визуальными указателями на контент или внешние ресурсы. Если какое-либо изображение не выполняет ninguna из перечисленных функций, его следует выбросить!

Когда вы думаете о добавлении изображений в документ,另外一个重要的考虑因素是在通过网络，尤其是通过调制解调器连接传输这个文档时，检索方面所带来的时间延迟。Обычные документы могут содержать до 10-15千байт, а одно изображение может легко достигать нескольких сотен千байт. И время загрузки всего документа не только зависит от суммы всех его частей, но и от задержек, связанных с сетевой нагрузкой.

В зависимости от скорости подключения (то есть ширины полосы)bandwidthОбычно это выражается с помощью bps или b/s и может замедлить скорость подключения из-за сетевых блокировок. Чтобы загрузить отдельный документ с изображением размером 100 KB, может потребоваться в полночь или около полуночи, когда большинство людей спят, использовать модем с скоростью 57.6 Kbps и потратить около 15 секунд на загрузку, или в полдень использовать модем с скоростью 9600 bps и потратить более 10 минут на загрузку. Получили ли вы это изображение?

Конечно, использование изображений и других多媒体促使 провайдеров интернета постоянно стремиться к более быстрому, лучшему и более устойчивому способу предоставления веб-контента. Вскоре соединения с модемами 56 Kbps будут退出 историческую сцену (как и 9600 bps модемы), они будут заменены новыми технологиями, такими как кабельные модемы и ADSL. На самом деле, большинство подключений скоро будут превышать скорость 1Mbps.

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

Когда использовать текст

Текст не устарел. Для некоторых пользователей текст - это единственная часть документа, которую они могут получить. Мы рекомендуем, чтобы в большинстве случаев документ был доступен любому, включая тех, кто не может просматривать изображения или тех, кто отключил автоматическую загрузку изображений в браузере для улучшения производительности подключения к Интернету. 虽然 есть потребность в добавлении изображений в документ, но в некоторых случаях чистый текстовый документ действительно имеет больше смысла.

Документы, преобразованные из других форматов в веб-страницы, редко содержат внедренные изображения, а литература и другие серьезные материалы обычно полностью доступны в виде чистого текста.

Когда скорость доступа очень важна, следует создавать чистые текстовые документы. Если вы знаете, что пользователи могут торопиться получить ваш документ, следует избегать использования изображений в документе, чтобы удовлетворить потребности этих пользователей. В некоторых крайних случаях вы можете предложить домашнюю страницу (вводную страницу), чтобы пользователи могли выбрать между двумя версиями вашего произведения: одна с изображениями, другая без них (все популярные браузеры имеют специальные иконки изображений, чтобы оставить место для изображений, которые еще предстоит загрузить, и эти占аторы могут сделать документ.layout катастрофически сложным, даже превращая его в нечитаемый материал).

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

Accelerate the download speed of images

Кроме cuidadoso selections of the content to be included in the document, there are many methods to improve the load and delay problems caused by images:

Удерживать простоту

Полноэкранный 24-битный цветной графический элемент все равно будет занимать большую часть полосы пропускания сети, даже после уменьшения размера стандартными форматами (например, GIF или JPEG и т.д.). Поэтому лучше использовать различные инструменты управления изображениями для оптимизации размеров и уменьшения количества цветов до минимального количества пикселей. Упростите свои изображения, не используйте пейзажные фотографии и избегайте больших пустых фонов, а также ненужных рамок и других занимающих места элементов. Также избегайте использования эффектов дрожания (смешение двух близких цветов для получения третьего цвета), так как это значительно снижает возможность сжатия изображения. Напротив, старайтесь использовать大面积一致的 цвета, так как их легко сжать в формате GIF или JPEG.

Повторно использовать изображения

Это особенно относится к иконкам и GIF-анимациям. Большинство браузеров кэшируют компоненты документа в локальной памяти, чтобы ускорить доступ к данным и использовать меньше сетевых соединений. Для небольших GIF-анимаций рекомендуется готовить каждый кадр, чтобы обновлять только те части, которые изменились в анимации, а не полностью обновлять изображение (что также ускоряет отображение анимации).

Разбивать большие документы

Это общее правило для включения изображений. Многие kleine Dokumentteile организованы в группы с помощью гиперссылок (конечно, с их помощью!) и эффективных оглавлений, что делает их более приемлемыми для пользователей по сравнению с одним большим документом. В общем, люди предпочитают листать несколько страниц, чем тратить время на загрузку большого документа (что похоже на симптом频道-синдрома). Хорошим правилом является поддержание размера каждого документа около 50 КБ, чтобы читатели с самыми медленными соединениями не чувствовали себя уставшими.

Изолировать крупные графические элементы по мере необходимости

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

Определение размеров изображения

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

JPEG или GIF?

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

Однако, мы все же рекомендуем использовать определенные инструменты для создания или преобразования этих форматов, чтобы充分利用各自的功能. Например, можно использовать прозрачные свойства GIF для иконок и небольших декоративных знаков. А JPEG можно использовать для сжатия больших цветных изображений, чтобы ускорить загрузку.

Тег <img>

Тег <img> позволяет включать или вставлять графические изображения в текущий поток документа. Для получения более подробной информации о данном теге, пожалуйста, обратитесь к: