Отправляет email-рассылки с помощью сервиса Sendsay

Заработок в интернете.

  Все выпуски  

Заработок в интернете. html


 Здравствуйте, дорогие подписчики спасибо вам за то ,что вы подписались на рассылку.

Немного истории. Интернет, каким вы знаете его сейчас, появился совсем недавно - в 1992 году. Именно тогда была реализована первая спецификация языка HTML, разработанного человеком, которого зовут Тим Бернерс-Ли. Название этого языка представляет собой аббревиатуру от словосочетания HyperText Markup Language (язык гипертекстовой разметки документов). Если не вдаваться в детали этот язык позволяет отобразить нелинейный (т.е. разделенный на отдельные блоки) документ при помощи линейного текста (этот текст вы можете увидеть выбрав пункт "Просмотр HTML-кода" в меню "Вид" Internet Explorer'а).

Взгляните на этот текст. Там вы можете увидеть элементы текста, заключенные между значками < и >, например <html>. Это
теги языка HTML. Браузер воспринимает теги, как инструкции по разметке документа. Все, что не находится между значками < и >, браузер воспринимает как текст и просто тупо выводит его на экран. Для того, чтобы написать веб-страницу необходимо использовать теги. Именно они позволяют создать красивую шапочку у страницы, разместить меню сайта слева, вверху, внизу и т.д. Например, для того чтобы создать вот такую ссылку, необходимо написать в текстовом файле следующий текст:

<html><body><a href="http://www.subscribe.ru" target="_blank">ссылку</a></body></html>

Создайте текстовый документ, напишите в нем этот текст, а затем переименуйте его в "index.html" (папка, в которой он лежит, не имеет значеня, хоть на Рабочем столе) и откройте его.

Возникает вопрос - что обозначают слова
href, target и т.д.? Это - параметры тега. В данном случае параметр href обозначает адрес, на который ведет ссылка, а параметр target="_blank" указывает браузеру, что ссылку нужно открыть в новом окне. Практически любой тег может иметь параметры. Правда, есть теги, у которых параметры почти никогда не используются, например тег <br> (он переносит текст на новую строку).

Весь документ дожен находиться между тегами <html> и </html> (обычно говорят так: внутри тега html). Тег который имеет слэш (/), назывется закрывающим. Для большинства тегов он обязателен, для некоторых - желателен, а для остальных - запрещен. Как узнать, требуется ли закрывающий тег? Надо помнить, либо иметь справочник под рукой. Когда будет закончен сайт, я выложу там справочник по тегам.

Каждая веб-страница может состоять из двух частей: заголовка и тела. Под заголовком понимается не текст написанный вверху страницы большими буквами, а внутренние параметры документа. Найти эти части нетрудно:

<html>
  <head>
    Это заголовок документа
  </head>
  <body>
    Это тело документа
  </body>
</html>

То, что находится в заголовке, пользователь не увидит, заголовок необходим для служебных целей. Например, там можно задать текст, который будет отображаться в заголовке окна браузера, подключить к веб-странице другие файлы, указать ключевые слова для поисковиков и т.д.
Внутри тега <body> находится то, что будет открыто в окне браузера.
Об использовании пакета "Denwer"

Если вы уже закачали и установили пакет, то лучше всего начать его использование сразу. После установки у вас в папке "Мой компьютер" (или "Компьютер" в Windows Vista) должен появиться новый диск (по умолчанию - диск Z:). Откройте его, после этого откройте папку "home". Там есть несколько папок (localhost, custom, test1.ru и т.д.). Эти папки представляют собой виртуальные хосты. Например, если в адресной строке набрать "http://localhost", откроется страница приветствия, установленная вместе с Денвером. Создайте в папке "Z:\home" новую папку (назовите ее, например, webdev), а в ней - папку "www". После этого положите туда файл "index.htm", который мы написали чуть раньше. После этого перезапустите Денвер (ярлык "Restart Denwer" на Рабочем столе). После этого наберите в адресной строке браузера "webdev". Вы должны увидеть страницу с ссылкой, которую написали ранее. Для начала этого достаточно. Объясняется все просто - создавая новую папку, вы автоматически создаете новый сайт на локальном хосте (т.е. на вашем компьютере), причем адрес сайта совпадает с названием папки, а в папке "www" находятся файлы, относящиеся к этому сайту. Если вы рядом с папкой "wwww" создадите папку "subdomain", то после перезапуска Денвера будет доступен адрес "http://subdomain.webdev".

Говоря строго, Денвер нам потребуется только когда мы перейдем к изучению PHP, но я думаю, будет лучше, чтобы вы привыкли сразу использовать серверные технологии. Если вы еще не скачали Денвер, лучше всего сделать это сейчас.

Новые теги

  Название тега     Описание тега     Закрывающий тег     Параметры     Пример  
  <html>     Указывает браузеру на начало документа. Этот тег обязателен для любой веб-страницы     </html> - обязателен     Не требуются     -  
  <head>     Указывает браузеру на заголовок страницы.     </head> - обязателен     Не требуются     -  
  <body>     Указывает браузеру на тело страницы.     </body> - обязателен     Не требуются     -  
  <a>     Гиперссылка     </a> - обязателен   href - адрес, на который ведет ссылка
target (_blank) - окно назначения (_blank означает в новом окне)
title - подсказка к ссылке
<a href="http://www.subscribe.ru" target="_blank" title="subscribe.ru">subscribe.ru</a>  
Результат:
subscribe.ru
  <br>     Принудительный перенос текста на новую строку     Запрещен   - Это<br>пример<br>использования
Результат:
Это
пример
использования

Практика

Попробуем применить полученные знания на практике. В программировании есть традиция: программа "Hello, world!". Мы не будем отступать от нее. Начнем.
Если у вас стоит Денвер, то в папке "Z:\home\webdev\www" (см. выше) создаем текстовый документ, переименовываем его в "index.htm" (в принципе, вы можете дать ему расширение *.html или *.php). Следом открываем его с помощью блокнота (если вы установили специальный редактор для программистов, то с его помощью). Внутри пишем следующий текст:

<html>
  <head>
    <title>Моя первая веб-страница</title>
  </head>
  <body>
    Привет, интернет, это моя первая веб-страница<br>
    А это моя первая <a href="http://subscribe.ru/archive/comp.soft.prog.webdev" target="_blank" title="Подписаться на рассылку о веб-разработке">гиперссылка</a><br>
    А это моя первая ссылка на <a href="mailto:author@itml.su">электронную почту</a>
  </body>
</html>
Комментарий: тег <title> используется, чтобы задать текст, который будет отображаться в заголовке окна браузера.

Сохраняем, запускаем через браузер и наслаждаемся приобщением к славному обществу веб-разработчиков.

Итог

Сегодня мы начали изучение языка HTML. Мы ознакомились с основными принципами построения гипертекстовых документов, изучили самые важные теги. Также мы научились использовать серверные технологии, которые пригодятся нам, когда мы будем изучать серверные языки программырования (PHP). Также я хотел бы дать несколько советов:

  • Набирайте текст сами, а не просто копируйте его через буфер обмена.
  • Не бойтесь экспериментировать. Изучить некоторые теги очень просто - откройте любую веб-страницу в блокноте, чтобы посмотреть, какие теги там используются.
  • И, наконец, не стесняйтесь писать мне на email - буду рад ответить.

Об этих и некоторых других тегах я расскажу в следующем выпуске:

  • <b>текст</b> - жирный текст
  • <u>текст</u> - подчеркнутый текст
  • <i>текст</i> - наклонный шрифт
  • <h[число]>текст</h[число]> - устанавливает размер шрифта. Число может принимать значения от 1 до 6. Напрмер, <h3>текст</h3>
<b><i>Теги можно комбинировать</i></b>. Поэкспериментируйте с этими тегами.


В избранное