![[Перевод] Выбор CSS макета — Grid или Flexbox?](https://habrastorage.org/webt/5s/44/lw/5s44lw-ru8ew49fov8tcxrydwhw.png)
Удачно оформленный макет удерживает пользователей на сайте, так как делает важные элементы доступными и легко находимыми. Слабые же макеты отпугивают посетителей, которые покидают ресурс, так и не найдя того, за чем пришли. В веб-дизайне макет – это то, как сайт отображается на экране. В HTML 5 есть довольно много элементов, определяющих внешний вид веб-страницы: заголовок, навигационный блок, абзац, сноска, статья и нижний колонтитул, каждый из которых имеет свое особое значение в
Подробнее![[Перевод] CSS-переменные](https://habrastorage.org/webt/am/sd/sl/amsdsl3qgw4_ursgt9kzvseaot4.png)
CSS-переменные (их ещё называют «пользовательскими свойствами») поддерживаются веб-браузерами уже почти четыре года. Я пользуюсь ими там, где они могут пригодиться. Это зависит от проекта, над которым я работаю, и от конкретных задач, которые мне приходится решать. Работать с CSS-переменными просто, они способны принести разработчику немалую пользу. Правда, часто фронтенд-программисты применяют CSS-переменные неправильно или не понимают особенностей работы с ними. Я написал эту статью
Подробнее![[Перевод] Переменные CSS — курс молодого бойца](https://habrastorage.org/webt/1w/mc/be/1wmcbeuwodzijh2l-7zkm8i93ve.jpeg)
Переменные CSS (также известные как настраиваемые свойства) поддерживаются браузерами почти 4 года. Мне нравится применять их в зависимости от проекта или ситуации. Они очень полезны и просты в использовании, но зачастую фронтенд разработчик неправильно использует или неправильно понимает их. Основная цель статьи: я хочу иметь место, где собрано все, что я знаю о переменных CSS, чтобы узнать и понять больше. Здесь вы прочитаете обо всем, что должны знать о переменных CSS, включая примеры…
Подробнее
Платформа 1С:Предприятие локализована на 22 языка, включая английский, немецкий, французский, китайский, вьетнамский. Недавно, в версии 8.3.17, мы поддержали арабский язык. Одна из особенностей арабского языка в том, что текст на нём пишут и читают справа налево. UI для арабского языка надо отображать зеркально по горизонтали (но не всё и не всегда – тут есть тонкости), контекстное меню открывать слева от курсора и т.п. Под катом – о том, как мы поддержали RTL (right-to-left) в
Подробнее
Доброго времени суток, друзья! Предлагаю Вашему вниманию результаты небольшого исследования — визуального сравнения 13 CSS-фреймворков. Цель исследования — определить, какой из фреймворков лучше всего справляется со стилизацией по умолчанию, т.е. без добавления специальных (предусмотренных фреймворком) классов. В исследовании представлены следующие фреймворки: …
Подробнее![[recovery mode] Как стать Front-End разработчиком](https://habrastorage.org/getpro/habr/post_images/c5a/3d9/666/c5a3d9666c77dd2f49dcfd109f0cf864.jpg)
Кто такой Front-End разработчик? Front-End разработчик это человек который пишет код для внешнего вида сайта, также есть Back-End разработчик который пишет код для функциональной части сайта. Если скрестить эти две профессии получится Full-Stack разработчик Читать дальше →
Подробнее
Современная вычислительная техника позволяет создавать классные компьютерные игры! И сейчас, достаточно популярны игры с 3d-графикой, так как, играя в них, ты окунаешься в вымышленный мир и теряешь всякую связь с реальностью. Развитие интернета и браузерных технологий сделало возможным запускать головоломки и стрелялки в любимом Хроме, Мозилле или еще в чем-то там (про Эксплорер помолчим) в онлайн-режиме, без загрузки. Так вот, здесь я расскажу о том, как создать простую трехмерную
Подробнее
Наверняка многие из вас бывали в ситуации, когда нужно быстро подобрать цвета для оформления, а дизайнер занят более важными задачами, в плохом настроении или в отпуске. Задача несложная, но иногда ответа приходится ждать по несколько дней. Особенно, если нужно подобрать цвета для тёмной схемы
Подробнее![[Перевод] Анализ производительности CSS-анимаций](https://habrastorage.org/webt/de/dp/jv/dedpjvqp7lfw3cyv961zhombmv8.png)
Что выбрать для анимирования элементов веб-страниц? JavaScript или CSS? Этот вопрос однажды вынужден будет задать себе каждый веб-разработчик. А может — и не однажды. JavaScript-программисты создали множество библиотек для браузерной анимации. И, похоже, все вокруг оказались склонны к тому, чтобы использовать эти библиотеки в виде готового решения для анимации. Но давайте-ка притормозим. Правильно ли это? Следует ли анимировать элементы веб-страниц с помощью JavaScript? Может, можно
Подробнее![[Перевод] CSS Houdini: практическое руководство](https://habrastorage.org/webt/fl/be/g1/flbeg1byaenkvxg2vagd1iyoesc.png)
Доброго времени суток, друзья! Что такое Houdini? Houdini (Гудини) — коллекция API браузера, значительно улучшающих процесс веб разработки, включая разработку стандартов CSS. Разработчики смогут расширять CSS, используя JavaScript, влияя на рендеринг CSS и указывая браузеру, как следует применять стили. Это обеспечит значительное повышение производительности и стабильности, нежели использование полифилов. Гудини состоит из двух групп API — высокоуровневые API и API низкого уровня. …
Подробнее
Доброго времени суток, друзья! Задача Сделать нечто похожее на Dashboard на Codepen. Результат должен быть примерно следующим: Возможное решение Разметка одной секции может выглядеть так: Title Читать дальше →
Подробнее![[Перевод] Расширяемые расширения в JavaScript](https://habrastorage.org/webt/xc/he/sh/xcheshyyruqmp90p5qwuga1k9cu.jpeg)
Привет, Хабр! Обращаем ваше внимание на долгожданную допечатку книги "Выразительный JavaScript", которая только-только пришла из типографии. Тем, кто еще не знаком с творчеством автора книги (при всей энциклопедичности она понравится и начинающим разработчиком) — предлагаем познакомиться со статьей из его блога; в статье изложены мысли об организации расширений в языке JavaScript Читать дальше →
Подробнее