Вместе с Creative Developer We Wizards Даниилом Сарабьевым сделаем сервис, позволяющий получить случайный набор закрытых таро с возможностью вскрыть выбранные карты. Читать далее
Подробнее
Привет, Хабр! Поисковая оптимизация обычно ассоциируется только с производством контента, а роль веб-разработчиков в ней часто недооценивают. Мы с этим не согласны. В этой статье обсудим технические детали верстки оптимизированных под поисковые движки веб-страниц, а для закрепления знаний создадим по всем правилам и задеплоим на сервер небольшой сайт. Это не ультимативный гайд, а скорее шпаргалка о том, как сделать красиво, функционально и так, чтобы целевая страница попадала в топ выдачи.
Подробнее
В разговорах людей, интересующихся доступностью, часто можно услышать слово «Роль». Так, что это такое? Это специальная форма представления элемента для скринридера. Устанавливается она с помощью атрибута role. Сегодня поговорим о нем. Я не буду описывать всё. Атрибут слишком сложный для одной статьи. Остановлюсь на моментах, которые вы можете использовать сразу. Продвинутые техники оставим на другой случай. Давайте начнём! Читать дальше →
Подробнее
Кодировка символов – это про то, как символы которыми мы пишем наши сообщения выглядят в двоичном коде. В мире существует множество кодировок, но самые популярные из них, это; ASCII – это самая первая кодировка в мире, она была создана в Америке. Собственно благодаря ей, 8 бит равны 1 байт. UTF-8, 16 и 32 – данные кодировки были созданы организацией Unicode (Юникод). Если по простому, то они это то же самое что и ASCII, но более вместительные, что означает, что они занимают больше памяти.
Подробнее![[Перевод] Скрытые возможности элемента <input>](https://habrastorage.org/webt/kl/ii/gg/kliiggeawdfcz0srsyf6jdowq3o.png)
Элемент в HTML самый интересный. Большинство его собратьев вне зависимости от своих атрибутов ведут себя одинаково. При этом атрибут type элемента может принимать 22 разных значения, которые не только меняют его поведение, но и влияют на внешний вид (зачастую в ущерб стилистике). Элемент отвечает за всё, начиная с текстового ввода и чекбоксов, заканчивая переключателями и кнопкой для сброса всех полей в форме. В этой статье я опишу не только различные типы , но и сопутствующие атрибуты,
Подробнее
Фронтенд-разработка — это как собирать лего без инструкции: иногда весело и творчески, но порой ты забираешься на кровать и кричишь: «*@#%*, да где же этот пропавший блок?!» Каждый новый проект во фронтенде — это как уникальный набор лего, и ты никогда не знаешь, какие интересные вызовы подкинет он на этот раз. В этой статье, опираясь на личный опыт, я расскажу, что такое современный фронтенд, какие задачи решают фронтендеры и что вообще происходит в мире фронтенда. Читать далее
Подробнее
Продолжение перевода статьи «Reimagine Atomic CSS» двухлетней давности одного из членов команды Vue core Anthony Fu, автора UnoCSS, в которой рассматривается уже сам UnoCSS. Читать далее
Подробнее
Перевод статьи «Reimagine Atomic CSS» двухлетней давности одного из членов команды Vue core Anthony Fu, автора UnoCSS, в которой обсуждается концепция Atomic CSS, плюсы и минусы Tailwind и Windi CSS Что такое Atomic CSS? Для начала давайте дадим правильное определение атомарному CSS. Из этой статьи Джона Полачека: > Атомарный CSS — это подход к архитектуре CSS, при котором предпочтение отдается небольшим, одноцелевым классам с именами, основанными на визуальной функции. Читать далее
Подробнее
Мы уже много говорили про оптимизацию сайтов до минимального размера, преимущества статичного HTML, а также упаковку сайта (и веб-сервера) в портативный формат одного исполняемого файла, который нативно исполняется под любой ОС. Но стремление к минимизации может пойти дальше, если вы хотите поместить весь сайт в адресную строку браузера. А с помощью сокращателя ссылок даже большой сайт сжимается до восьми байт. В этом случае и хостинг не нужен (то есть роль хостинга выполняет сервис
Подробнее
Статья рассматривает возможные задачи верстки на разных проектах и как с ними справляются две разные архитектуры: Tailwind CSS и ванильный CSS + BEM. Читать далее
Подробнее
В этих двух статьях я буду сравнивать TailwindCSS с чистым CSS + BEM. Цель - разобраться что является лучшим решением для хорошей архитектуры приложения. Это не вопрос предпочтений, от этого выбора будет зависеть очень многое на поздних этапах разработки и оно должно быть очень хорошо обосновано. Начну со сравнения производительности. Tailwind позволяет значительно уменьшить размер итогового CSS и тем самым ускорить время отображения страницы. Но это сработает только в том случае, если
Подробнее
Все мы знакомы с широко используемыми HTML тегами, такими как , , , и . Однако, существуют HTML - теги, которые могут упростить жизнь, и вместо написания дополнительного кода, выполнят всю работу :) Читать далее
Подробнее