| |
Графика на сайте
На этом уроке мы будем учиться вставлять на наш сайт графику. Но перед этим - важное наставление:
"Вес" вашей страницы не должен быть больше 30Кбайт - это вместе с графикой!. Если вес будет больше,
то вы рискуете потерять посетителей - их оттолкнет долгая загрузка страниц. Есть и исключения, например в первом уроке
я был вынужден использовать несколько скриншотов(картинок), и общий "вес" такой странички у меня получился около 40
Кбайт. Ну а теперь приступим...
 |
Посмотрите, неправда ли при открытии этой странички Ваше внимание привлекла внимание эта
картинка слева? В этом и есть преимущества графики на сайте (графика радует глаз и привлекает внимание), НО,
есть и другая сторона медали - подобная картинка может отвлечь внимание посетителей от основного содержимого!
Конечно если картинка показывает что-то относящееся к содержимому сайта, то это очень хорошо, но помните про размер!
|
| Итак, чтобы вставить на сайт картинку существует специальный тэг для этого - <img>.
Чтобы просто вставить картинку на сайт надо в этот тэг добавить атрибут scr с адресом картинки:
<img src="images/xxx.gif">.
Теперь поговорим о других важных атрибутах:
| № |
атрибут |
разъяснение |
| 1 |
align="" |
Этот атрибут нужен для выравнивания картинки.left - по левому краю;
right - по правому краю;
center - по центру;
bottom - по нижнему краю;
top - по верхнему краю;
middle - по середине;
|
| 2 |
border="" |
Устанавливает рамку вокруг картинки. Чем больше цифра между кавычками, тем толще рамка. |
| 3 |
alt="" |
Выводит при наведении мыши на картинку подсказку. Можете навести мышку на картинку в виде руки повыше,
там для Вас сообщение. |
| 4 |
width=""
height="" |
Эти атрибуты задают размеры картинки. width - задает ширину, а height - высоту. |
|
Как сделать картинку ссылкой...
Чтобы сделать картинку одновременно ссылкой надо всего-лишь вставить код картинки между тэгом <a href=""> </a>,
т.е. примерно выглядит вот так: <a href="foto.html"><img src="images/xxx.gif"></a>,
и тогда картинка будет ссылкой, как эта:
|
|
Такой метод ссылки очень часто применяется. Например на сайтах, использующих для дизайна графику,
на таких сайтах обычно меню сайта выглядит не в виде ссылок, а в виде картинок-кнопок.
|
|
|
