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

Полезный веб-сайты предлагают огромный опыт пользователей, и большой опыт пользователя привести к довольных клиентов.Восторга и удовлетворения ваших посетителей, а не мешали и раздражать их, с умными решениями дизайна.Вот 9 проблемах юзабилити, веб-сайты обычно face, и некоторые рекомендуемые решения для каждой из them.

1.Крошечные интерактивными areas

Гиперссылки предназначены для нажатия, так, чтобы сделать их пригодными для использования, имеет смысл проверить, что they’ Re Легко click.Here’ S пример ссылки, которые слишком малы, кликая на них сложнее, чем она должна быть.Эти комментарии ссылки на Hacker News, социальные новости на сайте.(Активные области выделены красным цветом):

Here’ приведен пример одного и того же элемента интерфейса, комментарии ссылку, но на этот раз с гораздо большей активная область:

Newspond комментариев link.

Почему мы хотим большего активная область?Simple.Потому что наше движение руки с помощью мыши isn’ T очень точным. Большие активные области облегчает наведении курсора мыши на link.Чтобы гарантировать, что мы получаем большие активные области, мы могли либо сделать все ссылки больше или увеличить отступ вокруг ссылку с помощью CSS “ padding” собственность.Here’ Это код:

<a href="http://www.examplesite.com" style="padding: 5px;">Example Site<a>

CSS был размещен встроенный вместе с разметкой, чтобы сделать пример проще, но в реальной жизни you’ будете вероятно хотите добавить это стиль для вашего файла CSS, дав ссылку на класс или ID и ориентации его с that.

Вы можете прочитать больше о мягкой целей ссылка для лучшего мышью в 37signals статьи о мягкой ссылка targets.Согласно статье, обивка предоставляет пользователям “ ощущение комфорта.Это просто очень легко нажмите на ссылку.Он чувствует, как ссылки работают с вами, а не против you.”

2.Разбивка на страницы, используемые для неправильного purpose

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

FeedMyApp использует нумерацию страниц вПравильный путь: чтобы отобразить его обширный список приложений в удобоваримый chunks.

Но есть и другой способ, который используется разбиение на страницы в Интернете сегодня.Содержимое страниц, как и статьи блога, иногда разделены на несколько страниц.Для чего это делается?What’ с усилением?It’ маловероятно, что статья так долго, что требует разбиения на страницы, в большинстве случаев, он используется для увеличения странице views.Потому что многие блоги и журналы получают свои доходы за счет рекламы, становятся все более просмотров страниц (то есть отдельные загрузке страницы) повышает их статистику просмотра и позволяет им взимать больше за каждую ad.

Проводные статьи о Google’ S logo разделена на восемь страниц, что делает его очень трудно read.

Хотя это может показаться простой способ выжать больше денег из вашего объявления, оно представляет две основные проблемы.Первым является то, что it’ просто очень, очень раздражает.Необходимости загружать несколько страниц, чтобы просто прочитать одну статью isn’ T весело.You’ Re создание барьера для вашего visitors doesn__42, что | т должны быть there.

Вторая причина имеет отношение к SEO (Search Engine Optimization).Поисковые системы используют содержимое на странице, чтобы понять о чем идет речь, а затем индекс его соответствующим образом.Если содержание разделено на несколько страниц, он разбавляется, и так каждая страница имеет все меньше смысла на own __ и имеет 3 | менее ключевые слова о его topic.Это может негативно повлиять на рейтинг статьи в поисковой системе results.

3.Дубликат страницы titles

Названии каждой веб-страницы имеет важное значение.Страница названия фрагменты текста пишем между < title> tags В < head> раздел нашего HTML-кода.Иногда люди создают общее название во время работы над своим website’ с шаблоном — их website’ имя, например —, а затем повторно использовать тот же титул по всему сайту.Это неправильно, потому что это отнимает у каждой страницы несколько ключевых benefits.

Первое преимущество в том, что Хорошее название общается с посетителями много information о том, что страница.Люди могут быстро выяснить, если they’ повторно в нужное место или нет.Помните, что это название doesn’ т просто показать в верхней части окна браузера; it’ S также показаны на результатов поиска pages.Когда люди видят список результатов поисковой системы, как Google, они читают заголовок страницы, чтобы выяснить, что каждая страница.Это само по себе является достаточной причиной, чтобы потратить немного времени на оптимизацию вашей странице titles.

Вторая причина имеет отношение к SEO.ИскатьДвигатели нужна разная информация для ранжирования результатов конкретного запроса.Заголовок страницы является одним из наиболее важных частей информации они используют, чтобы оценить релевантность страницы к определенному поиск term.Это doesn’ означает, что вы должны загрузить как много ключевых слов, как возможно в названии —, что поражение первого пользу — но вы должны убедиться, что каждый заголовок кратко описывает содержание страницы, в том числе пару слов вы думаете, что люди будут искатьfor.

Here’ S пример хорошего титульного листа.Это Smashing Magazine название страницы, как показано на Safari:

Здесь у нас есть название статьи, категория статьи и названия сайта.Ввод названия сайта последнему ставит больше внимания на то, что сама страница является about, а не на сайт бренда, который по-прежнему существует.Here’ S Что HTML код выглядит в разметке:

<title>Vintage and Blues WordPress Themes | Freebies | Smashing Magazine</title>

И here’ ы, как страница отображается в результате поиска Google:

4.Материалы, которые трудно scan

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

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

Basecamp посадку page.

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

• Есть несколько точек фокусировки.Это часть вашей страницы, которые привлекают внимание посетителей.Это может быть достигнуто путем сильнее, выше контрастность цветов и больше fonts.Вы можете также использовать изображения, такие как иконки, рядом с text дать эти области еще более визуальной pull.
• Каждая точка фокусировки в идеале должны сопровождаться описательным заголовком.Не читая копию дальше, посетители должны быть в состоянии понять, что это немного контент о.Не делайте заголовки таинственного или расплывчатыми, чтобы привлечь людей дюйма Держите их информативным еще concise.Люди хотят получить информацию быстро, и удержание его только раздражает them.
• Любой другой текст должен быть коротким и легко усваивается.Обеспечить только предметы первой необходимости, и отбросить остальные.В большинстве случаев, дополнительный текст, что копия писатели положить, чтобы сделать точку менее двусмысленным только добавляет мертвым грузом.Люди будут читать укуса размера кусков текста, но откладывать на долгое пунктов. Вырезать копию вниз, пока не жир остается cut.

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

Things app’ с особенностями странице распадается каждая функция в маленьких укуса размера сегментов, каждый из которых имеет собственную иконку и заголовок.Это делает список легко сканировать.Для того, чтобы скопировать еще более эффективным, перечислить реальные выгоды, а не функция names.

5.Ни в коем случае, чтобы получить в touch

Пользователь сотрудничество является важным, если вы хотите построить успешную сообщества и сообщества важно, если вы хотите построить успешный веб-сайтов и веб-приложений социальных. Пользователь участие также важно, если вы хотите построить лояльные customers.Быстро ответив people’ с вопросами и фиксации их проблемы doesn’ т просто означает, что у вас есть хорошее обслуживание клиентов — это означает, что вы care, и ваши клиенты и посетители по достоинству оценят it.

Но многие сайты все еще don’ т дать посетителям легко канала в контакте с компанией.Некоторые веб-сайты don’ даже не имеют адреса электронной почты или контактную форму на them.

При нажатии на контакт ссылкой на официальных Coca-Cola сайт.you’ повторно представлена ​​с этой страницы.Нет электронной почте, ни номера телефона.Большинство ссылок ведут на автоматизированных часто задаваемые вопросы; форму обратной связи требует ваш адрес и возраст и имеет 500-символов; “ Отправить idea” Форма состоит из двух страни� …

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров