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

Обучение HTML очень подробно

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "Заработок в Интернет: cоздание, продвижение и монетизация сайта/блога" на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

  Январь 2003   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
Автор
ZoKeR

Статистика

32 подписчиков
0 за неделю
←   Все выпуски   →

Обучение HTML очень подробно Обучение HTML очень подробно


Информационный Канал Subscribe.Ru
ДК

 

Выпуск 1

 

Самая respectабельная
рассылка о HTML

Какой он есть этот HTML его преимущества и недостатки

www.zoker.by.ru

HTML

Автор и её главный и единственный редактор

ZoKeR

 

Большое спасибо Человеку за помощь www.esbnn.by.ru

www.htmlik.by.ru

Очень подробно

 

Какой он есть этот HTML его преимущества и недостатки

Самая respectабельная
рассылка о HTML

 

всего подписчиков Content.Mail.Ru

 

 

Интерестные сайты: www.zoker.by.ru www.esbnn.by.ru www.galanta.wallst.ru www.htmlik.by.ru

 

Доброе время суток дорогие читатели!

Сегодня в выпуске:

1.  Версии HTML

2.  Анатомия Web

3.  Рассмотрим 11 тегов

4.  Правила синтаксиса

5. Рубрика "Вопрос-Ответ"

6.Обзор лучших хостингов рунета

7.  И на последок

·    2 Java-script исходника

· Немного смеха

·   Сайты с акцентами на HTML

Один мой друг хочет делать рубрику, которая будет состоять из ваших вопросов не про HTML (компьютеры, хакерство, кряки, проги, русификаторы и т. д.) и его ответов все вопросы пишите на esbnn@mail.ru. Спосибо за внимание.

 Внимание!

Некоторые очень не умные люди (очень крутые вёбмастеры :-)) после того как напишут HTML код страницы и сохраняют его в фориате .txt, а потом пытаются открыть его с помощью браузера. И как вы думаете что у них получалоь? Тоже самое что и у них в блокнотике! Я вам советую купите или скачайте прогу Namo WebEditor 5 для тех кому нужн русификатор для неё можно скачать его на сайте www.zoker.by.ru

Версии HTML.

Первая версия HTML была разработана в начале 90-х годов Тимом Бенерс-Ли для популярного в прошлом браузера Mozaic. Но в те времена ни для браузера, ни для языка не нашлось достойного применения. В 1993 году появился HTML+, и эта версия также оказалась практически незамеченной. Начало широкому использованию гиппертекста дала версия 2.0, которая появилась в июне 1994 года. Это был момент начала роста популярности WWW  по всему миру. Элементы, включенные в версию 2, в большинстве своём используются и по сей день.

В версии 3.0 HTML, которая появилась год спустя, была реализована возможность прорисовки математических символов (знаков интеграла, бесконечности, дроби, скобок и т. д.) при помощи элементов языка. Под эту версию разрабатывались браузеры (Arena). Но этот проект оказался тупиковым и не получил дальнейшего распространения.

В1996 году появился HTML версии 3.2. Это было новаторское решение, достаточно было упомянуть, что в спецификацию языка были введены фреймы, которые стали теперь весьма популярны у разработчиков. Даже сейчас с их помощью фреймов создаются очень не плохие страницы. Практически все современные браузеры поддерживают версию 3.2, поэтому вы можете не беспокоиться за работоспособность вашего элемента.

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

Официальная спецификация HTML 4 (Dynamic HTML) появилась в 1997 году. Но, к сожалению, для веб дизайнеров в настоящее время не все браузеры поддерживают 4 версию, поэтому остаётся проблема: пользоваться HTML 4 или отдать предпочтение HTML версии 3.2? Но я советую вам пользоваться версией 4!

вернуться к оглавлению

Анатомия Web-страницы.

Ниже показана заготовка типичного Web-документа. На этом примере мы рассмотрим структуру HTML-страниц.

 

<HTML>

<HEAD>

<TITLE>Структура Web-страницы</title>

<STYLE> H2 {font-family:  verdana, sans-serif, arbat;}

CODE {font-family: Arial;} </style>

<META name="Author" content="Alexei Goncharov">

<META name="Keywords" content="WWW, HTML, document, element">

<META http-equiv="Content-Type" content="text/html; charset=windows-1251">

</head>

<BODY bgcolor=#FFFFFF>

<!-- Комментарий к странице -->

<A href="start.htm"><IMG align="right" src="soder.jpg" alt="На титульную страницу"

 border=0 width=150 height=24></a><BR clear="right">

<A name="top"></a>

Переход в <A href="#bottom">конец</A> документа<P>

Переход к <A href="#S001"><B>ссылке 1</b></A><P>

<P>

<HR>

<H1>Заголовок 1</h1>

<H2>Заголовок 2</h2>

<H3>Заголовок 3</h3>

<H4>Заголовок 4</h4>

<H5>Заголовок 5</h5>

<H6>Заголовок 6</h6>

<HR>

Здесь расположена <B>ссылка 1</b><A name="S001"></A>

<HR>

<P>Здесь должен располагаться оригинальный текст Web-страницы

<HR>

<A name="bottom"></A>

Переход в <A href="#top">начало</A> документа.

</body>

</html>

 

Если рассмотреть исходные тексты различных Web-страниц, то можно легко увидеть схождение их структур. Это объясняется тем, что документы создаются по определенным правилам. В основу синтаксиса языка HTML лег стандарт ISO 8879:1986 «Information processing. Text and office systems. Standard Generalized Markup Language(SGML)”

Но что вам это даст? Да практически ничего! Чтобы понять структуру страницы нужно рассмотреть все элементы вхлдящие в приведенный выше листинг при рассмотре некоторых тегов я буду приводить начальный тег и конечный! Например: <I> </i>. но есть элементы у которых конечного тега и вовсе нет! Для имен тегов можно применять так прописные так и заглавные буквы! Некоторве разработчики для удобства начальный тег ставят прописные буквы, а конечные - строчными. Это помогает разобраться в исходном текстe Web-страницы.

вернуться к оглавлению

Рассмотрим главные 11 тегов!

<HTML> </html>

Обозначение документа, что он написан на языке html. <HTML> С данного тега должен начинаться каждая страница которая пишется в html! И естественно этот документ дожен заканчиваться тегом </html>!

<HEAD> </head>

Область заголовка Web-страницы даже не сам заголовок, а его первая часть. Этот элемент может иметь атрибуты: lang и dir.Этот элемент ддолжен включать в себя элемент TITLE.

<TITLE> </title>

Элемент для размещения заголовка страницы. Например, <TITLE> Добро пожаловать!</title>. Но есть и другие способы создания заголовка , напимер, как на моём сайте www.zoker.by.ru кстати зайдите может найдёте что-нибудь интерестное. Кстати для тех кто хочет расскрутить свой сайт эта строка ктотарая содержится меду тегами ТИТЛ часто используется при организации поиска в WWW. Поэтому я вам советую, чтобы эта строка, не будучи слишком длинной, достаточно точно отражала назначение документы.

<STYLE> </style>

Описание стиля некоторых элементов Web страницы. Элементы <H1></h1><H2></h2>...<H6></h6> (на них тоже ориентируются поисковики) исползуются для обозначения заголовков на странице:

 

Заголовок1

 <H1></H1>

Заголовок2

<H2>

Заголовок3

 <H3>

Заголовок 4

 <H4>

Заголовок 5

 <H5>

Заголовок6

 <H6>

Естественно, что для каждого элемента существует стилевое оформление по умолчанию, поэтому употребление элемента STYLE не обязатетельно, но желательно.

<META>

Этот элемент показывает служебную информацию, которая не отражается при просмотре страницы. Внутри него нет текста в обычном понимании, поэтому нет и конечного тега. Каждый элемент МЕТА содержит два основных атрибута, первый из которых определяет тип данных, а второй - содержание. Вот несколько примеров meta-данных:

  • Дата, обозначающая "срок годности документа:

      • name="Expires"  content="Дата"

  • Адрес электронной почты:

      • name="Reply-to" content="Имя@адрес"

  • Имя автора сайта:

      • name="Autor" content="Имя автора"

  • Набор ключевых слов для поиска(на них ориентируются многие поисковики!)

      • name="Keywords" content="Слово1, слово2, слово3..."

Но есть и другие элементы если попросите меня то я обязательно расскажу о них в рублике вопросы-ответы в следующем выпуске.

 <BODY></body>

Этот элемент заключает в себя гиппертекст, который определяет собственно Web-страницу. Это та произвольная часть документа, которую разрабатывает автор страницы и которая отображается браузером. Соответственно, конечый тег этого элемента надо искать в конце HTML документа. Внутри этого элемента можено распологать любые элементы передназначенные для дизайна страницы. Внутри тега BODY можно расположить ряд элементов. Рассмотрим их по порядку.

Один из самых полезных для дизайна - атрибут, определяющий фон страницы. Но не забудьте расширение файла! background="Путь к файлу фона". Например, <BODY background="fon1.gif">.

Более простое оформление фона сводится к заданию его цвета: bgcolor="#RRGGBB".  Например, <BODY bgcolor="#123456">. Но есть и другие параметры тега BODY но чтобы их перечислять нужно время которого у меня нет! Но если попросите меня рассказать о них, то я обязательно расскажу о них в рублике вопросы-ответы в следующем выпуске.

<!-- Комментарий -->

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

<H1> </h1>

Элемент заголовка. Существуют 6 уровней заголовков о которых уже было сказано и показаны их размеры (STYLE). Для заголовков можно использовать атрибут, задающий выравнивание влево, по центру или вправо:

align="left"

align="center"

align="right"

<HR>

Горизонтальная линия - очень часто используемый элемент. Во-первых, потому что с его помощью удобно делить страницу на две равных части или более. Во-вторых, потому - что выбор подобных элементов оформление у автора очень небольшой. Элемент не исключает конечного тега, но допускает ряд дополнительных параметров:

  • Выравнивание:
    • align="left" (лево)
    • align="center" (по центру)
    • align="right"(по правому краю)
  • Толщина линии:
    • size=толщина в пикселах
  • Длина линии:
    • width=длина в пикселях
    • width=длина в процентах%
  • Цвет линии
    • color="Цвет"

<A></a>

Документ может быть очень большим, и в этом случае пользователю должна быть представленна возможность быстрого перемещения к нужному разделу документа. Для этого можно использовать метки создавать их можно очень легко. Расмотрим шаблон создания меток: <A name="имя метки">Произвольный текст</a>

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

Напримет для перехода внутри документа можно использовать следующую конструкцию: Переход к <A href="#имя метки">имя метки</a>. Несколько подобных строк документа в начале и в конце могут образовать своеобразное оглавление.

Другое применение тега <A></a>

Один из важнейших элементов языка, обеспечивающий создание гиперссылок. Чаще всего используется такой шаблон  Произвольный текст <A href="Адрес ссылки"> текст для щелчка</a>

Или такой:

<A href="дрес ссылки"> <IMG src="ссылка на рисунок"> </a>

Первый шаблон используется если ссылка используется в тексте, а второй если в качестве ссыли лежит картинка.

Если файл лежит на определенную страницу в папке на вашем компьютере то ссылка будет выглядеть таким образом:

href="файл.тип"(если файл распологаестся в тойже папке как и страница которую редактируют)

или

href="./папка/Файл.тип"

А если вообще в папке уровнем ниже чем папка в которой расположен файл или вообще на другом диске то путь указывается так:

href="file:///диск:/Путь к файлу"

А если вам нужна ссылка на Е-mail то ссылка должна выглядеть так:

<A href="mailto:zoker@dax.ru">ZoKeR</a>

Ну вообще есть много функций этого тега на все функции не хватило бы пол рассылки, но я взял кратенько, но самое главное!

К оглавлению!

Правила синтаксиса.

Теперь, когда мы знаем, как выглядит код Web-станицы, можно сделать некоторые обобщающие выводы относительно синтаксиса HTML. При использовании каждого элемента важно знать, каие элементы могут распологаться внутри него и внутри каких элементов может находиться он сам. Так, взаимное расположение элементов HTML, HEAD, TITLE, BODY должно стандартным на любой странице, правда, в тех случаях, когда не используются фреймы. Но если же сайт представлен как фреймы то вместо элемента BODY используется элемент FRAMESET, но подробней о фреймах вы узнаете в следубщих выпусках рассыли.

Существуют группы элементов, которые используются совлестно. К ним относятся элементы для создания таблиц, списков, фреймов... В этом случае порядок вложения элементов определяется логикой  создания того или иного объекта на странице: тет надо помнить несложные правила конструирования. Таблицы и фреймы часто используются для того чтобы разместить детали страницы в определенном порядке.

Ниже приведена строка, содержащая типичную ошибку вложения элементов

<H1>HI <H2> my </H1> name </H2>

Но надо заметить что браузеры построены таким образом чтобы они не слишком реагировали на ошибки гиппертекста в пределах возможного они следуя логики оставляют текст и рисунки как заложил их разработчик.

Очень важным правилом, которое не имеет исключений, является размещение атрибутов элемента внутри начального тега.

К оглавлению!

Рубрика вопрос-ответ.

Если у вас возник вопрос по HTML или вообще по теме дизайна небойтесь отправить свой вопрос сюда и вам обязательно ответят! Так что не стесняйтесь пишите!

По причине "это первый выпуск рассылки" вопросов не поступало!

К оглавлению!

Обзор лучших хостингов рунета.

www.by.ru в рунете таких удобных (если у вас несколько HomePage) и скоростных хостингов я еще не встречал! FTP, вроде есть PHP и CGI (про это ничего не сказано, но есть такие сайты на by.ru где они используются) неогранич. простр. под сайт, даются гостевые, форумы, чаты, статистика по дням и месяцам. сайты типа: ваше_имя.by.ru, но есть 1 минус не терпи больших файлов, написано до 1 Мб, а на на самом деле всего где-то до 800 Кб. (краткость сестра таланта).

www.wallst.ru и www.webservis.ru здесь регистрация закрыта до 15 января, но на www.wallst.ru она же открыта если написать им письмо на их почтовый адрес (сказать не могу сами найдете)! Есть практически всё много вариантов названия сайтов типа: ваше_имя.wallst.ru  ваше_имя.dax.ru и т. д. предостовляют ящик типа ваше_имя@wallst.ru ...@dax.ru и т. д. + неогр. кол-во ящиков типа что-то@ваше_имя.dax.ru ...@wallst.ru и т. д. , но в скорости они явно проигрывают. Реклама только на предустановленных скриптах которых много. А на остальных (ваших) рекламу не вещают неогран. дисковое пространство по сайт FTPишник.

www.narod.ru хостинг для тех кто любит подождать загрузку сайта можно создавать сайт по шаблонам дается 1 ящик ваше_имя@narod.ru а название сайта ваше_имя.narod.ru есть FTPишник. Вешают свои банеры на каждой странице, но есть и плюсы размеры файла закачаваемого на сайт до 10 Мб.

К оглавлению!

 И на последок.

2 Java Script исходника.

Для того чтобы законно использовать скрипты приведенные ниже вам нужно разместить на свём сайте ссылку на мой сайт www.htmlik.by.ru или на www.zoker.by.ru что вам больше понравиться.

Спасибо от ZoKeRa

Этот скрипт создает заголовок страницы который меняется. Проимер можете посмотреть на www.zoker.by.ru

Скрипт номер два представляет из себя выпрыгивающее окно в котором написан текст который сами и зададите! Два варианта!

Вариант 1 когда скрипт выпрыгивает до загрузки страницы.

Вариант 2 когда окно выпрыгивает после загрузки страницы.

Если у вас есть интерестный скрипт присылайте его мне.

К оглавлению!

 Немного смеха.

Анекдоты предоставленны сайтом www.zoker.by.ru (мой же сайт)

Мужик угодил в больницу.
Нянечка приносит обед - кусочек хлеба, ломтик помидора, пол-яйца, ложку каши. Мужик смотрит на всё это "море" еды и вдыхает:
- А марка почтовая есть у вас?
- Зачем?!
- Да люблю я после обеда чего-нибудь почитать.

Есть 3 верных способа поддержания зубов в отличной форме:
1.Чистите их 2 раза в день.
2.Раз в полгода посещайте своего дантиста.
3.Никогда не суйтесь не в своё дело.
В аптеке:
- Дайте мне упаковку шипучего аспирина!
-С сегодняшнего дня аспирин подорожал.
-Да? Тогда дайте упаковку вчерашнего.
-Доктор, я буду жить?
-А на фига?

-Доктор, мой ребёнок наелся песка. Я дала ему много воды, а что теперь?
-Следите, чтоб он не подходил к цементу!

Приходит девушка к врачу, и чуть не плача, заявляет:
- Доктор, вы знаете, у меня прыщи, и поэтому меня никто не любит.
Доктор задумчиво:
- Та-а-ак... Прыщи... Никто не любит... Никто не любит прыщи... Прыщи никто не любит...Замкнутый кругкакой-то получается!
Больная на операционном столе:
-Доктор, вы можете снять эту дурацкую маску, я вас всё равно узнала!

К оглавлению! 

Сайты с акцентами на HTML.

Вы владелиц сайта о HTML? И хотите бесплатную раскрутку сайта в этой рассылке то пишите сюда сыои сайты, не забывая о том что я вам отвечу так что не скрывайтесь анонимками!

Сайты будут только в следующем выпуске!

К оглавлению!

http://subscribe.ru/
E-mail: ask@subscribe.ru 		Отписаться
Убрать рекламу
В избранное