Автор Тема: Делаем сайт своими руками!  (Прочитано 3366 раз)

0 Пользователей и 1 Гость просматривают эту тему.

Сентября 24, 2011, 09:20:25 pm
  • Администратор
  • Учитель
  • *****
  • Сказали спасибо
  • -вы: 93
  • -вам: 40
  • Topic Author
  • Сообщений: 1167
  • Инквизитор
    • Просмотр профиля
    • The English Hall
  • Награды: 1000 сообщений500 сообщений100 сообщений50 сообщенийТрехлетие форума
Знакомимся с HTML.

[spoiler]HTML это "родной язык" вашего браузера (программы просмотра веб-страниц).

Говоря кратко, HTML был изобретён в 1990 году учёным, Тимом Бёрнсом-Ли (Tim Berners-Lee), и предназначался для облегчения обмена документами между учёными различных университетов. Проект имел больший успех, чем Tim Berners-Lee мог ожидать. Этим изобретением HTML он заложил основы современной сети Internet.

HTML это сокращение от "HyperText Mark-up Language/язык гипертекстовой разметки" - и на данном этапе этого знания вам вполне достаточно. Однако, чтобы всё было путём, давайте разъясним некоторые детали.

Hyper противоположно linear/построчно. В добрые старые времена - когда кошки ловили мышей - компьютерные программы работали построчно: программа выполняла одну строку, затем переходила к выполнению следующей, и т. д. Но HTML работает по-иному - вы можете перейти куда и когда захотите. Например, не нужно посещать MSN.com до того, как посетить HTML.net.
  • Text - всё понятно.
  • Mark-up - это разметка, то, что вы делаете с текстом. Вы размечаете текст так же, как вы делаете это в текстовых редакторах: выставляете заголовки, списки, выделяете текст жирным шрифтом и т. д.
  • Language это язык - HTML. В нём используется много английских слов.
[/spoiler]



Что такое HTML - тэги?

[spoiler]Тэги это метки, которые вы используете для указания браузеру, как он должен показывать ваш web-сайт.

Все тэги имеют одинаковый формат: они начинаются знаком "<" и заканчиваются знаком sign ">".

Обычно имеются два тэга - открывающий: <html> и закрывающий: </html>. Различие в том, что в закрывающем имеется слэш "/".

Всё содержимое, помещённое между открывающим и закрывающим тэгами, является содержимым тэга.

Н, как говорится, из каждого правила есть исключения, и в HTML также имеются тэги, которые являются и открывающими, и закрывающими. Эти тэги не содержат текста, а являются метками, например, перенос строки выглядит так: <br />.

HTML - это тэги, и ничего кроме тэгов. Для изучения HTML нужно изучить различные тэги.

Пример:

Используем тэг <b> </b>. Следующий код

<b>Выделенный жирным текст</b>
при просмотре в браузере будет выглядеть так:

Цитировать
Выделенный жирным текст
[/spoiler]
« Последнее редактирование: Сентября 24, 2011, 09:27:24 pm от Avvaron »

Сентября 24, 2011, 09:21:14 pm
Ответ #1
  • Администратор
  • Учитель
  • *****
  • Сказали спасибо
  • -вы: 93
  • -вам: 40
  • Topic Author
  • Сообщений: 1167
  • Инквизитор
    • Просмотр профиля
    • The English Hall
  • Награды: 1000 сообщений500 сообщений100 сообщений50 сообщенийТрехлетие форума
Приступаем непосредственно к созданию сайта.

Шаг первый.

[spoiler]Откроем самый обычный "Блокнот" (или его аналог, "Notepad++"). Думаю, начать лучше с чего-нибудь самого простого, например, странички с обычным текстом.

HTML прост и логичен. Браузер читает HTML так, как читаете его вы: сверху вниз и слева направо. Таким образом, HTML-документ начинается и заканчивается тем, чем должен начинаться и заканчиваться текст.

Во-первых необходимо сообщить браузеру, что вы будете "говорить" с ним на языке HTML. Это делается тэгом <html> (тут ничего нового). Так что, прежде чем напечатать что-либо, нужно поставить тэг "<html>" в первой строке документа.

Как вы, возможно, помните из предыдущего урока, <html> это открывающий тэг, который должен иметь и закрывающий тэг после того, как вы закончите ввод HTML. Поэтому, чтобы не забыть, поставьте закрывающий тэг "</html>" на пару строк ниже и вводите весь текст документа между <html> и </html>.

Следующее, что необходимо, это "head" (голова или "шапка"), которая содержит служебную информацию о вашем документе, и "body" (тело), содержимое самого документа. Поскольку HTML логичен, head (<head> и </head>) находятся выше body (<body> и </body>).

Ваш документ теперь должен выглядеть так:

Цитировать
<html>
       <head>
       </head>
 
       <body>
       </body>
 
</html>

Обратите внимание, как мы структурировали тэги по строкам (с помощью клавиши Enter) и какие сделали отступы (клавишей Tab). В принципе не важно, как вы структурируете ваш HTML-документ. Но, для облегчения чтения кода, настоятельно рекомендуем структурировать ваш HTML с помощью перевода строк и отступов, как в нашем примере.

Вот вы уже и сделали вашу первую web-страницу - первенца, который, возможно, выглядит не так, как вы предполагали, когда начинали читать этот учебник, но это уже, в некотором роде, web-сайт. Вы создали базовый шаблон для всех последующих HTML-документ.[/spoiler]
« Последнее редактирование: Сентября 24, 2011, 10:48:44 pm от Avvaron »

Сентября 24, 2011, 09:21:23 pm
Ответ #2
  • Администратор
  • Учитель
  • *****
  • Сказали спасибо
  • -вы: 93
  • -вам: 40
  • Topic Author
  • Сообщений: 1167
  • Инквизитор
    • Просмотр профиля
    • The English Hall
  • Награды: 1000 сообщений500 сообщений100 сообщений50 сообщенийТрехлетие форума

Сентября 24, 2011, 09:21:31 pm
Ответ #3
  • Администратор
  • Учитель
  • *****
  • Сказали спасибо
  • -вы: 93
  • -вам: 40
  • Topic Author
  • Сообщений: 1167
  • Инквизитор
    • Просмотр профиля
    • The English Hall
  • Награды: 1000 сообщений500 сообщений100 сообщений50 сообщенийТрехлетие форума

Сентября 24, 2011, 09:21:42 pm
Ответ #4
  • Администратор
  • Учитель
  • *****
  • Сказали спасибо
  • -вы: 93
  • -вам: 40
  • Topic Author
  • Сообщений: 1167
  • Инквизитор
    • Просмотр профиля
    • The English Hall
  • Награды: 1000 сообщений500 сообщений100 сообщений50 сообщенийТрехлетие форума

Сентября 25, 2011, 05:12:08 pm
Ответ #5
  • Ученики
  • Учитель
  • *
  • Сказали спасибо
  • -вы: 81
  • -вам: 66
  • Сообщений: 854
  • всегда меняюсь
    • Просмотр профиля
  • Награды: Знаток ОБЖПочетный Спасатель форумаМедаль Умника500 сообщенийСеребряный кубок100 сообщений50 сообщенийТрехлетие форума
зачем вы пишите несколько раз слово резерв

Сентября 25, 2011, 05:52:11 pm
Ответ #6
  • Администратор
  • Учитель
  • *****
  • Сказали спасибо
  • -вы: 93
  • -вам: 40
  • Topic Author
  • Сообщений: 1167
  • Инквизитор
    • Просмотр профиля
    • The English Hall
  • Награды: 1000 сообщений500 сообщений100 сообщений50 сообщенийТрехлетие форума
Материала-то много, чтобы он не растекался по всей теме, а был собран в первых сообщениях!

 

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



* Дополнительная инфомация

Locations of visitors to this page Средний банер
Яндекс цитирования Яндекс.Метрика

* Прикрепленные материалы

No attachments were found.