Верстальщик от бога
Самый большой канал по верстке в телеграм. По крупицам собираем frontend-годноту из интернета. Чат верстальщиков: @godinhtmlchat По всем вопросам: @godinmedia
Mostrar más12 311
Suscriptores
-624 horas
-37 días
-9730 días
- Suscriptores
- Cobertura postal
- ER - ratio de compromiso
Carga de datos en curso...
Tasa de crecimiento de suscriptores
Carga de datos en curso...
Photo unavailableShow in Telegram
Исследование переноса текста и слов
#почитать
О различных способах управления переноса текста на веб-странице. CSS даёт множество инструментов, позволяющих сделать текст таким, каким мы хотим его видеть. Также рассмотрим трюки с использованием HTML и спецсимволов.
⏱Читать статью
👍 4
Photo unavailableShow in Telegram
10 CSS-однострочников для преобразования веб-приложения
#почитать
CSS позволяет создавать красивые и отзывчивые веб-дизайны. Однако написание кода CSS может отнимать много времени и сил, особенно если вы не знакомы с новейшими методиками и лучшими практиками. К счастью, есть несколько однострочников, помогающих оптимизировать CSS-код и создавать более эффективные проекты.
1. Центрирование div
2. Создание свободно перемещающихся элементов
3. Позиционирование элементов в любом месте DOM
4. Универсальное свойство box-sizing
5. Адаптивные изображения
6. Центрирование элементов
7. Создание пользовательских стилей флажков
8. Выравнивание текста
9. Очистка float-элементов
10. Сброс всех стилей
⏱Читать статью
👍 7👎 2
Photo unavailableShow in Telegram
Изменить цвета и кнопки сервиса — и не сломать дизайн-систему
#почитать
В прошлом году нам понадобилось полностью изменить внешний вид нашего сервиса. Разработчики и дизайнеры интерфейсов часто сталкиваются с подобными задачами: есть уже работающий сервис, но его нужно стилизовать, например, в случае ребрендинга.⏱Читать статью
🔥 7❤ 1
Photo unavailableShow in Telegram
Почему AVIF вместо JPEG, WebP, PNG и GIF
#почитать
Вам может не нравиться стиль каких-то артефактов изображения, но если это означает, что кто-то сможет быстрее загрузить сайт в поезде или с низкой задержкой, то вам придется пойти на компромисс. Конечная цель — предоставить пользователю наименьшую полезную нагрузку в пределах разумного.⏱Читать статью
❤ 6👍 3🔥 2
Photo unavailableShow in Telegram
"Заявляю: Мы, как цивилизация, разучились использовать центрирование"
#почитать
Плохое выравнивание может испортить прекрасный интерфейс. И напротив, с правильно выровненным текстом ваш интерфейс обретёт утончённую красоту. Даже если это трудно. Даже если инструменты создают неудобства. Даже если приходится искать решения. Я верю, что вместе мы можем разобраться, как засунуть один прямоугольник в другой ровно.⏱Читать статью
🎉 6👍 3🔥 1
Photo unavailableShow in Telegram
Анимация в веб-интерфейсе, влияние на UX
#почитать
Любое движение в визуале триггерит пользователей лучше. По данным, Engagement Rate у видео и анимаций в 2 раза выше, в сравнении со статикой.⏱Читать статью
👍 6❤ 2🔥 1
Photo unavailableShow in Telegram
CSS in Depth
Автор: Keith J. Grant
Год: 2018
⏱Обзор
⏱Скачать книгу
😁 9👍 2🎉 2
Photo unavailableShow in Telegram
Архитектура Inverted Triangle CSS (ITCSS)
#почитать
▪️Settings (Настройки): Основополагающий слой, включающий конфигурацию, переменные и глобальные настройки. Он задаёт основу для всей таблицы стилей.
▪️Tools (Инструменты): Этот слой включает миксины, функции и другие инструменты, используемые в проекте. Он предоставляет разработчикам набор инструментов для эффективного управления и расширения стилей.
Generic (Общий): на этом слое применяются сброс стилей и normalize.css, создавая единую базу для стилей в разных браузерах.
▪️Elements (Элементы): Далее идёт базовая стилизация элементов HTML. Это неклассифицированные селекторы, определяющие базовые стили для стандартных HTML-тегов.
▪️Objects (Объекты): Этот слой определяет многократно используемые шаблоны дизайна и структуры макета. Он сосредоточен на создании объектов, содержащих специфическое поведение стилей, что способствует модульности и возможности повторного использования.
▪️Components (Компоненты): На этом слое выполняется стилизация конкретных компонентов пользовательского интерфейса. Этот слой реализует большую часть стилизации приложения, обеспечивая чёткое разделение задач.
▪️Trumps (Козыри): Вершина перевёрнутого треугольника, слой Trumps, имеет дело с утилитарными классами и переопределением стилей. Он позволяет вносить специфические изменения и тонкие настройки, не нарушая целостности нижних слоёв.
⏱Читать статью
👍 10❤ 1🔥 1
Photo unavailableShow in Telegram
Яндекс приглашает студентов и начинающих разработчиков на Young Con — фестиваль для тех, кто интересуется карьерой в IT
• 6000 участников
• Свыше 10 часов нетворкинга и активностей
• 30 топ-менеджеров расскажут о внутренней кухне больших IT-компаний и дадут советы, как начать карьеру в одной из команд
• Знакомство с технологиями Яндекса
• 9 тематических «миров» — интерактивных стендов, где участники смогут узнать про сервисы и карьерные возможности, которые дает работа в IT-компании.
У участников будет возможность в будущем попасть на стажировку в Яндекс, ведь прямо на фестивале пройдут экспресс-собеседования.
На фестивале также пройдет «Баттл вузов» — финал турнира по спортивному программированию между студентами. Команда-победитель разделит между собой призовой фонд в размере 1 млн рублей. Завершится мероприятие концертом музыкальных групп The Hatters и ХЛЕБ.
Фестиваль пройдет 27 июня в Live Arena. Принять участие в нем можно очно или онлайн — для этого необходимо заполнить форму на сайте.
👍 7❤ 3🔥 1