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

Узнайте Как Серьезный...

Правило #1: Не показывайте Горизонтальный участок меню.

Существенное Число мышей не имеет горизонтального колеса мыши. Это делает неуклюжим, чтобы завиться левый или правый, когда содержание веб-страницы простирается мимо сторон браузера. Может быть раздражающе должны сбить курсор мыши к основанию окна и тянуть участок меню свитка только, чтобы видеть слово или два, который находится вне видимой области страницы. Это сказало, вот - некоторые хорошо-редизайнируемые{-предназначенные} сайты, которые помещали участок меню свитка, чтобы работать эффективными способами. Использует JavaScript, чтобы изменить направление свитка колеса мыши от вертикального до горизонтального. Гуру избегает неприятностей с горизонтальным завиванием. Тартелин использует горизонтальный участок меню свитка, чтобы заставить его художественные работы быть похожими, что это находится в художественной галерее. Хотя вертикальное колесо мыши не функционирует как это, делает в примерах выше, работы эффекта удивительно хорошо. Вы могли даже утверждать, что эффект уменьшился бы, если бы колесо мыши было повторно закодировано, чтобы завиться горизонтально.

Графическая Терапия

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

Правило #2: Используйте Минимальное Число шрифтов

Слишком много шрифтов обычно находятся в противоречии друг с другом и сокрушают зрителя. Каждый шрифт имеет индивидуальность, и слишком много могут создать расстройство. Чтобы эффективно использовать больше чем только несколько шрифтов, редизайн должен очень ориентироваться на текст, и остальная часть редизайна должна быть относительно тихой. Вот - некоторые примеры сайтов, которые используют этот смысл конфликта и расстройства, чтобы нанять пользователя. Связи LA используют много шрифтов в нелинейном макете, чтобы создать ощущение энергии. Страница трудна читать быстро, но привлекает пользователя в. Это также стоит отмечать, что ни один из шрифтов не чрезмерно декоративен; каждое слово является четким, держа редизайн, свежий и чистый. Используя разнообразие шрифтов обычно передает ощущение энергии и хаоса, но сайт Студии редизайна Элементов Geo очень открыт и чист. Каждому шрифту дают его собственное место так, чтобы зритель не связал это с другим шрифтом. Изображение неба на заднем плане помогает укреплять смысл открытости. В отличие от последнего примера, подталкивает его различные шрифты близко друг к другу. редизайн работает, потому что только один шрифт не выглядит нарисованным рукой, и другие две работы хорошо с иллюстрацией. нарисованные рукой шрифты обычно работают хорошо вместе, даже когда есть много различных лиц шрифта. Название эмблемы находится в одном шрифте, и этих двух подзаголовках, каждый имеет их собственный шрифт, но зритель естественно собирает в группу эти три пункта текста.
Правило #3: Не используйте Слишком много Цветов

Опасение относительно движения слишком далеко с редизайном состоит в том то, что отделяет профессионалов от новобранцев и новобранцев от забывающего. Забывающая попытка сделать их редизайны, настолько чрезвычайные насколько возможно. Новобранцы хотят держать их редизайны тонкими и легкими на глазу, но в конце их редизайны могут иногда выглядеть безжизненными. Следующие приятные глазом редизайны - некоторыми истинными профессионалами, которые выдвигают границы. Красиво цветной редизайн Матового похож на живопись акварели (сайт был обновлен, так как{с тех пор как} эта статья была написана. Все цвета на заднем плане захватили бы чье - то внимание. Вообще, хорошие редизайны с тонной цветов будут иметь эти цвета на заднем плане, с более простой палитрой фронт. Редизайн имеет красочный вертикальный градиент на заднем плане, который заставляет редизайн казаться красочным повсюду. Этот сайт имеет яркую гвоздику как ее цвет связи, который является большим выбором для редизайнеров, которые хотят создать красочный эффект.

Правило #4: Сделайте Цель Вашего сайта Очевидной

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

Используя "всплеск" экран - хороший способ замедлиться, мысль пользователя обрабатывают и вдохновляют их рыть глубже. Цель страницы "всплеска" состоит в том, чтобы обычно объяснять сайт быстро с фотографиями или коротким битом текста. Но в случае его цель состоит в том, чтобы вызвать чувство. Большое небо и обрызганный эффект текста делают большую работу при вызывании любопытства, потому что эти вещи обычно не появляются вместе. Этот сайт также делает большую работу при продолжении эмоции, созданной страницей всплеска в фактическое содержание. Завивающееся стороной движение и оживляемые линии, которые следуют за пользователем, действительно эффективны.

Большой способ обойти языковой барьер состоит в том, чтобы не использовать никаких слов. Галерея CSS, и люди, которые видели, что галерея CSS прежде вероятно признает это как один сразу же. Те, кто не имеет, могут быть заинтригованы достаточно, чтобы дать несколько из щелчка ногтей большого пальца руки в надежде на выяснение образца. Маленькое количество текста у основания страницы помогает с сортировкой и лишнее.

Правило #5: Навигация Должна Быть Легкой фигурировать

Навигация не должна быть узким местом сайта. Пользователи должны быть в состоянии найти то, что они хотят быстро. Иногда, тем не менее, необладающий интуицией все же привлекательная навигация может помочь пользовательскому чувству, связанному с сайтом и что это продвигает. Как упомянуто в предыдущей секции, впечатление секретности передано, когда портфель не обстоятельно объясняет себя. Дело обстоит так в портфеле фотографии. Сначала прибывая в сайт, пользователь немедленно не признает слова, которые они видят как связи. Эта неуверенность должна побудить их тыкать вокруг немного. Перемещение мыши по слову показывает, что это - действительно связь, и после щелчка этим, великолепная фотография загружает. Фотография соблазнит пользователей, чтобы продолжить рассматривать. Чтобы видеть больше фотографий, пользователи должны щелкнуть "Обратной" кнопкой на их браузере (кое-что, что большинство людей понимает, чтобы сделать), и затем щелкните другой связью. В редизайне нет никакого холдинга руки, и это работает чрезвычайно хорошо. Это не традиционно “великолепный редизайн сайта,”, но это поставляет точно, к чему это нуждается. Навигация Казуло не ужасно трудно выяснить, но средний пользователь, возможно, не знает, точно что сделать после прибытия в сайт. После первого щелчка, тем не менее, все становится очевидным. Пользователь проводит части портфеля в 3-ьем стиле, и последние кажутся самыми близкими к началу. Используя мышь колесо - даже больше забавы. Если клиент должен был попросить, чтобы редизайнер сделал их сайт в 3-ьем, как видеоигра стрелка первого человека, большинство редизайнеров будет тихо смеяться к себе, глубоко вздыхать, и затем медленно объяснять, почему это было бы плохой идеей. В то время как долгое время погрузки и бедная оптимизация поисковой машины делают это меньше чем идеал для большинства редизайнов, это определенно стоит долгое размышление.

Правило #6: Используйте различные Цвета для Текста и Фона

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

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

Штифтик редизайн подобен Линксису из-за синего текста на синем фоне. Синий на синем трудно осуществить приятно, особенно с очень многим другим блюзом всюду по сайту. Пока в этой секции мы видели только синие сайты, потому что синий текст является самым твердым для человеческого глаза читать, и таким образом четкий синий тип всегда внушителен. Если эффект текста будет работать в синем, то это будет наиболее вероятно работать в любом цвете. Художник В редизайне не только имеет зеленый текст на зеленом второстепенном и желтом/бежевом тексте на желтом фоне, но имеет текст непосредственно на вершине фотографии. В то время как некоторые индивидуальные письма могут быть трудно читать, слова в целом остаются четкими. Этот тип эффекта должен почти всегда быть стадией центра в редизайне. Белла использует другой 3-ий эффект. В этом случае, письма, кажется, высовываются, а не вдавленный внутрь. Без этого эффекта, была бы очень уменьшена четкость.

Правило #7: Не помещайте Мультипликацию в Путь Вашего Содержания

Серьезно, не выскочите немного права объявлений эффектов, где пользователь читает. То же самое идет для тех коробок обзора, которые обнаруживаются всякий раз, когда пользователь находится в середине предложения. Пользователи не любят быть отвлеченными, когда они на полпути заканчивают предложение.

Правило #8: Придерживайтесь Безопасных сетью Шрифтов

На сайте Disenorama, красный текст “Recientemente” является выбираемым. Одна нижняя сторона - то, что, если сайт не загружает немедленно, пользователь будет видеть оригинальный простой шрифт кратко.

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

Правило #9: Не имейте Страницы "Всплеска"/"Приземления"

Много редизайнеров имели то то же самое старое обсуждение с их клиентами о том, почему страница всплеска не хорошая идея. Google имеет тенденцию оценивать такие страницы ниже, и они замедляют пользователя от получения содержания, что они являются после. Но они могут быть невероятно красивыми и вдохновляющими если сделанное право. После каждого посещения, загружена случайная фотография от портфеля. Нажатие на фотографию сокращает это и помещает это в ее место среди других частей портфеля на сайте. Эффект вычисления и движения обеспечивает продолжение и помогает переносить эмоцию пользователя на остальную часть работы компании. Когда сайт полностью сделан во "Вспышке", участок меню погрузки может служить страницей всплеска. Когда пользователь видит участок меню погрузки, они или закроют страницу и пойдут где-то в другом месте или переключат к другому счету и рассмотрят в другом месте, в то время как они ждут. Насколько редизайны со таблицами идут, это - один из лучших. С двумя таблицами, показанными в этой мультипликации эффектов, редизайн уделяет им большое внимание. Этот сайт должен быть в списке каждого редизайнера больших редизайнов теми таблицами использования. Нарушение правил хорошо, когда редизайн призывает к этому. Многие из выборов редизайна , рассмотренных здесь не рассмотрел бы средний редизайнер. Это - то, что отделяет больших редизайнеров от средних. Достаточно храбрые, чтобы пойти против того, что им преподавали всегда, выделяются. Вы нарушаете{ломаете} какие-нибудь правила в ваших редизайна сайта? Почему или почему нет? Пожалуйста разделите ваши взгляды с нами … Является ли это вашим портфелем, blog, маркетинговым сайтом, или собранием игр, все мы хотим привлечь посетителей нашего сайта и гарантировать, что они имеют приятный опыт. Удобство и простота использования измеряет уровень опыта пользователя и может быть характеризовано тем, как легко данная задача может быть закончена; сделано ли это с предшествующим знанием, или при наличии пользователя изучают новый способ взаимодействовать.  “Удобство и простота использования - качественный признак, который оценивает, как легкие пользовательские интерфейсы должны использовать. Слово "удобство и простота использования" также обращается к методам для того, чтобы улучшиться простой в употреблении в течение процесса редизайна . ” В этой статье я надеюсь дать Вам, некоторая форма контрольного списка удобства и простоты использования, покрывая темы от формы намеревается к простым навигационным подсказкам, что Вы можете обратиться к любому Web-редизайну.

1. Создание (редизайн) активной навигации

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

2. Кликабельность маркирует и кнопки

Когда Вы не торопитесь, чтобы повысить форму должным образом, пользователь может щелкнуть ярлыком, чтобы активизировать связанный элемент формы и есть действительно легкий способ представить в выгодном цвете это. Это - большая часть функциональных возможностей, встроенных прямо в HTML. К сожалению, очень немного пользователей знают об этом естественном драгоценном камне пользовательского интерфейса. Разрешение пользователю знать ярлык - кликабельнсть, только проводит линию или два из CSS (в зависимости от того, как Вы пишете это), изменяться, курсор от текста по умолчанию вставляют к большему количеству кликабельнсть и дружественному указателю. К настоящему времени всеобщий хорошо знающий, которые подчиняются, кнопки - кликабельнсть. Я всегда думал, что было сверхъестественным, что это - очевидно кликабельнсть - элемент не использует тот же самый курсор как связь. Таким образом я люблю применять этот бит CSS к кнопкам также:

3. Соединение вашей эмблемы

Не связывая эмблему с домашней страницей вашего сайта - одна из более расстраивающих{более печальных} вещей, на которые я натолкнулся на сайта. Я не могу понять, почему кто - то не так это. Это настолько легко, и к настоящему времени, безопасно сказать, пользователи ожидают это. Соединение вашей эмблемы настолько обычно в настоящее время, что много сайтов находят, что маркировка связи "Домой" не полезна больше, поскольку пользователи только щелкают эмблемой, чтобы провести к домашней странице.

4. Увеличение области хита на связи

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

5. Добавление центра, чтобы сформировать области

Применение центра к области формы - растущая тенденция в редизайне UI. Это позволяет пользователю знать, что то, что они только сделали, заставило кое-что случаться (который имел смысл?). Это - быстрый и легкий способ передать полезную, скромную информацию на пользователя. Высказывание кое-чего как: “Эй! Вы только щелкнули здесь.” Может быть очень полезным.

6. Обеспечение 404 страниц

Создание (редизайн)пользовательского удобного чувства очень важно и показывает, большое апачское ошибочное сообщение на экране не лучший способ достигнуть этого. Полезные 404 страницы могут пойти длинный путь, и это не должно содержать номера “4 ? или “0 ?, поскольку они не очень полезны для любого кроме разработчика. Помимо этого, никто действительно не должен знать ошибочный код для чего - нибудь, что случается негласно. Пользователи только хотят, чтобы сайт работал способ, к которому они ожидают это. На всякий случай пользователь находит на “Странице не найденным”, намного более полезно вести их куда-нибудь, где они могли бы быть в состоянии определить местонахождение информации, они смотрят для, обеспечивая некоторый примирительный текст, коробку поиска, или предлагают некоторое возможное предназначение. Но попытка не возлагать вину на пользователя для того, чтобы приземляться на неправильном URL. Блогушен написал большую статью о создании информативных 404 страниц, который перечисляет{вносит в список} некоторые очень хорошие Подсказки и даже некоторый код для тех пользователей WordPress среди нас.

7. Используя язык, чтобы создать случайную окружающую среду

Письмо на сайта - большая тема прямо сейчас. Это походит, мы спускаемся по некоторому гигантскому контрольному списку, имеющему дело с проблемами: HTML, CSS, прогрессивное повышение, доступность, пишущая для сайта, и всего затрагивания “стандарты сайта”. Мы слышим много о письме на сайта, и это, кажется, продолжает изменяться. Со дней Стива Круга, говорящего нам сокращать наше содержание в половине к использованию маркированных списков везде, где возможно. Теперь мы, как все предполагают, напишем как, мы говорим с другом, и все это возвращается к тому, чтобы заставлять пользователя чувствовать, что они находятся в удобной окружающей среде. Когда Вы держите копию на вашем сайте случайной, это делает пользовательское чувство менее подчеркнутым, так, даже когда они действительно сталкиваются кое с чем запутывающим, они могут все еще чувствовать ощущение расслабления и непринужденности, поскольку они ищут их ответ.

8. Высоты линии для удобочитаемости

Высота линии - одна из вещей, которые могут быть непосредственно унаследованы от физических СМИ, типа книг и газет. Эти источники были вокруг в течение сотен лет и имели большое количество времени, чтобы справиться с удобочитаемостью и высотой линии. Так следующий раз Вы застреваете на этом, не бойтесь взламывать учебник и проверять это. Это - аспект редизайна сайта, который может легко пропуститься и легко злоупотреблен. Я обычно начинаюсь с высотой линии приблизительно 1.4em и регулирую{приспосабливаю} это оттуда, основанный на редизайне и содержании.

9. Использование белого места к элементам группы

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

10. Быть доступным

Доступность, в этом случае, означает быть там для ваших пользователей, когда они имеют проблему (живой отклик). Говоря о доступности, много неплатежей людей к беседе о со слабым зрением, но доступности простираются далеко вне этого. Например, Вы должны сделать ваш сайт доступным для пользователей с ограничениями полосы пропускания (связи наборного диска{солнечных часов} наверх, Обслуживание или редизайн ячейки, медленные сети) и старшие браузеры (некоторые компании не будут позволять служащим модернизировать браузеры). Редизайнеры и разработчики часто, кажется, приезжают от различных планет и имеют полностью различные умственные способности. Разработчики хотят, чтобы сайт работал право, редизайнери хотят, чтобы это выглядело правильное. В то время как эти цели имеют много наложения (и, конечно, я - стереотипирование здесь немного), различия часто сводятся к редизайнеру и ожиданиям разработчика успеха. Руководящие ожидания - вопрос коммуникации: Создание (редизайн) пунктов ясно к другой стороне, обнаружение точек соприкосновения, и достижения соглашения о целях. Хорошо, так возможно не то, чтобы легкий, но это важно для обеих сторон по крайней мере пробовать понять друг друга. Чтобы продвинуть доброжелательность между редизайнерами и разработчиками, я разделю некоторые любимые обиды, я столкнулся и исследую проблемы, которые приводят к ним и их решениям.

Узнайте Как Серьезный...

Ошибка #1: “Почему разработчик не может только заставить это быть похожий на аккомпанемент?”

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

Проблема

Аккомпанементы не Веб-страницы; они не смесь HTML, CSS, и кода JavaScript. Фотомагазин, Фейерверк, и Иллюстратор могут сделать много вещей, которые являются невозможными (или по крайней мере дико непрактичными) на сайта, которая часто означает, что разработчики должны будут сократить редизайн.

Решение

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

Ошибка #2: “Цвета все неправильны!”

Вы не выбираете цвета произвольно, но разработчики, кажется, думают, что “близко является достаточно близким.”

проблема

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

Решение

Если Вы хотите, чтобы цвета были правы, то обстоятельно объясните все цветные ценности на странице. Не положитесь на вашего разработчика к глазному яблоку цветные ценности или к образцу цвета в Фотомагазине.

Вы также должны полагать, что проблема, возможно, не с разработчиком, но с Вами. Цвета выглядят отличными на Макинтоше и в CMYK (если Вы, случается, случайно позволяете то цветное место). Удостоверьтесь, что ваш способ цвета документа и доказательства собираются родовой RGB по умолчанию.

Ошибка #3: “разработчики даже знают то, что ‘означает белое место’?”

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

проблема

Я когда-то жаловался разработчику, что он не оставил никакого места между границей модуля и его содержания, делая это действительно трудным для большинства людей читать. Он ответил, “я не забочусь о других людях. Я могу прочитать это.” В то время как большинство разработчиков не совсем настолько черство, они не обучались в прекрасном искусстве смешивания положительных и отрицательных мест, чтобы вести глаз посетителя вокруг редизайна .

Решение

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

По крайней мере, определите общие правила для краев и дополнения. Например, “Все модули должны иметь минимум 10 пикселов дополнения между содержанием и границей.”

Ошибка #4: “разработчик никогда не может заставлять мои редизайны выглядеть одинаково в различных браузерах.”

Вы смотрите на сайт в Firefox, и это выглядит прекрасным, но когда Вы переключаете к Internet Explorer, это падает к частям.

проблема

Вы должны быть сочувствующими тяжелому положению разработчиков, когда это прибывает в то, чтобы заставлять редизайны выглядеть последовательным поперек браузеров. Каждый браузер имеет его собственные причуды с интервалом. Вещи - улучшение (особенно с медленной смертью Internet Explorer 6), но то, чтобы заставлять их всех полностью играть хороший друг с другом все еще твердо.

Решение

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

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

Ошибка #5: “Это возьмет как долго?”

Ничто не является более угнетающим чем горение полуночной масла на ускоренном марше, чтобы получить вашу часть редизайна , сделанного в графике, только возвратить развитие LOE (Уровень Усилия), который помещает редизайнный выпуск, датируются месяц с конца вечности.

проблема

В классическом эпизоде Похода Звезды: Следующее поколение, Скоттай объясняет факты технической жизни Жорди Ла Форж: “Вы не говорили ему [Капитан Пикард], как долго будет действительно требоваться, не так ли? о, малец. Вы имеете много, чтобы учиться, хотите ли Вы, чтобы люди думали о Вас как рабочий чуда.” Некоторые разработчики думают о редизайнерах таким же образом, что Скоттай думает о Капитанах Starfleet.

Испытание удобства и простоты использования вашего сайта - одна из самых шикарных вещей, которые Вы можете сделать. Удобство и простота использования вовлекает Создание (редизайн)интерфейса сайта, легче использовать и более простой понять, так, чтобы опыт пользователя был настолько приятен насколько возможно. Чем более годный к употреблению сайт, тем больше удовлетворения этого должно будет взаимодействовать с этим - и счастливые посетители переводят на счастливых клиентов. Идеи о том, что делает для лучшего редизайна сайта, не всегда переводят совершенно когда осуществлено. Элементы, которые один человек мог бы счесть удобным, может фактически оказаться, запутывающие для кого - то еще. В этой статье, мы рассмотрим 10 инструментов, которые Вы можете использовать, чтобы улучшить удобство и простоту использования вашего сайта, даже если Вы находитесь на низком бюджете. [Нашей эры] Как редизайнери и разработчики, мы имеем естественный уклон к пути наша собственная функция продуктов: мы строили их, таким образом мы знаем точно, как они работают. Наши посетители, однако, не имеют преимущество. Это означает, что испытание на удобство и простоту использования - единственный надежный способ узнать, как хорошо сайт работает. Испытание удобства и простоты использования позволяет Вам обнаруживать много путей, которыми может быть улучшен ваш сайт.

Сколько испытания я должен сделать?

Испытание удобства и простоты использования может казаться укрощением, но в действительности, маленькие инвестиции могут привести к большой прибыли. Джекоб Нилсен, один из самых известных гуру удобства и простоты использования, говорит: “Лучшие результаты прибывают от испытания не больше, чем 5 пользователей и управление так много маленьких испытаний, как Вы можете позволить себе.” Число пользователей против найденных проблем Удобства и простоты использования

Правильно. Только 5 пользователей обеспечат достаточно многие результаты помочь Вам делать эффективные обновления к вашему сайту. В то время как Вы могли проверить с 15 пользователями, чтобы найти больше всего, или все области проблемы на вашем сайте, проверяющем только с 5 раскроют 85 % проблем, которые дают Вам большинство ценности за ваши деньги. Другие горячие точки могут быть идентифицированы, проверяя последующий раунд пользователей, и с каждым дополнительным тестом, Число раскрытых проблем уменьшится. Важно отметить, что самый первый тест удобства и простоты использования предлагает самое большое понимание. Даже маленькое количество испытания может привести к существенным результатам и показать большие проблемы и области проблемы вначале. Это означает, что Вы не должны провести много времени или деньги, чтобы извлечь выгоду из испытания удобства и простоты использования. На напряженном бюджете? Испытание удобства и простоты использования походит на хорошую идею, но Вы вероятно задаетесь вопросом, существуют ли какие-нибудь возможные варианты. Ответ - да. Большое количество свободных или дешевых инструментов и услуг доступно, чтобы помочь Вам проверять и оптимизировать ваш сайт. Вот - наш выбор некоторых из лучших и самых возможных вариантов начать с. Пять Вторых испытаний. Пять Вторых испытаний - свободное Обслуживание или редизайн испытания удобства и простоты использования, которое предлагает три различных способа проверить: "Классик", "Сравнитесь", и "Чувство". Классические испытательные показы и затем скрывают скриншот вашей страницы и просят, чтобы пользователи вспомнили элементы, которые они помнят. Сравнивающийся тест показывает два скриншота и спрашивает пользователей, которых они предпочитают. тест Чувства показывает одну страницу и просит, чтобы пользователи выбрали их фаворита и наименьшее количество любимых элементов. Поскольку Вы можете вероятно предположить с названия, испытатели имеют только 5 секунд, чтобы обеспечить обратную связь после наблюдения вопроса. Кроме того, каждый тест может быть отмечен как общественный или только для приглашения, который является полезным, если Вы должны ограничить подвергание.

4. UserTesting

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

5. ClickTale

Подобный Userfly, ClickTale захватывает действия посетителей вашего сайта, включая щелчки, завивание, и нажатия клавиши. Другие предлагаемые особенности включают завивающуюся карту высокой температуры, аналитику формы, и индивидуальный анализ связи (например, сколько щелчков или парений действительно каждый связывалось, добираются?). ClickTale имеет свободный план, который делает запись представлений на 400 страниц в месяц для одной области. Некоторые из особенностей в свободном плане ограничены; например, завивающаяся карта высокой температуры доступна только для вашей самой популярной страницы.

6.Сайт Google оптимизация

Хороший способ улучшать работу вашего сайта состоит в том, чтобы сделать A/B, проверяющий (также известный как раздроблено испытание). Это означает управлять двумя различными версиями специфической страницы одновременно для различных пользователей и делать запись, как хорошо каждый преобразовывает. Более передовую версию этого теста называют многомерным испытанием, в котором множество переменных проверены, чтобы обнаружить лучшую комбинацию. Google предлагает инструмент, чтобы сделать точно это: сайт Google оптимизация. Все, что Вы должны сделать, - обеспечивают различные довольные элементы (например, различные заголовки или картины продукта) и сайт Google, оптимизация будет служить случайным комбинациям их вашим посетителям, отслеживая, как хорошо каждая комбинация преобразовывает. Лучший из всех, сайт Google оптимизация свободен использовать.

7. ClickHeat

ClickHeat - интересный небольшой инструмент, который производит карты высокой температуры всех щелчков, сделанных на вашем сайте. Вы вероятно видели карты высокой температуры, произведенные отслеживающими глаз исследованиями: это - то же самое понятие{концепция}, но для того, чтобы отследить щелчки вместо этого. Обслуживание или редизайн свободно, но должно быть загружено и установлено на сервере, и таким образом это имеет несколько требований, типа поддержки PHP.

8. Черта мелом

Черта мелом - удобство и простота использования, проверяющее приложение, в настоящее время предлагаемое как свободная бета. Черта мелом позволяет Вам настраивать ряд испытаний; например, пользователю можно было бы показать вашу страницу приземления и просился выполнять задачу, типа находят подписывающуюся страницу. Местоположение (я), на которое пользователь нажимает, отслежено. Эти испытания, для которых предназначаются, позволяют Вам узнавать, как легкие определенные задачи на вашем сайте состоят в том, чтобы выполнить и ясны ли навигация и информация, которую Вы обеспечиваете. Используя Черту мелом свободно, Вы будете все еще должны найти, что люди выполняют испытания. Однако, потому что они онлайн, испытания могут быть закончены очень быстро, и так пополнение пользователей должно быть намного легче чем в традиционном пользовательском испытании.

9. Простое Прослеживание Мыши

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

10. Silverback

Если Вы используете Макинтош, то есть большое удобство и простота использования, проверяющее применение по имени Silverback, который был создан известной консалтинговой фирмой редизайна Clearleft. Это пригодилось для того, чтобы провести лично пользовательское испытание. Вместо того, чтобы иметь необходимость настраивать связку камер и делать запись оборудования, Вы просто должны иметь Макинтош с iSight камерой. Как в традиционном пользовательском испытании, Вы сидите с пользователем перед компьютером и просите, чтобы они выполнили определенные задачи, все, в то время как они говорят их мысли громко. Silverback делает запись видео их и того, что случается на экране. Приложение также имеет немного полезных берущих примечание функциональных возможностей и позволяет Вам устанавливать маркеры главы (использующий отдаленное ), когда кое-что интересное происходит в течение сессии.

Эмблема - лицо любой марки - самого первого впечатления - таким образом его редизайн чрезвычайно важен. Когда выполнено правильно, эмблема - мощный актив к марке вашего клиента. Однако, Создание (редизайн) эффективного визуального представления марки требует намного больше чем только графический редизайн. Как любая линия работы, которая вовлекает ряд определенных навыков, редизайн эмблемы требует, чтобы большое количество практики и опыта для этого было успешным; знание - определенно власть для любого графического редизайнера.

Поэтому мы выделили 12 существенных правил следовать, чтобы редизайнировать эффективную эмблему.

1. Предварительная Работа - необходимость

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

2. Создать Баланс

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

3. Дела Размера

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

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

4. Умное Использование Цвета

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

* Использование красит друг близко к другу на цветном колесе (например для "теплой" палитры, использование красные, оранжевые{апельсиновые}, и желтые оттенки).

* Не использовать цвета, которые являются настолько яркими, что они плохо обращаются с глазами.

* Эмблема должна также выглядеть хорошей в письменной форме{чёрно-белых тонах}, шкала яркости, и два цвета.

* Нарушение правил иногда хорошо; только удостоверьтесь, что Вы имеете серьезное основание к!

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

5. Стиль редизайна Должен Удовлетворить Компании

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

6. Дела Книгопечатания … много!

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

* Избежать обычно используемых шрифтов, типа Комика Санса, или иначе ваш редизайн может оторваться как дилетантский.

* Удостоверьтесь, что шрифт является четким когда сокращено, особенно с шрифтами сценария.

* Один шрифт идеален, и избегать больше чем двух.

Настоятельно рассмотрите таможенный шрифт для вашего редизайна . Чем более оригинальный{более первоначальный} шрифт, тем больше это отличит марку. Примеры успешных эмблем, которые имеют таможенный шрифт, - Yahoo!, Щебет, и Кока-кола.

7. Цель - Признание

Целый пункт создания эмблемы должен строить опознание торговой марки. Так, как Вы идете о выполнении этого? Хорошо, это изменяется от случая до случая, но цель с эмблемой - для среднего человека, чтобы немедленно вспомнить марку. Несколько примеров этого - эмблемы для Coca-Cola, Pepsi, Макдоналда, и Nike. Только проблеск любой из этих эмблем - все, что Вы должны признать марки. Ключ к созданию популярной и распознаваемой эмблемы должен скомбинировать все элементы, обсужденные в этой статье: размер, стиль, цвет, книгопечатание, и новизна. Пропуск любого из них в течение процесса редизайна будет вредить качеству вашего заключительного редизайна . Исследуйте ваш собственный редизайн эмблемы и см., выполняет ли это все эти критерии. Быстрый тест, чтобы определить, является ли ваша эмблема достаточно распознаваемая, должен инвертировать это использующий любое графическое программное обеспечение редизайна и видеть, можете ли Вы все еще признавать марку. Дополнительно, Вы должны отразить эмблему и видеть, является ли это легко распознаваемым в этом состоянии. Имейте в виду, что эмблемы не всегда видятся передней частью в реальных мировых ситуациях, например, на стороне автобуса или доски объявлений, которой Вы двигаетесь. Поэтому, Вы должны удостовериться, чтобы рассмотреть ваш редизайн эмблемы от всех углов и гарантировать, что это является распознаваемым от любого руководства перед передачей этого вашему клиенту.

8. Сметь быть Отличными

Чтобы стоять из конкуренции, Вы должны отличить себя как редизайнер с отличным стилем. Вместо того, чтобы копировать другой редизайн или стиль, будьте инновационные и стенд из толпы. Так, как Вы можете быть отличными? Пробуйте нарушить{ломать} правила редизайна и рисковать. Пробуйте разнообразие стилей, чтобы найти тот, который работает лучше всего для вашего клиента. Пробуйте различные цветные комбинации, пока Вы не находите тот, который делает ваш редизайн действительно оригинальным. Имейте забаву с программой редизайна , которую Вы используете, и продолжаете щипать редизайн, пока Вы не чувствуете, что Вы имеете это право.

9. K.I.S.S. (Держите это Простым, ),

Чем более простой эмблема, тем более распознаваемый это будет. Например, Nike проносятся со свистом - чрезвычайно простая эмблема и - также один из самых распознаваемых в мире. Следуйте за правилом K.I.S.S. с самого начала процесса редизайна , когда Вы проводите коллективное обсуждение идей и чирикаете эскизы. Часто, Вы найдете, что Вы начинаете с относительно сложного редизайна и заканчиваетесь с более простой версией этого в конце. Работа редизайн вниз к его предметам первой необходимости и не учитывает все ненужные элементы.

10. Пойти Легкие на Эффектах

Наносно-глинистый Иллюстратор, Свобода действий, Фотомагазин, и другие графические программы редизайна - чрезвычайно мощные инструменты и имеют много фильтров и эффектов, что Вы можете обратиться к вашей эмблеме, но не становиться унесенными! Есть время и место для этих мощных инструментов, но это должно не обязательно редизайнировать эмблему. Конечно, игра вокруг и видя, увеличивают ли они эмблему, прекрасна, но только помнить, что простота является ключевой.

11. Развить редизайн "Сборочная линия"

Чтобы производить последовательно высококачественные эмблемы, Вы должны развить ваш собственный процесс редизайна , или “сборочная линия.” Это должно включить следующие шаги:

* Исследование

* Припадок безумия и производит идеи

* Предварительные эскизы

* Развить векторные редизайны

* Послать клиенту

* Добавить или удалить что - нибудь, что клиент хочет

* Завершить редизайн и повторно подчинитесь клиенту

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

12. Использовать Другие редизайны для Вдохновения Только!

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

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