Разработка простого сайта. Часть 1 — Юзабилити
*** Предисловие ***
В качестве иллюстрации к посту использована фотография банкомата НСМЭП, разработанного в Украине, функционал ПО которого на столько запутан, что интуитивно не ясно как им пользоваться. В результате появилась необходимость инструкции (бумажка на банкомате). Это яркий пример ошибки юзабилити-специалиста.
Приветствую вас, уважаемый читатель, в новом цикле статьей, посвященном созданию простого сайта.
Меня как-то спросили: что лучше, программировать динамический сайт с нуля на PHP или воспользоваться движком?
Отвечаю: если функционал сайта стандартный (разделы, заполняемые текстом вперемешку с картинами) то нужно использовать движок и не выдумывать велосипед (причем велосипед у новичка обязательно получится с квадратными колесами); если функционал сайта уникальный – то нужно писать код с нуля, а не приспосабливать при помощи разнообразных костылей имеющиеся модули.
Для создания простого и качественного сайта, который сможет выполнять функции информационного представительства в интернете, идеальной подойдет популярный движок Joomla, с которым мы будем возиться в данном цикле статей. Я покажу, как на основе стандартного шаблона дизайна можно своять вполне приличный сайт.
Почему именно Joomla:
- Бесплатный.
- В интернете много информации по работе с ним.
- Кроме информации много дополнительных модулей, позволяющих реализовать интересные функции.
Также нужно иметь в виду следующее: сайт – это не блог.
На сайте вы раскидаете информацию по разделам, когда информация утратит актуальность, ее нужно обновить, а не создавать новую статью, которая хронологически разместится выше предыдущей.
Блог же, в отличие от сайта, это сплошная хронологическая последовательность статей.
Поэтому если сайт, то все-таки Joomla, а не WordPress. Не зачем ломать философию движка в корне и ставить все те же самые костыли.
Так, движок выбрали, теперь я позволю себе немного пофилософствовать на тему юзабилити сайта.
Моя точка зрения на сайтостроение следующая:
Дизайн – это, безусловно, сила природы, но дизайн в своей веб-реинкарнации первичен только для презентационных сайтов. Т.е. если вы хотите выгодно представить новую линию духов – сухими текстовыми фразами описания не обойтись. Графическое наполнение сайта должно передавать всю прелесть аромата и затягивать падких клиентов.
Теперь представьте, что вы описываете дизель-генератор. Да какая разница, что там у вас за дизайн! Главное предоставьте посетителю полное описание функциональных особенностей и не забудьте про информативность фотографий и видео. В данном случае, первичным оказывается именно юзабилити сайта (удобство восприятия информации и простата ее поиска), а не дизайн. На нулевой позиции важности все равно стоит полнота предоставляемой информации.
Да, в случае духов информационная полнота важна только на странице «Как заказать и оплатить».
Поэтому, работая на должности арт-директора студии и специализируясь на информационных сайта, я не обсуждал с дизайнером его графические решения, они меня не волновали. Волновало меня именно юзабилити.
Само собой разумеется, что решения дизайнера должны быть качественными. Разницы между качественным и некачественным дизайном обсуждать не будем, я просто дам ссылку на заметку в своем ЖЖ.
Теперь перейдем к видеопремеру анализа юзабилити:
Часть 1
Часть 2
В чем суть:
Посетителю сайта нет времени разбираться с путаницей в структуре или читать инструкцию. Выбор между пунктами меню, разделами, кнопками функционала должен быть однозначен и понятен.
Так, в случае обновленного сайта Азовского морского института, абитуриент четко видит в единственном меню единственно-интересующий его раздел “Абитуриенту”, где в полном объеме представлена тематическая информация.
Структура сайта, как путеводная нить, должна однозначно, не путаясь и не обрываясь, вести посетителя к искомой цели.
Дизайн сайта должен быть качественным и ни в коем случае не мешать основной функции – информированию посетителя.
Как, например, в случае старого дизайна сайта Азовского морского института, текстовый блок разбивался на несколько страниц, цвет текста был не достаточно контрастен к фону, размер шрифта мелок, а информационные блоки и блоки меню разбросаны по странице.
В сайте, имеющим интересный дизайн и не имеющим информационного наполнения, смысла нет.
Если дизайн не очень, но информации предостаточно – то тут совсем другое дело. Можно мирится с промахами дизайнера. Однако, если информацию из-за путаницы в структуре найти сложно, то становится очень обидно за потраченное напрасно время администратора.
Хочется обратится к заказчикам сайтов. Уважаемые заказчики, уделяйте больше внимания наполнению вашего сайта, и тогда от него будет толк. Не зацикливайтесь на дизайне, не в том фишка.
Новый сайт Азовского морского института был полностью реализован на движке Joomla. О том, как это сделать, я расскажу в следующей части.
С уважением, Андрей Морковин.
Похожие материалы:
Отзывов: 43 на «Разработка простого сайта. Часть 1 — Юзабилити»














, 15.03.2010 в 06:45
Почему, Joomla, а не Drupal например, чем обоснован выбор?
, 15.03.2010 в 13:30
Да, знаком и с Joomla и с Drupal. Первый — простой и лёгкий в понимании, но очень ограничивает разработчика. Второй надо просто понять. Возможности огромные.
, 15.03.2010 в 07:36
В противоположность этому некоторые рисуют сайт как картинку или как буклет. Ну, если сайт тупо линейный… есть корень и есть 5 рекламно-информационных (или презентационных) страниц, то, возможно, это и оправданно. В остальных случаях, считаю, что такой подход приводит к появлению сайта-картинки. Зашел, полюбовался и ушел. Потому что толком что-то сделать (получить какой-то осмысленный результат, кроме эстетического наслаждения) — сложно или вовсе невозможно. Впрочем, и эстетическое наслаждение, прямо скажем, далеко не всегда получить удается.
Большое спасибо! За интересную статью и за регулярность публикации!
Успехов и удачи вам!
, 15.03.2010 в 09:18
Я бы вместо Джумлы DLE взял или Danneo
, 15.03.2010 в 12:11
нупс, интересный подход, но все же что-то упустили.
даже только информацию надо умно подать при минимуме дизайна, и никогда не соглашусь, що дизайн сайт — второстепенное. хороший дизайнер учитывает все: размер и цвет шрифтов, правильно расположенную навигацию, блоки картинок в тексте и т.д.
а реализация програмного кода — вопрос после дизайна. а понятие «юзабилити» первично решается дизайнером, а не программером.
, 15.03.2010 в 21:37
Порадовался материалу. Для меня актуально. Для дилетанта — Joomla наиболее дружественная CMS.
Спасибо, Андрей.
, 15.03.2010 в 21:54
Урок как всегда интересно смотреть, спасибо! Если бы вы еще залили видео на народ одним файлом, было бы вообще шикарно : )
, 16.03.2010 в 03:45
а мне не нравится Joomla, хотя пару проектов делал на ней
, 16.03.2010 в 10:49
Выбор CMS еще основывается на том, к какой из них вы привыкли..
Если сильно к джумле привыкли, то на друпал не сильно и смотрите..
, 16.03.2010 в 11:46
И зачем новичкам навязывать Джумлу. Это же одна из самых ужасных и громоздких ЦМС.
Вообще Natalya не права. Можно хорошо подать информацию без дизайна в принципе. И за отображение сайта в браузере отвечает не программист, а дизайнер с верстальщиком. Иногда хватает только вёрстки. Но никогда «только дизайна».
, 16.03.2010 в 17:03
> И зачем новичкам навязывать Джумлу. Это же одна из самых ужасных и громоздких ЦМС.
+ 1
, 17.03.2010 в 10:20
К тому же, для простого сайта Джумла обладает избыточным функционалом.
, 17.03.2010 в 02:38
В корне не согласен с Вашим высказыванием, что на WP нельзя сделать сайт без костылей.
Читайте кодекс WP и юзайте функции и будет Вам счастье! И не путайте это с костылями!
На WP сделано огромное кол-во крупных порталов в буржнете, значительно превышающее сайтов на JM.
JM — прожорливая, жутко не удобная модульная CMS-ка, с огромным кол-м криво написанных модулей, тяжело прикручиваемым дизайном и т.д.
У WP конечно тоже есть куча минусов, но их все же меньше. Я для своих небольших сайтов выбираю только WP
, 17.03.2010 в 09:06
Для небольших сайтов достаточно HTML + CSS, легко оптимизировать, хорошо индексируется и полная свобода в дизайне и структуре
, 17.03.2010 в 10:26
Полностью согласен. Но всё таки использую простенькие движки для облегчения изменений.
, 17.03.2010 в 16:31
Используя WP, при необходимости, есть возможность сделать более крупный сайт. что проблематично сделать с HTML…
, 17.03.2010 в 16:34
В смысле, есть маленький сайт. Он показал перспективность по сбору тафика. В таком случае есть возможность быстро расширить этот сайт, если он на WP.
, 17.03.2010 в 21:11
ВП тоже обладает огромным количеством избыточного функционала, напрягает сервер и тормозит.
, 18.03.2010 в 00:58
оптимизируйте. У меня — все ОК.
, 18.03.2010 в 17:56
видеопрИмер, а не видеопремер
Андрей, неплохо получилось.
Успехов!
Говоря о юзабилити сайта, вы не упоминаете более философские понятия удобочитаемости и удобослышимости сайта. И дело не только в контрастах и шрифтах. Тут и домен важен, особенно для ВУЗа, веб-адрес которого часто будет сообщаться в телефонном режиме, тут очень важен и лингвистический аспект. Есть над чем работать, короче!
ЗЫ 1: Не люблю слово юзабилити, поэтому давно придумал слово «удобность», как более узкое понятие чем «удобство»
ЗЫ 1,5: Фраза «сайт сделай сайт точка ком» звучит если не тавтологично, то точно некрасиво. Придумайте что-нибудь более пафосное и красивое типа «Андрей Морковин, специально для проекта «СделайСайт Точка Ком»" — звучит понятнее и «дороже»
ЗЫ 2: Кстати, холивар «Жумла против Вордпресса» считается моветоном в приличном обществе
, 18.03.2010 в 19:45
друзья, вся дискусия медленно перешла в споры какая CMS лучьше, я скажу что все хороши и все плохи, знаю много народу кто на Joomla работает всю жизнь и делает превосходные посещаемые сайты, и свами могли бы поспорить., что одна из лучших смс.
Автору спасибо за интересный рассказ, очень тема актуальна в наши дни когда на сайте все есть, дизайн, контент но навигация ужасная… всем приятного полета
, 23.03.2010 в 08:42
Спасибо.
, 26.03.2010 в 11:14
Пожалуйста
Вот мне интересно, ссылки на сайты из Ваших комментариев можно счесть ручным спамом?
, 26.03.2010 в 11:59
Они и есть!
, 24.03.2010 в 22:39
Андрей, всегда с интересом слежу за новостями на Вашем сайте. Но я так понимаю, что как и крутизне дизайна сайта Вы предпочитаете качество его наполнения, так и массе грамматических ошибок — информативность статей. Знаете, может кому-то и все равно, но мне не все равно. Когда человек, у которого ты пытаешься чему-то научиться пишет с ошибками — то к этому человеку падает доверие. Простите, это без обид, по товарищески. Есть ведь система Orphus наконец, пусть сами посетители исправляют Ваши ошибки…Но, еще раз простите, наверное не мне судить.
, 26.03.2010 в 11:07
Человек склонен ошибаться. Ничего не могу с этим поделать.
, 24.06.2010 в 00:41
Я с вами согласен, что человек склонен ошибаться! Никто не может быть совершенен. Пишите новые статьи! Жду
, 25.03.2010 в 17:22
простата ее поиска
видать с поиском у нее действительно плохо
ну а если серьезно — спасибо, было интересно
, 28.03.2010 в 09:50
Я считаю что к CMS вообще не стоит подходить это деградирует мозг ИМХО лудще самому учить Php а ещё лудще ASP.NET
, 05.04.2010 в 08:24
Это вовсе не так. Не нужно каждый раз изобретать велосипед.
, 05.04.2010 в 19:42
Да для начала лучше хоть азы кода узнать, потом уж лезть на движки какие то
, 06.04.2010 в 09:31
Сайт КтоЗнаетДом.ком — склепал на Joomla, без глубокого знания PHP — второй php сайт в моей жизни. Какой обычный пользователь распознает, что это стандартная CMS? Еще немного поработать с CSS компонентов и проф не каждый поймет за первые несколько сек.
ИМХО, Joomla отличный, довольно простой движок, множество модулей и компонентов, бесплатных, и платных, с открытым кодом — легко редактировать, подправлять или создавать свое собственное, хорошая русская поддержка. Есть, конечно недостатки, но изобретать велик точно не стоит. Критикуйте…
, 08.04.2010 в 11:33
Joomla! конечно обладает множеством недостатком, но я согласен с выбором автора, т.к. преимущество Joomla! перед другими CMS — огромное количество информации по ней на просторах Рунета. А это огромный + для новичков.
, 11.04.2010 в 18:01
А можете рассказать о юзабилити женского портала или сайта широкой тематики. Буду благодарна
, 21.04.2010 в 09:29
Вопрос не совсем по юзабилити, делаю сайт блочной версткой, хочу разбить его на отдельные файлы header, footer… итд, чтобы не добавлять на каждой странице, к примеру, новый пункт меню. Нашел ряд уроков на эту тему, везде сайты сделаны табличной версткой, это обязательное условие?
, 26.04.2010 в 10:57
Посмотрите здесь о болчной div вёрстке видеоуроки. Вообще необязательно использовать таблицы при вёрстке страниц. Сам раньше сидел на таблицах, а потом пришлось под Joomla писать сайт, стало интересно и в итоге по урокам Андрея изучил div
вёрстку.
, 08.05.2010 в 10:54
Андрей, у меня вопрос какой Joomla лучше использовать 1.5.* или 1.0.*??? И еще будут ли в дальнейшем уроки по Joomla??? Если будут то поскорей бы ))))))
, 08.05.2010 в 20:51
Я не Андрей, но уверен, что 1.5.15 Joomla — самое оно, пока что. Нужно жить в ногу со временем. Более новые версии не использовал, хотя они уже давно предлагаются. Просто боюсь, что некоторые компоненты и модули, могут глючить на самых новых версиях.
Это сугубо ИМХО. А уроков по Joomla, в Инете миллиярд, как и компонентов с модулями (хотя 90% предлагаемых дополнений, я лично, дорабатываю напильником).
, 03.06.2010 в 17:16
По мне так для простого сайта и uCoz сойдёт
, 26.06.2010 в 11:26
Здравствуйте Андрей.
У меня к Вам такой вопрос: как сделать так, чтобы на сайте рядом с названием (или адресом) стоял логотип? Как его поставить?
(вот как например стоит значок «@» на Mail.Ru, «W» на Wikipedia, а на Вашем морковка)
Заранее спасибо.
, 27.06.2010 в 12:37
Эта штуковина называется Favicon. Подробнее о ней можете почитать здесь: http://ru.wikipedia.org/wiki/Favicon
, 29.06.2010 в 12:13
спасибки! покопавшись намного в гугли смогла установить себе на фотошопе бесплатный плагинчик для создания изображений с расширением .ico
, 15.09.2010 в 01:14
Боже!!! Где вторая часть? у меня ломка…