Материал: 1896
Рис. 45. Вид Web-страницы в окне браузера
Задание альтернативного текста
Иногда загрузка изображений занимает много времени, и не очень приятно, если посетители будут видеть просто белые пятна на месте изображений.
Торопливые посетители часто «командуют» браузерам прекратить загрузку изображений с WWW. Поскольку загрузка изображений отнимает много времени, они предпочитают ускорить процесс, не выводя изображения. Для таких пользователей полезно дать альтернативный текст, тогда они могут прочесть краткое описание того, что представлено на рисунке, и при желании просмотреть его.
Ниже рассмотрим пример: если установить курсор на изображении, то появится альтернативный текст (рис. 46).
…
<IMG SRC="computer.gif" ALT="Компьютер" ALIGN="RIGHT">
…
Рис. 46. Вид Web-страницы в окне браузера
1.5.4. Расположение текста рядом с графикой
Одной графики может оказаться недостаточно для полной передачи ее смысла. Поэтому вместе с графикой используют текст. Есть несколько способов выравнивания изображений на домашней странице по отношению к тексту. Ключевое слово ALIGN является частью тега <IMG>. С его помощью можно задавать место изображения на экране и вид обрамления его текстом. Перечислим восемь опций ALIGN (табл. 15).
Таблица 15. Опции ALIGN
Опция |
|
|
Комментарий |
|
|
LEFT |
Выравнивает |
изображение по левому краю |
страницы, |
строки |
|
текста выводятся справа от изображения |
|
|
|||
|
|
|
|||
RIGHT |
Действует так |
же, как |
LEFT, но выравнивает изображение по |
||
правому краю страницы |
|
|
|
||
|
|
|
|
||
TOP |
Выравнивает изображение по самому высокому элементу в строке |
||||
TEXTTOP |
Выравнивает изображение по самому высокому элементу текста в |
||||
строке (обычно совпадает с TOP) |
|
|
|||
|
|
|
|||
MIDDLE |
Выравнивает нижнюю границу строки посередине изображения |
||||
ABSMIDDLE |
Выравнивает середину строки посередине изображения (очень |
||||
похожа на MIDDLE, но применяется для мелких изображений) |
|||||
BOTTOM |
Выравнивает |
нижнюю |
границу строки по |
нижней |
границе |
изображения |
|
|
|
|
|
|
|
|
|
|
|
BASELINE |
То же, что BOTTOM |
|
|
|
|
Приведем примеры по выравниванию текста с графикой: 1. Текст выровнен по верхнему краю изображения (рис. 47):
…
<IMG SRC="computer.gif" ALT="Компьютер" ALIGN="TOP"> <B>Устройство персонального компьютера</B>
…
Рис. 47. Вид Web-страницы в окне браузера
2. Текст выровнен посередине изображения (рис. 48):
…
<IMG SRC="computer.gif" ALT="Компьютер" ALIGN="MIDDLE"> <B>Устройство персонального компьютера</B>
…
Рис. 48. Вид Web-страницы в окне браузера
3. Текст выровнен по нижнему краю изображения (рис. 49):
…
<IMG SRC="computer.gif" ALT="Компьютер" ALIGN="BOTTOM"> <B>Устройство персонального компьютера</B>
…
Рис. 49. Вид Web-страницы в окне браузера
4. Размещение изображения в тексте (рис. 50):
…
<P ALIGN="JUSTIFY">
Персональный компьютер представляет собой комплект устройств. Главным в этом комплекте является системный блок. <IMG SRC="computer.gif" ALIGN="LEFT">
Кроме системного блока, в обязательный минимальный комплект ПК входят клавишное устройство (клавиатура) и монитор (дисплей). Дополнительно к этому минимальному комплекту ПК могут быть подключены принтер, мышь, модем и другие устройства.
…
Рис. 50. Вид Web-страницы в окне браузера
Задание размера изображения
Приведем примеры:
1. Ширина изображения 86 пикселей, высота – 86 пикселей (рис. 51):
…
<IMG SRC="computer.gif" ALT="Компьютер" WIDTH="86" HEIGHT="86" ALIGN="LEFT">
…
Рис. 51. Вид Web-страницы в окне браузера
2.Ширина изображения 259 пикселей, а высота – 211 пикселей (рис. 52):
…
<IMG SRC="computer.gif" ALT="Компьютер" WIDTH="259" HEIGHT="211”>
…
Рис. 52. Вид Web-страницы в окне браузера
1.5.5. Пиктограммы
Кроме цветных изображений и рисунков, на домашней странице могут присутствовать пиктограммы всех видов. С технической точки зрения пиктограммы попадают в категорию «изображений» (они обычно хранятся в файлах формата GIF и JPEG), но обычно очень малы (2 – 6 Кбайт) и применяются на домашних страницах из соображений дизайна, эстетики, а также для «перелистывания» страниц.
Существуют самые различные пиктограммы. На страницах WWW можно найти их великое множество, начиная от миниатюрных пиктограмм реконструкции до цветных линий и кнопок. Иногда при просмотре домашних страниц не отдаешь отчета в том, что смотришь на пиктограммы, настолько хорошо они интегрированы в страницу.
Пиктограммы перемещения
Это, пожалуй, категория самых полезных пиктограмм для разработчиков домашних страниц. Обычно эти пиктограммы имеют вид стрелок, указывающих то или иное направление. Как правило, это стрелки перехода на следующую страницу. Например, если читаете книгу на