- •31 Перечень сокращений, условных обозначений, символов, единиц и терминов
- •Введение
- •Глава 1. Аналитический обзор Использования мобильных гаджетов для просмотра
- •Глава 2. Анализ технических возможностей и требования для создания мобильных сайтов
- •Глава 3. Исследование Методов и анализ технологий и технических возможностей создания мобильных сайтов
- •3.1.4. Примеры отдельного мобильного сайта
- •3.2. Адаптивный веб-дизайн
- •3.2.1. Использование и описание адаптивного дизайна
- •3.2.2. Преимущества адаптивного веб-дизайна
- •3.2.3. Недостатки адаптивного веб-дизайна
- •3.2.4. Примеры адаптивного веб-дизайна
- •3.3. Ress: Вывод разных html и css на одном url
- •3.3.1. Использование и описание технологии ress
- •3.3.2. Преимущества технологии ress
- •3.3.3. Недостатки технологии ress
- •Заключение
- •Библиографический список
- •Приложение
31 Перечень сокращений, условных обозначений, символов, единиц и терминов
С каждым годом достижения
Введение
С каждым годом достижения и разработки в области информационных технологий растут. Всё обновляется и несет в себе частичку инновации. Так и, казалось бы, в обычном обиходе ходьбы по магазинам, чем занимается, пожалуй, каждый человек, мы находим частичку инновации или новой разработке. Совсем недавно мы смотрели на обычные витрины магазинов, где попросту лежали вещи, стояли манекены, и красовалась какая-нибудь незаурядная картинка или надпись. Теперь владельцы приходят к новым модным тенденциям внедрения современных технологий медиадизайна в простой торговле и оформлении магазинов.
Уже плотно в обиход вошли так называемые интерактивные витрины. Они позволяют узнать информацию о товаре в движении с помощью меняющихся объектов товара или информирует потенциального покупателя о том, что в его магазинах не только огромный ассортимент товара, но и современные технологии. Следует отметить, что интерактивные витрины или экраны не только передают информацию о товаре, но и позволяют поиграть в игру, которая устанавливает эмоциональную связь бренда и покупателя. Современные технологии действуют во благо продавцов и покупателей. Это своего рода особый маркетинговый ход. Сделать рекламу уникальной, ненавязчивой и оригинальной, а информацию о товарах доступной и объемной помогают интерактивные витрины.
Актуальность исследования. Интерактивная витрина вполне может стать заменой продавца-консультанта, обеспечив непрерывный процесс продаж даже в ночное время суток. На витрине можно не только посмотреть нужный товар, но и получить о нем исчерпывающую информацию. При этом объем информации и многообразие деталей ничем не ограничивается. Следует отметить, что данные витрины основываются на системе «интерактивное стекло», одной из важных составляющих современного медиадизайна в сфере информационных технологий и систем. И именно система «интерактивное стекло» является объектом исследованием данной выпускной квалификационной работы.
Итак, перечислим основные пункты данной выпускной квалификационной работы:
Объект исследования: система «интерактивное стекло».
Предмет исследования: визуализация информации для системы «интерактивное стекло»
Цель работы: провести анализ средств, благодаря которым можно осуществлять визуализацию информации для системы «интерактивное стекло» и взаимодействовать с человеком для вывода информации по его запросу.
Задачи:
1. Изучить систему «интерактивное стекло» и её составляющие.
2. Провести анализ компонентов необходимых для визуализации информации.
3. Исследовать технологии управления данной визуализацией для взаимодействия с человеком. Провести их сравнение.
4. Провести апробацию управления.
5. Проанализировать полученные результаты.
Основные положения данного исследования по системе «интерактивное стекло» докладывались на XLII научной и учебно-методической конференции НИУ ИТМО 29 января – 1 февраля 2013 года.
Глава 1. Аналитический обзор Использования мобильных гаджетов для просмотра
Определение и состав мобильной версии сайта
Развитие технологий постепенно всё больше и больше проявляют себя в обычной жизни простого пользователя. Не обошло стороной это обычных пользователей интернета. Расширяющийся с каждым днем рынок мобильных устройств диктует новые правила разработчикам и веб-мастерам. Представители Google в России озвучивали статистику, по которой количество запросов к их поисковой системе за год (2012-2013) выросло на 85%. Мобильный Интернет постепенно меняет картину поискового маркетинга и нахождения в сети. Изменяется общий портрет аудитории, семантика и форма запросов, появляются новые требования к сайтам и в свою очередь и к мобильным устройствам.
По данным полученным из опроса сложилась статистика, которая говорит сама за себя. По данным статистики, можно с уверенностью сказать, что мобильный интернет имеет будущее, над которым надо работать и развивать. Люди используют мобильный интернет и мобильные устройства повсеместно:
84% дома;
80% в свободное время в течение дня;
76% в очередях и в процессе ожидания;
69% в процессе шоппинга;
64% на работе;
62% во время просмотра ТВ-программ;
47% во время подготовки к работе.
По официальной статистике, в 2013 году 25% общемирового интернет трафика пользователи получали посредством мобильных устройств. Статистика показывает, что все больше и больше людей по всему миру заходят в сеть и путешествуют по сайтам с помощью смартфонов, планшетов и прочих мобильных устройств. Ожидается, что к середине 2014 года число пользователей мобильного интернета увеличится до 1.7 миллиардов по всему миру, что естественно скажется на количестве посещений сайтов с телефонов.
С каждым днем этот трафик будет расти не только за счет новых пользователей мобильных устройств, но и за счет увеличения времени, которое проводят мобильные пользователи в Интернете. Это произойдет за счет стремительного расширения спектра услуг и контента предоставляемых мобильным пользователям.
На сегодняшний день мы все чаще слышим от крупнейших поисковых систем, в частности от компании Google, что рейтинг сайтов, которые не имеют мобильной версии будет понижаться. Не трудно догадаться, что через какое-то время примеру Google последует и российская поисковая система Яндекс.
По доступным данным аналитической корпорации IDC в 2013 году продажи мобильных гаджетов и смартфонов вырастут на 32,7% по сравнению с предыдущим годом и составят порядка 958,8 млн устройств против прошлогодних 733,4 млн. Таким образом, текущий год станет переломным – продажи «умных» девайсов составят 52,2% от общего рынка мобильных устройств и впервые в истории полностью опередят продажи простых телефонов. Этот тренд будет сохраняться, и в будущем приведет к значительному росту потребления мобильного трафика, считают специалисты IDC.
Как сообщает журнал The Economist со ссылкой на аналитиков инвестиционного подразделения банка Morgan Stanley, в 2013 году количество мобильных устройств с выходом в сеть наконец-то превысило количество подключенных к интернету ПК.
И хотя из-за дороговизны мобильного соединения (на сегодняшний день) объем мобильного трафика по-прежнему не так велик, как стационарного, на протяжении всей истории наблюдений прослеживается стабильный и уверенный рост. Статистическая компания StatCounter (ирландский веб-сайт, который представляет собой инструмент для анализа веб-трафика) приводит цифры – в июне 2013 года более 16% мирового трафика приходятся на мобильные устройства (по сравнению с 10,4% в июне 2012 года). Что до России, то здесь цифры несколько ниже – 5,62% мобильного трафика по сравнению со стационарным. Примечательно, что StatCounter считает только смартфоны и телефоны – планшетные компьютеры в эту статистику не входят. Таким образом, доля мобильного трафика в общепринятом понимании еще больше. Другое аналитическое агентство, Gemius, насчитывает в России 6,38% просмотров страниц с мобильных устройств в общем интернет-трафике по стране. По оценкам экспертов тенденция сохранится, и степень проникновения мобильного интернета будет стремительно расти.
Также не стоит упускать тот факт, что мобильные пользователи намного активнее своих "стационарных" коллег: они больше времени проводят онлайн и готовы вступать в живую коммуникацию с сайтами. Странно не замечать очевидного – будущее за мобильными устройствами. Для электронных коммерсантов игнорировать этот тренд, по меньшей мере, беспечно.
К этому нужно быть готовым и развивать свой сайт в направлении мобильного поиска и технического процесса. Для этого нужно решить ряд вопросов. Одним из таких вопросов является вопрос о том, на каких мобильных гаджетах будет отображаться интернет ресурс.
Планшеты
Планшеты и смартфоны оснащаются экранами с разными соотношениями сторон и разной плотностью пикселей, однако эти параметры редко указываются в технических характеристиках. Для разработки сайта для мобильных устройств эти факторы играют практически определяющую роль. От этих параметров зависит, как будет выглядеть сайт на экранах планшетов, мобильных телефонах. Попробуем разобраться со всеми хитростями, связанными с этими параметрами.
Интернет-планшет (англ. Internet tablet или Web tablet — Веб-планшет, или Pad tablet — Pad-планшет (Блокнотный планшет), или Web-pad — Веб-блокнот, или Surfpad — Веб-серфинг-блокнот) — мобильный компьютер, относящийся к типу планшетных компьютеров с диагональю экрана от 7 до 12 дюймов, построенный на аппаратной платформе того же класса, что и платформа для смартфонов. Для управления интернет-планшетом используется сенсорный экран, взаимодействие с которым осуществляется при помощи пальцев, без использования физической клавиатуры и мыши. Ввод текста на сенсорном экране в целом не уступает клавиатурному по скорости. Многие современные интернет-планшеты позволяют использовать для управления программами мультитач-жесты.
Интернет-планшеты, как правило, имеют возможность быть постоянно подключёнными к сети интернет — через Wi-Fi или 3G/4G-соединение. Поэтому интернет-планшеты удобно использовать для веб-серфинга (просмотра веб-сайтов и веб-страниц), запуска веб-приложений, и взаимодействия с какими-либо веб-службами.
Вот соотношение размеров экранов, использующихся в большинстве современных планшетов.
Рис. 1.1. Соотношение сторон экранов планшетов
Данные табл. 2.1 показывают параметры экранов, чаще всего использующихся в планшетах.
Таблица 1.1
Параметры экранов планшетных компьютеров
Экран |
Ширина |
Высота |
Формат |
Пример |
7" |
1024 |
600 |
16:10 |
Galaxy Tab 2 7.0 |
7" |
1280 |
800 |
16:10 |
Nexus 7 |
7.7" |
1280 |
800 |
16:10 |
Galaxy Tab 7.7 |
7.9" |
1024 |
768 |
4:3 |
iPad mini |
8.9" |
1280 |
800 |
16:10 |
Galaxy Tab 8.9 |
9.7" |
1024 |
768 |
4:3 |
iPad 2 |
9.7" |
2048 |
1536 |
4:3 |
iPad 3 retina |
10.1" |
1280 |
800 |
16:10 |
Galaxy Tab 2 10.1 |
10.6" |
2560 |
1600 |
16:10 |
Nexus 10 |
Обратите внимание, насколько экран 8" с соотношением сторон 4:3 визуально больше широкого экрана 7". А широкий экран 10.1" на сантиметр меньше экрана 9.7" по высоте.
Телефоны и смартфоны
Смартфо́н (англ. smartphone — умный телефон) — мобильный телефон, дополненный функциональностью карманного персонального компьютера.
Коммуникатор (англ. communicator, PDA phone) — карманный персональный компьютер, дополненный функциональностью мобильного телефона.
В обоих этих устройствах и всех современных гаджетах из этого семейства используются экраны с разными соотношениями сторон (3:2, 5:3, 16:9), однако все они довольно близки. Соотношение размеров экранов с одинаковой диагональю и разными соотношениями сторон представлены на рисунке 1.2.
Рис. 1.2. Схема обратной проекции
Экраны смартфонов, а именно их диагонали используемых в смартфонах могут быть совершенно одинаковыми, но количество пикселей при этом будет существенно отличаться.
По данным небольшого опроса, только 31% пользователей мобильных гаджетов с диагональю экрана от 4 до 4,4 дюймов при выборе нового смартфона решили ограничиться той же диагональю – большинство из опрошенных пользователей переключились или предпочли бы переключиться на более крупные дисплеи. Наиболее популярным размером дисплея среди опрошенных стали 4,7 и 5 дюймов. Востребованность устройств подобного соотношения сторон и форм-фактора отражает и дебют 5,1-дюймового Galaxy S5 – нового флагманского аппарата Samsung.
В таблице 1.2 для наглядности и понимания представлены данные, о которых говорилось ранее
Таблица 1.2
Параметры экранов смартфонов
Экран |
Ширина |
Высота |
Формат |
Пример |
3.2" |
320 |
240 |
4:3 |
Galaxy Y |
3.2" |
480 |
320 |
3:2 |
Galaxy Mini 2 |
3.5" |
480 |
320 |
4:3 |
Galaxy Ace |
3.5" |
960 |
640 |
3:2 |
iPhone 4 |
3.8" |
800 |
480 |
5:3 |
Galaxy Ace II |
4" |
480 |
320 |
3:2 |
Sony Xperia miro |
4" |
800 |
480 |
5:3 |
Galaxy S III mini |
4" |
1136 |
640 |
16:9 |
iPhone 5 |
4.1" |
800 |
480 |
5:3 |
HTC Desire X |
4.3" |
800 |
480 |
5:3 |
Galaxy S II |
4.3" |
960 |
540 |
16:9 |
HTC One S |
4.3" |
1280 |
720 |
16:9 |
Xperia S |
4.5" |
1280 |
768 |
5:3 |
Lumia 920 |
4.7" |
1280 |
720 |
16:9 |
Galaxy Nexus |
4.7" |
1280 |
768 |
5:3 |
Nexus 4 |
4.8" |
1280 |
720 |
16:9 |
Galaxy S III |
5.3" |
1280 |
800 |
16:10 |
Galaxy Note |
5.55" |
1280 |
720 |
16:9 |
Galaxy Note II |
Как можно увидеть из таблицы, у подавляющего большинства экранов пиксель квадратный, поэтому соотношение сторон экрана можно вычислить, зная количество точек в ширину и в высоту. Есть лишь два исключения — «неправильные» экраны планшетов и смартфонов с прямоугольными пикселями — 800x480 (должно было бы быть 800x500) и 1024x600 (правильно было бы 1024x640).
Помимо соотношений сторон и разрешений экранов одним из факторов, влияющим на отображение информации на экране, является количеством точек на единицу длины. Эту величину принято называть сокращенно PPI сокращение для англ. pixels per inch. Применяется для указания разрешающей способности при вводе или выводе графики. Измеряется числом пикселей, приходящихся на дюйм поверхности.
Текст на экранах с низким PPI (количеством точек на дюйм) читается не комфортно. Отлично воспринимаются экраны с PPI больше 200. PPI может быть рассчитан из размера диагонали экрана в дюймах и разрешения. Для того чтобы рассчитать разрешаю способность экрана необходимо вначале рассчитать диагональное разрешение в пикселях с использованием теоремы Пифагора как показано в формуле (1.1):
, (1.1)
где
— диагональное разрешение в пикселях;
— ширина разрешения в пикселях;
— высота разрешения в пикселях.
После того как мы узнали диагональное разрешение в пикселях, мы можем рассчитать непосредственно и разрешаю способность экрана, зная из характеристик размер диагонали в дюймах. В цифровой индустрии часто используется «пикселей на сантиметр» вместо «пикселей на дюйм». Но в планшетах и смартфонах принято дюйм. Для вычисления необходимо воспользоваться формулой (1.2):
, (1.2)
где
— размер диагонали в дюймах.
Используя полученные при вычислении данные, составим таблицы смартфонов и планшетов и их разрешающими способностями, чтобы узнать долю гаджетов с тем или иным PPI
Таблица 1.3
Параметры экранов планшетных компьютеров
Экран |
Ширина |
Высота |
PPI |
Пример |
7" |
1024 |
600 |
173 |
Galaxy Tab 2 7.0 |
7" |
1280 |
800 |
216 |
Nexus 7 |
7.7" |
1280 |
800 |
196 |
Galaxy Tab 7.7 |
7.9" |
1024 |
768 |
164 |
iPad mini |
8.9" |
1280 |
800 |
170 |
Galaxy Tab 8.9 |
9.7" |
1024 |
768 |
132 |
iPad 2 |
9.7" |
2048 |
1536 |
264 |
iPad 3 retina |
10.1" |
1280 |
800 |
149 |
Galaxy Tab 2 10.1 |
10.6" |
2560 |
1600 |
300 |
Nexus 10 |
Таблица 1.4
Параметры экранов смартфонов
Экран |
Ширина |
Высота |
PPI |
Пример |
3.2" |
320 |
240 |
125 |
Galaxy Y |
3.2" |
480 |
320 |
180 |
Galaxy Mini 2 |
3.5" |
480 |
320 |
171 |
Galaxy Ace |
3.5" |
960 |
640 |
330 |
iPhone 4 |
3.8" |
800 |
480 |
246 |
Galaxy Ace II |
4" |
480 |
320 |
144 |
Sony Xperia miro |
4" |
800 |
480 |
233 |
Galaxy S III mini |
4" |
1136 |
640 |
326 |
iPhone 5 |
4.1" |
800 |
480 |
228 |
HTC Desire X |
4.3" |
800 |
480 |
217 |
Galaxy S II |
4.3" |
960 |
540 |
256 |
HTC One S |
4.3" |
1280 |
720 |
342 |
Xperia S |
4.5" |
1280 |
768 |
207 |
Lumia 920 |
4.7" |
1280 |
720 |
312 |
Galaxy Nexus |
4.7" |
1280 |
768 |
318 |
Nexus 4 |
4.8" |
1280 |
720 |
306 |
Galaxy S III |
5.3" |
1280 |
800 |
285 |
Galaxy Note |
5.55" |
1280 |
720 |
265 |
Galaxy Note II |
Как видно из таблицы 1.3 и таблицы 1.4 экранов с низким PPI совсем немного. PPI вовсе не зависит от разрешения например, что экран 9.7" 1024x768 имеет даже меньшее PPI, чем экран 7" 800x480.
Говорить о том, какой гаджет кому покупать не имеет смысла, потому что у всех разные предпочтения. Но интернет ресурс должен правильно отображаться на разных типах экранов.