HTML: Популярный самоучитель
Шрифт:
При анализе текста приведенного сценария можно увидеть, что сценарием создается таблица, занимающая все доступное пространство (имеется в виду левая часть страницы). В ячейки этой таблицы и добавляются различные сведения. В данном случае это одна из 14 картинок с изображением яблок в папке apples, а также надпись.
Еще один сценарий используется для заполнения ячейки в нижней части страницы сведениями об авторских правах. Он записан в файле copyright.js и состоит из одной-единственной строки:
document.write(«© Чиртик Александр 2006»);
Используемые таблицы стилей
В двух CSS-файлах помещены используемые таблицы стилей. В файле page.css находится таблица стилей, используемая для оформления текста страниц (плюс оформление основной таблицы страниц) (пример 14.9).
/*
Определения стилей для таблицы, форматирующей страницу
*/
TABLE.main_table {width: 100%; border-style: none;
background-color: green}
COL.info {width: 100px; background-color: rgb(180,255,200)}
COL.content {background-color: rgb(200,255,200)}
TR.copyright {background-color: green; color: white; text-align: right;
padding: 5; font-size: 3mm}
/*
Стили рецептов
*/
.process {font-size: 85%}
.products {font-style: italic; font-size: 85%}
/*
Прочие стили разметки
*/
H1 {text-align: center}
В файле menu.css находится таблица стилей, используемая для оформления пунктов меню и рецептов (пример 14.10).
/*
Стиль строки меню и ее пунктов
*/
.menu_line {border-style: none; background-color: green;
width:100%; text-align: center}
.main_item {background-color: green}
.main_selected {background-color: magenta}
A.main_href {color: rgb(230,230,230); text-decoration: none;
font-family: "times new roman"}
/*
Стиль пунктов меню
*/
.item {background-color: rgb(230,230,230)}
.selected {background-color: magenta}
A.main_href {}
/*
Стили отображаемого и спрятанного меню
*/
.menu {border-style: solid; border-width: 1px;
visibility: visible; position: absolute;
background-color: rgb(230,230,230); border-color: black}
.hidden {display: none}
/*
Определение стилей для разворачиваемых элементов exp – класс элемента, при щелчке кнопкой мыши на котором будет показан соответствующий элемент класса expbody
*/
.exp {background-color: rgb(150, 255, 200)}
.exp_ref {text-decoration: none; font-weight: bold}
.expbody {display: block; background-color: rgb(150, 255, 150)}
.exp_hidden {display: none}
В приведенных таблицах стилей использовано небольшое количество настроек, чтобы слишком не увеличивать размер таблиц.
14.5. Примеры работы сайта
При открытии сайта пользователь попадает на главную (стартовую) страницу (файл index.html), показанную на рис. 14.4.
Рис. 14.4. Главная страница сайта
Реализованная страница истории яблок особого интереса не представляет. Обратим внимание, как выглядит страница с рецептами, ведь там дополнительно используются реализованные нами разворачивающиеся абзацы. Итак, внешний вид страницы с рецептами приведен на рис. 14.5 (начало страницы).
Рис. 14.5. Страница с рецептами
Сами рецепты выглядят так, как показано на рис. 14.6.
Рис. 14.6. Страница с рецептами (сами рецепты)
Ну вот, мы выполнили практически все необходимое для того, чтобы можно было поместить сайт в сеть Интернет (правда, содержание сайта пока неполное). Как раз этому посвящена следующая – последняя – глава книги.
Глава 15
Публикация сайта в Интернете
После того как пройден путь от изучения основ HTML до создания собственного сайта, наступило время выйти в большой мир, то есть опубликовать сайт в Интернете. Для этого нужно узнать еще совсем немного (на первый взгляд): как, где помещается сайт в Сети.
15.1. Ищем место для сайта
Чтобы опубликовать сайт в Интернете, нужно сначала найти для него место. В Сети существует ряд серверов, предназначенных как раз для размещения на них сайтов. Услуга предоставления места на таком сервере называется хостингом.
Существует большое количество компаний, осуществляющих как платный, так и бесплатный хостинг. Оба вида хостинга имеют свои преимущества и недостатки. Основными недостатками бесплатного хостинга зачастую являются следующие:
• ограничение на объем данных сайта (часто, но не всегда);
• отсутствие поддержки полезных сервисов и сценариев, выполняемых на сервере (например, PHP-сценариев);
• довольно строгие требования к содержанию сайта и возможность удаления сайта (некоторые хостеры удаляют сайты, содержащие, например, файловые архивы);
• отсутствие гарантий постоянной готовности сервера, то есть вероятность (и иногда она бывает высокой), что ваш сайт будет недоступен пользователям Сети;
• более «слабое» оборудование по сравнению с серверами платного хостинга.
Кроме всего перечисленного, при пользовании бесплатным хостингом часто приходится расплачиваться местом страницы, отведенным под рекламу (баннеры, ссылки и пр.), ведь хостеру нужно как-то зарабатывать деньги.
Естественно, что при пользовании платным хостингом открывается значительно больше возможностей, появляются гарантии того, что ваш ресурс будет доступен, по крайней мере, максимально возможное время, а также многое другое. Однако начинающему веб-мастеру, особенно если его проекты не связаны с коммерцией и не приносят дохода (как наш сайт о яблоках), резонно воспользоваться услугами бесплатного хостинга.
Чтобы получить информацию, где и на каких условиях вы можете разместить свой сайт, достаточно ввести слово «хостинг» или что-то подобное в строке поиска любого поисковика, например Google (www.google.com).
Не стоит оставлять без внимания и тот факт, что возможность размещения для зарегистрированных пользователей личного сайта на своем сервере предоставляют некоторые интернет-порталы. Для таких сайтов бесплатно выделяется очень небольшой объем (5–10 Мбайт), но зато вероятность удаления сайта не более чем вероятность удаления учетной записи пользователя портала. Только следует помнить, что и здесь действует законодательство о цензуре. Для поделок начинающих мастеров такой хостинг подходит как нельзя лучше. Тем более что, помимо сайта, вы будете располагать еще и почтовым ящиком.
Для размещения созданного в предыдущей главе сайта воспользуемся услугами как раз интернет-портала, а конкретно – интернет-портала www.tut.by. Пользователю этого портала предоставляется 50 Мбайт на почтовый ящик и 5 Мбайт на личный сайт. Ну что же, для начала вполне хватит. К тому же здесь вполне снисходительно относятся к пользователям в отношении обязательного размещения рекламы на личном сайте – ее нет.
15.2. Доменное имя для сайта
Сайт мало просто разместить на сервере, доступном по Интернету. Его же нужно как-то идентифицировать. Для сайта нужно заполучить доменное имя. Что же это такое?