Создание текстовых веб-страниц
Самый простой способ создания текстовой веб-страницы — это набор ее кода в каком-либо текстовом редакторе, работающем с простым текстом без оформления и сохранение ее в файле с расширением .htm или .html. В операционных системах для этих расширений предусмотрена связь с браузером, поэтому делая двойной щелчок на имени файла мы открываем веб-страницу в браузере в режиме просмотра.
Изменить страницу можно в любом текстовом редакторе. Затем сохранить изменения на диске, после чего обновить страницу в браузере.
Помимо этого, имеются специальные редакторы, которые предназначены для разработки веб-страниц. Во многих из них поддерживается режим WYSIWYG, т.е. в процессе редактирования документ имеет такой же вид, как и при просмотре в браузере. Изменение содержания и оформления веб-страниц выполняется так же, как и в тек-стовых редакторах (используя мышь, меню и командные кнопки), при этом пользователь может не знать язык HTML — все нужные команды (теги) программа добавит автоматически. Однако профессиональными веб-дизайнерами редко используются WYSIWYG-редакторы, так как точная верстка (размещение материала на странице) практически всегда требует ручного редактирования HTML-кода.
Даже при поддержке редактором режима WYSIWYG полезно будет изучить код построенной в нем веб-страницы, чтобы в дальнейшем было легче перейти к созданию динамических сайтов.
Оформление текстовых веб-страниц
Оформляя текстовую веб-страницу можно решить 2 основные задачи: определение цветового оформления и достижение удобочитаемости текста.
Цветовое оформление
Выбирая цвет при создании веб-страницы на любом ресурсе, необходимо помнить, что цвет представляет собой средство передачи информации. От выбранной цветовой гаммы будут зависеть эмоции посетителей, их настроение при просмотре страницы.
Цвета веб-страницы сравнимы с голосом человека. Блеклые с низким контрастом схожи с тихим голосом, для которого характерно застенчивое и нерешительное произношение слов. Спокойные цвета с сильным контрастом схожи с сильным голосом спокойного человека. Насыщенный яркий цвет с резким контрастом могут создать ощущение громкого крика. Громким голосом всегда можно привлечь внимание, но согласитесь, не все любят, чтобы с ними разговаривали на повышенном тоне.
Ясный цвет улучшает читаемость страницы, зависящую от того, насколько легко воспринимается используемый шрифт на цветном заднем фоне. Отметим, что наиболее сильные, яркие или же теплые цвета использовать нежелательно, поскольку при чтении они способны вызвать напряжение и утомление.
Кто-то наделен умением правильного подбора цветовой гаммы от природы, кто-то учится этому опытным путем, но можно воспользоваться и научными знаниями, ведь существует такая наука как цветоведение (наука о цвете).
Вспомним детскую присказку: «Каждый охотник желает знать, где сидит фазан», с помощью которой запоминание последовательности цветов в спектре происходит согласно первым буквам этой фразы. Именно основными цветами (красным, оранжевым, желтым, зеленым, голубым, синим, фиолетовым), кроме того, желто-зеленым, зелено-голубым и оттенками пурпурного представлена цветная шкала цветов, называемая хроматической, которая представлена на рисунке.
Цвета различают теплые и холодные. Желто-красную часть спектра относят к теплым, а сине-голубую – к холодным.
Не нужно забывать про еще одну шкалу цветов, называемую ахроматической, или бесцветной, которая состоит из 2 основных цветов (белого и черного) и из цветов, которые получены от их различного пропорционального смешения. Получается довольно большой ряд оттенков серого цвета разной насыщенности – от чисто белого до сине-черного.
Хроматические и ахроматические цвета сочетаются между собой следующим образом: теплым цветам соответствуют темно-серые, а холодным - светло-серые. Это знание важно учитывать при цветовом оформление страницы. Например:
Еще один интересный факт – цвета, соседствующие друг с другом, иногда оптически кажутся выступающими вперед или же отступающими назад. Выступают теплые (светлые и насыщенные цвета), а отступают холодные (темные и ненасыщенные).
При оформлении веб-страниц необходимо учитывать, какие цвета гармонируют друг с другом, а какие ни в коем случае нельзя сочетать. Цветовые гармонии представляют собой комбинации небольшого количества цветов, расположенных в строго определенном порядке.
В основном используют 3 основные схемы гармонических сочетаний цветов:
- двухцветная гармония;
- трехцветная гармония;
- четырехцветная гармония.
Причем из двух последних лучше использовать не все цвета, а только 2 из 3 и 3 из 4 соответственно.
- Двухцветная гармония представлена сочетанием противоположных в цветовом круге цветов (оранжевый и темно-синий). В итоге получается немного грубоватое контрастное сочетание, что может придать дизайну определенную неповторимость.
- Трехцветная гармония - цветовой круг делится точно на 3 части. Выбирая один цвет, в двух других третях круга подбирают соответствующие цвета, в итоге гармонирует друг с другом каждый четвертый цвет (желтый, голубой и фиолетовый).
- Четырехцветная гармония – цветовой круг делится на 4 части, соответственно, гармонирует друг с другом каждый третий цвет (красный, салатовый, ярко-синий и лиловый).
При выборе цветовой гаммы важны многие факторы: тематика веб-ресурса, способ подачи информации, личные вкусы и т.д. Иногда приходится поэкспериментировать, пока не получится нужный результат. Профессиональными дизайнерами был разработан ряд оптимальных цветовых сочетаний в зависимости от тематики веб-ресурсов. Можно воспользоваться их рекомендациями.
Оформление шрифта
Встречают по одежке, а провожают по уму. Эта житейская мудрость известна давно. Всех, в первую очередь, привлекает красивая оболочка, а только потом начинка. У веб-страниц красивой оболочкой является цветовое оформление, а начинкой – текст. Всем хочется, чтобы начинка была «вкусной» пищей для ума.
Для удобного чтения текста на веб-странице его лучше разбить на абзацы, страница же должна быть оформлена в едином стиле. Под понятием стиля подразумевают набор элементов форматирования:
- гарнитура шрифта;
- размер шрифта;
- начертание шрифта;
- метод выравнивания.
Шрифт в основном выбирают согласно соображениям комфортного чтения. Так для выделения заголовков применяют шрифт большего размера, чем в основном тексте.
Размер шрифта должен быть согласован с общим видом веб-страницы. Не рекомендуется использовать слишком мелкий или слишком крупный шрифт. При оформлении веб-страницы можно использовать не более 2 видов шрифтов.
Полужирное начертание чаще применяют в заголовках и редко используют в основном тексте. Курсивом выделяют и заголовки, и часть текста, привлекая внимание к отдельному слову и фразе.
Подчеркивание при оформлении текста на страницах не рекомендуют использовать, поскольку пользователь воспринимает любой подчеркнутый текст как ссылку.
Для выравнивания текста существует 4 способа:
- по левому краю;
- по правому краю,
- по центру;
- по ширине.
Выравнивание по центру используют для заголовков, по правому краю – для примечаний и дополнений, а также для эпиграфов, по ширине и по левому краю выравнивается основной текст. Интересный факт, выравнивание по левому краю увеличивает скорость чтения веб-страницы, так как глаз человека легче находит начало новой строки.
Для структурирования текста используют таблицы.
Заголовки
Заголовки не рекомендуется писать прописными буквами, поскольку этим затрудняется чтение текста. Заголовки нужно начинать с заглавной буквы, и присутствовать они должны в начале каждой веб-страницы.
Подзаголовки служат для привлечения внимания, они помогают разделить информацию на смысловые части.
Заголовок (подзаголовок) задается стандартным форматированием, но можно в него внести изменения (размера, цвета, гарнитуры и т.д.).
При создании заголовков на страницах можно использовать графику, созданную даже в самом простом графическом редакторе типа Paint. Однако, нужно помнить про оптимизацию изображений и правильный выбор формата графического файла, лучше всего подходит формат png.
Сочетание правильно оформленного текста и красоты дизайна обеспечивают целостность восприятия веб-страницы.
