Почта Главная
Обзор сайтов
ПРОВОДИМЫЕ КОНКУРСЫ
web-дизайн
коллажи
АРХИВ КОНКУРСОВ
победители
награды
ОБЗОР САЙТОВ
рейтинг сайтов
ТЕХ.РАЗДЕЛ
ФОРУМ
ЖЮРИ
ПОЛЕЗНЫЕ РЕСУРСЫ
О НАС
КАК ЗАКАЗАТЬ САЙТ
ПОЧТА
Кнопки

Web-Стройка. Строительство сайтов.

Copyright © 2000. Fedor Yushkov
Design by Web-стройка
E-mail: JustFred@yandex.ru
Обзор сайтов. Обзор №2
Ведущий раздела Андрей Грабовский.
E-mail: space@paco.net

Обзор вариантов работ на конкурс "Дизайн сайта Футбольного Клуба Томь"

Участник №5 - Илья (посмотреть >>)

Эта работа получила много откликов на форуме и, судя по ним, народ поддерживает автора, причем довольно единодушно. Давайте же посмотрим, все ли там так хорошо.

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

Тут я на минутку переведу дух и скажу, что до сих пор смотрел в Opera (но и в IE, и NN все вышесказанное тоже справедливо), а теперь переключился в IE. И сразу мое внимание привлекла деталь, которой я не видел раньше. Бегущая строка вверху! У меня есть серьезное предложение к разработчикам Эксплорера из Майкрософт: добавить в панель навигации браузера еще одну кнопку "Стоп" - специально для остановки бегущей строки. Рассмотрим наш случай. Она, на фоне следующей за ней статики, сразу же привлекает к себе внимание. Тем самым отвлекая его от более важного - содержания страницы (добавлю: если бы оно было, это содержание, но об этом позже). Забегая немного вперед, скажу, что только переключившись в NN, где строка никуда не бегает, я вдумался в то, что в ней написано. Цитирую (дословно, с авторской пунктуацией, как говорят в подобных случаях, и пробелами впридачу):
"футбольный клуб ТОМЬ г. Томск официальный сайт"
Казнить нельзя помиловать ТЧК. Зачем это? Все то же самое есть на изображении ниже, к тому же представлено намного лучше. И для кого это уточнение - "официальный сайт"? Не нужно явно указывать очевидные вещи. Вряд ли у клуба "Томь" есть еще один сайт, неофициальный. А если и есть, то задачей этого конкурса было создать именно официальный вариант. И если это не получилось, и он так не выглядит, то никакие уточнения не помогут.

Идем дальше - вернее, ниже, а там у нас строка навигации. Ширина ячеек со ссылками различна, т.к. слова довольно сильно отличаются по длине. Это вполне допустимо. Но! Длинные слова вплотную прилегают к перегородкам ячеек, даже без единого пробела. Это абсолютно недопустимо. Слова прилипают одно к другому, и вертикальные перегородки, которые по замыслу должны разделять их между собой, не могут этого сделать, и только добавляют хаос в это месиво. Зеленая колонка слева содержит следующие слова (в оригинале они отделены не пробелами, а расстоянием между строками, и каждое слово на отдельной строке): "Футбольные истории Кричалки Приколы". Смею сделать предположение, что "Футбольные истории" - это один раздел, а не два разных. И, соответственно, они должны группироваться вместе (хотя бы дополнительным отступом перед следующей ссылкой).

Теперь переключимся в Навигатор и посмотрим, что он нам скажет. Если честно, я был немного поражен картиной. Строка навигации не заключена в темную рамку, и поэтому там нет той грязи, "шума", которые я видел раньше. Правда, теперь выплыла другая проблема - слова ссылок слиплись окончательно, и видно следующее: "КалендарьСоставГостевая" и "ФанатыГазеты". Главное информационное поле отделено от окружающего пространства аккуратненькой рамочкой, справа она двойная, что смотрится очень хорошо. За счет этой же рамки и главное поле, и шапка вверху стоят по центру, как им и положено (есть справа от картинки небольшой зазор, но он не так уж заметен). В общем, красота! Особенно по сравнению с тем, что я видел в Opera и IE. Это ввело меня в раздумья, под какой же браузер делалась страница. Разумеется, все говорит о том, что делалось под IE (это и игры с подсветкой ссылок, и бегущая строка). Но уж очень все красиво в NN, чтобы быть случайностью! Если это так, то действительно: "никогда не знаешь - где найдешь, где потеряешь".

Теперь немного о коде. Сразу видно, что там очень много лишнего. Например, мне кто-то объяснит, какой смысл в "ROWSPAN=1 COLSPAN=1"? Это явный мусор, и повторяется он в _каждой_ колонке по всей странице, а их там совсем немало. Структура документа сильно, невероятно сильно усложнена, причем там, где это абсолютно не нужно: каждая ссылка находится внутри своей таблицы, и вся строка навигации вставлена в еще одну таблицу. При этом для каждой таблицы и ее ячеек явно заданы практически все свойства: рамка, отступы, ширина с высотой и выравнивание. И все это для чего - чтобы при наведении курсора на ссылку она поменяла свой цвет на черный, а ее фон изменился с зеленого на желтый! Благодяря CSS текст ссылок действительно выглядит одинаково во всех браузерах, чего нельзя сказать об основном тексте. Потому что для самого текста стиль просто не определен; такое впечатление, что он (текст) здесь просто не предусмотрен. Та жалкая надпись, которая его заменяет: "Общий текст, информация и т.д.", везде выглядит по-разному. И если бы автор удосужился вставить хотя бы несколько предложений, он бы наверняка заметил, что к общему оформлению больше подходит вариант, показанный Opera. А именно: шрифт без засечек обычного начертания, а не полужирного (как в IE) и не полужирного с засечками (как в NN).

Еще раз окинув взглядом страницу, я понял, что больше там делать нечего. Итак, что же сделано? Бегущая строка. Цветная шапка, которая выглядит неплохо на первый взгляд, но при более детальном рассмотрении содержит много недочетов. Строка навигации, которая выглядит отвратительно, и работает, как задумано, только в IE. Все. Больше нет ничего, на этом энергия у автора закончилась. Кроме того, страница совершенно внезапно обрывается, и если бы не тоненькая полоска внизу, я бы подумал, что она просто не догрузилась до конца. Невероятно запутанный и усложненный код. Единственный плюс этой работы (по отношению к остальным), это шапка. Но он полностью перекрывается массой недочетов и, главное, тем, что она не содержит абсолютно ничего существенного и по-настоящему нужного.

Теперь ответьте мне на вопрос - а чему, собственно, все так восторгались?

далее >>
оглавление >>
Как прислать свою работу

Для того чтобы прислать свой персональный сайт достаточно написать нам письмо в свободной форме, в котором следует указать название сайта, его адрес, свое имя (псевдоним) и изъявить желание разместить свою ссылку у нас на конкурсе.

Кроме того, в целях популяризации нашего Конкурса мы просим разместить на своем сайте нашу "кнопку" 88х31. Вот ее код:

<a href="http://www.design-konkurs.narod.ru" target="_top"><img alt="Конкурс Дизайнеров-Любителей! Прими участие и выиграй призы!" border="0" src="http://www.design-konkurs.narod.ru/88x31_ban_new1.gif" width="88" height="31"></a>

Реклама

Hosted by uCoz