HTML 5 (Обмен опытом)

1. delete (03.02.2011 / 13:22)
Предлагаю всем желающим работающих с HTML 5 делится опытом в данной теме. Сюда можно вносить и примеры наиболее интересного вам кода, разные вкусности из CSS3 и canvas. Можно делится и ссылками по данной тематике с примерами.

Сервисы для дизайнера:
- WORDMARK.TK позволяет увидеть написание заданной фразы со всеми шрифтами, установленными на вашем компьютере.
- SPRITEBOX.NET предназначен для «нарезки» картинок на спрайты.
- ProCSSor инструмент для проверки/форматирования css-стилей.
- Super Conversion Button инструмент для быстрого создания дизайнов кнопок.
- 0 to 255 простой и удобный сервис подбора оттенков цветов.
- Frame Box сервис для создания так называемых «wireframes» структурных схем таблиц.
- JSFIDDLE.NET «песочница» для веб-разработчиков.
- Button Maker инструмент для создания кнопок.
- Generator генератор CSS3 элементов.
- Please! холст для тестирования CSS3 свойств.
- Gradient Generator генератор градиентов.
- Transforms трансформация блоков.
- Selectors Test тестер селекторов.

Ссылки по теме HTML 5 и CSS3:
- Логотип HTML 5
- Шаблон HTML 5 для создания сайтов
- HTML 5 <VIDEO> от А до Я

Примеры с использованием CANVAS:
- HTML5 CANVAS шаг за шагом: основы
- HTML5 CANVAS шаг за шагом: изображения
- Кубик Рубика
- Салют
- Эксперименты CANVAS
- Игры на CANVAS

2. delete (07.02.2011 / 07:53)
Новая структура документа
Что же нам принесет новый HTML5, изменения в первую очередь коснулись структуры документа.

DOCTYPE:
Теперь вместо привычных нам 3 всего лишь один.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> // было раньше

<!DOCTYPE html> // HTML5

Корневой документ:

<html xmlns="http://www.w3.org/1999/xhtml"
      lang="ru"
      xml:lang="ru"> // был раньше

<html lang="ru"> // HTML5

Кодировка символов:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> //  было раньше

<meta charset="utf-8" /> // HTML5

Вставка css и java script:

<script type="text/javascript" src="script.js"></script> // был раньше

<script src="script.js"></script> // HTML5

Новые теги:
В HTML 5 появилось несколько новых тегов article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section и т.д Которые служат для формирования документа, улучшают семантику, работают с мультимедиа и графикой, о всех их поговорим позже.

Пример структуры документа:

<!doctype html>
<html>
  <head>
    <meta name="description" content="Free template for PSPad" />
    <meta name="keywords" content="html5,template,pspad" />
    <meta name="author" content="Marshall" />
    <meta name="generator" content="PSPad editor, www.pspad.com" />
    <meta charset="UTF-8" />
    <title>Untitled</title>
  </head>
<body>
  <header> </header>
  <nav> </nav>
  <article>
    <section>

    </section>
  </article>
  <aside> </aside>
  <footer> </footer>
</body>
</html>

смотрим рисунки.
HTML 4 http://upwap.ru/1292301

HTML 5 http://upwap.ru/1292303

3. BEPDuKT (07.06.2011 / 13:10)
Вот шаблон на HTML 5, может кому пригодится - http://freegraphic.ru/web-templates/1390-besplatnyj-html5-shablon-sajta-na-temu-promyshlennogo-biznesa-free-html5-website-template-industrial-services.html

4. BEPDuKT (07.06.2011 / 16:41)
Обновляем сайт до HTML5 - http://outcoldman.ru/ru/blog/show/275

5. delete (07.06.2011 / 17:08)
кстати прошел слух что новые приложения для windows 8 будут основываться на html 5, интересно smile

6. Кирилл Алексеевич (07.06.2011 / 17:11)
Точно будут, MS уже подтвердила.

URL: https://visavi.net/topics/18463