Данная тема создана для тех, кто не может найти максимально простой учебник для начинающих сайтостроителей, а делать сайт с готовым шаблоном не хочет. Здесь расписаны несколько простейших пунктов написания страниц, самые основы. Разумеется, для создания полноценного сайта этого недостаточно, но, по крайней мере, думаю, теперь вы не будете создавать темы вроде "Как сделать ссылку на страницу?"
01. О тегах
Читать дальше...
Для начала уясним, что страницы пишутся на особом языке, языке html. Html предназначен для разметки текстовых документов, т.е. с его помощью размечают текст, картинки и все остальное, расположенное на странице.
Чтобы все это записать, используются специальные метки, называемые тэгами (от англ. слова “tag”). Все тэги пишутся в скобках < и >, таким образом, все, что стоит в таких скобках – тэг. Такие тэги, как <html>, <head> и <body>, являются обязательными тэгами, которые должны присутствовать в нашей странице, чтобы она корректно отображалась.
Есть два типа тэгов: требующие закрывающего и не требующие. К первым относится тот же тэг <html>, а закрывающий вариант выглядит так: </html>. Ко вторым относится такой тэг, как <br>, отвечающий за начинание новой строки.
- Все, что расположено между тэгами <head> и </head> - голова документа, там, как правило, располагается различная служебная информация.
- Между тэгами <body> и </body> расположено непосредственное содержание страницы, то есть текст, картинки и т.д.
Тэг может содержать в себе и другие тэги, но важно помнить последовательность закрывания тэгов:
<тэг1><тэг2>содержание</тэг2></тэг1>
То есть, если вы начали тэг 1 раньше тэга 2, то закрыть тэг 1 следует после того, как вы закроете тэг 2.
Посмотреть, какие еще есть тэги, можно тут: http://html.maxhost.ru (кстати, добавьте эту страницу в избранное, она вам еще пригодится).
02. Шрифт и цвет, фон
Читать дальше...
Как же изменить шрифт и его цвет? Очень просто. Следует прописать в специальном тэге <font> (обратите внимание, что этот тэг закрывающийся) нужный нам шрифт и его цвет, а если хотите – еще некоторые параметры, помогающие отобразить написанный текст разнообразнее.
Но тут нужно помнить, что далеко не все шрифты, которые есть на вашем компьютере, окажутся и на всех других машинах, а значит, не на всех других они будут отображаться так, как надо. Поэтому лучше используйте стандартные шрифты:
Times, Arial, Verdana, Tahoma, Helvetica, Courier, Cosmic Sans или Garamond. Как они выглядят, можете посмотреть, открыв Microsoft Word и выбрав нужный шрифт.
Существуют цвета, которые одинаково хорошо поддерживают все броузеры, поэтому если вам не нужно каких-то особо индивидуальных настроек цвета, воспользуйтесь теми, что показаны здесь: http://www.artlebedev.ru/tools/colors Код, состоящий из букв и/или цифр, расположенный над цветом, вы и прописываете в тэге <font>. Также существует несколько вариаций написания текста, например: жирный, подчеркнутый, курсив. Они отмечаются соответственно тэгами <b></b>, <u></u> и <i></i>. Но следует помнить, что эти тэги прописываются отдельно от тэга <font>.
Вот как это делается.
- Например, вам нужно, чтобы фраза «Я живу в России» была написана шрифтом Tahoma, была синего цвета (код 000099) и отображалась курсивом. Прописываем:
<font face=”Tahoma” color=”000099”><i>Я живу в России</i></font>
(Обратите еще раз внимание на очередность закрывания тэгов!)
Face и color, а также все другие подобные им дополнения к тэгам, носят название параметр или атрибут.
- Если же вы хотите, чтобы весь текст на всей странице был какого-то определенного цвета (по умолчанию он черный), допустим, того же синего, то прописываем в тэге <body> атрибут text, иными словами, вот это:
<body text="000099">
Когда вам нужно сделать фон страницы какого-то определенного цвета, например, белого, то прописываете следующее:
<body bgcolor=”FFFFFF”>
Только, пожалуйста, не клонируйте эти тэги <body>, вы можете прописать и текст всей страницы, и ее фон в одном тэге, используя просто пробел между атрибутами. Например:
<body text=”000099” bgcolor=”FFFFFF”>
03. Картинки
Читать дальше...
Вставлять картинки тоже очень легко. Существует тэг <img> (он не требует закрывания). Например, картинка, которую вы хотите вставить на страницу, носит название myimage.jpg (только не забудьте загрузить ее в сеть, иначе у вас ничего не получится).
Прописываем:
<img src=”myimage.jpg”>.
Готово! Ваша картинка появилась на странице.
Прямо от картинок давайте перейдем к ссылкам.
04. Ссылки
Читать дальше...
Ссылкой может быть и текст (1), и картинка (2), создается ссылка с помощью тэга <a> (он является закрывающимся).
- (1) Допустим, вам нужно сделать ссылкой на какую-то страницу на вашем сайте, носящую название «stranitsa2.html», слово “Страница 2”. Вот как это будет выглядеть:
<a href=”stranitsa2.html”>Страница 2</a>
- (2) В случае с картинкой, пишется все немного иначе. Например, следует сделать ссылкой на страницу 2 всю ту же картику myimage.jpg. Пишем:
<a href=”stranitsa2.html”><img src=”myimage.jpg”></a>
В этом случае, нажав на картинку, вы попадете на нужную страницу.
Также следует разобрать один важный момент: ссылка на е-майл. Прописывается это чуть-чуть по-другому. Если ваш е-майл – vasya@mail.ru, то прописываете следующее:
<a href=”mailto:vasya@mail.ru”>
"Mailto" в данном случае – вещь обязательная.
Помимо этого, ссылка может быть ссылкой не только на страницу, но и на картинку, какой-то другой файл (музыку или программу, которые пользователи смогут скачать с вашего сайта). Делается это так. Допустим, нужно сделать слова "Моя фотография" ссылкой на картинку с именем myimage.jpg.
<a href="myimage.jpg">Моя фотография</a> Вот и все!
Это - самые-самые основы языка html, но существует еще очень много всяких разностей, тонкостей, дополнений, о которых вы можете узнать по тем адресам, которые я давала выше. Смотрите, пробуйте, учитесь!
Удачи вам и вашему сайту!