Загалоўкі і падзагалоўкі

Сістэма падзагалоўкам дазваляе стварыць лагічную структуру кантэнту. Калі тэкст разбіты на сэнсавыя блокі, чытачу значна прасцей сканцэнтравацца і засвоіць новую інфармацыю. Пашукавікі таксама аналізуюць загалоўкі, каб зразумець, па якім запытах прасоўваць старонку. Менавіта таму спецыялісты па SEO рэкамендуюць выкарыстоўваць у іх тэматычныя ключы.

У HTML выкарыстоўваюцца шэсць узроўняў падзагалоўкам - ад

да

. У гэтай сістэме існуе выразная іерархія:

• ... . Асноўны загаловак (назва артыкула, тавару ў інтэрнэт-краме і т. Д.). У тэксце можа быць толькі адзін

  . Як правіла, ён ўтрымлівае галоўны ключавых слоў.

• ... . Падзагалоўкі другога ўзроўню разбіваюць тэкст на сэнсавыя блокі. Напрыклад, калі вы складаеце рэйтынг наўтбукаў, можна зрабіць некалькі

  з назвамі розных мадэляў.

• ... . Трэці ўзровень патрэбен у выпадку, калі тэкст паміж двума

  таксама разбіваецца на невялікія блокі. У нашым прыкладзе гэта могуць быць крытэрыі ацэнкі - "Прадукцыйнасць", "Памяць", "Відэакарта" і т. Д. Для кожнай мадэлі.

• ,

  ,

  . На практыцы сустракаюцца вельмі рэдка. Але агульны прынцып той жа - яны павінны быць "укладзеныя" у блок з падзагалоўкам вышэйшага ўзроўню.

Сачыце за захаваннем правільнай іерархіі. Вяртаючыся да нашага прыкладу, гэта азначае, што нельга адразу ўпісваць назвы мадэляў як

або

. А тым больш выкарыстоўваць для аднародных па сэнсе блокаў падзагалоўкі розных узроўняў (дапусцім, вылучыць ноўтбук, які заняў апошняе месца ў рэйтынгу, з дапамогай

).

А вось схема, якая дапаможа маментальна зразумець і запомніць правільную структуру загалоўкаў у HTML.

спісы

Любыя пералічэння і інструкцыі лепш афармляць у выглядзе спісаў, выкарыстоўваючы спецыяльныя HTML-тэгі для тэксту (тыповая памылка - проста некалькі абзацаў

, якія пачынаюцца з злучка ці лічбы).

Структура такіх блокаў вельмі простая. Спачатку вызначаем тып спісу - маркіраваны

... або нумараваны
... .

Усе элементы знаходзяцца паміж адкрывалым і які закрывае тэгамі. Кожны пункт спісу пачынаецца з новага радка і мае фармат

1. ... . Колькасць элементаў не абмежавана.

   Выбар шрыфта: і яго атрыбуты

   Што можна змяніць, выкарыстоўваючы гэты HTML-тэг? Памер тэксту, яго шрыфт і колер - прычым без дадання новых класаў у CSS. Гэта вельмі зручна, калі трэба вылучыць толькі адну прапанову або фрагмент.

   мае некалькі атрыбутаў:

   • Face. Дазваляе змяняць шрыфт тэксту. Можна пералічыць некалькі варыянтаў праз коску (Tahoma, Verdana). Калі ў карыстальніка не ўсталяваны першы шрыфт, сістэма проста выкарыстоўвае альтэрнатыву.
   • Size. Каб павялічыць або паменшыць тэкст, пакажыце ў двукоссях значэнне ад 1 да 7.
   • Color. У залежнасці ад дызайну можна выбраць адзін з стандартных адценняў (red, green, blue) або ўвесці код любога колеру на выбар.

   Не выкарыстоўвайце абзацы, адфарматаваны з дапамогай , замест падзагалоўкам. Лепш задаць тыя ж параметры афармлення правільным тэгам.

   Спосабы вылучэння тэксту

   Аднастайны тэкст стамляе, нават з разбіўкай па абзацы. Каб прыцягнуць увагу і падцяпліць цікавасць чытача, ключавыя моманты рэкамендуецца выдзяляць графічна. Вось некалькі каманд, якія дапамогуць справіцца з гэтай задачай.

   ... . Надзвычай папулярны HTML-тэг. Тоўсты тэкст адразу кідаецца ў вочы, а таму з яго дапамогай зручна вылучаць важныя тэзісы і факты.

   Многія блытаюць тэгі і . Візуальна розніцы няма, але працуюць яны па-рознаму. Першы проста мяняе знешні выгляд тэксту, а другі выконвае функцыю "паказальніка" і вылучае самыя важныя фрагменты (тэматычныя ключавыя словы і фразы для SEO).

   ... . Хупавы і строгі курсіў ідэальна падыходзіць для афармлення навуковых тэрмінаў, замежных слоў і разнастайных цытат. У сур'ёзных выданнях нахільным тэкстам таксама вылучаюць назвы твораў мастацтва.

   ... . Мабыць, столькі спрэчак не выклікаў ні адзін HTML-тэг. Падкрэсленне тэксту выкарыстоўваецца рэдка, бо дадзены спосаб вылучэння гістарычна замацаваўся за гіперспасылкамі. Калі ж вы карыстаецеся у артыкулах, улічыце, што гэта падыходзіць толькі для кароткіх фрагментаў - не больш за 1 радка.

   ... . Цікавы тэг, які дазваляе зрабіць частку тэксту зачёркнутой. Вельмі актуальны ў рэкламе - напрыклад, каб падкрэсліць кантраст паміж старой і новай коштамі.

   ... . Самы просты спосаб павялічыць памер шрыфта без якіх-небудзь дадатковых параметраў.

   ... . Працуе па тым жа прынцыпе, што папярэдні тэг. Тэкст, размешчаны ўнутры, памяншаецца адносна асноўнага.

   ^{... .} Правільная назва такога фармату - верхні індэкс. У асноўным дадзены тэг прызначаны для матэматычных ступеняў і зносак. Ён памяншае памер шрыфта і ссоўвае вылучаны тэкст ўверх.

   _{... .} Ніжні індэкс часта сустракаецца ў розных формулах. Вылучаны фрагмент размяшчаецца ніжэй асноўнага тэксту.

   сэнсавыя кантэйнеры

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

   ... . Тэг для дадання камп'ютэрных кодаў. Незаменны ў артыкулах па праграмаванні з прыкладамі - каманды не выконваюцца, а адлюстроўваюцца, як звычайны тэкст.

   ... . Прызначаны для афармлення цытат - напрыклад, ключавых вынятак з інтэрв'ю.

   ... . Выносіць частка тэксту ў асобны блок. Па змаўчанні вылучаны фрагмент мае большы водступ злева, аднак у CSS вы таксама можаце змяніць памер, стыль напісання і колер тэксту.

   ... . Дадатковы тэг, у якім утрымліваецца інфармацыя пра аўтара, у тым ліку спасылкі.

   Раздзяляльная лінія

   ---

   З дапамогай простай рысы можна пазначыць лагічны канчатак вялікага падзелу.

   ---

   не адносіцца да парным тэгах. Гэта значыць, што зачыняе элемент фармату не патрэбны.

   C дапамогай атрыбуту WIDTH можна зрабіць падзельнік карацей, задаўшы прыдатны памер у пікселях або працэнтах ад шырыні акна.

   Навучыўшыся пісьменна выкарыстоўваць тэгі для фарматавання тэксту ў HTML, вы не толькі зробіце свае артыкулы зручнымі для чытання, але і павялічыце эфектыўнасць SEO.