Советы по правильному использованию html (11-20)

Советы по правильному использованию html (11-20)11. Используйте теги H1 — H6


Лучше всего использовать все 6 тегов. Большинство вебмастеров работают максимум с 2-3-мя. В целях SEO и правильной семантики иногда заставляйте себя вместо тега P использовать заголовки.
<h1>This is a really important corn fact! </h1>

      <h6>Small, but still significant corn fact goes here. </h6>
    

12. При запуске блога оставьте тег H1 для названия статьи

С точки зрения SEO это будет наилучшим вариантом. По многим поисковым запросам Ваш блог начнет появляться в выдаче.

13. Загрузите ySlow

В последние несколько лет команда Yahoo очень успешно работает над темой ускорения загрузки сайтов. Совсем недавно они создали дополнение для Firebug с названием ySlow (http://developer.yahoo.com/yslow/). При активации оно анализирует сайт и выдает отчет с рекомендациями по улучшению скорости загрузки. Рекомендую всем.

14. Сделайте навигацию на сайте с помощью неупорядоченного списка


На каждом сайте есть какая-либо навигация. Можно ее создать очень просто:
<div id=»nav»>

<a href=»#»>Home </a>

<a href=»#»>About </a>

<a href=»#»>Contact </a>

</div>
  

Но я призываю Вас так не делать по причине семантики. Вы должны стремится писать наиболее оптимальный код.

И лучше всего использовать тег UL, так как в нем может находится список элементов.
<ul id=»nav»>

<li><a href=»#»>Home</a></li>

<li><a href=»#»>About</a></li>

<li><a href=»#»>Contact</a></li>

</ul>
  


15. Научитесь подстраиваться под IE


Порой Вам захочется очень сильно ругаться на творение Майкрософт. Очень часто именно в этом браузере все отображается неверно.

В таком случае после создания основной таблицы стилей, Вам необходимо также создать уникальную таблицу стилей «ie.css». И скармливать ее посетителям, которые используют IE вот так:
<!—[if lt IE 7]>

<link rel=»stylesheet» type=»text/css» media=»screen» href=»path/to/ie.css» />

<![endif]—>
    

Этот код сообщает браузеру: «Если у пользователя Internet Explorer 6 или ниже, загрузить этот CSS файл». Если необходимо включить также IE7, тогда замените «lt» на «lte» (при переводе с английского: меньше или равно).


16. Выберите хороший редактор кода

С помощью специальных архиваторов можно существенно (более чем на 25%) уменьшить CSS и javascript файлы. В процессе создания — не думайте об этом. После завершения работы не забывайте про это.

Сервисы по сжатию javascript:

* javascript Compressor (http://javascriptcompressor.com/)
* JS Compressor (http://www.xmlforasp.net/JSCompressor.aspx)

Сервисы по сжатию CSS:

* CSS Optimiser (http://www.cssoptimiser.com/)
* CSS Compressor (http://www.cssdrive.com/index.php/main/csscompressor/)
* Clean CSS (http://www.cleancss.com/)

18. Всем изображениям необходим аттрибут «Alt»

Очень легко его не использовать. Но это очень важно для успешной проверки на валидность и в целях оптимизации сайта.


Плохо:
<IMG SRC=»cornImage.jpg» />
    

Хорошо:
<img src=»cornImage.jpg» style=»max-width:600px;» alt=»A corn field I visited.» />

19. Просматривайте исходный код страницы

Лучший способ выучить HTML просматривать исходный код других сайтов. На первых этапах можно копировать интересные идеи. Далее они будут трансформироваться в свои новые наработки. Копируйте у всех, учитесь, все такое делают (но при этом не передирайте дизайн 1 в 1 — экспериментируйте).

Также с помощью исходного кода страницы можно найти интересные javascript эффекты.

20. Выучите каждый тег HTML

Существует десятки тегов, с которыми Вы скорее всего не встретитесь. Но это не означает, что их можно не знать. Вам знаком тег «abbr»? а «cite»? Эти теги заслуживает место в Вашем арсенале.

На сегодня все! Завтра Вас ждет завершающая часть статьи.

Всего наилучшего, уважаемые посетители.

Без рубрики