Разработка сайтов, создание сайтов
главная / HTML / Сбор данных о посетителе

Сбор данных о посетителе

Для того, чтобы страничка хорошо отображалась в браузере у пользователя, дизайнеру необходима некоторая информация о пользователе, например, тип браузер, разрешение монитора, допустимая ширина и высота экрана, глубина цвета, поддержка cookie и Java. Кроме этого в некоторых сервисах статистики посещений доступна такая информация о пользователе, как системный язык, пользовательский язык, платформа, на которой работает пользователь. О том, как можно получить эти и некоторые другие данные, и пойдет речь в этой статье.

1. Браузер пользователя.

О получении информации о браузере, в котором просматривается web-страница, было написано до меня и очень много раз, кроме того, просто элементарно найти скрипт, который проверяет браузер и в зависимости от этого как-то подстраивает страницу или загружает другую. Поэтому я не буду приводить подобных скриптов, а лишь напомню какой объект и какие свойства надо использовать. Объект – windows.navigator. Свойства: appName, appVersion. Версия и тип – это все, что нужно знать web-кодеру о браузере пользователя.

2. Монитор пользователя.

Теперь разберемся с монитором пользователя. Для создания дизайна, зависящего от монитора желательно знать: разрешение, допустимую ширину (а за одно и высоту), глубину цвета (а вдруг у пользователя 8-битная глубина, тогда зачем ему загружать 32-битные картинки?) О получении информации о мониторе написано, по-моему, не так уж много, по крайней мере, все, что я тут пишу, я открыл сам. И так, как это получить? Приведу скрипт с построчными комментариями, и сразу станет все ясно.

//разрешение экрана:
w = window.screen.width;
h = window.screen.height;
//допустимая ширина и высота:
aw = window.screen.availWidth;
ah = window.screen.availHeight;
//глубина цвета:
cd = window.screen.colorDepth;
3. Поддержка cookie.

Поддержка cookie определяется элементарно:

ce = window.navigator.cookieEnabled;
О том, что это такое и как это использовать, можно прочитать в моей статье «Использование cookie» по адресу – http://www.frnet.narod.ru/article/0028.html.

4. Другая информация.

И так, что еще мы можем получить от пользователя?

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

Вот так получается эта информация:

fse = window.screen.fontSmoothingEnabled;
Ну, а теперь все что было изложено выше и даже больше можно получить при обращении к одному объекту (а не к двум). Для того, чтобы это сделать нужно:

1. Выбрать объект (любой <span>, <div> и т.п.)
2. Дать ему имя.
3. Добавить стилевое свойство behavior со значением url(#default#clientCaps).
4. Написать небольшой скрипт для получения информации от этого объекта.

Приведу пример web-страницы, выводящей всю необходимую информации о посетителе на экран (за исключением типа и версии браузера, т.к. этот способ работает только в IE). Тут есть и та информация, которую мы уже получали, и другая. Вот пример:

<HTML>
<HEAD>
<STYLE>
/*определение стилевого свойства:*/
.#cc {behavior:url(#default#clientCaps)}
</STYLE>
</HEAD>

<BODY>
<!-- Объект, к которому будет обращаться за информацией: -->
<span id=cc></span>

<!-- Объект для вывода информации -->
<PRE id=txt></PRE>

<SCRIPT>
<!--
function window.onload() //объявляем функцию, которая будет выполняться при загрузке страницы
{
inf =
//допустимая высота:
"availHeight = " + cc.availHeight + "n" +
//допустимая ширина:
"availWidth = " + cc.availWidth + "n" +
//глубина цвета:
"colorDepth = " + cc.colorDepth + "n" +
//тип подключения (offline, если отключен):
"connectionType = " + cc.connectionType + "n" +
//поддержка cookie:
"cookieEnabled = " + cc.cookieEnabled + "n" +
//класс процессора:
"cpuClass = " + cc.cpuClass + "n" +
//разрешение монитора (width*height):
"width = " + cc.width + "n" +
"height = " + cc.height + "n" +
//поддержка Java:
"javaEnabled = " + cc.javaEnabled + "n" +
//платформа, на которой работает пользователь:
"platform = " + cc.platform + "n" +
//системный и пользовательский языки
"systemLanguage = " + cc.systemLanguage + "n" +
"userLanguage = " + cc.userLanguage + "n";

//вывод информации на экран:
txt.innerText = inf;
}
-->
</SCRIPT>
</BODY>
</HTML>

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

Источник: frnet.narod.ru

КОНТАКТЫ
г. Екатеринбург
info@vismech.ru


текущее:
Свои теги в HTML
Отправка форм
Создание динамических форм с помощью JavaScript

НОВОСТИ
2011 г., «VisMech.ru»