Создать панель навигации с HTML против Photoshop - PullRequest
3 голосов
/ 12 декабря 2011

На моем сайте я хочу навигационную панель.Я думал о создании фона в Photoshop, а затем использовал его в качестве фона неупорядоченного списка (с HTML, отображающим фактический текст) для элементов на панели.Лучше сделать это или сделать текст на элементы в Photoshop?И если я сделаю это вторым способом, как мне сделать так, чтобы каждая отдельная часть изображения была кликабельной?

1 Ответ

4 голосов
/ 12 декабря 2011

Здорово, что вы задаете правильные вопросы, и вы правы, задавая их.В любом случае используйте изображение в качестве фона, но никогда не помещайте текст в качестве изображения, чтобы избежать его, особенно в меню.Причиной этого является то, что поисковые системы в два раза не читают контент, а вторые программы чтения с экрана доступности не могут его прочитать, а пользователи не могут увеличивать текст через браузеры.

Ваша разметка может выглядеть примерно так

.nav{
     background-image:url("bg.jpg");
     background-repeat:no-repeat;
     width:yourwidth;
     height:yourheight;
     display:block;
}
.nav li{
     list-style:none;
     float:left;
     margin-left:20px;
     margin-right:20px;}

разметка

<ul class="nav">
    <li><a href="#">Link</a></li>
     <li><a href="#">Link</a></li>
     <li><a href="#">Link</a></li>
</ul>
...