Есть два варианта, идентичных визуально, но различающиеся по семантике с точки зрения поисковых систем.
ВАРИАНТ ПЕРВЫЙ
<a href = "index.html" class = "logo">Кушать Подано - лучший ресторан в России</a>
.logo {
display: block;
text-indent: -99999px;
width: 250px;
height: 75px;
background: url("logo.gif") no-repeat;
}
Достоинства: релевантная ссылка с каждой страницы сайта на индекс. :)
Недостатки: посетитель не сможет простым способом сохранить изображение логотипа; если отключено отображение картинок, будет сложно понять, что это картинка, являющаяся к тому же логотипом. :(
ВАРИАНТ ВТОРОЙ
<a href = "index.html"><img src = "logo.gif" width = "250" height = "75" alt = "Кушать Подано - лучший ресторан в России" /></a>
Достоинства: при желании посетитель может простым способом сохранить логотип; при отключенных картинках будет видно, что здесь находится изображение, к тому же будет понятно, что это логотип (внутри будет текст из alt'а). :)
Недостатки: внутри ссылки находится изображение, а не текст... Т.е. ссылка, на мой взгляд, не такая ценная, как в предыдущем варианте. :(
Примечание:
chong, почему?
Примечание:
ise-dvp, не подскажете каким образом?
Примечание:
ise-dvp, а! Я-то думал все глубже, а у Вас была более простая мысль. Но она же меня подтолкнула на лучшее решение. Сделать для логотипа контейнер, в него поместить картинку, а ПОВЕРХ картинки ссылку того же размера. ;) Правда сохранить картинку с помощью контекстного меню не удастся, но при отключенной графике, пользователь увидит и рамку картинки и ее alt.
<div class = "logo">
<img src = "images/logo.jpg" width = "238" height = "75" alt = "Смакуй Гейшу - Восточная кухня" />
<a href = "index.html">Смакуй Гейшу - Восточная кухня</a>
</div>
.logo {
display: block;
width: 238px;
height: 75px;
margin: 0 auto;
position: relative;
top: 80px;
background-color: #f5a198;
}
.logo a {
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
text-indent: -99999px;
background: url("../images/blank.gif") repeat;
}
P.S. blank.gif - 1х1 прозрачный гиф.
P.P.S. Применять таблицы в данном случае крайне НЕ приветствуется! Атрибуты "align" и "border" тоже не рекомендуются!
RPI.su - самая большая русскоязычная база вопросов и ответов. Наш проект был реализован как продолжение популярного сервиса otvety.google.ru, который был закрыт и удален 30 апреля 2015 года. Мы решили воскресить полезный сервис Ответы Гугл, чтобы любой человек смог публично узнать ответ на свой вопрос у интернет сообщества.
Все вопросы, добавленные на сайт ответов Google, мы скопировали и сохранили здесь. Имена старых пользователей также отображены в том виде, в котором они существовали ранее. Только нужно заново пройти регистрацию, чтобы иметь возможность задавать вопросы, или отвечать другим.
Чтобы связаться с нами по любому вопросу О САЙТЕ (реклама, сотрудничество, отзыв о сервисе), пишите на почту [email protected]. Только все общие вопросы размещайте на сайте, на них ответ по почте не предоставляется.