I Shar

I Shar

мир глазами веб-разработчика

html

HTML: ленивая загрузка изображений

Простая реализация ленивой загрузки изображений с помощью HTML-атрибута loading

I Shar

время чтения 1 мин.

Photo by Peter Broomfield on Unsplash

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

Язык сайта и местоположение

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

I Shar

время чтения 1 мин.

Photo by Raphael Schaller on Unsplash

Пожалуйста, не устанавливайте язык сайта, полагаясь на данные о фактическом местоположении пользователя. Такое решение практически всегда является неудачным, потому что люди перемещаются: они путешествуют или отправляются в командировки, и далеко не всегда говорят на языке той страны или того места, в котором находятся.

Чем опасен target=_blank

неочевидный вред использования значения _blank для атрибута target

I Shar

время чтения 2 мин.

Photo by Niklas Tidbury on Unsplash

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

Адаптируем картинки для dark mode

меняем url изображения HTML-документа для dark mode

I Shar

время чтения 1 мин.

Photo by Federico Respini on Unsplash

Изменить CSS-свойства различных элементов при переходе в темный режим (dark mode) несложно - достаточно использовать медиа функцию prefers-color-scheme. Но, что делать, если появляется другая проблема: как при смене темы браузера на dark mode изменить изображение, объявленное непосредственно в HTML-документе, когда нет возможности воспользоваться всеми преимуществами правил CSS?

Плавающий label

создаем плавающий label для поля ввода с помощью CSS и HTML

I Shar

время чтения 1 мин.

Photo by Kiril Aglichev on Unsplash

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

Новые публикации

Далее

Категории

О нас

Frontend & Backend. Статьи, обзоры, заметки, код, уроки.