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

Характерные особенности дизайна сайта в стиле Apple

1. Строгая иерархия в композиции элементов. Основной приоритет – изображение продукта. Фотография высокого качества, четкая, крупная, размещается в центе страницы и окружается белым пространством. В лучших традициях минимализма.
2. Цветовая палитра, как правило, состоит из трех оттенков: черный, белый, серый. При этом, в отличие от плоского стиля, широко применяются градиенты, тени, способы передачи объема.
3. Характерные шрифты. Заголовки оформляются Adobe Myriad, обычный текст – Lucida Grande.
4. Контент. На главной странице сайта – минимум информации. Подробное описание вынесено на отдельные страницы. Отсутствует эффект перенасыщения. Пользователь сам выбирает информацию, которая его интересует.
5. Технические особенности. Apple-дизайн ориентирован на формат HTML 5, использование современных стандартов в дизайне. На официальном сайте Apple принципиально не используется Flash.

Для каких сайтов подходит?

• • Jumsoft http://www.jumsoft.com/money/
  • Versionsapp https://versionsapp.com/

Многие клиенты, описывая свои пожелания относительно будущего сайта, выражаются ёмко: «Хотим что-то в стиле Apple!». По их мнению, такой ответ должен дать исполнителю исчерпывающую информацию, сходу расставить все точки над «i» и исключить какую-либо неоднозначность. Но на деле всё, конечно, сложнее. Ведь впечатлить человека в стилистике Apple может что угодно — презентация нового планшета, простая белая коробка iPhone или сам сайт Apple. И ведь самое обидное, вполне вероятно, говоря «сделайте в стиле Apple», сам клиент попросту не знает, что это значит на самом деле. Как же быть несчастному исполнителю, который, возможно, просто не догадывается, чего от него в итоге ждут?

Попробуем разобраться!

Принцип Apple

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

«Ну, сэкономили на копирайтинге — мы же не тексты продаем, а телефон», — подумает большинство.

Но в том-то вся штука! С точки зрения Apple, опыт владения их продукцией появляется ещё до того, как вы выложили за какой-нибудь iPod свои кровные, а потому малозначительных элементов в этой цепи нет. Это не только технология, не только упаковка, но и реклама, и витрина, и веб-сайт, и тексты на сайте. Незначительных элементов здесь нет. А «упаковка сама по себе может рассказать целую историю». Соответственно, первое, что стоит уяснить о «стиле Apple» — это скрупулезное внимание ко всем участкам работы.

Второй важно особенностью продукции Apple является элегантная простота. Она у Apple играет очень важную роль.

«Почему мы считаем, что простота — это хорошо? Потому что когда мы имеем дело с предметами, нам важно чувствовать, что мы управляем ими».

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

Но всё, что я пока что описывал, касалось всё же продукции. А в нашем изначальном примере речь шла о создании веб-сайта. Как же применить эти подходы в веб-дизайне? Чтобы ответить на этот вопрос, давайте-ка взглянем на веб-сайт Apple и попытаемся понять, какие стилистические приёмы использованы в нём.

Подходы

Фотографии и иллюстрации

Первое, что бросается в глаза при посещении сайта Apple, — качественные фотографии продуктов. По правде говоря, я считаю, что эти фотографии берут на себя половину работы по вызову протяжного «Вау!» у посетителя. Все они крупные, яркие, выполнены в одном стиле и позволяют рассмотреть все детали.

Та самая магия фотографий. По словам некоторых — «обычный брусок со скругленными углами», но на таких фотографиях он вызывает восхищение.

Воздушность и чистота

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

Шрифты

На сайте Apple используется всего две гарнитуры Adobe Myriad для заголовков и стандартный шрифт системы MacOS X — Lucida Grande. Обе гарнитуры — строгие и современные рубленые шрифты, которые только поддерживают общий минималистичный стиль. Что характерно, стремление к высокому качеству присутствует и здесь — из-за желания, чтобы большие заголовки на сайте выглядели гарантированно красиво в любых условиях, Apple использует для надписей изображения, а не текст.

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

Скругленные углы

Также на сайте присутствуют знаменитые (куда уж без них!) скругленные углы. Они буквально повсюду! Чего греха таить — иногда кажется, что iPhone был придуман только для того, чтобы продолжить традицию использования скругленных уголков.

Скругленные уголки везде — в корпусе телефона, иконках приложений и даже на кнопке «Home».

Эффекты

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

Главное меню на сайте Apple. Дань уважения знаменитому стилю Aqua — после отставки Скотта Форстолла минимализм все больше преобладает на скеоморфизмом и карамельными эффектами.

Контент

Не меньше внимания Apple уделили и наполнению сайта, тексту и его подаче. Интересной особенностью можно посчитать отсутствие столь любимого многими раздела «О компании», потому что главными на этом сайте являются продукты.

Современные эффекты

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

И это все?

Очевидно, что такой подход нельзя использовать для всех сайтов без разбора. Ему самое место в презентационных или промосайтах. А самое главное — нельзя повторить стиль, руководствуясь лишь визуальными ориентирами. Сайт — это целостный, законченный продукт, каждый этап создания которого должен выполняться на высоком уровне, с любовью и идеей.

Недостаточная проработка всего лишь одного из этапов моментально разрушит хрупкую магию «стиля Apple».

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