Итак, каркас web-страницы мы создали, рамку ей сделали, а теперь будем продолжать создание web-страницы и наполнять страницу контентом, делать меню и.т.д. А начнем с названия сайта, с его заголовка, который естественно должно быть в хедере. В соответствии с правилами поисковой оптимизации, заголовок сайта должен отражать его тематику и содержать ключевые слова, соответствующие этой тематике. Просто для примера, я выбрал тематику создаваемого нами сайта, как сайта о лошадях. Поэтому и придумал вот такой заголовок: — Человек и лошади. Это все, на что хватило сегодня фантазии. Зато коротко.
Теперь мы этот заголовок поместим в хедер создаваемой web-страницы. Просто ставим курсор в поле контейнера header и набираем текст. Не очень красиво? Сейчас поправим.
О названии сайта. По правилам оптимизации под поисковые запросы, название сайта, то есть заголовок, должно быть выполнено в формате h1, заголовок статьи на web-странице в формате h2, подзаголовки в форматах h3-h6.
Возвращаемся к заголовку и присваиваем ему формат h1. Как? Ставим курсор на заголовке. В нижнем доке редактора в выпадающем меню окошка Формат выбираем Заголовок1. Вот и все. Опять не красиво? Сейчас сделаем!
Но прежде чем непосредственно заняться заголовком, давайте определим тип и размер шрифта для всей web-страницы. Потом нам это очень поможет в форматировании шрифтов отдельных ее частей. Тем боле это не сложно. Просто нужно создать стиль для тега body. Вот так:
Сам тег выбираем из списка. В свойствах стиля задаем шрифт Arial размер шрифта 12 пикселей. И переходим к заголовку сайта.
Конечно, надпись черным шрифтом на всю ширину web-страницы сайт не украсит. Поэтому создаем стилевой класс для тега h1, так же как мы сделали это для тега body, в котором сделаем дизайн заголовка в таком виде, в каком Вы пожелаете. А именно. В категории Тип задаем размер шрифта 200%, стиль – наклон, цвет - #008800.
Продолжаем создание web-страницы. Оставляем пока хедер в покое и прейдем к контенту создаваемой web-страницы. Откроем стиль контента content в режиме редактирования. Напоминаю, что для этого достаточно щелкнуть правой клавишей мышки на названии стиля и в выпадающем меню выбрать Редактировать. В категории Блок выравнивание текста зададим - по ширине. В категории Рамка сделаем отступы текста от рамки по 5 пикселей и соответственно уменьшим ширину контейнера content до 575 пикселей:
Набираем или вставляем методом копирования в контейнер content текст статьи и сразу создадим ей заголовок. Заголовки статей будем делать в формате h2. Поэтому создаем стилевой класс для тега h2, так же как мы сделали это для тега h1, в котором сделаем дизайн заголовков статей. А конкретно — в категории Тип задаем размер шрифта 130%, цвет - #008800, в категории Блок – выравнивание текста по центру. Теперь можно непосредственно набрать название статьи и присвоить ему формат h2 так же, как это мы делали для заголовка - h1.
Ну и для завершения написания статьи вставим в текст web-страницы какой-либо рисунок. Как вставлять в контент графику? Если не знаете или забыли, то это легко вспомнить на странице Вставка рисунков и фотографий.
Я же вставляю рисунок лошади в начало статьи, выравниваю его по левому краю и задаю отступ по горизонтали в 5 пикселей. И вот что будем иметь в браузере:
Кстати, не забудем открыть стиль внешнего контейнера cont в режиме редактирования и в категории Рамка убрать значение высоты контейнера. На сегодня пока все. В следующий раз мы продолжим создание web-страницы и сделаем неотъемлемую часть любого сайта - меню.