Jump to content

Оцените верстку, дайте совет


sloggermike
 Share

Recommended Posts

Всем привет!

Верстка шаблонов с сайта divhack.com уже становится моветоном, однако рискну и я поделиться своими успехами.

Валидацию проходит, отображается одинаково во всех браузера (от ие7 и выше).

Главная проблема в ие6 - не удается оторвать от левого края и добиться нужного фона.

Сссылка на работы

Следует наверное сразу предупредить, что это мои первые работы. :blush:

P.S. обсуждаем... что переделывать,что почитать и куда двигаться дальше....

  • Like 1
Link to comment
Share on other sites

Валидацию проходит, отображается одинаково во всех браузера (от ие7 и выше).

Спешу разочаровать: в 6-м макете некорректно отображается слайдер. Картинки отображаются, а вот текст пропал.

Скажу насчёт вёрстки макета №5, так как сам верстал его. Я вот тогда даже решил не мучатся с растягиванием градиентного баннера на всю ширину — сделал всё max-width: 1200px; min-width: 960px — тут дизайнер явно переусердствовал, всё равно идеально не получается, а жаль, ведь макет действительно красивый <_<

Подсказки в полях ввода лучше сделать либо атрибутом placeholder, либо скриптом (если умеете). Это относится и к другим макетам. А вообще, неплохо для первых работ :)

Edited by Vin
Link to comment
Share on other sites

Спасибо за внимание.

Про слайдер - не доглядел, теперь поправил. С placeholder и скриптом разобрался.

Что касается фона в 5 макете. Я сперва долго голову грел, как реализовать. Результатом доволен=)

Link to comment
Share on other sites

  • 3 weeks later...

Советы на будущее по улучшению уровня:

1. Все ссылки должны иметь :hover (отлично будет, если еще и :visited). Все кнопки(и визуально похожие) хорошо когда имеют :hover и :active. Все ссылки и некоторые кнопки должны содержать атрибут title.(Usability)

2. Тег Img используйте только для вставки изображений, которые несут смысловую нагрузку. Не используйте как фон, например, в 5-м макете "See More". И всегда старайтесь использовать теги Только по их прямому назначению. (Семантика)

3. Начинайте изучать HTML5, CSS3 и практиковаться в их использовании. HTML5 - это новый этап в верстке, который очень стремительно развиваеться и распростаняеться.

4. Возможно вам еще рановато, но на будущее советую познакомиться с идеей "Верстка независимыми блокаки" Виталия Харисова, положившая начало идеологии БЭМ от Яндекса.

Для начала вам, думаю, хватит ;)

П.С. Также советую читать книги ( издательство O'Reilly одно из лучших в ИТ сфере ) и habrahabr.ru советую весь перечитать(что качаеться верстки). Смотреть по онлайну web-конференции (инфо:_http://web-standards.ru/, видио: легко находиться через поиск) и "Я.Суботник" от Яндекса (суботники, есть поудобней список, но забыл где он... если найду заменю ссылку).

П.П.С. Как для первый работ, очень даже не плохо!)

  • Like 1
Link to comment
Share on other sites

Раздел "Другие работы". Об одном и том же человеке думаем, Sloggermike ;) ? Не правда ли, немного похоже? А вот основная страница.

Вариант, что стоит на сайте проекта, мне вообще не нравится=))

Viper спасибо за советы, поужинаю и пойду читать.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy