WebBum.

 

 


Ссылки сайта

Главная

Web дизайн

Основы HTML

Java скрипты

Советы

Раскрутка сайта

Работа в Internet

Юмор

О нас

 

 

 

 

 

Как создать свой сайт бесплатно

Реклама

 

 

Итак, вы освоили какой-либо из HTML-редакторов, изучили язык HTML. Значит ли это, что вы сможете создавать красивые страницы? Отнюдь. Дело в том, что HTML обладает весьма существенным недостатком: он не позволяет разместить текст или картинку на странице так, как вам хочется. Один и тот же текст при разных экранных разрешениях будет выглядеть по-разному. Например, при разрешении 800х600 он может занять одну строчку, а при 640х480 - две. А если учесть, что разные браузеры на разных компьютерах используют различные шрифты...

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

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

Другими словами, добиться того, чтобы HTML-страница выглядела точно так, как вам хочется, крайне сложно. А иногда и невозможно.

Но тем не менее получить примерно то, что нужно, вполне возможно - если прибегнуть к помощи таблиц.

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

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

Таким образом, к примеру, задачка размещения подписи строго справа от рисунка решается помещением обоих в табличку. Размер левой ячейки установим равным строго размеру картинки, а размер правой - половине от ширины основного текста.

 Время загрузки страницы напрямую зависит от длины HTML-кода и размера рисунков, размещенный на странице. Существенно уменьшить HTML-код нам вряд ли удастся, а вот над картинками можно поработать. Во-первых, все картинки на сайте (кроме фотографий)должны быть в сохранены в формате GIF. Если Вы рисуете в Photoshop’е, то при сохранении (Сохранить->Сохранить для Web) выберите режим «Adaptive» («адаптированный»). Этот режим позволяет выбрать наименьшее нужное количество цветов. Таким образом можно уменьшить среднюю картинку на 5 килобайт. И еще один совет - не используйте картинок там, где этого можно избежать. Но! Если вы используете специфические шрифты, которых заведомо нет у среднего пользователя Интернета, то лучше замените текст картинкой. Этим Вы сможете избежать некорректного отображения Ваших текстов.

ВНИМАНИЕ! Большинство операционных систем, управляющих Интернет-серверами, различают регистр букв, поэтому надо тщательно следить, чтобы имя файла указывалось с соблюдением регистра. Начинающие дизайнеры часто недоумевают - картинка не появляется на странице. А дело в том, что они указали имя kartinka.gif, а на диске хранится Kartinka.gif.

 Надо выбрать цветовую гамму сайта. Обычно это 3-4 цвета, но бывает и два. Например: черный, серый, белый; синий, красный; желтый, серый, черный, белый. Вообще, существуют несколько наборов цветов, которые почти всегда выглядят привлекательно. К ним относятся: 1) бессмертное сочетание черного и белого, 2) белый, черный, оранжевый, 3) зеленый и/или черный и белый, 4) красный и белый, 5) красный или черный, желтый и белый и др. Другая категория - цветовые сочетания, которые иногда могут испортить весь дизайн. Это, например, - синий и черный; красный и зеленый и др. И, наконец, последняя категория - «черный список». Такие цветовые сочетания нельзя использовать ни в коем случае. Вот они: 1) серый и пурпурный, 2) серый и желтый, 3) все цвета радуги в одной куче :), 4) красный или розовый и голубой и др.

При работе с картинками вам потребуются некоторые  программы. Paint Shop Pro можно скачать с сайта http://www.tucows.com/. Кроме того, вы можете оптимизировать графику, которая уже находится на вашей странице. Инструкции можно найти на http://www.webreference.com/ и http://www.gifwizard.com/.

 (источник: Дизайн студия D_#F_ -Уроки web-дизайна, КОМПЬЮТЕРРА)

 

 

 

  

 

 

Hosted by uCoz