Верстка "Первого оранжевого"

[fragilewelldone]

Всем привет.

Закончил работу над макетом, взятым из темы : Как обещал макет для верстки

Прошу опытных людей оценить верстку и отметить недостатки и достоиноства.

Приму любую критику и даже буду очень благодарен!

Не судите строго я только учусь).

А вот и ссылка на саму верстку:

Первый оранжевый

PS. Не обязательно критиковать, можно еще и отметить плюсы)

Edited November 6, 2011 by fragilewelldone

[fragilewelldone]

200 просмотров и не одного отзыва? Зачем тогда сюда люди заходят?

[Undead_46]

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

начну с положительного, вёрстка кроссбраузерна, это радует как для новичка.

теперь о грустном

1. зачем в шапке дивом ставить постояно inline-block,существует же float для блочных элементов.

2. я заметил у вас был разделен background, вы написали вот так background-image: url("images/bgpoint.png");

background-repeat: repeat-x;

но можно было сократить background-image: url("images/bgpoint.png")repeat-x;, так же проще и на строчку меньше!

3.вы некоторые изображения добавляли в тег <img />, но лучше было их добавлять в background, так как это фон, в <img />

добавляются фотографии а не фон.

4. у вас много не семантических тегов, то есть где должен стоять например h4 вы ставите везде div

5. ещё мне не понравилось название классов например у вас там есть телефон название кода телефона у вас почему то orange, хотя может быть его надо сделать голубым, то есть надо называть классы максимально приближено к действительности, я бы назвал класс с кодом телефона так <span class ="phone-code"></span> и.т.д

это пока что я заметил но чувствую есть ещё не дочеты

Edited November 7, 2011 by Undead_46

[psywalker]

200 просмотров и не одного отзыва? Зачем тогда сюда люди заходят?

Дружище, что за обидки кидаешь непонятные? Во-первых тебе никто не обязан тут, во-вторых, если люди не отвечают, значит нет времени или возможности. Я в своё время тоже ждал, но молча, и дожидался в конце концов.

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

[fragilewelldone]

1. Я просто поэксперементировал с этим свойством))

2. Чесно, не знал о таком сокращении.

3. Вы про изображения полосок? Да действительно... после вашего сообщения я задумался над этим.

5. Вы правы)

Спасибо за ответ!

200 просмотров и не одного отзыва? Зачем тогда сюда люди заходят?

Дружище, что за обидки кидаешь непонятные? Во-первых тебе никто не обязан тут, во-вторых, если люди не отвечают, значит нет времени или возможности. Я в своё время тоже ждал, но молча, и дожидался в конце концов.Со-стороны вёрстка ничего вроде. Держится вполне. Но вот код грязненький, и почему-то всякие ссылки, кнопки и т.д - некликабельные.

Да, ты прав мне никто не обязан)

Что значит ссылки, кнопки и т.д - некликабельные? При наведении курсора появляется рука) вроде я все ссылки пометил...

Edited November 7, 2011 by fragilewelldone

[psywalker]

Что значит ссылки, кнопки и т.д - некликабельные? При наведении курсора появляется рука) вроде я все ссылки пометил...

Да, рука появляется, но например подчёркивание не убирается, как-то непривыччно. В форме поиска кнопка сабмит не кликабельна вообще. Где рисунок лупы.

Далее вот это не очень понравилось

<a href="#">
<img alt="деньги" src="images/cash.gif">
</a>
<div>
<a href="#"> На неотложенные нужды</a>
</div>

Выходит, что две ссылки на один адрес указывают. Хотелось бы в одно объединить. Т.е. одна ссылка, а в неё уже текст и картинка.

[fragilewelldone]

Спасибо за советы!

Очень сильно благодарю.

Щас решил верстать этот макет далее может буду совершенствовать "Оранжевый банк"

Как хочется сразу за все взяться))

[psywalker]

Спасибо за советы!

Очень сильно благодарю.

Щас решил верстать этот макет далее может буду совершенствовать "Оранжевый банк"

Как хочется сразу за все взяться))

Ты лучше сначала прочитай сайт, от начала до конца, в общем теории побольше, а потом уже принимайся за очередной макет. Практика должна разбавляться теорией, обязательно. Чтобы было эффективнее.

[fragilewelldone]

Я уже прочитал сайт и пару книг)

Сразу все не запомнишь) Поэтому в процессе практики я частично захожу "В раздел теории".

Спасибо еще раз.

[Mr.Black]

Уже работает.....

Посмотрел я код, и

1) зачем добавлять <?xml version ="1.0" encoding="UTF-8"?> , и делать доктайп в две строки.

2) это сематика и читабельность кода желает лучшего

3) Еще в IE7 в глаза кинулось http://imageshack.us/photo/my-images/135/25980801.png/, лучше было б сделать картинкой только лупу.

4) В IE6 верстка идет, но на даном етопе для тебе єто не очень важно, да и ослик 6 свое уже отжил.

5) Шрифты и расстояние (line-height) очень разнится между IE9 и IE7.

6) Еще в опере 10 посмотри шапка немного едет

По сути за верстку можно дать 6 из 10

Edited November 12, 2011 by Mr.Black

[fragilewelldone]

3) Еще в IE7 в глаза кинулось http://imageshack.us...5/25980801.png/, лучше было б сделать картинкой только лупу.

Дело в том что в PSD был всего один слой, и вырезать картинку я не стал.

С остальным полностью согласен, но 6 из 10 это слишком много, я бы поставил 4 или 3, потому что мог сделать лучше, но доводить до "лучше" не очень хотелось(может в будущем...)).

Спасибо)

Edited November 12, 2011 by fragilewelldone