Хабрахабр: Метки / html5

Блог компании Microsoft / Windows 8 Camp — 2 марта в Москве и онлайн

mixen — Mon, 06 Feb 2012 06:09:13 GMT

Мы проводим первое в России мероприятие по новой операционной системе Windows 8 – 2 марта пройдет Windows 8 Camp!

Мы расскажем и покажем, как создавать приложения на HTML5/JavaScript, C# и C++ и как соблюдать принципы Metro-дизайна.

Мероприятие бесплатное, регистрация уже идет, места уже начинают заканчиваться. Для всех желающих будет организована онлайн-трансляция.

Как вы знаете, на данный момент Windows 8 находится в статусе Developer Preview – как и наш сайт. В конце февраля выйдет бета-версия Windows 8, после чего у нас будет более подробное расписание докладов.

Не пропустите начало нового этапа в развитии Windows!

Firefox / Firefox будет отображать переводы строк (LF) во всплывающих подсказках (атрибутах title)

Mithgol — Sun, 29 Jan 2012 09:50:57 GMT

Как известно, спецификация HTML 4.01 чёрным по белому требует того, чтобы в строковых атрибутах (CDATA) символы перевода строки (LF) игнорировались, а символы возврата каретки (CR) заменялись пробелами.

А вот в спецификации HTML5, наоборот, символы перевода строки (LF) в атрибуте title считаются значимыми. Предполагается, что можно набрать код наподобие нижеследующего:

…

и ожидать, что при наведении на гиперссылку явится двустрочная всплывающая подсказка.

Кстати, я-то там набрал « » — но Хабрахабр заменил этот код реальным переводом строки. По меньшей мере, у меня в Файерфоксе. Этакий вот баг хабратэга . Впрочем, согласно HTML5, значимыми являются обе эти формы перевода строки. И сам символ, и его entity.

Internet Explorer как раз так всю дорогу и вёл себя (по меньшей мере, последние шесть лет) — плевать хотел на HTML 4.01, отображал многострочную подсказку. Уместно думать, что именно поведение MSIE послужило источником вдохновения для авторов соответствующего подраздела HTML5.

А несколько дней назад (25 января) эта проблема (bug 358452) была решена и в Файерфоксе. По-видимому, первой версией Файерфокса с поддержкою многострочных всплывающих подсказок станет Firefox 12.

Читать дальше →

Game Development / Зададим вопросы Тому Галлену, разработчику Construct Classic

habriel — Sun, 29 Jan 2012 09:47:39 GMT

Три дня назад на Хабре была опубликована статья «Разработка 2D игр под Windows и HTML5 без программирования», посвящённая конструкторам игр от компании Scirra: один бесплатный с открытыми исходниками Construct Classic для DirectX-игр (есть SDK и поддержкой плагинов на C++), второй на его основе — условно-бесплатный Construct 2 для создания HTML5-игр, в качестве движка используется Box2D.

Статья понравилась хабралюдям: +76 баллов и 471 в избранном. Более того, с нами связался директор компании Scirra Том Галлен (Tom Gullen) и предложил ответить на все интересующие вопросы. Грех не воспользоваться такой возможностью!

Для справки: английская компания Scirra зародилась в 2007 году как тусовка студентов, которым просто нравилось делать игры — так был создан Construct Classic, у которого за прошлый год 300 тыс. скачиваний. Сейчас он под GPL и поддерживается волонтёрами, а сама компания сконцентрировала усилия на Construct 2 для HTML5 — с его помощью она надеется «произвести революцию на рынке разработки HTML5-игр».

Задавайте вопросы в комментариях и голосуйте за интересные вопросы. Самые лучшие мы скомпилируем в один список и отправим Тому Галлену. По доброй традиции, все авторы вопросов получают плюсы в карму.

Веб-стандарты / Google предлагает стандартизировать автозаполнение форм

alizar — Sat, 28 Jan 2012 20:38:42 GMT

Компания Google внедрила в браузер Chrome поддержку экспериментального атрибута autocomplete type и теперь обращается с призывом ко всем веб-мастерам использовать этот атрибут в описании всех онлайновых форм. Просто добавьте его в поле input, например, для email это может выглядеть так:

Таким образом, владелец сайта может гарантировать, что функция Chrome Autofill точно сработает на этом поле.

Google сейчас договаривается с другими заинтересованными сторонами, чтобы стандартизировать данный атрибут как часть спецификаций HTML5. Пока что у него экспериментальный статус, что подчёркивается приставкой x- в полном написании x-autocompletetype.

Нынешний стандарт в данной области RFC 4112 практически нигде не используется и явно нуждается в обновлении.

HTML5 / Чёртова дюжина советов начинающим верстальщикам. Часть вторая

krovatti — Thu, 26 Jan 2012 12:48:59 GMT

Доброго времени суток!

О том, что вы читаете

Вот оно и свершилось — перед вами продолжение советов начинающим верстальщикам. Если вы не читали первую часть, то можете сделать это прямо сейчас.
В данной части вы ознакомитесь ещё с 11 советами (именно столько в моей второй заметке их находится).
Сперва мы пройдём нововведения в визуализации, а затем пофилосовствуем на тему семантики.

Ещё немного лирики

После выхода первой части я получил огромное количество feedback'a. Если честно, я не ожидал такого желания изучить что-то новое. Да-да, быдлокодеры там тоже есть. Но сейчас не об этом…
Также, как вы можете заметить, что количество человек, добавивших мой топик в избранное ~~достигло миллиона~~, достаточно велико, что не может не свидетельствовать об огромном интересе к HTML5. Итак, поехали.

Читать дальше →

HTML5 / Рекомендации по функциям HTML5

alizar — Wed, 25 Jan 2012 00:06:35 GMT

Новый справочный сайт HTML5Please может сильно помочь при разработке кросс-браузерных сайтов на HTML5.

Веб-разработчики привыкли постоянно ходить на caniuse.com и проверять поддержку определённой функции в каждой версии каждого браузера, включая прошлые и будущие. Оно и понятно, ведь новые браузеры обновляются с сумасшедшей скоростью, и поддержка функций меняется чуть ли не каждый день.

HTML5Please идёт дальше. Кроме информации c caniuse.com, он ещё даёт практические рекомендации, каким образом лучше реализовать каждую фичу HTML и CSS. Просто вписываете в поисковую строку любую функцию — и сразу видите рекомендацию, можно её использовать или нет в данный момент, а если можно, то с какими условиями.

Если функция поддерживается не во всех браузерах, то сразу же приведены ссылки на соответствующие полифилы (polyfills), кросс-браузерные фрагменты кода обычно на github, которые добавляют недостающий функционал в старые браузеры (см. список полифилов). Если для функции нужен фоллбэк (откат на другую функцию или другой формат для совместимости), то вкратце описывается, как это сделать и в каких условиях это необходимо.

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

HTML5 / Mac OS X Lion воссоздали на HTML5 и CSS3

PavelPV — Mon, 23 Jan 2012 07:33:59 GMT

Mac OS X Lion воссоздали на HTML5 и CSS3 (если быть честным воссоздали совсем не всю ОС). Чудо доступно по ссылке: www.alessioatzeni.com/mac-osx-lion-css3

HTML5 / Миграция flash приложений на html5. Видеоурок первый

potapenko — Sun, 22 Jan 2012 15:19:54 GMT

Читать дальше →

HTML5 / JavaScript приложение под iPad. Пара советов

sarjick — Sat, 21 Jan 2012 23:13:29 GMT

Достался мне проект по адаптации флеш-курса электронного обучения под iPad.
Хотел поделиться некоторыми моментами.

Медиа
Проект должен был позволять играть видео/аудио файлы, причем без лишний движений со стороны пользователя.
Видео на iPad можно проиграть только путем нажатия пользователем на что-нибудь, т.е. автоматически проиграть медиа файл, например, при загрузке страницы не получится, или получится, но далеко не во всех версиях iOS.
Так что первый раз проиграть видео/аудио приходится по клику пользователя. Дальше, если тому же тегу менять атрибут src, отлавливая событие onended, проигрывание можно делать автоматически.

Читать дальше →

Веб-разработка / Simpliste: всего одна неделя

crenative — Sat, 21 Jan 2012 05:42:23 GMT

Не знаю, как для вас, а для меня прошедшая неделя оказалась насыщенной. Чуть больше недели прошло с момента первого поста о Simpliste и чуть меньше с момента второго поста. Эти несколько дней принесли и неожиданные, и приятные события.

Simpliste, который я сразу назвал шаблоном, не претендовал ни на роль фреймворка-конкурента Бутстрапу, ни на роль сервиса создания сайтов в два клика. Хотя, поступали предложения о том, чтобы превратить его и в то, и в другое. Все, чего я хотел, было предоставить возможность людям скачать пару файлов, наполнить информацией и получить современный HTML5 сайт, оптимизированный для мобильных устройств. Еще там есть темы оформления.

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

Итак, правила были объявлены и неделя прошла в работе.

Читать дальше →

Веб-разработка / Загрузка картинок на сервер с использованием HTML5+jQuery+PHP

FreeWolfAlex — Fri, 20 Jan 2012 21:26:05 GMT

Доброго времени суток!

Наверняка многие видели в движке WP функцию переноса файлов с рабочего стола в окно браузера и их дальнейшую загрузку на сервер. Когда я увидел такое, мне стало интересно как же это организовано. Тогда я полез в дебри, чуть было не заблудился, но всё таки решение нашел. Оказывается все очень просто.

Что нам понадобится?

Всего лишь небольшие знания HTML5+jQuery+PHP.

Читать дальше →

Веб-разработка / Command and Conquer на HTML5

evilt0n1c — Fri, 20 Jan 2012 06:23:23 GMT

В последнее время наблюдаю все больше и больше старых игр портированных на HTML5. Планка, которую ставят разработчики портов все выше и выше — от марио и до another world. Но сегодня, думаю, рекорд был побит.

Читать дальше →

HTML5 / Чёртова дюжина советов начинающим верстальщикам. Часть первая

krovatti — Thu, 19 Jan 2012 13:26:57 GMT

Доброго времени суток!

Введение

Я являюсь фрилансером. Раньше я не особо задумывался над тем, как и что делают верстальщики. Я делал серверную часть, а мой друг верстал и набивал контент. Совсем недавно мне захотелось попробовать «что и как». Пару дней назад мне на глаза попался материал, который мне очень понравился. Он наглядно обЪяснял, что и как нужно писать. К сожалению, сылку дать не могу, так как я не запаомнил, где располагался сей мануал, но… Казалось бы, можно это и запомнить, но я пошёл ещё одним путём — законспектировал это дело. Собственно, добро пожаловать в мою записку.

Читать дальше →

Веб-разработка / CSS 3D эффекты

Isis — Wed, 18 Jan 2012 00:48:48 GMT

Стивен Виттенс переработал свой сайт Acko.net. Виттенс применил 3D функции CSS 3 и небольшую часть JavaScript для создания ошеломляющего 3D заголовка страницы.

Чтобы увидеть 3D в действии вам надо использовать браузер WebKit (Safari или Chrome) т.к. пока только они поддерживают CSS 3D эффекты. В других браузерах, которые еще не поддерживают 3D эффекты сайт все равно нормально просматривается. Чтобы увидеть полный 3D эффект обязательно прокрутите страницу.

Виттенс в своем блоге подробно написал как он создал 3D эффекты и даже сделал 3D редактор, с которым вы можете поиграть.

Читать дальше →

Блог компании ZeptoLab / Cut the Rope на HTML5

esolovyeva — Tue, 17 Jan 2012 15:44:04 GMT

На конференции CES в Лас-Вегас была анонсирована HTML5-версия Cut the Rope!

в игре доступно 25 уровней, в том числе специальный раздел только для пользователей Internet Explorer 9, который обеспечивает аппаратное ускорение графики HTML5.

Не забудьте заглянуть в раздел “Behind the Scenes”!

Наслаждайтесь игрой и ждите новых уровней на http://cuttherope.ie!

Веб-разработка / Simpliste: засучим рукава

crenative — Tue, 17 Jan 2012 08:30:21 GMT

После моего поста в прошлый четверг не осталось сомнений в том, что простой и бесплатный шаблон (кто-то даже называет фреймворк) с адаптивной версткой на HTML5 вызывает интерес у потенциальных пользователей. Пост даже собрал достаточно голосов, чтобы НЛО разрешило мне пригласить кого-нибудь на Хабрахабр.

Нужно напомнить, что Simpliste — именно такой шаблон. И теперь работа по его развитию пойдет полным ходом.

Одним из преимуществ Simpliste я считаю наличие готовых тем оформления. Сразу, в момент запуска существовало 3 темы. Постепенно я создал еще несколько.

Читать дальше →

HTML5 / Всё в деталях

krovatti — Mon, 16 Jan 2012 12:49:36 GMT

Доброго времени суток!

Введение

К своему стыду, я совсем недавно познакомился с элементом details, который по сути является виджетом для представления информации о чём-либо. По информации, которая есть у меня, его поддержка достаточна скудна, так как поддерживается он на данный момент лишь в Google Chrome, начиная с 12.0, а также в Android Browser, начиная с версии 4.0. Что же, давайте посмотрим, что это за зверь такой.

Читать дальше →

Каскадные Таблицы Стилей / Великолепные стикеры с помощью CSS3

krovatti — Sat, 14 Jan 2012 18:08:22 GMT

Доброго времени суток!

Введение

В своё время было необходимо сделать заметки в форме стикеров для веб-сайта. Как вы понимаете, выбора большого особо не было и мой выбор пал на всеми нам любимый CSS3. С его появлением осуществление задуманного стало возможным без какого-либо велосипедостроения. ~~Итак, моё решение проблемы под катом.~~ На самом деле, мопед не мой. Мне дали всего-лишь покататься.

Читать дальше →

Windows Phone / Использование HTML5 и JavaScript для разработки приложений под Windows Phone

stasus — Fri, 13 Jan 2012 11:17:30 GMT

Cегодня я хочу рассказать о том, какие дополнительные возможность разработки приложений под Windows Phone есть у владеющих HTML5 и JavaScript.

Читать дальше →

Веб-разработка / Keep it simplest. Или про простые сайты

crenative — Thu, 12 Jan 2012 11:08:29 GMT

Для начала, у меня просто возникла потребность сделать сайт с текстовой информацией. Сделать надо было что-то несложное, но не забывая про мобильные устройства, которых все больше ходит по сайтам.

Очевидным вариантом было бы набросать основную разметку, определить doctype и оставить браузерам работу по стилизации. Но это очень ленивый метод, который дает результат, вызывающий недоумение у будущего посетителя такой страницы. Хочется хотя бы базовой стилизации заголовков и ссылок, какой-то простой структуры.

Так что следующим шагом стал просмотр готовых вариантов в сети.

Поиск

Шаблоны для CMS не подходят хотя бы потому, что CMS не будет. И такие шаблоны чаще всего расчитаны на более сложные сайты. И они не будут радовать посетителей с мобильными устройствами.

Хотя, сейчас появились шаблоны с адаптирующейся разметкой (responsive design), которые и вызвали у меня интерес. К сожалению, большинство найденных решений оказались платными, что не удивительно, учитывая объем работы, который проделывают их авторы.

Читать дальше →