zura-blog 20Привіт всім відвідувачам Zura–Blog, сьогодні вирішив написати пост про те, як додати метатеги до HTML –сторінки. Додавання метатегів до HTML – сторінки використовують для застосування методів SEO. 

В HTML –сторінку до якої будуть додаватись метатеги не буде знаходитись на хостингу, її не знайти в інтернеті, зміни які будуть внесені в сторінку, будуть робитись в off–line середовищі, для того щоб лише перевірити, “чи це працює”.

Пошуковий термін по якому я збираюсь оптимізувати сайт це “веб дизайн”

Взагалі для того щоб перевірити рівень, на якому знаходиться сайт з точки зору SEO, в інтернет мережі можна знайти дуже багато ресурсів, або безкоштовних інструментів (tool), типу “перевірка метатегів”.

На даний момент перевіряти HTML – сторінку не має сенсу, оскільки на ній не присутньо жодного метатегу, та й взагалі мета публікації інша, вона заключається в тому щоб показати куда вставляти метатеги, і які ключові слова підбирати.

Розпочнемо з заголовку для html – сторінки. До речі як створити заголовок, якщо користуватись любим веб редактором, наприклад Adobe Dreamveawear то в ньому в налаштуваннях уже присутній текст для заголовку, потрібно тільки знати як вивести текст, він створиться автоматично коли ви вкажите в налаштуваннях.

Не має значення яким ви редактором користуєтесь, я маю  на увазі платним веб редактором, коли ви створюєте HTML – сторінку, спочатку в верхній панелі налаштувань клацаєте на файл, потім  вибираєте  команду “створити новий”, і там вже визначаєтесь з розширення файлу і вибираєте декларацією сторінки. Що таке декларація і тип документа можна прочитати в публікації  “Базова структура документа HTML”.

Заголовок HTML – сторінки виглядає наступним чином

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Документ без названия</title>
</head>

<body>
</body>
</html>

 

Звісно що в заголовку відсутні метатеги, тому їх необхідно додати вручну, а також в метатегах прописати ключові слова сайту.

Ну що ж додаємо оскільки це дуже важливо для пошукових систем.

<meta http–equiv=’content–language’ conten=’ukr–Ua’>

це для того щоб пошуковик знав на якій мові написаний вміст сайту

<meta name=’description’ content = ‘Блог про перші спроби в веб дизайні, з чого найлегше починати займатись веб дизайном, про плагіни для CSM WordPress, CCS, PHP, JAVA, JavaScript’>

Це і є метатег, це є опис який буде появлятись в Google при пошуку.

<meta name = ‘keywords’ content= “веб–дизайн, плагіни для CSM WordPress, CCS, PHP, JAVA, JavaScript”>

для того щоб підкреслити ключові слова

<meta name =’subject’ content=’Перші спроби в веб дизайні’>

відображає мету сайту 

<meta name = ‘abstract’ content =’З чого найлегше розпочинати займатись веб дизайном’>

відображає опис сторінки, якій темі сторінка присвячена 

<meta name = ‘robots’ content = ‘index, follow’>

надамо інструкції роботу Google а саме читати ваш сайт

<meta name = ‘revisit–after’ content=’3days’>

визначає як часто робот буде читати вміст нашого сайту 

<meta name =’author’ content = ‘Zura-Blog’>

відображає автора сторінки

Ну і звичайно заголовок, щоб він містив групу слів по якій ми хочимо просувати наш сайт

<title>Zura-Blog</title>

Коли ми додамо все це в header наш сайт буде виглядати наступним чином.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http–equiv='content–language' conten='ukr–Ua'>
<meta name='description' content = 'Блог про перші спроби в веб дизайні, з чого найлегше починати займатись веб дизайном, про плагіни для CSM WordPress, CCS, PHP, JAVA, JavaScript'>
<meta name = 'keywords' content= "веб–дизайн, плагіни для CSM WordPress, CCS, PHP, JAVA, JavaScript">
<meta name ='subject' content='Перші спроби в веб дизайні'>
<meta name = 'abstract' content ='З чого найлегше розпочинати займатись веб дизайном'>
<meta name = 'robots' content = 'index, follow'>
<meta name = 'revisit–after' content='3days'>
<meta name ='author' content = 'Zura-Blog'>
<title>Zura-Blog</title>
</head>

<body>
</body>
</html>

Після того як зробимо зміни в  “header”, додавши метатеги, можна повторно провести перевірку. Додавання метатегів дуже важливо, але щоб сайт виглядав відмінно, цього не достатньо, тому що текст який буде присутній мається на увазі не в “header” а на сторінці повинен містити такі метатеги description, keyword, title. Також можна виділити групу слів, використовуючи елементи H1, H2, H3 або просто виділити жирним.

На цьому буду закруглятись, до зустрічі.


user_97

Публікації присвячені мові розмітки тексту HTML знаходяться в категорії

“Все про HTML”