Уроки
-
Введение
-
Поисковая оптимизация
- Битые ссылки
- Карта сайта
- Микроразметка
- Robots.txt
- Ссылки
- Текст
- Дубликаты
- Базовое
- Картинки
-
Скорость
-
Минификация
-
Минификация CSS
Минификация JavaScript файлов
Минификация inline CSS кода
Минификация картинок без потери качества
Минификация JavaScript файлов
Неиспользуемый CSS код
Оптимизация data:URL картинок
Формат анимированных изображений
Неиспользуемый JavaScript код
Использование WebP
Отсутствует сжатие картинки
Битрейт видео
-
Сокращение запросов
-
Переизбыток мелких картинок
Несгруппированные CSS файлы
Несгруппированные JavaScript файлы
Переизбыток шрифтов
Наличие сквозных CSS, JS файлов
Наличие монохромного шрифта
Загрузка дубликатов файлов
Использование JS фасадов
Перенаправление JavaScript кодом
Добавление ленивой загрузки
Редирект с/на www версию
- Шрифты
- Время загрузки
- Настройки сервера
- Картинки
- Первое содержимое
-
Минификация
- Мобильность
- Баги
-
Удобство
- Соцсети
- Browserconfig.xml
- Манифест веб-приложения
- Фавиконы
- Почта
- Базовое
- Читаемость текста
-
Безопасность
- Шифрованное соединение
- Эксплойты
- Уязвимости
Видеоплеер
Видеоплеер на странице размещается вот таким кодом:
<video poster="/preview-image.png" preload="none">
<source src="./video-file.mp4" type="video/mp4">
<source src="./video-file.webm" type="video/webm">
</video>
Вот несколько простых рекомендаций, которые помогут улучшить пользовательский опыт ваших клиентов:
- Укажите атрибут
preload="none"
. Это предотвратит предзагрузку видео файла. Без него страница загрузит первые несколько секунд видео, которые будут весить как вся остальная страница вместе с картинками. Это сильно замедляет загрузку страницы. - Укажите постер в аттрибуте
preload="none"
. Постер - это картинка-превью, которая отображается по умолчанию, пока пользователь не начнёт воспроизведение видео. - Укажите видео в 2 форматах: WebM и MP4. Первый формат - самый современный и весит меньше всего. Но он не всегда поддерживается операционными системами. Пользователи сохранят себе на компьютер это видео и не смогут его воспроизвести.
- Для каждого
source
укажите атрибутtype
. - Соотношение сторон у постера должно соответствовать соотношению сторон видео файла. Если ваше видео FullHD с соотношением сторон 16:9, то и постер должен иметь те же соотношения сторон.
Также наша проверка проверяет наличие видео файлов и постера, а также то, что их можно открыть и воспроизвести.
Есть замечания или дополнения? Напишите нам на почту admin@quick-site-upgrade.com.
Проверьте ваш сайт