HTML5

Основы HTML

Влад Мержевич

Приложение Основы HTML достигло показателя 5 тысяч установок. Более 30 положительных отзывов, более 100 оценок на пять звёзд и лишь единственная на единицу. Да, всегда найдётся пчёлка, которая в бочку несёт дёготь, а не мёд.

В общем, если вы ещё не установили это приложение на свой Андроид, то самое время это сделать. Приложение бесплатное, не содержит рекламы и каких-либо скрытых платежей.

Справочник HTML

Влад Мержевич

Большой популярностью пользуется справочник HTML, поэтому сделал локальную версию, которая не требует подключения к Интернету и пользоваться ей можно даже в деревне. Был бы компьютер только.

Вот форма сразу для оплаты. Справочник стоит 50 рублей, как обычно, считайте это поддержкой сайта, чтобы в будущем были новые учебные курсы и руководства. Без вашей поддержки ничего этого не будет.

Основы HTML

Влад Мержевич

Объединил несколько учебных курсов от Джереми Томаса, связанных с HTML, в один, и сделал из них мобильное приложение под Android. Все задания в каждом уроке в наличии, а кроме того есть удобная навигация и быстрый переход к любому уроку.

Скачать приложение бесплатно без рекламы, регистрации и СМС.

Устанавливайте, используйте, делитесь и пишите письма, если заметите какие-либо ошибки.

Продвинутые уроки по HTML и CSS

Влад Мержевич

Вот и всё. Книга Шэя Хоу полностью переведена и выложена для всеобщего обозрения. Это обзор веб-технологий, которые применяются при разработке сайтов и ориентированы они на тех, кто уже освоил HTML5 и CSS3.

Курс «Содержимое в HTML»

Влад Мержевич

На сайте webref.ru появился новый курс Содержимое в HTML от Джереми Томаса, который закрывает тему основ HTML. К каждому уроку идут интерактивные задания для закрепления знаний, в конце курса проверочный тест. Задания разнообразных типов, так что на будущее будет полезно, если в комментариях вы скажете, какой тип заданий вам понравился больше всего.

Курсы по HTML

Влад Мержевич

Напоминаю, что на сайте WebReference добавился раздел с учебными курсами. Особенность в том, что каждый урок сопровождается интерактивными заданиями для закрепления полученных знаний. В конце курса также идёт небольшой тест для проверки. Пока полностью готово два курса от Джереми Томаса:

Курсы

Влад Мержевич

На сайте WebReference появился раздел с курсами, как я их назвал. Пока их всего два, но со временем станет больше. Отличие от руководств на том же сайте в интерактивных заданиях, которые идут после каждой главы. Задания призваны проверить усвоенные знания и закрепить их. В планах также добавить проверку знаний в виде тестов в конце каждого курса и сделать практические задания для самостоятельного выполнения.

В общем, смотрите, читайте, делитесь впечатлениями.

Уроки по HTML и CSS

Влад Мержевич

Начал переводить замечательную книгу Шэя Хоу Уроки по HTML и CSS. Книга довольно объёмная, состоит из 12 глав, так что решил выкладывать её постепенно, по мере перевода каждой главы, а не ждать завершения работы целиком.

Сейчас можно ознакомиться с первыми главами, в которых рассказывается что такое HTML и CSS на примере вёрстки сайта.

Погружение в HTML5

Влад Мержевич

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

  • HTML5 перестал быть экзотикой и воспринимается большинством как полноценный и удобный инструмент.
  • Браузеры поддерживают, хотя и не всё, но уже большинство технологий. Даже IE, да.

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

С учётом этого обновления и внесены правки в перевод и исправлены мелкие ошибки (самая главная — с буквой ё!).

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

Как верстать на HTML5 и CSS3

Влад Мержевич

Появилось новое руководство по HTML5 и CSS3 от Дамиана Вельгошика. Ориентировано на новичков, которые вообще знать не знают ничего о вёрстке. Остальным рекомендую заглянуть в последнюю главу, где приведены полезные ссылки.

HTML5 и CSS3 на примерах

Влад Мержевич

На сайте webreference.ru добавлено руководство HTML5 и CSS3 на примерах. Более 70 материалов охватывающих популярные темы по вёрстке. Кое-что из них уже публиковалось ранее, но часть написана специально для этого сайта, особенно это касается новых тем вроде анимации, переходов и трансформации. Из-за большого объёма пришлось выбросить ряд тем, они будут оформлены позже в виде отдельных руководств. Потому что под формат сайта больше подходят небольшие руководства охватывающие узкую тему.

Руководство ориентировано на тех, кто уже знаком с основами HTML и CSS и теперь хочет знать, что с этим делать дальше. Читать можно как последовательно, так и по отдельным интересующим темам.

Также вы можете купить руководство за 40 рублей в формате CHM. Удобно тем, что не требует выхода в сеть и всё хранится в одном файле. Заодно поддержите тем самым сайт.

Купить HTML5 и CSS3 на примерах

Шаблоны HTML5

Реми Шарп

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

Как создать таблицу в HTML5 и указать её параметры через стили?

Таблица состоит из строк и столбцов ячеек, которые могут содержать текст и рисунки. Для добавления таблицы на веб-страницу используется тег <table>. Этот элемент служит контейнером для элементов, определяющих содержимое таблицы. Любая таблица состоит из строк и ячеек, которые задаются соответственно с помощью тегов <tr> и <td>. Таблица должна содержать хотя бы одну ячейку. Допускается вместо тега <td> использовать тег <th>. Текст в ячейке, оформленной с помощью тега <th>, отображается браузером шрифтом жирного начертания и выравнивается по центру ячейки.

Контекстное меню в Firefox

Влад Мержевич

Собственное контекстное меню довольно редко применяется в интерфейсе веб-страницы. Ведь пользователю совершенно не очевидно, что на каком-то элементе надо щёлкнуть не левой, а правой кнопкой мыши и выбрать пункт из списка. К тому же не все посетители сайтов любят использовать правую кнопку мыши, а на смартфонах её вообще нет, только имитация. Несмотря на эти особенности в HTML5 есть возможность создавать собственные контекстные меню, реализовано это пока только в Firefox, и то весьма своеобразно.

Авторазмер игр на HTML5

Дерек Детвейлер

Летом 2010 года мы создали игру Sand Trap, которую выставили на конкурс игр HTML5 для мобильных телефонов. Но большинство мобильных телефонов отображают только часть игры или делают игру слишком маленькой, что в итоге не позволяет в неё играть. Так что мы взяли на себя ответственность сделать игру плавно регулируемой в зависимости от любого разрешения. После небольшого изменения программы и использования идей изложенных в этой статье, мы получили игру, которая масштабируется в любом современном браузере запущенном на настольном или мобильном устройстве.

Полноэкранный режим Игра в окне браузера

Этот подход хорошо сработал для Sand Trap, поэтому мы использовали тот же метод в нашей последней игре Thwack. Игра автоматически подстраивается под разрешение экрана, чтобы соответствовать полноэкранному режиму и окну произвольного размера, как показано на скриншотах выше.

Для реализации необходимо воспользоваться как CSS, так и JavaScript. Использование CSS для заполнения всего экрана тривиально, но CSS не позволит вам поддерживать аналогичное соотношение ширины к высоте, чтобы предотвратить искажения холста и игрового поля.

Страницы