Так делать НЕЛЬЗЯ!

Автор: Nikitar
http://rusforumz.com/

В этой рубрике мы будем описывать различные сайты на просторах РуНета, которые имеют в дизайне ряд ошибок, какие именно я здесь их и буду перечислять. То есть мы разберём их дизайн по полочкам, заглянем в код и дополним всё это дело привлекательными (или не очень) скринами.

Привет всем! Итак, это уже третий выпуск журнала, в котором есть наша постоянная рубрика "Так делать НЕЛЬЗЯ!" Нам пришло много писем, и уже началась очередь на анализ и оценку различных сайтов. Сегодня я разберу сайт об обоях для рабочего стола. Он расположен, также как и прошлый сайт, на Народ.ру. Чего-то к нам только с Народа идут люди для заценки! Веб-мастеры с других хостингов: "От-зо-ви-тесь!" Ну да ладно, главное же не хостинг, а чтобы сайт хороший был. Пожалуй, можно начать!

Андрей (автор этого сайта) написал нам в редакцию следующее письмо: "Долго пытался сделать нормальный сайт, но всё никак не получалось, сейчас наконец-таки сдизайнил что-то (а я бы даже сказал нечто). Посмотрите, оцените, по возможности, ЗАцените!" Мы буквально сразу же отреагировали на просьбу Андрея, и посмотрели, что он там себе надизайнил...в общем..мрак, но об этом поподробнее. (Ладно-ладно, письмо я сам придумал, вообще-то он написал, зацените тчк Сайт тчк и адрес :))

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

Ещё что бросается в глаза, так это фон. Фон на странице совершенно никак не связан с самим сайтом, ему не подходит и не смотрится (выход один - поменять). Далее синий цвет под шапкой и рядом с ней. Это проблема всех начинающих веб-дизайнеров. Они, начитавшись книг 90-х годов, пытаются использовать только стандратные цвета, которые входят в 216 цветов. Маленькое открытие: браузерами, которые показывают только эти цвета пользуются всего 5 человек на Земле, и я не уверен, что именно они будут смотреть ваш сайт. А так, доступны все остальные миллионы цветов, так что марш в Фотошоп и подбирайте получше оттенок. :)

Меню и выпадающий список. Ладно про список ничего не скажу, полезная вещь, а вот так называемое меню. Первое ощущение. Это красивый jpg, который сохранили как gif с 4-мя цветами. Только потом понял, что на заднем фоне что-то такое изображено. Уважаемый автор, дорогой Андрей! То, что там изображено, разобрать не просто сложно, а практически невозможно, а вид весь портит очень хорошо. 4 пункта меню хорошо выделяются при наведении, но для чего это - не понятно. + отвратительное зрелище представляет таблица с белым бордюром, в которой находится меню. Здесь надо просто бордер удалить, то есть border="0".

Далее баннер сети знакомств, ну об этом не буду вообще говорить, место удачное для баннера, но совершенно неудачное для дизайна. Под ним текст автора. Текст автора выделен разными цветами, видимо для облегчения понимания, но совершенно не может быть нормально прочитан. Возникает лёгкий дискомфорт. Сейчас скажу почему. Видимо, текст отцентрован посередине, но первая строка в полную ширину таблицы, вообще в полную, то есть такое ощущение, что буквы сливаются с границами. Автор, ведь есть такое понятие, как поля. Когда вы читаете книгу, вы же видите поля, следовательно, и на сайтах должны быть поля. иначе совершенно никак нельзя. За это отвечает параметр тега td cellpadding, у вас он, видимо, 0, сделайте хотя бы 10, будет намного лучше смотреться.

Что неправильно на этой странице:

1. Фон. Следует очень тщательно подбирать цвет фона. Если вы решили сделать в качестве фона картинку, то подумайте 100 раз, будет ли он мозолить глаза? Отвлекать внимание посетителя. Запомните: фон должен дополнять, а не отвлекать. Фон - это не самая важная часть, поэтому следует отнестись к подбору фона очень внимательно, иначе можно переусердствовать.

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

3. Границы таблицы. 3-х мерная граница выглядит красиво, но когда она хорошо, я бы сказал, профессионально, подобрана. поэтому лучше границу сделать каким-то одним цветом, а там где она не нужна (в нашем случае с меню), лучше вообще выставить значение параметра border="0".

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

Думаете на этом страница закончилась? Нет, она тянется вниз, всё продолжается и продолжается.. Ниже находятся 4 самые свежие фотографии. Я сразу же подумал: "Красотища! Ну хоть не дизайн, так фотки хорошие!" Нажал увеличить - ошибка 404, нажал другую - то же самое, и так все. Видимо, автор позабыл прописать нормальные ссылки для этих ссылок.

Ниже смотрим. Реклама. Даже баннер сверху более в тему. Чем этот. Эту рекламу надо где-нибудь внизу писать и писать именно текстовой ссылкой, а не рисунком. Зачем делать графикой то, что можно сделать текстом? Правильно. Незачем. А ещё ниже опять меню, уже расширенное. Про дизайн таблицы не буду говорить, но двойные ячейки с тройными бордерами мне не очень понравились. Да и заголовок серый и огромными буквами Разделы сайта. Шрифт бы поменьше.

А ещё ниже. Новости. Пока до новостей доберёшься - не знаю сколько времени пройдёт. Новости почему-то отцентрованы, поэтому сложно читаемы. Хорошо хоть числа поставлены, и на том спасибо. Жёлтый цвет явно не к лицу сайту. Низ страницы - опять реклама. Заглянем в код пожалуй: это что-то. Вы не поверите: сайт сделан в ВОРДЕ! О чём и соответствуют записи в коде
<meta http-equiv=Content-Type content="text/html; charset=windows-1251">
<meta name=ProgId content=Word.Document>
<meta name=Generator content="Microsoft Word 10">
<meta name=Originator content="Microsoft Word 10">
Но по коду кстати ниже не видно что это Word, может автор взял файл Ворда, и переделал его, оставив только верх? Не знаю. В любом случае это неправильно. Ворд - это не редактор для веб-дизайнера, Попробуйте другие редакторы.

Ошибки на страницах:

1. Битые ссылки. Иногда такое бывает, что некоторые ссылки битые. То есть ведут на страницу, которой не существует. Это очень не нравится пользователям, они бесятся (как я сейчас) и стараются по-быстрее уйти с этой страницы, а также и с сайта вообще. Поэтому контроль за этим должен осуществляться регулярно.

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

3. Word как html-редактор. Word дейстительно с некоторых пор поддерживает функцию создания веб-страниц, но он это делает настолько плохо, что им лучше не пользоваться. Страницы получаются огромными, код массивным, поэтому всё очень долго грузится, и вообще бррр...лучше выберите HomeSite, FrontPage, DreamWeaver.

Так, чтобы ещё такое посетить. Посещу-ка я обои, посвящённые, Санкт-Петербургу. Кто не знает, я из Питера :) Так перехожу на страницу. Меню справа выглядит мягко говоря отвратительно. Когда 4 кнопки на главной страницы сделаны в таком стиле, это ещё ладно, но когда их 13. Бррр.. К автору просьба: измени стиль кнопок и будет намного лучше.

Опять фотографии в ужасных рамочках. Сделайте лучше так, как сделал автор предыдущего описываемого сайта (блин, его хакнули похоже, сочувствую), там рамочки были такие красивые, как тень к каждой фотографии. Далее, смотрю я на верх страницы и в заголовке хочу увидеть: "Санкт-Петербург. Красоты и Достопримечательности" А вижу вместо этого - "Фотографии Египет Хургада Сахара Бедунны" И ещё Бедунны, представляете? Название страницы должно соответствовать её содержанию. Вот эта окантовка синяя меня настораживает, лучше цвет всё-таки поменять. А фотографии красивые...

Ошибки на этой странице:

1. Название. Название страницы которое располагается в теге title должно отражать содержание страницы. Конечно, легче всего просто скопировать один title для всех страниц, но не поленитесь и сделайте для каждой страницы свой, это очень важно для поисковиков, и для людей, которые придут оттуда к вам на сайт.

2. Однообразие. Когда на странице много одного цвета, когда он и слева, и сверху, и снизу. Это некрасиво, лучше использовать какие-то оттенки этого цвета, чтобы как-то не так было массивно.

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

Напоследок. Автор ещё и продаёт эти снимки, так что тем более, что ему нужно сделать дизхайн сайта нормальным + перехать на нормальный хостинг. А цену-то ты нигде не указываешь, напиши где-нибудь, мне даже интересно стало, сколько могут стоить эти фотографии. Ок? ну всё, пока!

Вы тоже можете написать мне какой сайт вы бы хотели чтобы я оценил и написал такой подробный обзор. Это может быть ваш сайт или сайт кого-нибудь другого. Убогий и нет. страшный и приличный, ужасный и симпатичный, все они будут жестоко раскритикованы. Не боитесь жёсткой критики? Тогда пишите название сайта на странице обратной связи и не забудьте указать в теме: «Сайт на заценку» или что-то в этом роде.

Ждём-с. Ну, а сейчас прощаюсь и удаляюсь. Nikitar.

Уважаемые авторы – создатели сайтов, которые я подвергнул критике. Ничего в этом нет плохого, так как ссылка на ваш сайт стоит, и многие захотят его посетить. Если вы всё же думаете, что данный обзор ущемляет ваши права, то не думайте об этом, так как он никак и ничем, а также никогда не нарушит ваши права, так как это здоровая и объективная критика.

PS. Если вы обнаружили в моих текстах ошибки - не расстраивайтесь, бывает. Просто мысленно поставьте мне двойку и с чистой совестью продолжайте читать :) А если по правде, то пишу я очень быстро, поэтому на запятые времени нету, а все грамматические ошибки не более, чем опечатки, точнее очепятки, то есть пяткиоч, блин, запутали, короче, всё... Пока!