Круговая и кольцевая svg диаграммы на HTML5 с нуля

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

Читать далее...

Создание отзывчивой горизонтальной навигации типа "Приоритет+"

  • CSS
  • 5 месяцев назад

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

Читать далее...

Новый элемент HTML <picture> позволит загружать сайты быстрее

Вы уже слышали о том, что Интернет становится все более визуальным и для бизнес-сайтов невероятно важными становятся хорошие изображения.

Однако подобные картинки могут вдарить по посетителям вашей странички. Объем изображения может занимать 1 МБ от объема средней страницы в 1,7 МБ.

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

Читать далее...

Работаем с data атрибутами в HTML5

До создания HTML5 работать с атрибутами в HTML элементах, мягко говоря, не доставляло удовольствия. Приходилось использовать такие атрибуты, как rel или class. А некоторые разработчики даже создавали свои атрибуты.

Но дело координально изменилось когда HTML5 предоставил нам возможность использования своих data атрибутов. Теперь довольно легко можно сохранять дополнительные данные стандартными средствами.

Читать далее...