Закритикуйте верстку

[Kiddo]

Здравствуйте.

Покритикуйте пожалуйста верстку.

http://zodios.net/portfolio/karefun/index.html

Буду благодарен всем, кто не полениться потратить свое время и напишет замечания.

Попутно еще один вопрос.

Есть сервисы для сжатия цсс файлов, например http://www.cleancss.com/ , он убирает с файла все лишние пробелы, табы, единицы измерения после нулевых значений параметров, точку с запятой в конце последнего свойства селектора. Пользуйтесь ли вы им? Знаете ли программную реализацию подобного инструмента? Есть ли в ней функция обратная сжатию?

Edited November 22, 2008 by Kiddo

[Dimitry Wolotko]

Ничего не найденно, Ошибка 404

[tematika]

Ничего не найденно, Ошибка 404

http://zodios.net/portfolio/karefun/

[Kiddo]

Прошу прощение. Поправил, случайно скопировал папку с названием с большой буквы

[Victor Ananiev]

КНИГА ЖАЛОБ И ПОЖЕЛАНИЙ - как то оно вроде подругому звучит, мнения что ли...

В меню слишком большой шрифт(для текущей страницы), а для нактивных, слишком мал...))))

ДА и серо как то....

А на счет верстки, верстка как верстка, таблички одни... А дивы?

Edited November 22, 2008 by Vindex10

[homm]

При цвеличении ширины страницы можно вмещать 3, 4, 5 и так далее единиц товара в ряд. И ограничивать ширину страницы тогда не имеет смысла.

> верстка как верстка, таблички одни... А дивы?

Ты что-то не туда смотришь Все там в порядке.

[tematika]

Приятная вёрстка, приятный дизайн.

[Kiddo]

Спасибо всем кто уже откликнулся.

2Vindex10

А где конструктивная критика?

Там всего 2 таблицы и все остальное на блоках и списках...

Если вы считаете что таблицы были где-то применены неуместно, обоснуйте свою точку зрения адекватными доводами.

2homm

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

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

Edited November 22, 2008 by Kiddo

[yopopt]

Свёрстано хорошо, таблицы правильно использованы. Однако, возможно, о существовании тега address Вы не знаете и используете вместо него <p class="hPhones">. Address здесь более уместен. Также, имхо, многовато <br />, не люблю я их.

[rus]

1) Где то уже встречал подобную конструкцию, но не помню для чего она:

<h1 class="hLogo"><a href="#">CAREFUN<span></span></a></h1>

Интересует <span></span> - зачем?

2) Подогнать бэк в хедере под размер самого хедера (до горизонтального меню) имеется ввиду увеличить высоту файла bg.png, а то вертикальное дублирование не красиво смотрится имхо, да и размер его ширины сделать можно не 26 а скажем 2-3 px.

З.Ы. вроде все. По верстке ничего лишнего кроме <br> как подметил yopopt не заметил.

[Kiddo]

2rus

Пустая конструкция спанов, это IR(Image Replacement) Park, когда под картинкой прятают текст, для того чтоб пользователь с отключенной графикой смогу понять назначение этого блока, также этим способом порой злоупотребляют "черные" оптимизаторы.

Подробней об этом IR и других способах:

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

А как вам удалось увидеть вертикальное дублирование бекраунда? Я при масштабировании его не вижу, там стоят спрайты, поэтому видно фон футера. В каком браузере, ОС увидели дублирование? Фот сделать шириной до 2-3 пикселя считаю лишним, потому что там стоит патерн, и при сильном уменьшении он плохо дублируется, но чуть-чуть ужать все-таки постараюсь.

yopopt

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

А где вы увидели лишние брейклайны?

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

Edited November 29, 2008 by Kiddo

[klierik]

хороший уровень верстки. понравилось.

но все же всавлю свои 5 копеек =)

.itemsGalery

это можно было б сделать на блоках. не очень понял почему именно тут использовалась таблица.

и не очень понравилась организация CSS (малокомментируемый)

рекомендовал бы почитать это

а так вроде все =)

[Kiddo]

2klierik

Если о .itemsGalery, то мне кажется целесообразно делать на списке (список товаров), а не на блоке. Но я это рассматриваю как таблицу товаров.

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

[vvsh]

Молодец, что сказать, отличная верстка.

[rus]

2rus

Пустая конструкция спанов, это IR(Image Replacement) Park, когда под картинкой прятают текст, для того чтоб пользователь с отключенной графикой смогу понять назначение этого блока, также этим способом порой злоупотребляют "черные" оптимизаторы.

Подробней об этом IR и других способах:

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

А как вам удалось увидеть вертикальное дублирование бекраунда? Я при масштабировании его не вижу, там стоят спрайты, поэтому видно фон футера. В каком браузере, ОС увидели дублирование? Фот сделать шириной до 2-3 пикселя считаю лишним, потому что там стоит патерн, и при сильном уменьшении он плохо дублируется, но чуть-чуть ужать все-таки постараюсь.

За разъяснение спасибо.

По поводу дублирования:

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

[Victor Ananiev]

Там всего 2 таблицы и все остальное на блоках и списках...

Завтыкал) прости)

Конструктивно я высказал по дизайну)

[Searcher]

Верстка на 5! ))

[unodj]

2rus

Пустая конструкция спанов, это IR(Image Replacement) Park, когда под картинкой прятают текст, для того чтоб пользователь с отключенной графикой смогу понять назначение этого блока, также этим способом порой злоупотребляют "черные" оптимизаторы.

Подробней об этом IR и других способах:

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

ваш пример не открывается - 404

я пользуюсь такой конструкцией:

<h1 style="text-indent:-99999px;background:url(Картинка/вместо_заголовка ) no-repeat;">Заголовок</h1>

применить можно и к A тегу, добавив display:block и нужные размеры, преймущество такого способа в отсутствии лишних пустых тегов, но есть и недостатки

естественно, как правило, это все выносится в CSS файл )

[rus]

ваш пример не открывается - 404

В адресной строке убери в конце " он и откроется

[qwelp]

у тебя в коде есть <span></span> 5 раз. замени на <span> </span>

[Kiddo]

у тебя в коде есть <span></span> 5 раз. замени на <span> </span>

А зачем добавлять пробел?