SEO Оптимізований логотип

Всім відомо про те, що майже кожен сучасний сайт наділений логотипом. Логотипи бувають різні - текстові, геометричні, web2.0 і інші, однак, з точки зору SEO, Абсолютно не важливо, якого типу ви використовуєте логотип, а важливо те, як він оформлений у HTML коді. Саме про оптимізацію логотипів і хотілося б поговорити.
За призначенням, логотипи можна підрозділити на ті, які служать тільки для оформлення сторінки і не служать для навігації і ті, які є частиною навігації і повинні вести на головну сторінку сайту.
Якщо говорити про логотипи першого типу, то в залежності від обсягу сторінок та інформації їх можна оформляти або картинками (тег img), або за допомогою CSS стилів. При невеликій кількості контенту і наявності всього однієї або декількох сторінок на сайті, гарним рішенням буде використовувати для логотипу тег <img> з потрібними ключовими словами в атрибут alt, Які будуть доповнювати контент сторінки.
<div class="logo"> <img src="images/logo.jpg" alt="Ключові слова" width="100" height="30" /> </ div>
Зауважте, що в атрибут alt потрібно писати ключові слова, за якими оптимізується сайт, можна з назвою сайту, створюючи бренд, а не написи на кшталт "Логотип компанії". При такому підході ваш логoтіп також буде видаватися в результатах пошуку зображень за обраними вами ключам або бренду. Приклад можна подивитися на сайті seogen.net - seo генератор.
Якщо на сайті безліч сторінок з великою кількістю контенту, які оптимізуються під низькочастотні запити, Тоді краще оформити ненавігаційній логотип за допомогою CSS стилів, щоб оптимізувати код, завантаження сторінок і не заважати високочастотні запити в ключах логотипу з низькочастотними в контенті.
<div class="logo"> </ div>

. Logo {
width: 100px;
height: 30px;
background: url (images / logo.jpg) no-repeat left top;
}

Приклади логотипів першого типу (ненавігаційній).

Навігаційні логотипи

Логотипи цього виду можна оформити різними способами, наприклад, так:
<div class="logo"> <a href="/"> <img src="images/logo.jpg" alt="Ключевие слова" width="100" height="30" /> </ a> < / div>
Однак, у коді це виглядає занадто громіздко, збільшуючи розмір кожної сторінки на кілька байт і при такому підході вагу на головну сторінку буде передаватися без урахування ключових слів. Краще використовувати другий варіант, як на сайті хороших адвокатів.
<div class="logo">
<a href="/"> </ a>
</ Div>

. Logo (padding-left: 32px; padding-top: 70px;)
. Logo a (
background: url (/ images / logo.jpg) no-repeat left top;
display: block;
height: 43px;
width: 133px;
}

Цей метод оформлення логотипу вже краще, але знову ж відсутні ключові слова на засланні, зазвичай високочастотні, за якими оптимізується головна сторінка сайту. Адже зазвичай, лого розміщується в самому верху сторінки, для SEO це важлива частина. Тому, хорошим рішенням для навігаційного логотипу буде наступне:
<div class="logo"> <a href="/"> Ключові слова сайту </ a> </ div>
При цьому, щоб заховати ключові слова від очей користувача, достатньо в CSS використовувати правило text-indent.
. Logo a (text-indent:-1000em; outline: 0;)
Знову ж таки, слід зауважити, що багато хто в логотипах в атрибут alt ставлять непотрібну нікому інформацію "Лого сайту", "Домашня сторінка" і т.д. (Напр., www.photostart.info). Ставте в alt потрібні ключі, а якщо ви хочете повідомити користувача при наведенні миші на логотип про те, що після кліка він буде перенаправлено на головну сторінку, використовуйте для цього атрибут title для посилання або зображення, який для цього і призначений і не береться до уваги пошуковими системами.

Висновки

Логотипи необхідно оформляти в коді так, щоб з одного боку оптимізувати HTML код, з іншого - використовувати потрібні ключі для передачі посилального ваги на головну сторінку і з третього - використовувати атрибут title для юзабіліті. Підводячи підсумок, формула ідеального логотипу буде виглядати наступним чином:
<div class="logo">
<a href="/" title="MySite.ua-Домашня сторінка"> Ключові слова сайту </ a>
</ div>