Изучение HTML кода. Вводное занятие.
Основные HTML теги
Один из способов продвижения своего товара в Интернете – это web-сайты, страницы. Предлагаю Вам научиться созданию таких визиток на примере HTML программирования. Для начала особых знаний не потребуется. А из программного обеспечения достаточно будет стандартного Блокнота Windows или другого текстового редактора.
Структура HTML страниц
Давайте разберем структуру HTML. Web-страницы состоят из обычного текста заключенные в специальные теги. Теги – элементы помогающие структурировать данные. Имеют вид < тег > и </тег >.
Для того, что бы было понятно, что обозначает каждый тег, предлагаю ознакомиться наглядно. Для этого откройте Блокнот. И окунемся в мир HTML – это доступно любому желающему. Основные HTML теги:
< HTML > и </ HTML > - теги открывающие и закрывающие документ. Все, что располагается между ними будет обрабатываться браузером и влиять на отображение на мониторе. Наберите в блокноте:
<HTML>
</HTML>
Нажмите «Сохранить как». Укажите название файла index.html (так обычно называются стартовые страницы; *.html – такое расширение у web-страниц).
Открыв сейчас index.html в браузере вы увидите перед собой белую чистую страницу. Начнем ее заполнять и облагораживать!
Следующий тег <HEAD> и </HEAD> - шапка страницы. Текст расположенный внутри него является настройками, диктующие правила для браузера.
<HTML>
<HEAD>
</HEAD>
</HTML>
Тег < TITLE > и </ TITLE > - прописывается в "шапке" и текст расположенный в нем будет отображаться в браузере названием страницы.
Например,
<HTML>
<HEAD >
<TITLE >
Моя первая страница
</TITLE>
</HEAD>
</HTML>
Будет выводить в названии страницы – «Моя первая страница».
Тег < BODY > и </ BODY > - тело страницы. Текст заключенный между ним предназначен для отображения. Наберите и сохраните:
<HTML>
<HEAD>
<TITLE>
Моя страница
</TITLE>
</HEAD>
<BODY>
Моя первая web-страница HTML!!!!!!
</BODY>
</HTML>
Откройте документ в браузере. Должно получиться:
Поздравляю, Вы создали свою первую web-страницу HTML!!!
Теперь рассмотрим пару приемов, которые сделают страницу более привлекательной.
Обработка текста HTML
<B> и </B> - текст заключенный в эти теги будет выделен жирным начертанием.
Например:
<B> Текст жирным шрифтом </B>
Будет выглядеть как:
Текст жирным шрифтом
<I> и </I> - текст заключенный в эти теги будет отображен курсивом.
Например:
<I> Текст написан курсивом </I>
Будет выглядеть как:
Текст написан курсивом
<U> и </U> - эти теги сделают текст подчеркнутым.
Например:
<U> Этот текст подчеркнут с помощью тегов </U>
Будет выглядеть как:
Этот текст подчеркнут с помощью тегов
Теги заголовков выглядят как <h Номер> и </h Номер>, где вместо «Номер» стоит число от 1 до 6.
<h1> Заголовок 1 </h1>
<h2> Заголовок 2 </h2>
<h3> Заголовок 3 </h3>
<h4> Заголовок 4 </h4>
<h5> Заголовок 5 </5>
<h6> Заголовок 6 </6>
Заголовок 1
Заголовок 2
Заголовок 3
Заголовок 4
Заголовок 5
Заголовок 6
Другие параметры текста изменяются с помощью тега <FONT> и </FONT> и проставленных в нем пераметров.
Для того, что бы изменить размер текста применяют параметр size="...", указывая номер шрифта от 1 до 6, который бы вы хотели применить.
Если вы хотите изменить цвет текста, то нужно применить параметр color="...", указав интересующий вас цвет.
Красный - #FF0000 пример
Зеленый - #00FF00 пример
Синий -#0000FF пример
Желтый - #FFFF00 пример
Черный -#000000 пример
Белый - #FFFFFF
Серый - #999999 пример
Бирюза - #009999 пример
Телесный - #FFFFCC пример
Голубой - #CCFFFF пример
Так, если вы хотите написать текст синим жирным курсивом, шрифтом 3, нужно указать:
<FONT size="3" color="#0000FF"> <B> <I> Пример текста с применением параметров HTML обработки =)</I> </B> </FONT>
В результате получим:
Пример текста с применением параметров HTML обработки =)
Для того, что бы сделать ссылку на другую web-страницу, применяют тег <a href="URL"> и </a>, разместив между ним адрес. Например <a href=" http://ex77.at.ua/ "> текст </a>, сделает ссылку текст.
Для того, что бы вставить картинку, используют тег <img src="URL картинки">. Например, <img src="http://ex77.at.ua/cartinka.gif">
Вот основные элементы, благодаря которым вы сможете создать страницу своему продукту. Дальше я покажу, как используя все это, добиться красивого эффекта. ЧИТАТЬ ДАЛЬШЕ!
В ближашее время на сайте http://ex77.at.ua/ будут опубликованы скриншоты выплат из сисем и графики прибыли. Так же ведуться работы над разделами регистрации и выплат Webmoney, PayPal, AlertPay. Свои вопросы можете задать здесь.
