Оцените Верстку

[qwelp]

Оцените уровень верстки Шаблон

По десяти бальной шкале. Пример:

5 из 10

Edited November 28, 2008 by qwelp

[Anami]

8 из 10.

Всё кросбраузерно, симпатишно. Не понравились конструкци типа <br class="bort_br"/>, h1 через класс, а не наследованием, в css половина кода через id, половина через class.

[Searcher]

Сделано все аккуратно, почти без излишеств, но есть несколько ложек дегтя:

1. На какой странице нахожусь - непонятно. А меню так незаметно, что не сразу понятно, что это меню.

2. Что такое в меню "Главная"? Это о директоре фирмы? )) Если это страничка, то она вообще лишняя. Зачем путать посетителя.

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

4. Чтобы увеличить место под информацию, надо не шрифт уменьшать, а сделать макет резиновым.

5. Новости надо назвать новостями, не надо загадок посетителю, он их не любит.

6. Внизу ссылки: "О сайте Карта сайта Правила размещения Обратная связь Реклама на сайте" - к месту только последнее. Из прочего понял только "Карта сайта", что говорит о запутанной структуре сайта, а остальное вообще зачем? "О сайте" и "Карта сайта" - можно объединить. "Правила размещения" чего, если рекламы, то уже есть о рекламе на сайте? "Обратная связь" уже есть в главном меню "Контакты".

7. Если планируется реклама на сайте, то ее уже некуда тут воткнуть.

8. Обмен ссылками и каталог ресурсов - вообще никому не нужно. Это ж не домашняя страничка. Это сайт серьезного производства. Хотя, заходя на npounit.ru я вижу логотип "Агрегат", ой, наверное я не туда попал...

Не перегружайте мозг посетителя кучей дублирующихся ссылок и запутанной структурой сайта. Почему прайсы и заказ отдельно от всего? Почему на сайте НПО Юнит какой-то Агрегат, да еще с надписью www.znpo.ru? Где я!? Продумайте более четкую древовидную структуру сайта.

за код 8, за остальное 5

[kalyaka-malyaka]

Сделано все аккуратно, почти без излишеств, но есть несколько ложек дегтя:

1. На какой странице нахожусь - непонятно. А меню так незаметно, что не сразу понятно, что это меню.

2. Что такое в меню "Главная"? Это о директоре фирмы? )) Если это страничка, то она вообще лишняя. Зачем путать посетителя.

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

4. Чтобы увеличить место под информацию, надо не шрифт уменьшать, а сделать макет резиновым.

5. Новости надо назвать новостями, не надо загадок посетителю, он их не любит.

6. Внизу ссылки: "О сайте Карта сайта Правила размещения Обратная связь Реклама на сайте" - к месту только последнее. Из прочего понял только "Карта сайта", что говорит о запутанной структуре сайта, а остальное вообще зачем? "О сайте" и "Карта сайта" - можно объединить. "Правила размещения" чего, если рекламы, то уже есть о рекламе на сайте? "Обратная связь" уже есть в главном меню "Контакты".

7. Если планируется реклама на сайте, то ее уже некуда тут воткнуть.

8. Обмен ссылками и каталог ресурсов - вообще никому не нужно. Это ж не домашняя страничка. Это сайт серьезного производства. Хотя, заходя на npounit.ru я вижу логотип "Агрегат", ой, наверное я не туда попал...

Не перегружайте мозг посетителя кучей дублирующихся ссылок и запутанной структурой сайта. Почему прайсы и заказ отдельно от всего? Почему на сайте НПО Юнит какой-то Агрегат, да еще с надписью www.znpo.ru? Где я!? Продумайте более четкую древовидную структуру сайта.

за код 8, за остальное 5

а при чем тут верстка, которую только и просили оценить?

верстальщик не имеет никакого отношения ни к размерам шрифтов, ни к структуре сайта, ни к рекламе,

ни к названиям пунктов меню. как отрисовано, утверждено и оговорено в ТЗ, так и режет.

8 из 10.

Всё кросбраузерно, симпатишно. Не понравились конструкци типа <br class="bort_br"/>, h1 через класс, а не наследованием, в css половина кода через id, половина через class.

согласна.

еще не понравилось, что абзацы текста после h1 не являются параграфами, у которых легко можно было бы оговорить отступы и многое другое, а отступы между абзацами осуществляются двумя <br />.

и по оценке поддержу: 8 из 10-и.

[qwelp]

Не понравились конструкци типа <br class="bort_br"/>, h1 через класс, а не наследованием, в css половина кода через id, половина через class.

1. Конструкцию <br class="bort_br"/> рекомендуют использовать программисты adobe.com, класс выглядит так:

служит для того чтобы отделить уровень блоков.

.bort_br {
	line-height:0px;
	font-size:1px;
	height:0;
	clear:both;
}

2. h1 через класс. в css половина кода через id, половина через class.

Если использовать id в повторяющихся блоках, то валидатор w3c выдает предупреждение. Вот и приходится там где не повторяющиеся блоки на странице использовать id (так как они работают быстрее, чем конструкция .class), a там где блоки повторяются использовать .class

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

Эти места будут заполняться из панели управления, контент менеджер сможет подставить любые теги

Edited November 28, 2008 by qwelp

[kalyaka-malyaka]

1. Конструкцию <br class="bort_br"/> рекомендуют использовать программисты adobe.com, класс выглядит так:

служит для того чтобы отделить уровень блоков.

.bort_br {
	line-height:0px;
	font-size:1px;
	height:0;
	clear:both;
}

<br /> - тег для форматирования текста. это не блочный элемент. с классом все понятно и все правильно. но использовать его стоит в диве.

http://www.htmlbook.ru/html/br.html

[qwelp]

<br /> - тег для форматирования текста. это не блочный элемент. с классом все понятно и все правильно. но использовать его стоит в диве.

http://www.htmlbook.ru/html/br.html

Работает во всех браузерах и валидатор воспринимает хорошо, если бы не работало использовал блок, а так короче

[Searcher]

а при чем тут верстка, которую только и просили оценить?

Виноват, недоглядел за мозгом... )))

[rus]

Да в принципе все гуд, по 10 бальной на 9 тянет.

Только вот не понравилось много <br />, да и выше сказанное тоже верно, его не стоит применять как блочный элемент.

И еще, вместо:

текст<br /><br />текст

лучше использовать :

<p>текст</p>

Вроде все...

[yopopt]

5 из 10

Очевидные недостатки:

1. Не отформатирован код.

2. Нет атрибута «title» у ссылок.

3. Излишняя вложенность тегов. Пример - футер.

4. При отключенных картинках (или ошибки при их загрузке) вёрстка немного едет. Не забывайте прописывать размеры изображений. А телефона становится просто не видно.

5. Использование <br /> не по назначению. Пример - <span>6 ноя 2008</span><br />

6. Не упорядочен css, не используются короткие формы записей.

7. Подобные записи в css не красят выставленную на оценку работы:

.search_mini_submit {
	border:0px !important;
	float:left !important;
	width:45px !important;
	height:18px !important;
	margin-left:0px !important;
	border-top-width: 1px !important;
	border-bottom-width: 1px !important;
	border-top-style: solid !important;
	border-bottom-style: solid !important;
	border-top-color: #A5A5A5 !important;
	border-bottom-color: #A5A5A5 !important;
	padding-bottom:1px !important;
	padding-top:1px !important;
}

.item_all_link {}

В целом неаккуратно. Посмотрите вёрстку из этого топика: http://forum.htmlbook.ru/index.php?showtopic=11326. Особенное внимание обратите на способ подачи адресов и логотипа. (Посмотрите что творится со страницей при выключенной графике)

[Anami]

1. Конструкцию <br class="bort_br"/> рекомендуют использовать программисты adobe.com, класс выглядит так:

служит для того чтобы отделить уровень блоков.

.bort_br {
	line-height:0px;
	font-size:1px;
	height:0;
	clear:both;
}

а clear:left, clear:both; ? Если нет четкой высоты,а нужны отступы спасет

.class {
	height:100%;
	overflow:hidden;
}

спасет.

Вобщем можно обойтись

yopopt хотелось бы увидеть сайт на 9 из 10 хотябы))

Edited November 28, 2008 by Anami

[Ялекс]

yopopt, поддержу тебя, не отформатированный код это плохо.

С BR тоже поддержу.

Согласен с замечаниями и твоей оценкой. Может на бал подыму.

Edited November 28, 2008 by Ялекс

[SelenIT]

Форматирование - еще ладно. А вот <br> в аккуратном ряду дивов действительно смотрится дико и в общем-то не нужен. Фоны блока "Наши разработки" и правого футера фиксированы по высоте, поэтому при увеличении шрифта в мозилле/сафарях/хроме текст из них выбивается (то же самое может произойти, просто если у одной разработки окажется более длинное описание, этот фон просто обязан тянуться по вертикали!). Вообще разработки - это очевидный список по смыслу (возможно, даже DL), а не набор спанов (при выключенных стилях сейчас непонятно, какая картинка относится к какому описанию). Учитывая, что макет в целом простой, этих недостатков можно было избежать. Но на 7 баллов, по-моему, вполне тянет

[Kiddo]

1. Зачем логотип в тегэ img?

2. Нет IR в телефоне, куда звонить человеку который серфит с отключенными картинками?Image Replacement

3. Нет media для файла цсс

4. Новости это список

5. Шрифт в px

6. Для поисковой оптимизации центральную часть в коде нужно было выводить до сайдбара.

7. "Наши разработки" в идеале тоже список.

8. Невалидный цсс.

9. Неструктурированные заголовки, на одной странице должен быть один h1, а не 3.

10. Презентационные имена классов (modLeft, modCenter...)

11. Нексроссбраузерное объявления font-weight:100;

12. Написание многих цсс параметров можно сократить сокращения в CSS

13. Все картинки в гиф формате. Например, лого можно было сохранить в пнг-8, было б 5кб, а не 9.

14. Для ссылок можно было обнулить outline, но это дело вкуса. Outline

15. Для ссылок копирайта хорошим тоном задавать target="_blank"

16. Неотформатированная типографика, но это у вас наверно к дизайнеру, хотя этим в идеале должен и верстальщик заботится.

17. Ссылка реклама на сайте сделана блоком с падингом, активный получается и отступ между ней и навигацией.

Edited December 1, 2008 by Kiddo