Как отправить совершенно другой контент HTML на основе разрешения экрана?

Question

Мне нужно отправить отдельный контент клиенту на основе разрешения экрана.

В этот момент весь контент доставляется на страницу index.php, а через CSS я показываю или не детали, которые я хочу.

Недостаток заключается в том, что все содержимое страницы всегда доставляется клиенту. Просто дисплей меняется. Это приводит к увеличению трафика на мобильные телефоны.

Моя цель состоит в том, чтобы иметь возможность всегда звонить index.php, чтобы действительно предоставлять различные HTML-данные на основе разрешения, так что трафик для мобильных устройств может быть значительно сокращен (на мой случай есть список и 10 строк CSS, а это тоны JS, разные CSS и т. д. и т. д.) и на настольные компьютеры, отправляется только то, что им действительно нужно отображать

Возможно ли это сделать с помощью PHP/JS и в то же время быть Google SEO Соответствует?

Answer 1

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

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

$detect = new Mobile_Detect; 

if ($detect->isMobile() && !$detect->isTablet()) { 
    // all mobile devices excluding tablets (i.e. phones) 
    include('phone_template.php'); 
} else if($detect->isTablet()) { 
    // all tablets 
    include('tablet_template.php'); 
} else { 
    // everything else 
    include('desktop_template.php'); 
} 

Опять же, это работает на основе строки агента пользователя, который подменен (ад хром позволяет сделать это инструменты разработчика для тестирования различных размеров экрана).

Это не будет идеально, но это может вас заинтересовать.