• Страница 1 из 2
  • 1
  • 2
  • »
Архив - только для чтения
Сообщество uCoz » Архивариус » Архив » Чистка: (25.07.11) Основы HTML (То что должен знать каждый)
Чистка: (25.07.11) Основы HTML
Piterski
Сообщений: 386
Репутация: 195

Сообщение # 1 | 13:48:00
Постораюсь изложить тут самое начало, самое необходимоет то что должен знать любой начинающий, так как пишу сам могу ошибаться, так что если что поправяйте.




  • Добавление элемента html
    Элемент html считаеться корневым элементом любого HTML-документа. Запомните обьявление DOCTYPE не являеться элементом языка HTML.
    Корнево элемент языка html


    Достаточно просто не правда ли?

  • Элементы head и title

    У нас уже есть основа с корневым элементом. Теперь добавляем элемент head. Данный элемент содержит все элементы , необходимые для отображения и выполнения документа, но которые не отображаются в окне браузера. Чтобы создать раздел head, необходимо просто добавить теги head в верхнюю часть шаблона, непосредственно за открывающимся тегом








  • Элементы в разделе документа head
    title - Этот элемент позволяет задать заголовок документа. Указанный заголовок будет отображаться в строке заголовка браузера. Элемент title являеться обязательным.
    meta - Элемент meta используеться для множества целей, включая указание ключевых слов и описаний, кодировки символов и автора документа. Элемент meta не являеться обязательным и его использование может варьироваться в зависипости от поставленных задач.
    script - Этот элемент позволяет вставлять скрипты непосредственно в документ, или, чот более предпочтительнго, с его помощью указываеться ссылка на необходимый для использования скрипт. Элемент используеться при необходимости.
    style - Элемент style позволяет размещать информацию о стиле прямо на странице. Стиль, информация о котором размещена таким образом, называеться встроенным. Элемент используеться при необходимости.
    link Элемент link наиболее часто используеться для выполнения связывания с внешней таблицей стилей, хотя он может приминятся и для других целей.

  • Элемент body
    Это то место где происходят все действия. Это тото элемент, где будет размещено содержимое и произведена разметка страницы.
    Элемент body размещен в элементе html, непосредственно за элементом head.



    Здесь размещаеться подходящий текст заголовка





    При просмотре страницы в браузере информация, размещенная внутри элемента body, отображаеться в окне браузера.


Пока все, устал писать. Потом еще может ченить напишу.
Piterski
Сообщений: 386
Репутация: 195

Сообщение # 2 | 14:03:28

  • Комментарии языка HTML
    Еще одной важной составляющей разменти языка html, являються комментарии. Комментарии позволяют временно скрыть содержимое или разметку, оформить содержимое элементов особым образом для обратной совместимости, обозначить части внутри документов и создать пояснения для других людей, которые, возможно, будут работать над страницей.

    Синтаксис комментария языка html выглядит следующим образом:
    <!-- -->

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

    Code
    <body>
    <!--
    <p>Это содержимое видно не будет, посколько оно заключено в комментариях</p>
    -->
    <p>Это содержимое видно будет, поскольку оно находиться за пределами поля комментария</p>
    </body>

    Можно отмечать разделы документа

    Code
    <body>

    <!-- Начало основного содержимого -->

    <!-- Конец основного содержимого -->

    </body>

    Хороший пример uCoz код:

    Code
    <!--uCoz Counter-->
    <script type="text/javascript"><!--
    document.write('<a href="http://www.ucoz.ru/main/?a=ustat;u=ucoz;d=0" target=_blank title="uCoz Counter"><img border="0" width="88" height="31" src="http://ucoz.ucoz.ru/stat/'+Math.random()+'?03'+escape(document.referrer)+'"></a>');//--></script><noscript><a href="http://www.ucoz.ru/main/?a=ustat;u=ucoz;d=0" target=_blank title="uCoz Counter"><img border="0" width="88" height="31" src="http://ucoz.ucoz.ru/stat?02"></a></noscript>
    <!--/uCoz Counter-->

    Комментарии удобно использовать для указаний.

frozen
Сообщений: 2
Репутация: 33

Сообщение # 3 | 14:55:59
В HTML теги пишутся заглавными буквами:
<HTML>
<HEAD>
ПОСЛЕДНЯЯ версия языка HTML - это HTML 4.01. Больше версий не будет. Можно считать следующей версией - XHTML 1.0

Quote (Piterski)
Запомните обьявление DOCTYPE не являеться элементом языка HTML

ЗОЛОТЫЕ СЛОВА. Потому что это объявление типа документа. Сначала нужно объявить тип документа, а потом открывать сам документ.
biggrin
Piterski
Сообщений: 386
Репутация: 195

Сообщение # 4 | 15:22:22
Хорошо немного об обьявлении типа документа, хотя тот же UCOZ не использует это.
Quote (Piterski)
Запомните обьявление DOCTYPE не являеться элементом языка HTML.
это элемент языка SGML.

  • Обьявление документа
    В документ необходимо добавить небольшой фрагмент кода, с помощью которого будет обьявлен тип используемого документа и идентифицированная версия языка. Это используеться при помощи Стандартного Обобщенного Языка Разметки (SGML), который являеться предком HTML и используеться в этом обьявлении. известном как DOCTYPE

    Пример для XHTML 1.0 Transitional:

    Code
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    Лично я тоже не использую это, хотя необходимость не вызывает сомнений, но все же.
    Нужно это только для получения корректной страницы, интерпритацию которых браузер выполняет наиболее оптимально для каждой конкретной ситуации.

    Quote (frozen)
    В HTML теги пишутся заглавными буквами:
    может быть. Всегда писал маленькими.
  • Piterski
    Сообщений: 386
    Репутация: 195

    Сообщение # 5 | 16:51:10

    • Подробнее о элементе title

      Элемент title являеться единственным обязательным элементом раздела head. В строке заголовка браузера отображаеться любой текст, содержащийся в этои элементе, вместе с название браузера, которое добовляеться в конец текста.

      Помимо того что элемент title всегда должен присутствовать в документе, создание хорошего заголовка являеться первоочередной задачей, преследующей три цели:

    • Указание заголовка страницы;
    • предостовление ориентировки пользователям - то есть предоставление пользователям о том, где они находяться в интернете и на самом сайте.
    • Предоставление дополнительной информации о странице сайта.

      Создание эффективного заголовка подразумевает выполнения этих трех положений.

      Вот пример эффективного заголовка:

      Code
      <title> Форум Ucoz - Вопросы по сервисам - Общие вопросы - Основы HTML </title>

    Добавлено (2006-05-16, 4:51 Pm)
    ---------------------------------------------
    Ну как бы завершая основную часть, вот как все вместе должно выглядеть.

    Code
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>

    <title>Сайт : расположение на сайте : заголовок темы</title>

    <meta name="author" content="тут ваше имя">

    </head>

    <body>

    <!-- Область основного содержимого -->

    </body>
    </html>


    Ну вот что то вроде этого.
    Сообщение отредактировал Piterski - Вторник, 16 Май 2006, 16:51:58
    frozen
    Сообщений: 2
    Репутация: 33

    Сообщение # 6 | 19:47:40
    Quote (Piterski)
    об обьявлении типа документа, хотя тот же UCOZ не использует это.

    Многие не используют это, но это не значит правильно. Многие продолжают использовать не рекомендованные теги. Ведь каждая версия языка имеет свои ограничения.
    Quote (Piterski)
    Лично я тоже не использую это, хотя необходимость не вызывает сомнений, но все же.

    Значит были трудности с которыми не удалось справиться (не хватило времени или лень взяла свое)
    Quote (Piterski)
    Нужно это только для получения корректной страницы, интерпритацию которых браузер выполняет наиболее оптимально для каждой конкретной ситуации.
    Не понял. Т.е. нужно, чтоб пройти проверку на валидность? Тогда - полный бред. Примеры страниц с объявлением и без, уже показывал.
    Quote (Piterski)
    Ну как бы завершая основную часть, вот как все вместе должно выглядеть.

    Наверное лучше так

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

    А переключение в другой режим, рассмотреть поздней.

    P.S. SGML - построен на принципе разделения содержания и представления. Может стоит уделить внимание XHTML...

    frozen
    Сообщений: 2
    Репутация: 33

    Сообщение # 7 | 21:53:38
    о элементе title можно перевести как Титул документа (титульный лист страницы). Дложен показать суть документа (страницы). До 60 символов.
    Piterski
    Сообщений: 386
    Репутация: 195

    Сообщение # 8 | 12:19:04
    Quote (rusak)
    Piterski, логичней начинать тег title наоборот, с темы и заканчивая сайтом, т.к. на каком сайте ты сидишь, ты запомнишь, а вот где именно. Кстати, и на uCoz так сделано. См. вверх.

    Ну да что то я перепутал немного...

    Quote (frozen)
    (не хватило времени или лень взяла свое)

    Скорее лень чемь время.
    Quote (frozen)
    Не понял. Т.е. нужно, чтоб пройти проверку на валидность?
    Ну отчасти и для этого тоже, Корректная страница подрозумевает собой также корректную работу этой страницы.

    Добавлено (2006-05-17, 12:19 Pm)
    ---------------------------------------------
    На сколько я знаю язык XHTML, это комбинация языков XML и HTML. Вот допустим одно из отличий XHTML.
    Элемент img
    Этот элемент являеться пустым - иначе говоря, элемент не содержит никакого текстового содержимого. Поэтому для него ненужно использовать закрывающий тег. На XHTML это будет так

    Code
    <img src="images/foto.jpg" />

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

    Сообщение отредактировал Piterski - Среда, 17 Май 2006, 12:21:08
    frozen
    Сообщений: 2
    Репутация: 33

    Сообщение # 9 | 15:44:55
    Quote (Piterski)
    а сколько я знаю язык XHTML, это комбинация языков XML и HTML.

    Можно и так сказать. Основные отличия: все теги должны быть закрыты, даже не парные.
    Примеры для HTML
    <img src="images/foto.jpg">
    <br>
    Примеры для XHTML
    <img src="images/foto.jpg" alt="" />
    <br />
    Для закрытия ставится пробел и слэш. И многие элементы не используются. Вот и все основные отличия.
    Quote (Piterski)
    хочу показать, научить людей самому элементарному... без чего можно даже не приступать к работе по созданию сайта.
    Только ведь технологии развиваются... я сомневаюсь, что получится уговорить человека поставить себе Internet Explorer 3 и, с его помощью, наслаждаться современными дизайнами.
    Звизю, если побеспокоил.
    Piterski
    Сообщений: 386
    Репутация: 195

    Сообщение # 10 | 10:14:17
    Quote (After_THE_God)
    Вот почитал эту тему в форуме и решил, раз уж XHTML будет будущим, то тогда надо выучить и XML и XHTML.
    Это будущее наступит не скоро, сейчас работая в системе Ucoz надо знать HTML. Я взял шаблон который прошел валидность на CSS2 и XHTML. Всеголишь вставил переменные Ucoz типа (Login_form, Last_news). И естественно никакую валидность я уже не прошел. В Ucoz используют HTML, думаю и вам следует последовать этому примеру. Я а в общем расскужу о аудио и видео файлах. Только позже, поеду на учебу, часика в 3, 4 напишу.
    frozen
    Сообщений: 2
    Репутация: 33

    Сообщение # 11 | 14:50:08
    Можно не обращать внимание на мое сообщение - так, разговор сам с собой.
    Quote (Piterski)
    Это будущее наступит не скоро, сейчас работая в системе Ucoz надо знать HTML.

    Наверное имеется ввиду система uCoz, т.к. XHTML рекомендован к применению в январе 2001 года.

    Quote (Piterski)
    Я взял шаблон который прошел валидность на CSS2 и XHTML. Всеголишь вставил переменные Ucoz типа (Login_form, Last_news). И естественно никакую валидность я уже не прошел.

    Все зависит от поставленных задачь. Может эта тема даст ответы на вопросы с валидностью.

    Quote (Piterski)
    В Ucoz используют HTML,
    Который не вполне соответствует спецификациям.

    Еще раз звиню - захотелось поговорить.

    Piterski
    Сообщений: 386
    Репутация: 195

    Сообщение # 12 | 16:26:36
    Quote (frozen)
    XHTML рекомендован к применению в январе 2001 года.

    Это мне известно, я не собираюсь с вами спорить о том что XHTML давно уже превосходит HTML, и даже во все тойже системе UCOZ можно работать с XHTML.
    Сообщение отредактировал Piterski - Четверг, 18 Май 2006, 16:29:19
    frozen
    Сообщений: 2
    Репутация: 33

    Сообщение # 13 | 18:57:12
    Piterski, я с тобой не спорю. Наооборот, эта тема очень нужна и полезна. Пользователь сам должен выбрать язык, но всему не научить. Поэтому нужна возможность проверить код, ведь валидаторы пишут причину несоответсвия. Ксожалению, все погрешности могут исправить только админы uCoz.
    frozen
    Сообщений: 2
    Репутация: 33

    Сообщение # 14 | 11:40:19
    Quote (After_THE_God)
    расскажите про тэг <embed></embed> я уверен, это заинтересует пользователей

    Думаю, будет интересно прочитать эту статью.
    Piterski
    Сообщений: 386
    Репутация: 195

    Сообщение # 15 | 15:24:22
    Долго что то ничего не писал, в общем сами знаете как дорого наше время, а тут еще сессия + ветрянкой заболел в общем ужас. Раскажу немного о тексте.

    Правильное использование заголовков
    Заголовки в языках HTML & XHTML представляют собой теги. Существуют теги 6 уровней заголовков, начиная с <h1>....</h1> и заканчивая <h6>....</h6>
    Заголовок <h1></h1> считают самым важным, а h2 подзаголовком и тд.
    Пример добовления заголовка

    Code
    <h1>Ucoz Web-Services</h1>
    <h2>Новый взгляд на создание сайтов</h2>

    Добавление абзацев

    Управление абзацами выполняеться при помощи элемента абзаца, <p></p>

    Code
    <p>Система управления сайтом
    Уникальная система управления сайтом, позволяющая создать как статический, так и динамический сайт.</p>

    <p>Новое поколение веб-сервисов. Наконец-то создание сайта стало простой и увлекательной процедурой...</p>

    Тег разрыв строки
    Этот тег применяеться для разрыва строк абзаца. Он полезен для оформления, например текста стихотворения. В языке XHTML этот тег обозначаеться так <br />

    Code
    <p>Мой дядя самых честных правил<br />
            Когда не в шутку занемог,<br />
            Он уважать себя заставил<br />
            И лучше выдумать не мог</p>

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

    Для создания упорядоченного списка необходимо два элемента.
    <ol></ol> - (ordered list - упорядоченный список)
    <li></li> - (list item - элемент списка)

    Code

    <ol>
    <li>Зарегистрируйтесь в системе UCOZ</>
    <li>Тщательно разберитесь с системой</li>
    <li>Создайте свой сайт</li>
    </ol>

    Неупорядоченный список
    Ну это где поряд размещения не важен. В основном такие списки называют маркированные. Структура почти такая же, только вместо элемента <ol></ol> используем элемент <ul></ul>

    Code
    <p>Список сервисов в системе UCOZ</p>
    <ul>
    <li>Редактор сайта</li>
    <li>Гостевая книга</li>
    <li>Форум</li>
    <li>Каталог статей</li>
    <li>Дневник (блог)</li>
    <li>Фотоальбомы</li>
    <li>Новости сайта</li>
    <li>Каталог файлов</li>
    <li>FAQ (вопрос/ответ)</li>
    <li>Опросы</li>
    <li>Почтовые формы</li>
    </ul>
    Сообщение отредактировал Piterski - Четверг, 01 Июн 2006, 15:26:12
    Сообщество uCoz » Архивариус » Архив » Чистка: (25.07.11) Основы HTML (То что должен знать каждый)
    • Страница 1 из 2
    • 1
    • 2
    • »
    Поиск: