Эй! Спасибо, что решили посмотреть на тему! Осмотритесь вокруг
и подпишитесь на RSS feed чтобы узнавать обо всех обновлениях. До встречи!

Архив Сентябрь, 2017

Назначение тега

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

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

Примерное содержание тега , которое содержится в теге этого сайта на момент написания этого описания.

Свой сайт это просто

Блокнот+ локальный сервер+ FTP клиент+ домен+ хостинг= свой сайт
пишим сайт в блокноте и не зависим от конструкторов и CMS

  • Делаем сайт
  • HTML теги
  • Верстка CSS
  • PHP скрипты

Этот тег, его содержимое это лицо сайта, в стиле CSS для этого тега обычно указывается тематическое изображение или фон тела шапки сайта, указываются стили для заголовка, который заключается в теге

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

Кнопки

Кнопка — это элемент интерфейса, на который нужно нажимать. Создается следующим образом.

Параметры кнопки перечислены в табл. 1.

Табл. 1. Параметры кнопки

Параметр Описание
name Имя поля. Предназначено для того, чтобы обработчик формы мог идентифицировать это поле. Параметр name может быть опущен, в этом случае значение кнопки не передается на сервер.
value Надпись на кнопке, а также ее значение.

Использование параметров и создание обычных кнопок показано в примере 1.

Пример 1. Создание кнопки

В надписи на кнопке можно ставить пробелы в любом количестве.

Кнопка SUBMIT

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

Параметры те же, что и у простых кнопок (пример 2).

Пример 2. Кнопка Submit

Вид кнопки показан ниже.

Параметр name для этого типа кнопки может быть опущен. Если значение параметра value не указывать, автоматически появится надпись Подача запроса или Submit (для IE) или Submit Query (для Netscape).

Кнопка RESET

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

Параметры совпадают с параметрами простых кнопок (пример 3).

Пример 3. Кнопка Reset

Вид кнопки Reset и принцип ее действия показан ниже.

Значение кнопки Reset никогда не пересылается на сервер.

Тег

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

Пример использования тега

Заголовок страницы

заголовок блока

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

Заголовок статьи

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

В основном тегом разделяют списки статей, как например на главной странице wordpress или livestreet и других CMS. Так же когда на странице идет описание разных товаров, или есть текстовые блоки. Закрывающий тег обязателен, можно также внутри тега использовать несколько тегов, то есть допускается вкладывать один тег внутрь другого.

Стиль font-family: устанавливает семейство шрифтов, которое будет использоваться для оформления текста содержимого. Значение может даваться как для всей страницы для тега body, так и к другим контейнерам на странице. Список шрифтов может включать одно или несколько названий шрифтов, разделенных запятой. Если в имени шрифта содержатся пробелы, например, «Trebuchet MS», то такой шрифт должен заключаться в одинарные или двойные кавычки.

Пример кода font-family:»Trebuchet MS»; или например самый распространенный шрифт font-family:Arial;.

Часто вебмастера указывают два,три, и более шрифтов по порядку. Например font-family:»Trebuchet MS», Georgia, Arial;.

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

Заканчивают список шрифтов обычно указанием типа шрифта serif, sans-serif, cursive, fantasy, monospace. Таким образом, последовательность шрифтов лучше начинать с экзотических типов и заканчивать обобщенным именем, которое задает вид шрифта.

Ниже на скриншоте пример указания стиля шрифта для body

Типы шрифтов:

serif & шрифты с засечками (антиквенные), типа Times

sans-serif — рубленные шрифты (шрифты без засечек или гротески), типичный представитель Arial
cursive — курсивные шрифты
fantasy — декоративные шрифты
monospace — моноширинные шрифты Пример:

font-family: Arial, sans-serif; — указывает шрифт семейства Arial, рубленый шрифт

Применение тега

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

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

Краткий пример использования тега

Заголовок сайта

боковая колонка

Заголовок статьи

Текст и содержание статьи

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

Назначение тега

Назначение тега Тег предназначен для создания карты активных областей на изображении, применяется внутри контейнера который служит для связи активных областей с изображением. С помощью связки + можно создать на любом изображении одну или несколько активных областей, которым с помощью атрибута href можно указать url адрес, и при клике на эту области будет переход по указанному адресу. Это существенно сокращает количество кода и элементов при создании графического сайта, или карты на изображении. Небольшой пример создания активной области на изображении  

  

  
   
 

В данном примере на изображении определен прямоугольник активной зоны, при нажатии по которой будет переход на adres.html. К тегу можно применять стили CSS , например чтобы убрать рамку по умолчанию можно прописать border:none;

area { border:none;}

Атрибуты тега

shape — форма активной зоны на изображении

href — задает адрес документа, на который следует перейти
alt — альтернативный текст для области изображения
accesskey — переход к области с помощью комбинации клавиш
coords — координаты активной области
hreflang — указывает язык документа, на который ведет ссылка
nohref — область без ссылки на другой документ
tabindex — задает последовательность перехода между элементами с помощью клавиши Tab
target — имя окна или фрейма, куда браузер будет загружать документ
type — устанавливает MIME-тип документа, на который ведёт ссылка

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

Тег

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

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

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

Пример использования тега

Заголовок страницы

Первый столб таблицы Второй столб таблицы Третий столб таблицы

Результат применения этого тега

Первый столб таблицы Второй столб таблицы Третий столб таблицы

Атрибуты

width — указывает ширина колонок

valign — задает вертикальное выравнивание содержимого колонки
align — устанавливает выравнивание содержимого колонки по краю
char — выравнивает содержимое колонки по заданному символу
charoff — сдвигает содержимое ячейки относительно заданного символа
span — количество колонок, к которым следует применять параметры

Теги и

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

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

Пример использования данных тегов и

Что такое html


HTML стандартный язык разметки веб страниц. Суть разметки заключается в придании сухому тексту и графике различных свойств и визуальных эффектов для лучшего восприятия читателями. Большинство веб-страниц создаются при помощи языка HTML. HTML теги в коде не видны пользователям, они указыват браузеру как выводить текст и графику на экране компьютера. Совместно с таблицей стилей CSS содержимому можно задать любой цвет фон, позиционирование и размеры, создать свой неповторимый дизайн веб страниц.

А так этот текст виден в браузере, как видно места выделенные тегами и отображаются курсивным шрифтом

Что такое html

HTML стандартный язык разметки веб страниц. Суть разметки заключается в придании сухому тексту и графике различных свойств и визуальных эффектов для лучшего восприятия читателями. Большинство веб-страниц создаются при помощи языка HTML. HTML теги в коде не видны пользователям, они указыват браузеру как выводить текст и графику на экране компьютера. Совместно с таблицей стилей CSS содержимому можно задать любой цвет фон, позиционирование и размеры, создать свой неповторимый дизайн веб страниц.

теги для создания таблицы и пример С помощью тегов

создается таблица. Тег является контейнером для строк и ячеек таблицы. Стока таблицы создается тегом , в которой содержатся ячейки. Ячейки создает тег

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

Небольшой пример создания таблицы

Таблица, пример ее создания.

>

ячейка ячейка1 ячейка2 ячейка3
ячейка 35 ячейка ячейка
ячейка 35 ячейка ячейка

Результат этого кода

> Таблица, пример ее создания.

ячейка ячейка1 ячейка2 ячейка3
ячейка 35 ячейка ячейка
ячейка 35 ячейка ячейка

В данном примере кроме тегов

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

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

Тег

назначение и применение тега Тег обычно используется в теге где служит для указания инструкций браузеру, точнее устанавливает связь с файлами, такими как файл стилей, иконка, rss лента и другие. Сам тег не создает ссылку и его содержимое не видно, он лишь указывают путь до нужных файлов браузеру.

Пример использования

заголовок страницы

контент
Атрибуты charset — указывает кодировку страницы href — путь к связываемому файлу media — определяет устройство, для которого следует применять стилевое оформление rel — определяет отношения между текущим документом и файлом, на который делается ссылка sizes — указывает размер иконок для визуального отображения type — MIME-тип данных подключаемого файла