html 5 написание

Здравствуйте уважаемые начинающие веб-мастера.

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

В этих рекомендациях есть некоторые нововведения, в корне отличающиеся от применяемых ранее правил.

А так как многие веб разработчики, заглядывают в спецификацию не очень то часто, если вообще делают это, то данная информация будет им полезна.

1. Используйте html5

HTML5 рекомендуется для всех типов документов. Не используйте XHTML, так как он хуже поддерживается браузерами, и ограничивает возможность оптимизации.

2. Старайтесь использовать валидный код.

Валидность — это важное качество кода. Написание валидного html способствует изучению технических требований, и обеспечивает правильное использование html.

Для проверки кода применяйте W3C HTML Validator. Работа над ошибками, выявленными валидатором, положительно сказывается на уровне образования веб-мастера.

3. Разделяйте структуру, оформление и поведение.

Держите структуру — разметка, css, скрипты раздельно, то есть в разных файлах. Постарайтесь свести их совмещение к минимуму.

Рекомендуется:

<!DOCTYPE html>
	<html lang="ru">
<head>
	<meta charset="utf-8" />
	    <link  href="css/style.css" rel="stylesheet">
	<title>Документ без названия</title>
</head>
<body>

</body>
</html>

Не рекомендуется:

<!DOCTYPE html>
	<html lang="ru">
<head>
	<meta charset="utf-8" />
	<title>Документ без названия</title>
		<style>
		   #selector{
			.nev: znac;
			    }
		</style>
</head>
<body>
	<p style="font-size: 16px;">Тест текст</p>
</body>
</html>

4. Не используйте необязательные теги.

Ознакомьтесь в спецификации HTML5 с необязательными тегами, и опускайте их при написании кода.

Для согласованности, и простоты кода, лучше опускать все необязательные теги, а не некоторые из них.

Это пока отличается от того, чему учат веб разработчиков, но данное правило будет использоваться повсеместно.

Не рекомендуется:

<!DOCTYPE html>
	<html lang="ru">
<head>
	<meta charset="utf-8" />
	<title>Документ без названия</title>
</head>
<body>
	<p>тест</p>
</body>
</html>

Рекомендуется:

<!DOCTYPE html>
	<meta charset="utf-8" />
	<title>Документ без названия</title>

	<p>тест

5. Не указывайте атрибут type при подключении стилей и скриптов к html документу.

Указывать данный атрибут не обязательно, так как html5 использует его в данном случае по умолчанию. Это работает во всех, даже старых браузерах.

Не рекомендуется:

<link href="css/style.css" rel="stylesheet" type="text/css">

Рекомендуется:

<link href="css/style.css" rel="stylesheet">

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

<ul>
    <li>Яблоко
    <li>Груша
    <li>Слива
  </ul>
  <table>
    <thead>
      <tr>
        <th scope="col">День
        <th scope="col">Месяц
    <tbody>
      <tr>
        <td>20
        <td>11
  </table>

7. Не используйте ссылки мнемоники.

Нет смысла использовать ссылки-мнемоники, когда все команды в файлах, используют одну кодировку UFT-8.

Исключением из этого правила являются служебные символы html, такие как < (&lt;), > (&gt;), а так же вспомогательные и невидимые символы, такие как градус (&deg;) или неразрывный пробел (&nbsp;)

8. Используйте теги html строго по назначению.

p используйте только для абзацев
a используйте только для ссылок
h используйте только для заголовков

И так далее.

9. Всегда указывайте альтернативный текст для мультимедиа.

Постарайтесь всегда указывать альтернативное содержимое для мультимедиа, например: для картинок это альтернативный текст (alt), а для видео — расшифровки текста и подписи.

Альтернативное содержание может помочь людям с ограниченными возможностями.

Если картинка используется чисто в декоративных целях, то используйте для неё пустой альтернативный текст alt=»».

Валидация документа < < < ◊ > > > Написание css

Запись опубликована в рубрике HTML основы. Добавьте в закладки постоянную ссылку.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *