Шта су ХТМЛ мета ознаке и за шта се користе?

Кључне Такеаваис

  • Мета ознаке пружају виталне информације о веб страници за претраживаче, претраживаче и веб услуге.
  • Основни типови укључују мета опис, отворени графикон, оквир за приказ и ХТТП-еквив ознаке.
  • Прилагођене мета ознаке нуде флексибилност, али захтевају пажљиву документацију и планирање.

Поред наслова ваше странице и скрипти и стилова које користи, одељак ХТМЛ главе може да садржи мета ознаке. Ово је од виталног значаја за СЕО, приступачност и укупне перформансе веб локације.

Научите како да користите мета ознаке и сазнајте које информације могу да пруже.

Мета ознаке су елементи који пружају додатне информације о веб страници. Претраживачи не приказују ове метаподатке директно, али било који алат може да их користи у различите сврхе. Ово укључује претраживаче, претраживаче и друге веб услуге.

Подаци које унесете у метаознаке помажу у побољшању рангирања на претраживачима, доприносе брзом реаговању и приступачности веб странице и побољшавају приказ ваших страница на друштвеним медијима.

Мета ознаке су самозатварајуће ознаке; нема јер не обухватају никакав садржај. Они садрже све своје податке у атрибутима. Можете додати мета ознаке у одељак заглавља ваше ХТМЛ датотеке:

 <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width-device-width, initial-scale=1.0">

  <title>Document</title>
</head>
<body>

</body>
</html>

Овај пример ХТМЛ шаблона садржи две мета ознаке у одељку хеад. Они обезбеђују информације о скупу знакова (УТФ-8) и области приказа, респективно.

Већина мета ознака користи комбинацију следећих атрибута да би садржала своје податке.

  • име и садржај: атрибут наме је као ознака, док атрибут садржаја чува податке повезане са том ознаком. Ово обезбеђује флексибилан, проширив систем за складиштење свих метаподатака који су вам потребни.
  • својство: Овај атрибут се понекад користи као алтернатива имену и служи углавном истој сврси.
  • хттп-екуив: Што значи “ХТТП еквивалент”, овај атрибут дефинише ХТТП заглавље за вредност наведену у атрибуту садржаја.
  • шема: Овај атрибут, који се користи са именом, дефинише тип података у атрибуту садржаја.
  Како проследити слике са натписима на Вхатсапп-у

Видећете да различите веб услуге и прегледачи обично подржавају следеће мета ознаке.

Мета Десцриптион Таг

Овај исечак дужине до 155 знакова резимира садржај странице. Претраживачи га често приказују испод наслова странице и УРЛ адресе. Од суштинског је значаја да пружите концизан и тачан опис како бисте подстакли кориснике да кликну на везу и посете вашу страницу.

 <meta name="description" content="A brief description of your page"> 

Отворите метаознаке графикона

Фацебоок и друге платформе друштвених медија значајно користе ове ознаке. Они користе информације у овим ознакама да побољшају презентацију веза до ваше странице када је корисници деле. Мета ознаке Опен Грапх укључују атрибуте као што су ог:титле, ог:десцриптион и ог:имаге:

 <meta property="og:title" content="Your Page Title">
<meta property="og:description" content="A brief description of your page">
<meta property="og:image" content="URL of a related image">

СЕО Мета Тагс

Ове ознаке пружају информације претраживачима и могу помоћи да се побољша ранг ваше странице. Они су такође укључени на листу основних СЕО најбољих пракси. Они укључују атрибуте као што су роботи, аутор и још много тога. Иако се важност ових ознака временом смањила, и даље је неопходно да их укључите у свој ХТМЛ документ.

 <meta name="robots" content="index, follow">
<meta name="author" content="Your Name">

Мета таг прозора приказа

Мета ознака области приказа је суштински елемент у респонзивном веб дизајну. Он говори претраживачу да прилагоди изглед веб странице према ширини уређаја, осигуравајући да се садржај правилно приказује и да је читљив на мобилним уређајима.

 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 

Мета ознаке ХТТП-еквив

Ове мета ознаке су неопходне за контролу одређених аспеката начина на који прегледачи и сервери обрађују веб странице. Они укључују атрибуте као што су освежавање и Кс-УА-Цомпатибле. Иако њихов директан утицај на СЕО може да варира, они играју кључну улогу у утицају на понашање и компатибилност странице.

 <meta http-equiv="refresh" content="5;url=https://example.com">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

Нећете их користити све одједном у својим пројектима, али је и даље важно добро разумети различите доступне мета ознаке. Такође, коришћење мета ознака пружа предности у побољшању организације ХТМЛ докумената.

  Како уклонити „Често посећено“ на Сафарију (иПхоне и Мац)

Мета ознаке су флексибилне јер:

  • Слободни сте да користите име по свом избору за чување података које желите.
  • Прегледачи неће приказати свој садржај, иако ће увек бити видљив у извору странице.

Ево примера прилагођене мета ознаке:

 <meta name="target-audience" content="developers"> 

У овом примеру, прилагођена ознака специфицира циљну публику садржаја, што указује да циља програмере.

Прилагођене мета ознаке нуде начин да се прошири стандардни скуп ознака које су широко признате. Међутим, важно је пажљиво документовати прилагођене ознаке које користите и добро разумети како ћете их користити. Друге услуге их подразумевано неће користити или препознати, тако да ћете вероватно у неком тренутку писати сопствени код да бисте их обрађивали.