Архивы: по дате | по разделам | по авторам

Оптимизация сайта для Opera Mini

АрхивProDigi
автор : Илья Шпаньков   25.12.2007

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

Браузер Opera Mini нередко отключает различные графические элементы веб-сайтов в целях экономии трафика. В результате пользователь может получить на телефоне малопонятные данные, слабо напоминающие оригинальную страницу. Для примера можно посмотреть, насколько различным может быть отображение одного и того же ресурса на персональном компьютере (рис. 1) и на экране Opera Mini (рис. 2).


Рис. 1


Рис. 2

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

Иногда стили заголовка страницы содержат подобные строки:

#header{
background-image: url({site_url}themes/site_themes/orange/header.png);
background-repeat: repeat-x;
}

Всё, что нам требуется - просто добавить в заголовок фоновый цвет, соответствующий по цвету рисунку, используемому в качестве заголовка сайта.

#header{
background-image: url({site_url}themes/site_themes/orange/header.png);
background-repeat: repeat-x;
background-color:#000000;
}

В результате при отображении веб-сайта с помощью Opera Mini фоновый цвет возьмёт на себя роль рисунка. (Заметим, что есть более краткая запись, использующая свойство background).

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

Таким же способом можно "подсветить" и другие элементы сайта, которые теряются при отображении в Opera Mini.

© ООО "Компьютерра-Онлайн", 1997-2018
При цитировании и использовании любых материалов ссылка на "Компьютерру" обязательна.