Идеально! Как создать и переделать свой сайт. Правильный подход и передовые техники разработки - Элиот Стокс

Итак, теперь, когда мы знаем, что такое «неродной», давайте выясним обратное.

Рисунок 9.2. Веб-технологии могут быть «родными» для определенных операционных систем. Здесь вы видите лэптоп Samsung с системой Chrome OS, чьи первостатейные граждане – HTML, CSS и JavaScript и веб-приложения. Фото: промо-изображение Google

Родной как культура

Термин «родной» относится к технологиям, т. е. языкам и объектным структурам – всему тому, что формирует культуру, язык, условные обозначения и нормы платформы. Это базовый уровень абстракции. Он включает в себя базовые символы, жесты и взаимосвязи, применяемые пользователем для взаимодействия с приложениями на установленной платформе. Эти элементы крайне важны, потому что они составляют культуру и нормы платформы[105]. Это языки, как визуальные, так и поведенческие, которые пользователь изучает для взаимодействия при пользовании платформой. И наоборот, это также слова, фразы и концепты, которые приложения на установленной платформе применяют для взаимодействия с пользователями. Чем больше они используются и постоянны на установленной платформе, тем больше плюсов для создания приложений для нее.

Рисунок 9.3. «Руководство по интерфейсу» от Apple дает ясные инструкции, как должно выглядеть и вести себя приложение на платформе iOS. Это поможет определить культуру платформы

В конце спектра мы имеем платформу iOS от Apple с ее подробным «Руководством по интерфейсу»[106] и элегантным и единообразным фреймворком Cocoa Touch. «Родное» приложение от производителя, которое соответствует руководству, унаследует много от практичности базовых фреймворков и сразу же покажется знакомым пользователю, уже знающему другие приложения этой платформы.

На другой чаше весов мы имеем такие платформы, как Android. Они основательно переработаны производителями устройств, сотовыми операторами и пользователям из-за того, что существует маленькая совместимость (если она вообще есть) между различными телефонами Android и приложениями. Разработчикам «родных» приложений для таких платформ придется затратить больше усилий, чтобы обеспечить постоянный пользовательский опыт взаимодействия.

Рисунок 9.4. Swype-клавиатура на самом деле восхитительна. Просто скользите пальцем от буквы к букве, а она автоматически будет угадывать слово, которое вам нужно. К сожалению, такая система есть не во всех устройствах Android, а лишь в некоторых. У других клавиатура похожа на клавиатуру iPhone, и пользователи могут купить и использовать кучу других сторонних клавиатур. Огромный выбор поначалу может показаться плюсом, однако это значит, что нет единого пользовательского опыта системой Android. Фактически есть столько опыта пользования платформами Android, сколько существует различных версий Android, которые адаптируются производителями, сотовыми операторами и самими пользователями. Поэтому так трудно использовать общий язык дизайна, когда создаете приложения

Например, мое iPhone-приложение Feathers[107] имеет собственную клавиатуру, которую я сделал, чтобы вводить расширенные уникод символы. На iPhone она работает в точности, как встроенная программная клавиатураiPhone. Чтобы добиться этого, пришлось попотеть, но невозможное возможно. Если бы я переносил приложение на Android, мне пришлось бы вычислять, какую именно из кучи программных платформ установил пользователь, а потом адаптировать ее поведение для совместимости. Не факт, что это было бы вообще реально сделать, не говоря уже о том, что точно потребовалось бы больше усилий. Клавиатура Swype на телефонах Android, например, патентована. Поэтому на устройстве Android со Swype-клавиатурой я не смогу заставить свою вести себя точь-в-точь как системная.

Рисунок 9.5. Портирование Feathers на Android потребует создания различных версий пользовательской раскладки клавиатуры под различные типы клавиатур

Компромиссное решение – создать единую пользовательскую клавиатуру и использовать ее независимо от системной клавиатуры пользователя. Конечно, она не будет ни смотреться, ни ощущаться как основная клавиатура и поэтому не будет обеспечивать такое же удобство работы, как и в Feathers на iOS. Вместо этого пользователям приложения придется учиться управлять двумя разными видами клавиатур в приложении и напрягаться при переключении с одной на другую.

Рисунок 9.6. Веб-приложение Gmail обеспечивает постоянный опыт взаимодействия на всех платформах. Пользователям не нужно ничего устанавливать или беспокоиться о синхронизации своей почты на разных устройствах

Аналогично на платформах, в которых нет сильного и постоянного визуального языка и культуры, «неродные» приложения будут иметь меньше недостатков и даже смогут, как это ни парадоксально, обеспечивать больше удобства при использовании в некоторых ситуациях.

Великолепный пример «неродного» приложения, которое обеспечивает лучший опыт взаимодействия на определенных «родных» платформах, – это Gmail. Использование почтового клиента компьютера в операционной системе, такой как Windows, может потребовать от вас установки самого приложения, его обновления, хранения вашей почты, синхронизации в различных устройствах. Нужно будет проверять, нет ли в сообщениях вирусов и другого вредоносного ПО. Оцените простоту Gmail, когда вводите URL-адрес в браузер любого устройства – раз! – вот и ваша почта. Все! Все отлично!

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

Рисунок 9.7. Браузер – «родное» приложение операционной системы (ОС), работающий в ее контексте. Веб-приложение работает в контексте браузера. Веб-приложение так или иначе не является «родным» приложением ОС. Между ним и операционной системой одна степень разделения (браузер). Аналогично Flash-приложение работает в виртуальной машине, «сидит» поверх браузера и не является «родным» по отношению к нему.

Изображение: Розмари Воегтли / smashed.by/voegtli

Однако Интернет как платформа имеет мало фиксированных пользовательских опытов. Хотя веб-приложения пользуются общими свойствами, «Руководства по интерфейсу» для Сети нет (но наверно, должно бы быть[108]). Вместо этого, мы концентрируем свое внимание на документировании и продвижении хорошего кода и дизайн-практик, таких как прогрессивное улучшение. Различные браузеры по-разному реализуют управление основными элементами форм. Вот почему поведение веб-приложения отличается в различных браузерах, даже если у него такие же компоненты, разметка и код.

Гибридные приложения

Итак, у нас есть «родные» приложения, которые относятся к культуре платформы, на которой они работают. И у нас есть веб-приложения, которые работают в браузере. Но мы забыли о третьей категории, под которую подпадают многие современные приложения: гибридные приложения.

Рисунок 9.8. Гибридное приложение Facebook на iPhone

Мы должны понимать всю силу различных технологий и использовать их где возможно. Официально провозглашенные авторские технологии (главным образом HTML и CSS) прекрасно подходят для создания сложных документов, и придают им бесподобный стиль. Таким образом, многие дизайнеры «родных» приложений используют язык HTML и библиотеки CSS, когда им нужно отобразить разнообразный контент. Эти виды приложений носят название «гибридные приложения», потому что они являются смесью «родных» и сетевых технологий.

Приложение Facebook на iPhone является одним из примеров гибридного приложения, в котором определенные разделы (такие как новостные ленты) воспроизводятся с помощью веб-технологий.

Аналогично тому, что мы видели раньше, веб-приложения тоже могут быть гибридными. Сайт, написанный на HTML, CSS и JavaScript и использующий Flash для отображения богатого интерактивного контента, – пример гибридного приложения.

Многие приложения сегодня – гибриды. И если вы ас в HTML, CSS и JavaScript, могу сказать, вы не останетесь голодным независимо от того, какая платформа или платформы в конечном итоге станут популярными через годы.

Преодоление идеологических предрассудков

Гораздо чаще технологические и дизайнерские решения основываются не на желании выбрать лучшие средства и материал для работы, а на идеологии. К сожалению, почти повсеместно веб-стандарты поддерживают те, кто слепо предлагает платформы и «родные» авторские технологии для любого проекта, не учитывая нужды пользователей. Веб-специалисты – практики, которые без оглядки советуют Flash и «родные» iPhone– или iPad-приложения для любого проекта, тоже явление распространенное. На ум приходит старая поговорка «Против лома нет приема». Поэтому важно увидеть такие предрассудки и строить свои решения на нуждах ваших пользователей, а не на идеологии. Еще важно уметь распознавать идеологические взгляды так, чтобы направить дискуссию в область разработки.