[Перевод] Стили заголовков в CSS: градиенты

[Перевод] Стили заголовков в CSS: градиенты

Заголовки должны быть большими, жирными и громкими, чтобы привлекать внимание пользователя за несколько секунд. Мы перевели статью о стилях заголовков, сегодня предлагаем изучить градиенты. Читать далее

Подробнее
Как плагин Emmet помогает ускорить работу с программным кодом

Как плагин Emmet помогает ускорить работу с программным кодом

Frontend-разработчик нашей команды Евгений Самойлов рассказывает, как сократить время написания рутинной разметки за счет преобразования простых аббревиатур в полноценные блоки кода. Читать далее

Подробнее
Фронтенд-новости №8. Вышел Wordpress 6.0, найдена оптимальная длина строки, <dialog> под вопросом

Фронтенд-новости №8. Вышел Wordpress 6.0, найдена оптимальная длина строки, <dialog> под вопросом

Дайджест новостей и полезных статей о фронтенд-разработке за последнюю неделю 23–29 мая. Что там у вас ещё

Подробнее
[Перевод] Как сделать веб-шрифты красочными

[Перевод] Как сделать веб-шрифты красочными

Сегодня рассказываем о палитрах CSS в работе с многоцветными шрифтами COLRv1, которые поддерживаются в последних Chrome и Edge, и, конечно, показываем их возможности к старту курса по Frontend-разработке. Читать далее

Подробнее
[Перевод] Знакомство с профилировщиком производительности вашего браузера

[Перевод] Знакомство с профилировщиком производительности вашего браузера

В какой-то момент своей карьеры вы, возможно, просматривали вкладку «Производительность» в инструментах разработки вашего любимого браузера. В конце концов вы попытались создать profile, но, вероятно, быстро разочаровались. Высокая плотность отображаемой информации делает ее немного подавляющей и несколько пугающей. Я был там, я понимаю тебя! Хорошая новость: кривая обучения на самом деле не такая крутая! Как только вы усвоите несколько концепций, он внезапно станет вашим самым ценным…

Подробнее
[Перевод] Первый взгляд на CSS свойство object-view-box

[Перевод] Первый взгляд на CSS свойство object-view-box

Я всегда хотел, чтобы CSS умел обрезать изображение и размещать его в любом нужном мне направлении. Это стало возможным благодаря использованию дополнительного элемента HTML в сочетании с различными свойствами CSS, которые я объясню позже. В этой статье я познакомлю вас с новым свойством CSS object-view-box, предложенным Джейком Арчибальдом в начале этого года. Это позволяет нам обрезать или изменять размер замененных HTML-элементов, таких как или . Читать далее

Подробнее
VS-RUS.ru - сайт дистрибьютера компании VERSUS-OMEGA

VS-RUS.ru - сайт дистрибьютера компании VERSUS-OMEGA

Корпоративный сайт для эксклюзивного дистрибьютера Versus-Omegа на территории России. Versus-Omega это производитель скользящих, подъемных крыш и ползунков для грузовых автомобилей. Компания находится в Oudsbergen; Бельгия, но продукты Versus экспортируются по всему миру. Наши раздвижные крыши можно узнать по размахивающим красным лентам на крыше трейлера. Сайт VS-RUS.ru по сути является сайтом-визиткой с основной информацией для потенциальных дилеров продукции бренда VERSUS-OMEGA

Подробнее
Фронтенд-новости №7. Больше никаких игр со шрифтами, COLRv1 и большое обновление Figma

Фронтенд-новости №7. Больше никаких игр со шрифтами, COLRv1 и большое обновление Figma

Дайджест новостей и интересных статей из мира фронтенд-разработки за 16—22 мая. Как отключить запрос favicon.ico, если это нужно. Вы же знали ,что ваш браузер всегда запрашивает favicon.ico? Теперь фраза «поиграться шрифтами» усложняет задачу, так как грядёт COLRv1 Как работают :where(), :is() :has() и какой из селекторов упрощает жизнь Playwright теперь готов тестировать ваши компоненты на React, Vue и Svelter Большое обновление Figma Что там у вас ещё

Подробнее
Введение в SVG-анимации для верстальщиков

Введение в SVG-анимации для верстальщиков

Время идет, технологии меняются, набитые шишки копятся, настала пора обновить материалы по SVG-анимациям. Тем более, что тема для многих фронтендеров все еще остается странной и запутанной. В этой статье мы рассмотрим SVG-анимации с разных сторон, посмотрим на актуальное состояние дел, возможности и сопутствующие инструменты. Мы не будем разбирать каждое свойство и каждый хак. Слишком большой объем материала получится. Для этого есть MDN и ему подобные сайты. Задача текущей статьи — дать

Подробнее
[Перевод] Знакомьтесь, object-view-box

[Перевод] Знакомьтесь, object-view-box

Всем привет! Меня зовут Лихопой Кирилл и я - фронтенд-разработчик в компании idaproject. Сегодня я представляю вам перевод статьи о новой CSS-фиче, которую, я уверен, многие ждали. И это - object-view-box, которое позволит нам обрезать и масштабировать фотографии не прибегая к “костылям” в виде фонового изображения или доп. элементов. Итак, знакомьтесь - object-view-box! В этой статье я познакомлю вас с новым CSS-свойством object-view-box , которое было предложено Jake Archibald еще год…

Подробнее
Надежный способ сокрытия ссылок сайта от поисковых роботов

Надежный способ сокрытия ссылок сайта от поисковых роботов

В статье наглядно показано, каким образом скрыть внешнюю ссылку сайта от поисковых систем без вреда для ссылочной массы. Также Вы сможете облегчить этот процесс с применением php, если у Вас имеется много подобных ссылок. Читать далее

Подробнее
[Перевод] Добавляем эффект бликов линз CSS к фотографиям для придания им яркости

[Перевод] Добавляем эффект бликов линз CSS к фотографиям для придания им яркости

Я большой поклонник фильмов Дж. Дж. Абрамса. Мне нравятся их напряженные сюжеты, остроумные диалоги и, конечно же, анаморфные блики линз (lens flares). Такие режиссеры, как Абрамс, используют lens flares, чтобы добавить в свои фильмы немного "доморощенного" реализма. Эту технику мы можем легко воссоздать в таких инструментах, как Photoshop, а затем добавить на наши сайты в виде растровых изображений. Читать далее

Подробнее