Сделал небольшой видеоролик, посвящённый довольно редко используемому псевдоэлементу ::first-line. Как вам такой формат рассказа о CSS? Запланировано ещё несколько подобных видео.

На сайте webref.ru обновился справочник HTML. На самом деле изменения в справочник вносятся постоянно и в какой-то момент их количество становится столь велико, что об этом можно заявить отдельно.

Итак, что стало нового.

• Нет акцента на HTML5. Раньше такие элементы выделялись специальным значком, а в описании говорилось об их принадлежности к HTML5. Теперь все элементы между собой равны и каким-либо образом не разделяются.
• Появилась отдельная группа с устаревшими элементами HTML. Обязательно указывается что элемент устарел, использовать его не нужно и показана современная альтернатива в виде другого элемента или CSS.
• Обновилась таблица браузеров, где указана версия, начиная с которой идёт поддержка элемента или его атрибута.
• Дополнены некоторые описания элементов и их атрибутов.
• Обновлены ссылки на спецификацию HTML. W3C отказалась от поддержки HTML5 и передала эти полномочия WHATWG. Теперь у нас нет HTML 5.3, а есть просто живой стандарт.
• Примеры это отдельная тема. Результат примера сразу же отображается в браузере и видно как этот элемент HTML будет выглядеть в действительности. Каждый пример буквально одной кнопкой можно скопировать в буфер, а затем вставить код в свой любимый редактор. Также через кнопки можно переправить код примера в популярные песочницы JSFiddle и CodePen, где, опять же, доработать под свои нужды.

Выравнивание текста появилось в CSS ещё в первой версии и в каком-то смысле копировало возможности текстовых редакторов.

В текстовых абзацах выравнивание по умолчанию происходит по левому краю, а правый же край остаётся неровным, в виде «лесенки». Для большинства текстов это смотрится вполне естественно, да и читать вполне комфортно (рис. 1).

Рис. 1. Текст, выровненный по умолчанию

Сделал публичный канал Телеграма, куда уже некоторое время выкладываю всякие рецепты, советы и мысли по поводу HTML, CSS и вёрстке. Так что присоединяйтесь!

Добавилось новое руководство Переменные CSS с нуля. Написал его пакистанский фронтенд-разработчик Ахмад Шадид, перевод мой.

Если не знаете, что это вообще такое и как эти переменные использовать, то читать обязательно.

Мы долго к этому шли и наконец пришли. htmlbook теперь работает по защищённому протоколу https. Никаких закладок обновлять не надо, всё настроили автоматически. Теперь идёт переход с http на https, а ещё с www на сайт без www. Адрес теперь один и это https://htmlbook.ru

Но если всё-таки заметите какие-то неполадки, пишите мне на ящик vlad@htmlbook.ru

Вот что мы будем делать в этом руководстве:

Реклама

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

Основы ссылочной массы

Ссылочная масса, также известная как «backlink profile», представляет собой совокупность всех внешних ссылок, которые указывают на конкретный веб-сайт. Каждая ссылка воспринимается поисковыми системами как голос за авторитетность и качество сайта. Чем больше ссылок от релевантных и авторитетных источников указывает на сайт, тем выше вероятность того, что поисковая система рассмотрит его как надёжный и ценный для пользователей.

Обновил приложение под Андроид Практика по HTML и CSS, в котором можно решать задачи на разные темы, повышать свой уровень знаний HTML и CSS на практике.

Если ещё не установили, то самое время это сделать прямо сейчас.

Вы сверстали сайт и сделали его красивым с помощью CSS. Осталось добавить интерактива, и можно добавлять проект в портфолио.

«Оживить» на сайте можно что угодно: меню, модальные окна, корзину, пагинацию… В этой статье мы разберём слайдер — посмотрим, как его сделать на чистом JavaScript. Слайдер пригодится для раздела с отзывами, фотографиями сотрудников, изображениями товаров или чего-нибудь ещё — всё зависит только от вашей фантазии и проекта.

Сделать слайдер