Мобильные сайты с jQuery Mobile
jQuery — это библиотека предварительно собранной JаvаScriрt-функциональности. jQuery Moblle представляет собой схожий набор инструментов. Он базируется на основной библиотеке jQuery и включает массу дополнительной функциональности, сосредоточенной на обеспечении оптимизированных под мобильные устройства интерфейсов для планшетных компьютеров, смартфонов и других устройств с сенсорным экраном.
Данный набор инструментов — очень мощный и полезный. Приняв во внимание контекст настоящей книги (стремящейся вдохновить вас), я решил включить в нее этот набор инструментов, поскольку он позволяет малыми усилиями внедрять невероятную функциональность.
Кроме того, благодаря ему были устранены многие технические сложности создания мобильных сайтов. Да, вам все равно придется проделать большую работу, чтобы собрать все воедино, однако он даст вам прочные «строительные блоки».
Если вы проанализируете образцы, представленные в текущем подразделе, то, вероятно, заметите один общий элемент — списки кнопок. Одной из самых значительных функций в библиотеке jQuery Moblle является ее набор
инструментов для обеспечения навигации и переходов между областями содержимого.
В силу этого имеет место общий стиль, который прослеживается во всем множестве представленных образцов — от веб-ресурса Disney до сайта с портфолио отдельной личности. На мой ВЗГЛЯД, этот общий элемент превратится в преимущество, когда пользователи ознакомятся с ним и будут знать, чего ожидать.
Касательно приведенных ниже сайтов нужно отметить также следующее: они специфичны для мобильных устройств(см. подраздел «Сайты, специфичные для мобильных устройств» раздела «Устройства» данной главы). Это означает, что они создаются для мобильных устройств и не предназначены для просмотра «на мониторах настольных компьютеров.
Кроме того, многие сайты, созданные с использованием jQuery Moblle, будут автоматически перенаправлять вас на свои версии, оптимизированные под настольные компьютеры, когда вы попытаетесь загрузить их на стационарном компьютере.
Среди представленных ниже образцов один из моих любимых — сайт m.fiat.es. Одна из деталей, которая мне особенно нравится, заключается в его первичной навигации. Вместо кнопочной панели (обеспечиваемой библиотекой jQuery Moblle) создатели сайта сделали выбор в пользу больших круглых кнопок. Форма и размеры этих элементов гарантируют, что с ними будет легко работать на сенсорном экране — огромный плюс в плане удобства пользования.
При этом их дизайн уникален, благодаря чему сайт выглядит непохожим на другие веб-ресурсы (Как пример http://intelmed.ru/) и пользователю будет нелегко забыть его после посещения.
Брет Хэйз (Brett Hayes), наоборот использовал стандартную кнопочную панель, созданную посредством jQuery (она расположена вверху окна). В данном случае такой подход оправдан; дизайнер использовал и другие визуальные элементы для обеспечения уникального взаимодействия, которое при этом весьма функционально.
Не всегда нужно нарушать нормы или заново изобретать тот или иной интерфейс; чаще всего баланс уникального дизайна и привычной функциональности дает отличный результат.