Консультации и оценка качества html-вёрстки (бесплатно)

[Nebohod]

Также можем разбирать уже готовую вёрстку: что хорошо, что плохо, как сделать лучше. Если вам кто-то сверстал сайт - тоже можно смело спрашивать - "ну как?"

Вот и спрашиваю - http://nebohod.com - ну как?

18-10-2011, 11:37
****************/showthread.php?t=1064958

[Nebohod]

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

Поехали.

Соответствие макету, сетка.
Т.к. эталонных дизайнов нет, будем смотреть на сетку сайта.
Дизайн - стандартный на джумле, смотреть нечего. Вот это бы я выровнял:

• clip2net.com/s/1k8Ji
• clip2net.com/s/1k8JF

Кроссбраузерность, кодировка и DOCTYPE
С кроссбраузерностью всё ок, было бы странно если бы было не так, сайт то простой.
Кодировка, доктайп - выданы джумлой, что тут смотреть, всё стандартно.

Валидность, доступность, микроформаты
Сайт не валидируется, но если вбить руками получаем лишь стандартные для xhtml ошибки об отсутствии замены & на & и незакрытых одиночных тегов. Ничего серьёзного.

С доступностью норм, сайт-то простой. Синтия матюкается - cynthiasays.com/mynewtester/cynthia.exe?rptmode=2&url1=http%3A%2F%2Fnebohod.com%2F , но то мелочи.
Ломаться нечему особо.

Микроформатов нет, ну тут особо и не требуются (разве что контакты разметить).

Корректная работа при вбивании реального текста, надёжность вёрстки
А вот тут по-хуже. Собственно сайт-то информационный, тут упор на тексты делать надо. А стилей для текста нет. Элементарная вещь - вбиваешь список - он не оформляется.

...
В общем, можно было-бы смотреть и дальше - bit.ly/markup-checklist-2011 , но это сайт на джумле набитый текстом, что проверять)

При 1024 - плохо, владельцы нетбуков негодуют.
На iPad - тоже, спонсоры не увидят картинку дирижабля по-людски.

Советы

• Сайт грузится долго. webo site speedup в помощь.
  
  
• Типографика!!
  Где она? Если бы я специально не почитал пару предложений из абзацев - так и не узнал бы о чём сайт. Глазу зацепиться не за что. Не в смысле картинок и дизайна, речь о типографике. У нас вообще с ней проблема, даже в глянце. Но хорошие примеры есть. Журнал Країна например - отлична работа с текстом.
  
  
• Огромное кол-во пунктов меню. Сократить до 7 ссылок на всю главную.
  
  
• Дизайн. Уберите картинку из шапки. Она ни о чём. Уберите илюстративные фоны плашечек. Работайте с текстом. Можно делать офигенные сайты просто текстом. Вам нужно донести мысль, текст. Дизайнера нет, да и тема техническая. Пусть сайт выглядит научно и строго. Ну вот например так: cssing.org.ua
  
  Контакты? Где они на видном месте? Как спонсору с вами связаться?
  
  О сайте? Зачем? Кому это интересно? Интересно - Об авторе. Кто такой? Почему ему стоит дать денег? Помочь проекту - спрятать. Тут не милостыню просят у метро. Комментарии - тоже. Вообще всё лишнее уберите. Уберите всё, кроме того что уже ну никак нельзя убрать.
  
  Счётчики спрятать, там пока нечем гордится.
  
  
• Социалочка. Кому нужны ваши закладки на linkedin и digg? Убрать всё - поставить вконтактик и ко.

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

Спасибо за советы. Практически со всем согласен, будем переделывать.

18-11-2011, 11:08

[Nebohod]

-Nebohod фиксированные размеры выползают, при стандартных размерах окна.
так лучше
<img width="100%" border="0" style="display: block; margin-left: auto; margin-right: auto;" alt="nebohod" src="/images/nebohod.jpg">

Да, спасибо, я знаю, правда сам только недавно это увидел что на маленьком разрешении картинка выползает, всё собирался исправить, откладывал, но вы меня прям заставили
Сделал width в процентах, height убрал, картинка стала "резиновая" но резкость немного ухудшилась.

или ещё лучше так:

Код:

.postcontent img {max-width: 100%;}

Да, вот так получше будет, спасибо.

18-11-2011, 16:27