Архив Ноябрь 2008 г.

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

Одно из важнейших обстоятельств, которые необходимо учитывать при
добавлении изображений в документ, – это привносимая ими добавочная задержка
при получении документа из сети, особенно при модемном соединении. Тогда как обычный текстовый документ может иметь объем не более 10–15 Кбайт, любому изображению понадобятся сотни килобайт. Кроме того, общее время получения документа состоит не только из суммы времени, потраченного на каждую из его
частей, но включает в себя все дополнительные задержки, происходящие
при передаче данных по сетям.

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

Разумеется, можно сказать, что рисунки и прочие мультимедийные «излишества» подталкивают интернет провайдеров стремиться ко все более быстрому, лучшему, надежному обеспечению доставки сетевых материалов. В ближайшем будущем модемные соединения последуют за почтовыми каретами, уступив место кабельным модемам и ADSL.

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

Формат PNG

26 Ноябрь 2008 | Автор: admin

Технология PNG (Portable Network Graphics, переносимая сетевая
графика) была создана в качестве замены GIF, но не из-за того, что GIF
плохо справлялся со своими обязанностями. В действительности GIF
был и остается самым востребованным форматом в Интернете. Многие
пользователи были возмущены, когда в 1993 году, после того как GIF
приобрел популярность и широкое распространение, компания Unisys
решила зарегистрировать свои авторские права и собирать дань за
использование технологии сжатия GIF. Эта акция противоречила философии
свободного обмена информацией, которой придерживалось тогдашнее
сообщество пользователей Интернета, состоявшее, в основном, из научных
работников. Она подтолкнула неформальную группу, возглавляемую
Томасом Бутеллом (Thomas Boutell), к разработке альтернативы,
а именно PNG.

Преимущества технологии PNG над GIF и JPEG (помимо того, что она
предоставляет формат, пользователи которого не рискуют оказаться
ответчиками в суде) заключаются в более широком выборе цветовых
форматов (24 битовый RGB, шкала оттенков серого и 8 битовая GIF
подобная палитра) и в меньших потерях при сжатии. Уникальными
и весьма привлекательными чертами технологии PNG являются альфа
каналы, позволяющие указывать огромное количество слоев прозрачности
(более 65 тыс. против одного слоя в GIF) и способные симулировать
трехмерные изображения; гамма коррекция, управляющая яркостью
при переносе с одной платформы на другую и обеспечивающая более
четкую графику; а также двухмерное чередование строк, обеспечивающее
более точное постепенное проявление картинки.

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

Формат JPEG

21 Ноябрь 2008 | Автор: admin

Joint Photographic Experts Group (JPEG) – это организация по стандартизации, разработавшая то, что теперь называется JPEG форматом кодировки
изображений. Подобно GIF форматам, JPEG изображения являются платформно независимыми и специально сжатыми для скоростной передачи посредством цифровых коммуникационных технологий. В отличие от GIF,
формат JPEG поддерживает десятки тысяч цветов для отображения более
детальных, фотореалистических изображений. При этом JPEG использует
специальные алгоритмы, обеспечивающие значительно больший коэффициент
сжатия. Нередко удается, например, 200 килобайтное GIF изображение
сократить до 30 Кбайт, применяя JPEG. Достигая такого впечатляющего сжатия,
JPEG теряет часть содержащихся в изображении данных. Впрочем, можно
управлять уровнем потерь при сжатии, применяя специальные JPEG средства,
так что, хотя восстановленное изображение, скорее всего, и не совпадает с оригиналом в точности, оно будет настолько на
него похоже, что большинство людей не заметит разницы.

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

Формат JPEG, обычно обозначаемый расширением .jpg (или .JPG),
распознается почти всеми современными графическими броузерами.
Изредка встречаются старые броузеры, которые не могут сами воспроизводить JPEG изображения.

Формат GIF

20 Ноябрь 2008 | Автор: admin

Формат обмена графикой (Graphics Interchange Format, GIF) был изначально
разработан для передачи изображений между пользователями онлайновой
службы CompuServe. У этого формата обнаружилось несколько черт,
сделавших его популярным при употреблении в HTML и XHTML
документах. Его кодировка является платформно независимой, так что,
используя подходящую программу декодер (встроенную в большинство
броузеров), вы можете, например, без особых хлопот загрузить и просматривать
на персональном компьютере с Windows изображение, созданное и
превращенное в GIF файл на Macintosh.
Вторая главная черта GIF – это применяемая при создании файла особая
технология сжатия, которая существенно сокращает его размер, что позволяет
передавать изображение по сети быстрее. Сжатие в GIF производится
«без потерь» – никакие данные исходного образца не удаляются и не
изменяются, так что в распакованном виде изображение точно совпадет с
оригиналом. Кроме того, GIF изображения легко анимировать.

Хотя все файлы с GIF изображениями неизменно обозначаются именами с
расширением .gif (или .GIF), существует две версии GIF – ориги
нальная GIF87 и расширенная GIF89a, которая поддерживает несколько новых возможностей, распространенных у сетевых авторов, включая прозрачный фон, чересстрочное хранение и анимацию. Популярные броузеры в настоящее время поддерживают обе версии GIF, использующие одинаковую схему кодировки,
которая представляет собой карту значений цвета пиксела. Сами коды берутся
из встроенной в файл восьмибитной таблицы (палитры), что дает не более 256
различных цветов в изображении. В большинстве случаев употребляется
меньше цветов: для этого применяются специальные средства, упрощающие
слишком богатую палитру графики. При упрощении GIF изображений
создается палитра меньшего размера и увеличивается избыточность данных в попиксельном представлении, что влечет за собой лучшее сжатие файла и,
следовательно, более быструю его загрузку.

Тем не менее ограниченный размер палитры делает GIF формат не
пригодным для фотореалистических картинок (см. раздел 5.2.1.3).
GIF идеально подходит для создания пиктограмм, цветных картинок
с ограниченным набором цветов и рисунков.

Поскольку в большинство графических броузеров встроена поддержка
данного формата, такое кодирование изображений является самым
распространенным в сети. Оно подходит как для внедренных в документ
изображений, так и для внешних, подключенных по гиперссылке. При
любых сомнениях используйте GIF.1 Это сработает почти всегда.

Форматы изображений

16 Ноябрь 2008 | Автор: admin

Ни HTML, ни XHTML не дают официальных предписаний для формата
изображений. Однако популярные броузеры особенно хорошо при
способлены для работы с определенными форматами, в частности GIF,
PNG и JPEG (объяснения в следующих разделах). Большинство других
мультимедийных форматов требуют, чтобы пользователь приобрел,
установил на своем компьютере и научился успешно применять
специальные вспомогательные программы. Поэтому неудивительно,
что GIF, PNG и JPEG de facto являются стандартами для изображений
в сети.

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

Изображения в документе

12 Ноябрь 2008 | Автор: admin

Одной из наиболее подкупающих черт HTML и XHTML является предоставляемая
ими возможность включать в текстовый документ изображения либо в виде
встроенных компонентов (внедренных изображений), либо отдельных документов, которые могут быть загружены с помощью соответствующей гиперссылки, либо
в виде фона документа. Изображения – статические и анимированные
пиктограммы, картинки, иллюстрации, рисунки – могут при умеренном их
употреблении сделать документ более привлекательным, зазывающим и
профессиональным, так же как и более информативным и легким для изучения.
Помимо этого существуют способы включения изображения в качестве карты гиперссылок. Однако чрезмерное количество изображений загромождает документ, делает его запутанным и труднодоступным, а заодно увеличивает время, которое необходимо пользователю для загрузки и просмотра ваших страниц.

Горизонтальные линейки помогают читателю зрительно ориентироваться
в документе. Чтобы эффективно использовать тег <hr> для отделения
друг от друга частей документа, прикиньте вначале, сколько в нем будет
уровней заголовков и какова приблизительно длина его разделов. Затем
решите, какие из заголовков следует отделять линейками.

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

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

Тег hr

5 Ноябрь 2008 | Автор: admin

Тег <hr> предлагает броузеру вставить горизонтальную линейку, пере
секающую окно броузера от края до края. В языке HTML у него нет
закрывающего тега. В XHTML документе требуется либо косая,
закрывающая тег перед знаком «>» после атрибутов (<hr …/>), либо
закрывающий тег сразу после открывающего (<hr></hr>).

Подобно тегу <br>, <hr> заставляет выравнивание абзаца вернуться
к принятому по умолчанию (по левому краю). Броузер размещает линейку непосредственно под текущей строкой, а поток текста возобновляется
сразу под линейкой.

Способ отображения горизонтальной линейки относится к компетенции
броузера. Обычно она протягивается через все окно. Графические
броузеры могут изображать ее выпуклой или углубленной, броузеры,
выводящие только символы, могут обозначить ее строкой тире или
подчеркиваний.

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

This text is directly above the rule.
<hr>
And this text is immediately below.
<p>
Whereas this text will have space before the rule.
<p>
<hr>
<p>
And this text has space after the rule.

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

Горизонтальные линейки

2 Ноябрь 2008 | Автор: admin

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