Оживляем сайт с помощью графических изображений

Любому сайту, принимающему посетителей, важно, чтобы гости получали нужное, да в таком виде, чтобы нравилось, не хотелось уходить, а если уходили, то обязательно возвращались. Ведь и вправду лучше, когда информация подается не сплошным текстовым «забором» без абзацев, красивых заголовков и отступов, а хорошо оформлена. Разнообразить свои Web-страницы можно изображениями и мультимедийными файлами : аудио или видео. В предыдущих версиях HTML добавлять их было сложно, приходилось использовать кучу функций, объектов и параметров. Наверное, именно поэтому так однооборазны были тогдашние страницы. Сейчас для этого достаточно одного тега с ссылкой — HTML 5 значительно упрощает задачу, для отображения файлов даже не нужен Flash Player. Чтобы использовать возможности пятой версии, возможно, придется указывать тип документа в начале кода. Отметим, что не все форматы изображений могут поддерживаться, поэтому приведем распространенные форматы, стандарты, и для чего они будут лучше.

Изображения. Формат GIF. Разработан в 1987 году, затем прошел модернизации. Это самый старый тип изображений, который имеет несколько незаменимых качеств : легко передается по сети из-за сжатия, поддерживает эффект «прозрачности», может содержать несколько изображений, объединенных в анимацию, идеально подходит для простых рисунков карандашом, чертежей, схем и моделей, ведь он выгодно сжимается, достаточно хорошо отображается, но поддерживает 256 цветов, поэтому другие картинки могут выглядеть совсем по-другому. Более уместно будут выглядеть иконки, штрихи и указатели.

JPEG. Более новый формат, разработанный именно для отображения полутоновых картин со множеством цветом. Ну а еще и сжатие тоже оптимизировано под «красочность». Используется довольно широко, но не подходит для прозрачности и анимирования, более выгоден под фотографии и картины. Впрочем, использовать можно и в дизайне.

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

Добавить картинок на страницу поможет одинарный тег <IMG>. Он является встроенным элементом, то есть обязан входить в какой-либо абзац (<P>). Чтобы отобразить изображение, достаточно лишь указать его ссылку в специальном атрибуте. <P><IMG SRC="picture9.png"><P>. Данный элемент поставит изображение picture9.png, хранящийся в той же папке, где и сама веб-страница, в то место, где встретится такой элемент.

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

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


Оставить комментарий или два

Я не робот!

Оповещать о новых комментариях по RSS