Размер имеет значение: Балансировка Line Длина и размер шрифта В Адаптивный веб-дизайн

1-casual-reading-preview-opt

Как мы совершенствуем наши методы Адаптивный веб-дизайн, мы все больше ориентируется на measure (другого слова для “длины строки»), и его отношения к тому, как люди читают .

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

Читать далее

Как правильно спланировать мобильный веб-сайт электронной коммерции.

Магазин O’Neill Clothing получил почти 600% увеличение прибыли от выполнения адаптивных преобразований, а на Skinny Ties увидели 377,6% увеличение выручки, в основном благодаря пользователям iPhone, за счет введения адаптивных технологий. Даже транзакции Think Tank Photo на смартфонах и планшетах увеличились более чем на 96% … вот тебе на!

В этой статье мы рассмотрим все наиболее важные шаги при планировании высоко конвертируемого мобильного веб-сайта электронной коммерции. Ниже представлены наиболее важные вопросы, которые вы должны задать:

Читать далее

Как адаптировать ваше приложение к новым динамическим взаимодействиям iOS 7.

Angry Birds screenshot

Для того чтобы анимировать компоненты вашего iOS 7 приложения и сделать их похожими на реальные объекты, необязательно нужно усердно штудировать учебник физике. Благодаря появлению у iOS 7 нового Dynamics API (интерфейс прикладного программирования) в различных представлениях стала возможной реализация различных эффектов, например, симуляции упругих сил. Создается впечатление, что между двумя объектами как бы находится пружина и если их свести, а потом отпустить, то они отпрыгнут вверх относительно границ и относительно друг друга.

Физические движки довольно хорошо знакомы разработчикам компьютерных игр. Будь то идеальная параболическая траектория, вызванная гравитационным влиянием в Angry Birds или качающаяся конфета в Cut the Rope (Перережь веревку). В играх мы привыкли взаимодействовать с объектам, которые во многом напоминают реальные. Чтобы получить этот эффект разработчики компьютерных игр не пишут специальный код, в котором бы вручную выполнялась установка положения каждого объекта. Вместо этого они используют физический движок, который при симуляции воспринимает эти элементы в качестве тел, и который использует законы Ньютона для расчета траектории движения, учитывая временные показатели.

Читать далее

Четыре способа построения мобильного приложения, часть 4: платформа Appcelerator Titanium.

FasTip application on iOS.

В трех предыдущих статьях мы рассмотрели, как создать приложение-калькулятор для расчета чаевых на базе родной iOS платформы, родной Android платформы и PhoneGap. В этой статье мы рассмотрим еще один кросс-платформенный инструмент для разработки под названием Appcelerator Titanium.
Читать далее

Организация вложенного контента в адаптивном дизайне.

Video breaks the layout in a responsive website on iPhone

Некоторые HTML элементы не могут функционировать в адаптивных шаблонах. Одним из таких элементов является хорошо известный вам iframe, который многие из вас наверняка использовали при вставке контента с внешних источников, например, таких как YouTube.

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

Читать далее

Откажитесь от заезженных холстов: исследование потенциала шаблонов, анимированных в стиле off-canvas.

dragon-map-final

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

В этой статье мы поговорим о том, почему off-canvas модель стала настолько успешной в качестве навигационного шаблона, и покажем ее потенциал для получения ещё больших возможностей. Область использования данного шаблона простирается от фильтров на страницах с продуктовыми списками до корзин и перечней недавно просмотренных статей. Его потенциал напрямую зависит от нашего стремления создавать что-то новое и более современное. Настало время выяснить, как далеко мы можем зайти в использовании off canvas шаблонов.

Читать далее

Четыре способа построения мобильного приложения, часть 3: PhoneGap.

ios_android-550

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

Платформа PhoneGap от компании Adobe позволяет разработчику создать приложение, которое работает на различных мобильных устройствах. Разработчик решает эту задачу путем создания пользовательского интерфейса с применением таких веб-технологий, как HTML, CSS и JavaScript. Инструментальные средства разработки PhoneGap позволяют комплектно загружать HTML, CSS и JavaScript файлы в пакеты развертывания конкретных платформ. PhoneGap поддерживает широкий спектр платформ:

Читать далее

Использование преобразований в адаптивном веб-дизайне.

The data flow of a transform

Многие веб-разработчики по-прежнему скептически относятся к использованию преобразований в сфере адаптивного дизайна. Прошлым летом разработчики, ответственные за поддержку браузера Google Chrome, выдвинули предложение, которое осталось практически незамеченным технической прессой. В основе этого предложения лежит необходимость отказаться от поддержки, установленной для W3C (консорциум World-Wide Web) стандарта, который по-прежнему поддерживает каждый второй производитель браузеров. Что же это за стандарт, о котором пойдет речь? Расширяемый язык стилей служит для описания преобразований и также известен как XSLT (Extensible Stylesheet Language Transformations).

В ответ на эту новость, большинство веб-разработчиков, скорее всего, просто пожмет плечами и скажет: «Ну и что?» Это печально.

Читать далее

Как использовать данные и исследования для создания улучшенного мобильного интернета.

finding-the-right-job-opt

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

От вас также требуется умение основывать свои рекомендации на субъективных потребностях пользователей. Это умение особенно актуально в быстро развивающемся мире мобильных устройств, где клиенты, как правило, требуют от разработчика выполнения многих задач.

Читать далее

Четыре способа построения мобильного приложения, часть 2: платформа Android.

android-example

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

Ранее мы уже создали простой калькулятор для подсчета чаевых. Как и в случае с iOS приложением, мы будем использовать два экрана: основное окно и окно просмотра настроек. Окно настроек по умолчанию позволяет сохранить процентное значение в локальную память с помощью возможности поддержки набора инструментальных средств разработки программного обеспечения Android. (Исходный код для каждого приложения доступен на GitHub).

Читать далее