[Перевод] Наиболее эффективные методы улучшения Core Web Vitals

[Перевод] Наиболее эффективные методы улучшения Core Web Vitals

На протяжении многих лет сообщество веб-разработчиков накапливало знания об оптимизации производительности веб-приложений. Хотя каждая отдельная оптимизация может привести к улучшению работы сайта, совместное применение всех методов является довольно сложной задачей. Кроме того, лишь некоторые из них применимы к какому-либо конкретному сайту. Вопросы производительности могут быть не столь очевидны для тех, чья карьера не была связана с этой областью. Именно поэтому важно понимать, какие…

Подробнее
Frontend Адвент-Календарь 2024

Frontend Адвент-Календарь 2024

Не успеваете следить за последними новинками и трендами веб технологий? Этот адвент-календарь идеально подойдет для того, чтобы изучить и попробовать новые возможности CSS и JavaScript, появившиеся за последние годы. Читать далее

Подробнее
Личный опыт: добавление микроразметки на сайт

Личный опыт: добавление микроразметки на сайт

Микроразметка сайта: личный опыт и решения. Никита Неминущий, ведущий инженер-программист «Выберу.ру», рассказывает о том, как на их сайте была реализована микроразметка и какие трудности пришлось преодолеть. Узнайте, как микроразметка влияет на поисковую выдачу и какие инструменты помогли упростить процесс ее добавления. Ознакомиться

Подробнее
В Chrome Canary стал доступен полностью кастомизируемый <Select>

В Chrome Canary стал доступен полностью кастомизируемый <Select>

Новость Это должно было когда то случится, вслед за разработкой нативного элемента popover, в 150й версии Chrome Canary появился запрос на обратную связь по элементу Select, у которого можно полностью изменять выпадающий элемент. Элемент будет состоять из следующих частей, представленных на картинке: Читать далее

Подробнее
Исследование: в 2024 году только 0,5% из топ-200 веб-сайтов мира используют валидный HTML

Исследование: в 2024 году только 0,5% из топ-200 веб-сайтов мира используют валидный HTML

Фронтенд-инженер, бывший сотрудник Google и Miro Йенс Оливер Мейерт провёл исследование, которое показало, что 199 из 200 самых популярных веб-сайтов используют неработающий HTML. Читать далее

Подробнее
HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 9

HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 9

Хабр, я снова пришёл к вам с практическими советами про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который помогает мне найти наши косяки в вёрстке. Сегодня мы рассмотрим следующие аспекты: какие сюрпризы есть при использовании свойства display; о чём нужно помнить при вёрстке кнопки «Показать пароль»; зачем нужны подсказки с помощью атрибута aria-label при разметке областей…

Подробнее
Как настроить SEO при создании сайтов самостоятельно?

Как настроить SEO при создании сайтов самостоятельно?

Привет, Хабр! Я — Марина, специалист по продвижению сайтов в Selectel. В тексте расскажу, как правильно настроить SEO-параметры для разных типов веб-ресурсов на этапе их создания. Пригодится вебмастерам, маркетологам и всем, кто работает с сайтами. Ранее мы выпустили текст о том, как разработать HTML-шаблон страницы с учетом SEO. Моя статья ориентирована больше на оптимизацию разных типов сайтов, а не код. Читать дальше →

Подробнее
Factor and Block CSS — методология CSS

Factor and Block CSS — методология CSS

Hello, Developers!! Сегодня я расскажу о новой методологии для CSS, которая поможет вам сэкономить время на чтение и редактирование CSS-файлов. Методологию я придумал сам, если будут какие-то идеи, как улучшить её, буду рад обсудить это с вами в комментариях. Давайте же начнем. Читать далее

Подробнее
Полный гайд по CSS Flexbox с примерами из практики

Полный гайд по CSS Flexbox с примерами из практики

Привет! Сегодня мы поговорим про flexbox в css. Это очень важная тема, в которой должен разбираться каждый фронтенд-разработчик или верстальщик. Я покажу вам как flexbox работает на реальных примерах. А в конце статьи покажу лайфхаки, которыми сам постоянно пользуюсь на работе. Читать далее

Подробнее
Как стать Frontend разработчиком: подробное руководство по началу карьеры

Как стать Frontend разработчиком: подробное руководство по началу карьеры

Добро пожаловать, в захватывающий мир frontend разработки! В этой статье я помогу вам разобраться в сложной и динамичной области, предоставив подробное руководство по изучению необходимых технологий и освоению навыков Frontend разработчика. Вы узнаете, какие инструменты и ресурсы использовать для эффективного освоения профессии, и как поэтапно углубляться в различные аспекты frontend разработки. В конечном итоге, вы сможете создавать интерактивные и визуально привлекательные веб-сайты,

Подробнее
HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 8

HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 8

Хабр, я снова пришёл к вам с практическими советами про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который помогает мне найти наши косяки в вёрстке. Сегодня мы рассмотрим следующие аспекты: какие скрытые проблемы с паттерном «visually-hidden» нас ждут; в каких ситуациях кнопка «Закрыть» указывает на выход; чем вредно значение contents у свойства display; почему подсказка с помощью…

Подробнее
[Перевод] 37 Советов от Senior Frontend Разработчика. Для начинающих

[Перевод] 37 Советов от Senior Frontend Разработчика. Для начинающих

Мне очень понравился пост abbeyperini, и я решил поделиться своими советами после более чем 5-летнего опыта работы разработчиком программного обеспечения. Готовы? Давайте погрузимся 💪. 1. Освойте основы Дом, построенный на шатком фундаменте, развалится при малейшей проблеме. Аналогично, если у вас нет прочных основ: Читать далее

Подробнее