Веб-дизайн тренди 2011
 
Між дизайном і розробкою існує тонка грань, яка, з переходом в нове десятиліття, стає все більш розмитою. Чи достатньо просто намалювати красивий макет в Фотошопі? Може бути п'ять років тому цього і було достатньо. У наші дні середньостатистичний користувач інтернету вимагає більшого. Весь блиск сайту з часом набридає, якщо в ньому немає ніякої суті. Якщо ваша єдина мета вразити дизайнерське співтовариство вашими яскравими роботами довго на плаву ви не протримаєтеся. 2011 характеризується не красою, а функціональністю. А тепер власне тренди нового року і найближчої декади: віртуальна реальність, постійний зв'язок та інтерактивний дизайн.
 
Як залишитися релевантним дизайнером в 2011? Головна мета дизайнера не засліпити, а заманити. Будь-який дизайнер може отримати «охи» й «ахи», які легко забуваються. Найкращий дизайнер здатний створити середовище, яке чарує і полонить користувача так, що він навіть і не думає про те, щоб шукати кнопку «назад». Кілька елементів зібрані воєдино, щоб створити прекрасний світ в якому є все: гармонія кольору, інтуїтивний дизайн, легко доступна інформація і швидкий відгук. Крім того, ніколи не можна недооцінювати силу простоти. Звичайно це завжди було так, але в 2011 ви не тільки під всепрощаючою егідою десктопів і лептов. Зараз ваш дизайн повинен справляючись з нетбуками, смартфонами і таблетками. Ви готові?
 
Погляньмо на ТОП 11 трендів в 2011 році.
 
1. Більше CSS3 і HTML5
 
Нарешті можна зітхнути з полегшенням! CSS3 і HTML5 були на горизонті веб-дизайну останні пару років, але зараз, в 2011, ми бачимо вибух цих технологій. Дизайнери починають йти від технології Flash. Ви і так знаєте, що вона не завжди працює добре, нові технології тепер доступні вашим постійним та потенційним відвідувачам. У 2011 ви відійдете від Flash і пізнаєте всю магію HTML5. Просто погляньте на приклади:
 
 
Тепер коли ви поглянули на приклади, зрозумійте, що Flash і HTML не рівні суперники. Є достатньо місця для обох в 2011 році. Проблема в тому що дизайнери в 2010 (і раніше) не правильно використали Flash. HTML5 знімає частину тієї відповідальності, яку ми поклали на плечі Flash, однак, HTML5 ще не може замінити окремі елементи дизайну, які ми можемо отримати тільки за допомогою Flash.
 
Можливо, ще більш захоплюючим є той факт, що CSS3 повною мірою доступна нам у цьому році. Заміняє Photoshop (ні-ні-ні, Adobe ще не пішов на спочинок), адже за допомогою CSS3 можна легко створити тінь для тексту або прозорості картинки. Якщо ви ще не почали, то саме час зануритися у вивчення CSS3 і HTML5.
 
2. Прості кольорові гами
 
Простота. Немає нічого настільки ж дієвого як просте повідомлення на спокійному фоні. Спокій може бути досягнуто кількома способами. Забудьте про чорне і білк, і навіть про відтінки сірого. Подумайте про зелений, жовтий або навіть червоний в якості основних. Втім, обмежте свою палітру двома або трьома кольорами. Працюйте з відтінками обраних вами кольорів для різноманітності. Адже чудово ж, коли всього кілька кольорів доносять ваші заспокійливі послання.Дивіться:
 
 
За допомогою відтінків зеленого була створена ця примочка для твіттера.Примітка: Цей сайт був створений з допомогою XHTML / CSS і Javascript.
 
 
Червоний може бути досить дратівливим, якщо використаний неправильно.
 
3. Mobile Ready
 
Смартфони, планшети, нетбуки, о Боже! Запаморочлива кількість мобільних гаджетів доступних покупцеві в 2011 році. Це означає що веб-дизайн повинен бути кросплатформним.
 
Щоб створити сайт, підготовлений для мобільних платформ не достатньо прибрати «свистілки» з дизайну. Через це дизайн може вийти порожнім і безликим. Хоча не виключено те, що якщо ви приберете частину фішок з дизайну ваш бренд не піддасться видимим ​​змінам. На щастя технології все більше допомагають нам, позбавляючи від цього тягаря.
 
Веб-дизайн для мобільних пристроїв зробив крок далеко вперед за допомогою CSS3. Одним з найбільш важливих досягнень є те, що ви можете спроектувати дизайн всього сайту і за допомогою засобів розробки підігнати його під пристрій користувача.
 
Дуже заманливо створити версію сайту для мобільної платформи, однак це більше не задовольняє сучасну аудиторію. Все частіше у мобільних версій є можливість відвідати оригінальний сайт. Якщо у вас немає такої опції або оригінальний сайт не оптимізований під мобільні пристрої ви не готові до 2011 року. «Синоптики» прогнозують що продажі смартфонів цього року перевищать продажі персональних комп'ютерів. Підготуйте ваш дизайн для задоволення потенційного попиту.
 
4. Параллакс скролінг
 
Параллакс скролінг призначений не тільки для олдсульних відеоігор. Як зазначалося раніше, один із трендів на 2011 рік - створення відчуття глибини. Що може бути зручніше для створення цього відчуття ніж паралакс скролінг? Він використовує шари для створення ілюзії тривимірного простору. Ефекту можна домогтися за допомогою простих CSS трюків або jQuery плагіна Spritely. Найефективніший варіант використання багаторівневого скролінгу як вторинного елемента дизайну. Наприклад, шапка, футер або фон. Зробивши його невід'ємною частиною навігації ви вкрай розчаруєте користувача.
 
 
5. Проектуйте для тач скрін, не для миші
 
Технології стали набагато більш відчутні. Юзабіліті перетворюється з абстрактного в щось відчутне. Тачскрін використовується планшетами, більшістю смартфонів і деякими десктопами. Пристосований чи ваш дизайн до управління пальцями?
 
Скільки з ваших робіт орієнтовані на мишу? Як дизайнери, ми використовуємо безпосередньо мишу. Коли ми наводимо на посилання вони підсвічуються (Примітка перекладача: «Якщо дизайнер не повний «дивак», то підсвічуються»). Як не дивно у тачскріна немає наведення як такого. Як ваш дизайн покаже користувачеві що це посилання? Що на рахунок випадаючих меню?
 
Як відвідувачеві ознайомитися з вашим сайтом? Досить спірний момент, однак для тачскрін-орієнтованого сайту горизонтальна прокрутка може виявитися куди більш зручною, ніж вертикальна. Ідеально вписується в цю нішу концепція журналу, де відвідувач фактично гортає сторінки вашого сайту.
 
І нарешті, розглянемо можливість використання плаваючого макету, як частини вашого інтерактивного дизайну. У 2011 ви вже не будете мати справу з розширенням екрану. Користувачі легко можуть змінити вид перегляду з вертикального на горизонтальний. Ваш дизайн повинен бути гнучким щоб задовольнити будь-які примхи.
 
6. Сприйняття глибини
 
Ні, я не кажу зараз про ефемерному «Я бачу твою чашку кави і клавіатуру». Суть глибини сприйняття - об'єм, та такий, що деякі елементи вашого сайту здаються ближче, ніж інші. Це створює відмінний 3D-ефект, коли зроблено вміло. Згадайте яке це дивитися 3D блокбастер «Аватар»? Предмети буквально вистрибують з екрану.
 
Хоча 3D технології ще толком і не дісталися до веб-дизайну, ви можете відтворити цей обсяг.
 
 
 
7. Великі фотобекграунди
 
Кількість великих фонів-тягучок зросте в 2011. Ці зображення будуть виского розширення і будуть покривати сайт цілком. Великі фото - легкий спосіб захопити аудиторію. Природно фонове фото повинне бути пов'язане з контентом.Розмістивши милу картинку, яка буде випадати з контексту, ви нашкодите юзабіліті.Тренди говорять нам про те, що кращим виходом будуть злегка прозорі образи, не кидають тіні на контент, гармонійно вписуючись в нього.
 
 
 
8. Цікаві доменні імена та їх використання
 
Це звичайно не найгостріше питання в веб-дизайні, проте дуже хочеться побачити по-більше оригінальних доменів. Колись бажане. Com втратило свою привабливість, в першу чергу тому, щоб знайти вільний домен потрібно придумати ще і свою мову, начебто клінгонською (баловство перекладача, в оригіналі - мова Na'Vi). У 2011 році ми зауважимо більш рідкісне використання домену. Com і прискорене використання таких химерних доменів як. Me і. Us. Задумайтесь про можливості і хапайте їх до того, як вони зникнуть.
 
 
9. QR: Quick Response
 
Якщо ви бачили ці квадратні штрих-коди з'явилися на журналах, візитних картка і ще багато де, ви знаєте що вони - гарячий тренд 2011 року. Як це перейде у веб-дизайн?
 
Ці штрих-коди називаються QR, коротко від Quick Response. Просто сфотографуйте унікальний штрих-код вашим телефоном, і як за помахом чарівної палички відкриється сайт, до якого цей штрих-код відноситься. Комфортність QR-кодів в тому, що є мільярди способів їх використання. Додайте його на сайті для того, щоб у відвідувачів було посилання на мобільну версію. Так само ви можете відслідковувати ваших відвідувачів через QR-коди, розміщуючи спеціальний рефералльний код в URL. Коли ви коментуєте статті на сайті, використовуйте QR-код в якості аватара.
 
 
2011 вельми «мобільний» і буде корисно використовувати цю відносно нову технічну фішку.
 
10. Превью (мініатюри)
 
Заповзятливі люди з Google представили звичайному користувачеві можливість перегляду пошукової видачі за допомогою превью. Пройшли ті дні, коли потрібно кликати по посиланню щоб побачити вміст сайту. Зараз потрібно просто натиснути на «лупу» або навести на посилання (це в тому випадку, якщо у вас не тачскрін).Перед вами магічним чином постає те, що знаходиться по ту сторону кліка.
 
Якщо ваш сайт використовує флеш, з превью виникнуть проблеми. Превью не відображатиме флешевих елементи дизайну.
 
Так як середньостатистичний користувач стає все більш і більш підкованим в серфінгу очікуйте, що в 2011 більше людей будуть використовувати мініатюри як засіб навігації. Адже так велика спокуса оцінити сайт за його мініатюрою.
 
 
11. Постійний зв'язок / Лайфстрімінг
 
Останнє, але не менш важливе, це постійний зв'язок. Інтернет за своєю суттю абсолютно стерильна середовище. Ми робимо його людяним, розповідаючи про наших життях у відкритій бесіді, чекаючи більше особистих подробиць. Характерною особливістю блогів і портфоліо в 2011 стане повна інтеграція з Twitter'ом (більше це не буде просто посиланням на сторінку в ньому), а люди все частіше будуть говорити вам де вони зараз за допомогою Foursquare.