15 сайтов, которые делают удивительные вещи с HTML5

Рекламное объявление

Предстоящий HTML5 10 сайтов, чтобы увидеть, что такое HTML5 Подробнее Обновление до 20-летнего языка разметки гипертекста обещает вывести веб-интерфейс на совершенно новый уровень, позволяя браузеру делать больше как с визуальной точки зрения, так и с точки зрения данных. Несмотря на то, что HTML5 все еще далеко от полного развертывания, это не помешало многим разработчикам довести его до предела.

Проверьте эти удивительные веб-сайты, которые действительно дают вам хорошее представление о возможностях HTML5 как язык программирования, выполнение в вашем веб-браузере того, что когда-то было возможно только во внешней программе или плагин. Я протестировал их в Chrome, и все они должны работать в браузере, совместимом с HTML5, таком как Chrome, Firefox 4, Safari или IE9. Это демонстрационные версии, а HTML5 все еще находится в стадии разработки, поэтому, если у вас возникли проблемы с их просмотром, вы можете попробовать использовать другой браузер. Наслаждайтесь!

Это отличная демонстрация, сделанная Arcade Fire и Google, в которой представлены различные трюки HTML5 Canvas. Я не хочу портить вам сюрприз - введите адрес своего детства и наслаждайтесь видео и техническим волшебством.

WebVenture - реализация HTML5 и Javascript игровой платформы MacVenture. Теперь вы можете играть в Deja Vu 1 & 2, Shadowgate и Uninvited прямо в вашем браузере! Другие реализации игр, такие как Wolfenstein 3D над работой, привнося игры в ваш браузер.

Этот сайт от Google демонстрирует «книжный» подход к описанию того, как работают веб-браузеры и как работают базовые технологии. Впечатляющий с технической точки зрения, он также является хорошим учебником для читателей, которые хотели бы узнать больше о том, как работает сеть.

Совместный рисунок

Это демо использует HTML5 веб-сокеты особенность, позволяющая зрителям совместно - в то же время - рисовать на холсте.

SketchPad - это программа для рисования в Интернете. Он поддерживает элементарные инструменты рисования и выполняется только в HTML5 и JavaScript.

Galactic Plunder - это 2D Space Shooter, реализованный в HTML5. Не совсем так, как в обычном шутере с боковой прокруткой, это сделано полностью в HTML5, что само по себе впечатляет.

HTML5 позволяет вам многое с видео в Интернете. В дополнение к тому, что вы можете воспроизводить его без веб-браузера и без плагинов, оно позволяет вам управлять этим видео. Эта демонстрация показывает, как вы можете «взорвать» пиксели видео во время воспроизведения.

Несколько оконный шар

Это демонстрирует и эффект, также замеченный в видео Огня Аркады. HTML5 позволяет открывать несколько окон и перемещать объекты между ними.

HTML5 Rocks - это слайд-шоу, демонстрирующее многие особенности языка HTML5. Если вы разработчик, он предоставит вам пример кода и позволит вам увидеть возможности HTML5.

Если вы были геймером в начале 90-х, вы с любовью запомните этот эффект. Поскольку вычислительные возможности были ограничены, графические дизайнеры использовали «хитрости» для эмуляции видео в статическом изображении. Этот эффект холста покажет вам, как это было сделано, а также включает в себя множество прекрасных примеров.

Эксперименты на HTML5 от Hakim.se [больше не доступны]

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

Harmony - это аккуратная маленькая программа для рисования, которая позволяет вам использовать классные кисти для рисования картины. Вы можете создавать такие вещи, как «мех» и «сеть», которые просто здорово увидеть при создании.

Этот аккуратный мэшап из @ 9elements сочиняет музыку и вращающиеся точки с постами в твиттере о HTML5. Трудно описать на практике, надо видеть, чтобы понять!

Radiohead / HTML5 Mashup

Еще один аккуратный мэшап, который рождает Radiohead Idioteque с рисунком Тома Йорка, который рисуется по ходу песни. Еще один эффект «видимо, чтобы верить».

Хочу больше?

Эти два веб-сайта настроены на то, чтобы предоставить посетителям множество демонстраций HTML5 и HTML5-эффектов Canvas. От мирского до «крутого», если вам хочется большего, вот куда пойти.

Сейчас в Интернете есть много демонстраций HTML5, и он уже на пути к тому, чтобы стать новым стандартом Интернета. У вас есть отличные демо, которыми вы хотели бы поделиться? Пожалуйста, оставьте в комментариях ниже!