Создание сайта HTML
Продолжаем пошаговое создание сайта. Решим некоторые проблемы. Во-первых, сделаем, чтобы все элементы графики были как единое целое, и текст находился вверху, а не по центру.
Для того чтобы соединить все элементы графики воедино, уберем границы таблицы html. Хоть их и не видно, но они есть.
В главную таблицу, в тег <table> поместим два параметра cellpadding=0 и cellspacing=0, со значением 0, кавычки можно опустить. Эти параметры обирают все границы.
Двигаемся дальше в пошаговом создании сайта. У нас образовался промежуток между шапкой и сайтом, его необходимо убрать.
Для этого поместим параметр topMargin="" в тег <body> и придадим ему значение 0, то есть <body topmargin="0">. После этого промежуток должен удалиться.
Теперь разберемся с текстом. Он находиться по центру, а должен вверху. Для этого преминем еще один параметр, которые укажем в ячейках меню и области под контент. Вот он, valign="", со значением top.
Итак, учтя все изменения должен получиться следующий код:
<html>
<head>
<title>Сайт об Интернете. Полезные ссылки и другая информация.</title>
</head>
<body topmargin="0">
<center>
<table width =900 height=600 cellpadding=0 cellspacing=0>
<tr>
<td colspan="2" width=900 height=162><img src="shapka.jpg"></td>
</tr>
<tr>
<td width=205 height=387 background="menu.jpg" valign="top">Меню сайта</td>
<td width=695 height=387 background="kontent.jpg" valign="top">Область под контент</td>
</tr>
<tr>
<td colspan="2" width=900 height=51><img src="niz.jpg"></td>
</tr>
</table>
</center>
</body>
</html>
Если вы действовали согласно пошаговому созданию сайта, то должно получиться так > результат
Пошаговое создание 2-ой страницы сайта
Пришло время создать вторую страницу сайта и объединить их ссылками, но для начала обсудим один важный момент.
Вы создали первую страницу сайта html код, которой указан выше. Эта страница должна иметь название index.html то есть весть код в блокноте нужно сохранит под именем index.html.
Если у вас другое название – переименуйте. И следите за тем, чтобы страница не называлась index.html.txt.
Вот такое правило. Главная страница сайта обязательно должна иметь название index с расширением .html или .php – это расширение динамической страницы написанной на языке программирования PHP, но об этом будет рассказано потом.
Могут быть и другие расширения, например .htm, но главная страница должна носить имя index.
Сейчас приступим к созданию второй страницы, для этого нужно сохранить первую страницу еще раз, но под другим именем – page2.html
Итак, у нас две одинаковых страницы с разными именами: index.html и page2.html
Займемся редактированием page2.html.
Откройте ее при помощи блокнота и внесите изменения. Допустим, на ней будут размещаться ссылки на разные ресурсы.
Значит, нам нужно изменить название страницы в тегах <table> </table> и написать другой контент, например ссылку на сайт htmlsait.ru
Следуйте пошаговому созданию сайта. Получает следующий html код:
<html>
<head>
<title>Ссылки на полезные ресурсы.</title>
</head>
<body topmargin="0">
<center>
<table width =900 height=600 cellpadding=0 cellspacing=0>
<tr>
<td colspan="2" width=900 height=162><img src="shapka.jpg"></td>
</tr>
<tr>
<td width=205 height=387 background="menu.jpg" valign="top">Меню сайта</td>
<td width=695 height=387 background="content.jpg" valign="top">
Здесь будут ссылки на полезные ресурсы
<br> <br>
<a href="http://htmlsait.ru">Создание сайтов HTML</a>
</td>
</tr>
<tr>
<td colspan="2" width=900 height=51><img src="niz.jpg"></td>
</tr>
</table>
</center>
</body>
</html>
Вторая страница пошагового создания сайта выглядит так > 2 страница сайта
Осталось только связать эти страницы между собой. Для этого в ячейке предназначенной под меню, поставим две ссылки: одну на главную страницу, другую на page2.html
Обратите внимание на то, что обе эти ссылки должны быть и на index.html и на page2.html, причем в одном и том же месте.
Это необходимо, так как меню является общим для всего сайта.
Вносим изменения в страницу index.html и получаем код:
<html>
<head>
<title>Сайт об Интернете. Полезные ссылки и другая информация.</title>
</head>
<body topmargin="0">
<center>
<table width =900 height=600 cellpadding=0 cellspacing=0>
<tr>
<td colspan="2" width=900 height=162><img src="shapka.jpg"></td>
</tr>
<tr>
<td width=205 height=387 background="menu.jpg" valign="top">Меню сайта
<br> <br>
<a href="index.html">Главная</a>
<br> <br>
<a href="page2.html">Ссылки</a>
</td>
<td width=695 height=387 background="kontent.jpg" valign="top">Область под контент</td>
</tr>
<tr>
<td colspan="2" width=900 height=51><img src="niz.jpg"></td>
</tr>
</table>
</center>
</body>
</html>
Все. Сайт готов и он выгляди так > результат
Остановимся на важных моментах. Обратите внимание на добавление тегов <br>, он нужны для переноса на другую строчку.
Обе страницы и графика должны находиться в одной папке. Главная страница должна называться index.html
Содержание ячейки меню должно быть одинаково на обеих страницах.
Вот вы и сделали свой первый, полноценны сайт и если следовали пошаговому созданию сайта, то должно было все получиться.
Сайт получился не очень крутым, но и его уже можно разместить в Интернете.