Как запретить просмотр сайта в старом браузере?

Наверняка вы, уважаемые коллеги вебмастера, часто сталкивались с жалобами посетителей, что ваш сайт некорректно отображается на экране их монитора. Причиной этому является использование старых браузеров, не поддерживающих современные стандарты верстки. Например, многие до сих пор работают в Windows XP, которая была выпущена аж 10 лет назад — в далеком 2003-м — как тут можно говорить об отображении современных сайтов. А в ней как раз по умолчанию установлен самый глючный браузер всех времен и народов — Internet Explorer 6 (IE6). Чаще всего это косяки с отображением прозрачных изображений и с позиционированием элементов дизайна на странице.


Для решения данной проблемы есть два пути. Первый — сложный. Это дописывать специальные коды верстки и скрипты конкретно под каждую версию IE — у любой из них от 6 до 8 есть свои «особенности» — для их ликвидации. Пишется несколько новых css файлов с параметрами, заданными под эти браузеры. После этого в шапке между тегами «html» и «head» прописывается код, который указывает IE6 его друзьям, что для них есть специальный файл стилей. выглядит это примерно так:

<html>

<!--[if lt IE 7]> <html class="no-js ie6 oldie"> <![endif]-->
<!--[if IE 7]>    <html class="no-js ie7 oldie"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie"> <![endif]-->
<!--[if gt IE 8]><!--> <html> <!--<![endif]-->

<head>

То же касается и прозрачности в png — в IE6 прозрачные картинки имеют серый фон. Нужно подключить к странице специальный скрипт, в котором будет нейтрализована данная ошибка.

Но есть более простой путь, у которого есть много противников, но которым все чаще и чаще пользуются — перенаправить пользователя, зашедшего на сайт из-под Internet Explorer 6, на отдельную страницу, в котором будет сообщаться о том, что ему необходимо установить более современный браузер. Действительно, зачем поддерживать старые программы, которыми уже мало кто пользуется, нагружая при этом свой сайт лишними кодами, замедляющими его работу. Среди сторонников этого пути много весьма известных сайтов, например, ВКонтакте.

Смотрим наглядное видео, а потом читаем разъяснения.

* данный урок из одного видеокурса по CSS верстке,
поэтому не удивляйтесь, что рассказчик просит открыть
некие файлы из папок. Все что вам нужно — файл
с папкой ie6 со скриптом — я выложил выше.





WordPress и Internet Explorer 6

Для WordPress сделать такое перенаправление можно самостоятельно или при помощи плагина. В первом случае надо скачать файл для IE6 — это архив, в котором лежит одноименная папка, которую надо загрузить в корень блога. После этого пропишите в header.php после тега «head» следующий код:

<script type="text/javascript">
var IE='\v'=='v';
if(IE) {
window.location="АДРЕС ВАШЕГО САЙТА/ie6/ie.html";
}
</script>

Данный скрипт перебросит любого, кто использует Internet Explorer, на нашу предупреждающую страничку, которая выглядит вот так:

Можно немного усложнить и выявить только тех, у кого версия ниже 6 и выдать им предупреждение:

<script language="JavaScript" type="text/javascript">
function Check()
{
var IE='\v'=='v';
if(IE) {
var temp = navigator.appVersion.match(/\((.+)\)/i);
var params = temp[1].split(/;\s*/);
var params1 = params[1].split(/\s/);
if (params1[1]<=6){
alert('Версия вашего браузера устарела и не может корректно отображать сайт. Рекомендуемая версия IE - не ниже 7.');
}
}
}
</script>

Еще одни вариант с перенаправлением — добавить в functions.php код:

/* Заглушка для Internet Explorer 6 */
$user_agent = $_SERVER['HTTP_USER_AGENT'];
if (strpos($user_agent, 'MSIE 6.0') !== false && strpos($user_agent, 'MSIE 8.0') === false && strpos($user_agent, 'MSIE 7.0') === false) {
    if (!isset($_COOKIE["ie"])) {
        setcookie("ie", "yes", time()+60*60*24*360);
        header ("Location: ./ie6/ie6.html");
    }
}

IE6 плагины

И, наконец, самый сложный и в то же время простой способ — установить плагин. Опять же, тут есть два варианта — перенаправить на заглушку, либо использовать простенькую дефолтную тему WordPress, которая хорошо работает со всеми браузерами.

Начнем со второго. Его можно в принципе сделать самостоятельно. Вооружаемся Блокнотом и пишем код:

<?php
/*
Plugin Name: Нейтрализация IE6
Plugin URI: 
Description: Активация для IE6 стандартной темы.
Author: Nathan Rice
Author URI:
Version: 1.0
*/
 
add_filter('template', 'serve_default_to_iesix');
add_filter('option_template', 'serve_default_to_iesix');
add_filter('option_stylesheet', 'serve_default_to_iesix');
function serve_default_to_iesix($theme) {
if(strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE 6') !== false)
$theme = 'default';
 
return $theme;
}
?>

Теперь сохраняем этот текст как файл с расширением PHP, архивируем и устанавливаем как любой другой плагин WordPress.

Плагин хороший, но есть одно НО — он не будет работать с плагинами кеширования (типа Hyper Cache), так как требует динамической смены темы оформления. Поэтому вернемся опять к заглушке IE6 и скачаем еще один плагин — WP-NoIE6. Он использует в работе куки, поэтому будет выдавать нашу предупреждающую страничку в течение недели, после чего читатель сможет посмотреть сайт даже со своим старым браузером. Если вы хотите изменить это время, то откройте файл «wp-noie6.php» в папке плагина и измените строку

setcookie("ie", "yes", time()+60*60*24*7, "/");

Например, заблокируем на год:

setcookie("ie", "yes", time()+60*60*24*360, "/");

Если же хотите насовсем закрыть доступ старым браузерам, то найдите строку

if ($show != "yes")

и поменяйте в ней «yes» на «no». Дизайн страницы-заглушки также можете изменить — за нее отвечает файл «template.php» в папке с плагином. Вот такую оригинальную страничку, которая сравнивает использование IE6 с питьем 9-тилетнего молока, я нашел в сети:

Так мы решили проблему отображения в WordPress Internet Explorer 6 (IE6) — теперь сайт будет отображаться именно так, как вы задумали.

Поделись этой статьей с друзьями!

Это будет интересно прочитать:

  • Причиной того, что у многих пользователей сайт отображается некорректно, является не использование старых браузеров, а использование всяческих говнофонов и других говноустройств, заточенных исключительно под убивание времени.
    Пока моду диктуют устройства с кастрированными дисплеями-мониторами, все так и будет продолжаться.
    Следствием потаканию это моды можно считать множество сайтов шириной с туалетную бумагу. На нормальных девайсах такие сайты смотрятся позорно и пользоваться ими неудобно.
    Если хотите использовать и-нет эффективно, откажитесь от говнопадов и прочей ереси. А если не можете, то тогда не нойте, что нормальные сайты у вас отображаются неудобно (криво).

    • Тоже верно. Но мне кажется, когда человек приобретает некий гаджет, то он заранее готов к тому, что сайты могут отображаться криво — не компьютер или ноутбук все-таки. Тут надо аудиторию прощупывать, если сайт про софт для планшетов, то имеет смысл под них делать. Можно также доп. плагин (на WordPress, например) поставить, который автоматически определит, какое устройство и под него шаблон загрузит. А если сайт рассчитан на рядового пользователя ПК, то нет смысла под девайсы подделываться

    • Чтобы не мучиться с версткой под эти динозавры. т.к. в них будет все криво отображаться

  • Втопку ослика….одно мучение……
    но за скрипты спасибо…хотел бы я посмотреть на тех кто сидит на ослике и еще древнем…

  • Александр, какой же Вы деликатный, заботитесь о всех пользователях. Просто необъятное число всевозможных нюансов, простым блогерам не объять необъятное.

Добавить комментарий