Photoshop 7 и webдизайн

       

Вы можете задать фоновое изображение



Рисунок 18.1. Вы можете задать фоновое изображение для тела документа и некоторых его элементов


Примечание 1
Примечание 1

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

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

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

Кроме фона, вы можете помещать на страницу и обычные рисунки, украшая сайт или иллюстрируя его текст. Во многих случаях графика, имея строго функциональное назначение (кнопки, ссылки и т. д.). служит украшением web-страницы, привлекая пользователя и создавая комфортные условия для работы. Для включения в текст HTML-документа изображений (точнее, ссылок на файлы изображений) используется тег <IMG> (от английского слова image — изображение). Ниже приведен список его параметров. С их помощью вы можете указать правила отображения картинки в окне браузера.

  • SRC указывает путь к файлу, содержащему изображение. Значение этого параметра лучше заключать в кавычки. Также обратите внимание на правильность записи имен файлов и каталогов. Программное обеспечение сервера может различать регистры символов. Пример записи тега с этим параметром:

    <IMG SRC="www.server.com/images/my_picture.jpg">

  • BORDER определяет ширину границы, выводимой вокруг изображения (в пикселах). Граница отображается для изображений, используемых в качестве ссылок (по умолчанию браузер выводит такие изображения окруженными цветной (обычно синей) рамкой). С помощью параметра BORDER вы можете контролировать ее размер. При задании значения BORDER-0 рамка не отображается. Пример записи параметра:

    <IMG SRC="images/picrute.jpg" BORDER=1>

  • WIDTH и HEIGHT параметры, задающие соответственно высоту и ширину изображения. Значения этих параметров задаются в пикселах. С их помощью вы можете, во-первых, указать браузеру, сколько места требуется отвести под рисунок еще до загрузки файла изображения. Это позволяет быстрее сверстать страницу на компьютере пользователя даже при отключенной загрузке графики. Во-вторых, вы можете использовать эти параметры для изменения размеров изображений, но качество такого масштабирования, как правило, далеко от идеала. Пример записи этих параметров:

    <IMG SRC="images/image5.gif" WIDTH=120 HEIGHT=150>

  • ALIGN используется для выбора режима выравнивания изображения. При помощи различных режимов выравнивания вы можете управлять положением рисунка, окруженного текстом, относительно строки, в которой он находится. Существует несколько режимов выравнивания, как по горизонтали, так и по вертикали. Ниже (табл. 18.1) приведен список допустимых значений параметра ALIGN.


Содержание раздела