Обслуживание не реагирующего css для ie8 и ниже
Мы переписываем наш веб-сайт на адаптивный дизайн (и, возможно, RESS в будущем). Аналитические данные заставляют нас поддерживать некоторые старые браузеры (ie7 и ie8).
У нас есть 2 CSS:
-
site.css: полный css с медиа-запросами (для всех агентов, кроме ie8 и ниже) -
old-ie.css: полный css без медиа-запросов (для ie8 и ниже)
Мы нашли этот метод:
<!--[if (gt IE 8) | (IEMobile)]><!-->
<link href="site.css" rel="stylesheet" />
<!--<![endif]-->
<!--[if (lt IE 9) & (!IEMobile)]>
<link href="old-ie.css" rel="stylesheet" />
<![endif]-->
Рекомендуется ли это? (Бот Google, seo, браузер совместимость и т.д.)
Или лучше сделать обнаружение старых браузеров на стороне сервера (небольшой конечный список) и просто изменить имя css, чтобы включить его? (Плюс обслуживание html с помощью Vary: User-Agent, чтобы угодить Google)
1 answers
Если вы выберете обнаружение на стороне сервера...
Преимущество обнаружения на стороне сервера заключается в том, что конечному пользователю будет доставлено меньше кода в целом, что немного ускоряет загрузку веб-страницы. Еще одно преимущество заключается в том, что не будет никаких CSS-команд, которые могли бы создать нежелательные эффекты в несовместимых браузерах.
Недостатком обнаружения на стороне сервера является то, что вам нужно написать код для обнаружения браузера и заставить его обслуживать контент в зависимости от браузера. Также, вам придется вести список браузеров, чтобы можно было загрузить соответствующий код. В зависимости от того, сколько браузеров вы планируете поддерживать, этот список может быть длинным. Я думаю, что на сегодняшний день должно быть создано не менее 50 веб-браузеров, начиная от Arachne для DOS и заканчивая Internet Explorer 3 для Windows 3.x и заканчивая Netscape, Firefox, chrome, и список можно продолжать. Кроме того, вам придется иметь дело с номерами версий, так как старые версии некоторых браузеров не поддерживают новые технологии.
Если вы не выбираете обнаружение на стороне сервера и вместо этого используете условные комментарии...
Преимущество здесь в том, что время кодирования может быть меньше, особенно если знания в области кодирования ограничены CSS и HTML, однако, условные комментарии, которые вы показываете (согласно заглушке на webpagetest.org во время тестирования веб-страницы) остановите Internet Explorer от выполнения дальнейшего кода до тех пор, пока не будет загружена таблица стилей внутри, тем самым замедляя воспринимаемую скорость загрузки.
Если у вас мало времени, затем объедините весь CSS-код вместе, а затем протестируйте его с помощью средства проверки CSS по адресу https://jigsaw.w3.org/css-validator / и попытайтесь сделать его совместимым с самым низким уровнем CSS, который вы можете. Чем ниже, тем выше вероятность того, что он будет работать с большим количеством браузеров.
Кроме того, попробуйте инструменты powermapper (на trypowermapper.com ) чтобы узнать, какие проблемы они могут найти на вашем сайте.
Но если вы просто хотите получить ответ...
Я бы пошел на сервер только ради вашего клиенты Internet Explorer, чтобы предотвратить любую блокировку.
Доказательство того, что использование условий IE - не лучшая идея
Этот совет случайно появился при тестировании моей страницы на webpagetest.org .
