Для оптимизации загрузки веб-страницы при разных размерах экрана можно использовать следующие подходы:

• Адаптивные CSS-стили. 1 Они позволяют задавать правила, которые будут применяться в зависимости от размеров экрана устройства. 1
• Оболочки (Wrapper). 1 Определяют максимальную ширину контента на странице и контролируют, как он отображается на разных устройствах. 1
• Адаптивные изображения. 12 Для них можно использовать CSS-свойство max-width: 100%, чтобы они автоматически масштабировались под размер экрана устройства. 1 Также можно использовать атрибут srcset для указания разных версий изображений для разных размеров экрана. 2
• Автоматическое масштабирование. 1 Для этого можно использовать относительные единицы измерения, такие как проценты или em. 1
• Оптимизация скорости загрузки. 1 Для этого нужно оптимизировать изображения, объединять и минифицировать CSS и JavaScript файлы, использовать кэширование и CDN (Content Delivery Network). 1

Также важно тестировать сайт на различных устройствах и размерах экранов, чтобы убедиться, что медиа-запросы определены правильно и контент отображается корректно. 1