Брат Тук
Брат Тук

Брат Тук

Редактор
badge 1 год с нами! badge Награда за 5000 очков репутации badge За 500 сообщений!
Регистрация
18/04/2023
Сообщения
9.689
Репутация
7.827
Автор: Дмитрий Лаврик
Название: Идеальная вёрстка (2023)

[Дмитрий Лаврик] Идеальная вёрстка (2023)


Описание:

Для оценки в Chrome Lighthouse и Google PageSpeed Insights

На интенсиве изучаются приёмы вёрстки для достижения максимального результата в системах автоматической оценки страниц от Google. Ведь при ранжировании Google официально учитывает показатели Core Web Vitals
:)


Интенсив предназначен для тех, кто:
Изучил HTML и CSS на более-менее нормальном уровне
Не понимает, почему инструменты Google ругают его вёрстку
Хочет освоить вёрстку, правильную с точки зрения Google

Темы интенсива

Обзор инструментов
  • Знакомство с Lighthouse
  • Знакомство с Page Speed Insights
  • Выбор целевого уровня
  • Реальность получения 100 из 100
  • Влияние показателей на SEO
Базовые требования гугла
  • Быстрый ответ сервера
  • Адекватный размер DOM
  • Критические и обычные стили
  • Минимизация размеров статики
  • Отсутствие прыжков контента
Основные показатели
  • First Contentful Paint
  • Largest Contentful Paint
  • First Input Delay
  • Cumulative Layout Shift
Анализ сайтов
  • Примеры хороших и кривых проектов
  • Комментарии по кейсам учеников
  • Выявление важнейших проблем
  • Последовательность исправления
Работа с критическим CSS
  • Ручное разделение стилей
  • Автоматизация разделения кода
  • Эксперименты с npm critical
  • Эффективная настройка critical
Ускоряющие теги link
  • Preload и Prefetch
  • Preconnect
  • Асинхронный link stylesheet
  • Загрузка CSS из JS
Изображения
  • Webp, picture и source
  • Img и srcset
  • Указание размеров в html
  • Вывод разных размеров
  • Ленивая загрузка изображений
Шрифты
  • Современные форматы шрифтов
  • Link vs @import
  • Обязательный link preload
  • Свойство font-display
  • Подбор стандартного шрифта
Популярные проблемы UI
  • Inputs & labels
  • Ссылки и кнопки без текста
  • Фреймы без title
  • Недостаточный контраст цвета
Серверная сторона
  • Gzip сжатие
  • Время кеша статики
  • Минификация html-ответа
  • Https, http2
Оптимизация монстра
  • Пример сайта на Vue + Vuetify
  • Стартовые показатели в красной зоне
  • Выявление ключевых проблем
  • Вывод в зелёную зону
Неизбежное зло
  • Y.Метрика и G.Аналитика
  • Фреймы сторонних сайтов
  • Неиспользуемый javascript
  • Nginx, Apache и время кэша

Подробнее:
Авторизуйтесь, чтобы посмотреть скрытый контент.

Скачать:
Авторизуйтесь, чтобы посмотреть скрытый контент.
 
Хороший автор. Интересные пути решений предлагает. Единственное, что вебинары длятся от 1,5 часов до 3. Нужно терпение что бы один вебинар посмотреть, но это стоит того
 

Создайте учетную запись или войдите, чтобы комментировать или скачивать материалы!

У вас должна быть учетная запись, чтобы оставлять комментарии

Зарегистрироваться

Создайте учетную запись. Это просто!

Авторизоваться

У вас уже есть аккаунт? Войдите здесь.

Последние темы автора

Брат Тук
Ответы
0
Просмотры
943
Брат Тук
Брат Тук
Брат Тук
Ответы
4
Просмотры
954
Lily2107
Lily2107
Брат Тук
Ответы
3
Просмотры
1K
Добряна
Добряна
Брат Тук
Ответы
0
Просмотры
634
Брат Тук
Брат Тук

Похожие темы

Малыш Джон
Ответы
0
Просмотры
5K
小黑鬼
小黑鬼
Малыш Джон
Ответы
2
Просмотры
4K
Tor_Down
Tor_Down
Алан-э-Дейл
Ответы
0
Просмотры
5K
Алан-э-Дейл
Алан-э-Дейл
Брат Тук
Ответы
0
Просмотры
6K
Брат Тук
Брат Тук
Брат Тук
Ответы
1
Просмотры
2K
underdog
underdog
Брат Тук
Ответы
2
Просмотры
1K
FarUnivers
FarUnivers
Дева Мэриан
Ответы
4
Просмотры
2K
Els i El
Брат Тук
Ответы
2
Просмотры
2K
Achtung
Achtung
Дева Мэриан
Верстка сайтов [Stepik] HTML CSS (pro) (2024)
Ответы
3
Просмотры
3K
remag777
remag777
Сверху Снизу