Building a Web Site For Dummies

Знакомый психолог заказал себе сайт на 400 уе у местной веб-студии stll. Я решил его посмотреть. Пришел домой с мыслью увидеть классный сайт. Что же я увидел? Читаем дальше!

Сайт выполнен на бесплатном движке Joomla 1.5 (как и мой сайт), но содержит много ошибок:

1

Шапка сайта

2

Текст «Центр психологии и психотерапии» как–будто набирал человек, который только недавно узнал про программу Фотошоп. Лень было даже сменить стандартное желтое свечение шрифта на белое или голубое.

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

В верхнем правом углу есть кнопка «КОНТАКТЫ», набранная заглавными кнопка, а рядом с ней расположена иконка, которая на компьютерах обозначает кнопку включения/выключения компьютера. Если нажать на кнопку «Контакты», то всплывает окно размером 900х600, где расположено 9 строчек длиной около 20 символов. Сейчас читаю книгу Яна Чихольда «Новая типографика». Он бы многое про такое сказал. Лучше создать отдельную страницу с контактами.

Также в шапке есть флеш модуль выводящий случайные фразы. Но к сожалению он работает коряво. Вы легко можете в нем увидеть такой текст: «Часто могут быть симптомами Социальной фобии —» – и все, дальше продолжения нет. Привет программистам веб-студии.

Под шапкой находятся вот такие кнопки:

3

Их, наверное, дизайнер нарисовал, когда второй раз в фотошоп зашел. На кнопке «Вопрос – Ответ» дизайнер даже не выровнял текст по центру.

Название сайта

Адрес сайта состоит из сокращения двух слов: «психологический» и «центр». При этом в «шапке» сайта написано: «Центр психологии и психотерапии». А в теге «title», который отвечает за название окна браузера, в котором открыт сайт написано «Психология, психотерапия, коучинг».То есть имеем 3 варианта названия сайта.

Логотип

Я бы применил, что-то положительно, но … Дизайнер использовал модель головы, внутри которой просвечиваются мозги. К тому же голова повернута налево, то есть назад по отношению к направлению чтения. Надо как минимум повернуть ее вправо.

Главное меню

Выглядит оно вот так:

4

При наведении ссылка становится светло-серого цвета, что очень «хорошо» читается на светло-голубом тоне.

«Главное меню» набрано огромным шрифтом. К тому же Times New Roman, хотя для заголовков принято в основном использовать «рубленные» шрифты. Но дизайнер решил использовать «рубленный» шрифт только для основного текста. Так тоже можно.

До заголовка меню «Тесты для самообработки» верстальщик просто не дошел:

5

Про отступы от краев верстальщик возможно просто не знает.

Опросы

6

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

В некоторых вариантах опроса все слова набраны с прописных букв: «Нуждаюсь, Но Боюсь Обратиться», «Нуждаюсь, Но Решать Проблему Буду Самостоятельно» – такое я тоже первый раз вижу.

В очень длинном названии опроса «Чувствуете ли Вы, что нуждаетесь в помощи. Поддержке психолога психотерапевта?» содержится ошибка. Правильно вот так: «Чувствуете ли вы, что нуждаетесь в помощи и поддержке психолога или психотерапевта?».

Контент сайта

Не знаю почему, но в FireFox на главной странице весь текст в центральной колонке выделен жирным, а в Opera выделены только некоторые абзацы и предложения, что впрочем тоже неправильно. Жирное выделение можно использовать только для выделения отдельных слов!

Списки набраны без использования маркеров, что также неверно

Футер

Обычно в нижней части дублируют основное меню, авторские права и счетчики. Здесь он просто пустой!

Дизайн сайта

В целом дизайн содержит много огрех. Опишу наиболее очевидные, не перечисленные выше:

  • название набрано не буквами, а вставлено картинкой;
  • неправильный подбор размеров шрифтов, комбинации цветов для главного меню;
  • на странице «карта сайта» маркеры плавают относительно пунктов меню;
  • на страницах, где мало текста не до конца прорисовываются колонки;
  • отсутствует поиск. Как искать непонятно.

Код сайта

Я не программист, но чтобы проверить качество работы веб-студии, вам достаточно клацнуть правой кнопкой мышки на сайте и выбрать пункт «Исходный текст».

Далее вам стоит обратить внимание на такие строки:

  • <meta name=”description” content=”Joomla! – the dynamic portal engine and content management system” />. Тег «description» – это краткое описание вашего сайта, которое будет отображаться на странице поискового сервиса, если вы попадете в результаты поиска. Как видите, программисту лень было описывать этот сайт.
  • <meta name=”keywords” content=”joomla, Joomla” />. «keywords» рассказывает поисковым работам, какие ключевые слова использовать при индексации вашего сайта.  “Joomla” – программисту было лень.
  • <meta name=”author” content=”Administrator” /> – здесь указывается автор материалов ил сайта. Программисту… :)
  • Несмотря на то, что Joomla имеет возможность преобразовывать сложные ссылки в понятные человеку, программисту было влом включить этот пункт. Имеем: http://ххххх.com.ua/index.php?option=com_content&view=article&id=161&Itemid=145 Могло бы быть http://ххххх.com.ua/price

Я знаком с Joomla. Нахожу в коде строчку: /templates/JB_Strata/css/template_css.css. Ввожу фразу «JB_Strata» в Google и удивляюсь, как веб-студия умудрилась так испортить красивый ПЛАТНЫЙ шаблон JB Strata от компании JoomlaBamboo. Годовая подписка на темы от производителя составляет 195 американских доллара. Судя по всему еще были использованы и платные дополнения к движку сайта. Ждите гостей от правообладателей, когда ваш сайт станет популярным. В других работах студия также использовала скачаные платные шаблоны.

Вот так вот. Проверяйте Веб-студии, когда платите им.

С уважением, Павел Чурюмов :)