Jump to content

Приму любую критику! Оцените верстку пожалуйста!


migunov88
 Share

Recommended Posts

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

Просто не стоит совершать совсем уж вопиющих ошибок, о которых можно почитать здесь http://htmlforum.ru/index.php?showtopic=47375

Edited by Bassline
  • Like 1
Link to comment
Share on other sites

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

Просто не стоит совершать совсем уж вопиющих ошибок, о которых можно почитать здесь http://htmlforum.ru/index.php?showtopic=47375

А можно конкретно указать на ошибки?) Кроме того, что я использовал один айдишник, больше ничего не нашел.

Link to comment
Share on other sites

FF 39

 

post-61936-0-14439800-1437026933_thumb.ppost-61936-0-04396400-1437026943_thumb.p

 

javascript лучше убрать в отдельный файл

 

post-61936-0-36135700-1437026954_thumb.p

 

А вообще есть атрибут placeholder может стоить его использовать, а если браузер не поддерживает то навешивать свои велосипеды?

Link to comment
Share on other sites

FF 39

 

attachicon.gifScreenshot_4.pngattachicon.gifScreenshot_5.png

 

javascript лучше убрать в отдельный файл

 

attachicon.gifScreenshot_6.png

 

А вообще есть атрибут placeholder может стоить его использовать, а если браузер не поддерживает то навешивать свои велосипеды?

спасибо огромное :) Учту ошибки

Link to comment
Share on other sites

1) То, что вы в курсе про uppercase, уже хорошо, но в вёрстке всё-таки не надо отходить от правила 1 класса начальной школы, что предложения надо писать с заглавной буквы;

2) "В корзине 2 товара на 27 700" на 27 700 чего?

3) Кнопка "Добавить в корзину" не работает

4) Зачем каждый третий товар прибивать вправо?

Link to comment
Share on other sites

1) То, что вы в курсе про uppercase, уже хорошо, но в вёрстке всё-таки не надо отходить от правила 1 класса начальной школы, что предложения надо писать с заглавной буквы;

2) "В корзине 2 товара на 27 700" на 27 700 чего?

3) Кнопка "Добавить в корзину" не работает

4) Зачем каждый третий товар прибивать вправо?

1) А как по другому? Поясните пожалуйста.

2) 27 700 было по макету, руб. там не было)

3) А как она должна работать? Она кликабельна и hover присутствует)

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

 

P.S. спасибо за критику!

Edited by migunov88
Link to comment
Share on other sites

1) Я ж написал: писать предложения с заглавной буквы. В вёрстке они у вас все прописные в шапке.

2) Это косяк дизайнера, за таким нужно следить. Позиция "моя хата с краю, ничего не знаю" очень плохая, и её лучше не придерживаться.

3) Почему не пересчитывается стоимость и количество товара в корзине?

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

Edited by antonKar
Link to comment
Share on other sites

3) Почему не пересчитывается стоимость и количество товара в корзине?

Это же верстка, подозреваю что перерасчёт и прочий функционал уже дело программиста =)

Link to comment
Share on other sites

перерасчёт и прочий функционал уже дело программиста

Пересчёт цены и количества товара на стороне клиента не такая уж и непосильная для верстальщика задача.  

Edited by antonKar
Link to comment
Share on other sites

Пересчёт цены и количества товара на стороне клиента не такая уж и непосильная для верстальщика задача.

 

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

  • Like 1
Link to comment
Share on other sites

 

А никто не говорил цены присылать серверу, я только про отображение данных имел в виду

 

о_О а зачем тогда этот бесполезный функционал нужен?

 

 

К сожалению я пока не умею писать на java скрипте)

Link to comment
Share on other sites

а зачем тогда этот бесполезный функционал нужен?

А мы сейчас обсуждаем уже готовый боевой сайт?

 

Сейчас данные никакие не отправляются, потому что их некуда отправлять, это вёрстка. Когда будет что отправлять и куда, тогда и будем отправлять. А заготовку пересчёта цен и количества можно сделать и на этапе вёрстки.

Link to comment
Share on other sites

А заготовку пересчёта цен и количества можно сделать и на этапе вёрстки.

 

Вот отсюда и вопрос, зачем это делать? Зачем верстальщику зря тратить время на реализацию добавления товара в корзину и перерасчета суммы заказа если это ещё просто верстка? Для наглядности? так для наглядности вполне достаточно просто текста "3 товара на 1000 рублей". 

  • Like 1
Link to comment
Share on other sites

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

Вы так говорите зря, как будто оно вправду зря.

 

1. У ТС это первая вёрстка, а JS автор вёрстки не знает, так что проработка хоть какой-то динамики на странице абсолютно 100% не будет сделана зря им.

2. Сейчас можно сделать отдельно функцию, меняющую количество товара и цену в шапке, которая будет на входе принимать DOM-элемент, новую цену и новое количество товара. Если ТС возьмёт в привычку сразу же прорабатывать какие-то очевидные моменты, то потом в продакшене ему это хорошо аукнется (в положительном смысле).

Link to comment
Share on other sites

antonKar, согласен с wwt, данный функционал - лишнее в верстке, более того, я вообще верстаю только каркасы, а доверстываю с функционалом cms уже на сервере (локальном).

 

А вообще есть атрибут placeholder может стоить его использовать, а если браузер не поддерживает то навешивать свои велосипеды?

Хз, хз..., стилей очень много получается, а там всего одна строчка на js.

<form action="#" method="get">     <input type="text" name="search" value="введите поисковой запрос" onfocus="if(this.value=='введите поисковой запрос')this.value=''" onblur="if(this.value=='')this.value='введите поисковой запрос'" class="search-txt left">     <input type="submit" name="search-btn" value="поиск" class="search-btn left"></form>
.search .input_search::-webkit-input-placeholder {	font: normal 12px Trebuchet MS;	color:#898989;}.search .input_search::-moz-placeholder {	font: normal 12px Trebuchet MS;	color:#898989;	height: 35px;	line-height: 35px;}.search .input_search:-moz-placeholder {	font: normal 12px Trebuchet MS;	color:#898989;	height: 35px;	line-height: 35px;}.search .input_search:-ms-input-placeholder {	font: normal 12px Trebuchet MS;	color:#898989;	height: 35px;	line-height: 35px;}.search .input_search:focus::-webkit-input-placeholder {color: transparent;}.search .input_search:focus::-moz-placeholder {color: transparent;}.search .input_search:focus:-moz-placeholder {color: transparent;}.search .input_search:focus:-ms-input-placeholder {color: transparent;}
Link to comment
Share on other sites

 

antonKar, согласен с wwt, данный функционал - лишнее в верстке, более того, я вообще верстаю только каркасы, а доверстываю с функционалом cms уже на сервере (локальном).

 

А вообще есть атрибут placeholder может стоить его использовать, а если браузер не поддерживает то навешивать свои велосипеды?

Хз, хз..., стилей очень много получается, а там всего одна строчка на js.

<form action="#" method="get">     <input type="text" name="search" value="введите поисковой запрос" onfocus="if(this.value=='введите поисковой запрос')this.value=''" onblur="if(this.value=='')this.value='введите поисковой запрос'" class="search-txt left">     <input type="submit" name="search-btn" value="поиск" class="search-btn left"></form>
.search .input_search::-webkit-input-placeholder {	font: normal 12px Trebuchet MS;	color:#898989;}.search .input_search::-moz-placeholder {	font: normal 12px Trebuchet MS;	color:#898989;	height: 35px;	line-height: 35px;}.search .input_search:-moz-placeholder {	font: normal 12px Trebuchet MS;	color:#898989;	height: 35px;	line-height: 35px;}.search .input_search:-ms-input-placeholder {	font: normal 12px Trebuchet MS;	color:#898989;	height: 35px;	line-height: 35px;}.search .input_search:focus::-webkit-input-placeholder {color: transparent;}.search .input_search:focus::-moz-placeholder {color: transparent;}.search .input_search:focus:-moz-placeholder {color: transparent;}.search .input_search:focus:-ms-input-placeholder {color: transparent;}

Хотя ты прав по поводу плейсхолдера, подзабыл я что IE его только с 10 умеет, а если эмулировать нормально то слишком много кода выходит.

 

Но javascript я все же вынес бы в файл со скриптами, а не инлайном писал.

Link to comment
Share on other sites

<nav class="navigation clearfix">
  <a href="#">Главная</a>
  <a href="#">Блог</a>
  <a href="#">Доставка</a>
  <a href="#">Оплата</a>
  <a href="#">Контакты</a>
  <a href="#">Работа у нас</a>
  <div class="main-cart right">
     <p>В корзине 2 товара на 27 700 руб.</p>
  </div>
</nav>
 
.navigation {
background: -webkit-linear-gradient(#335989, #01316c);
background: -moz-linear-gradient(#335989, #01316c);
background: -ms-linear-gradient(#335989, #01316c);
background: -o-linear-gradient(#335989, #01316c);
}
.navigation a {
display: block;
float: left;
padding: 15px;
color: #fff;
font: 11px Tahoma, Arial, sans-serif;
text-transform: uppercase;
}
.navigation a:hover {
background: -webkit-linear-gradient(#28476d, #032957);
background: -moz-linear-gradient(#28476d, #032957);
background: -ms-linear-gradient(#28476d, #032957);
background: -o-linear-gradient(#28476d, #032957);
}
.main-cart {
background: -webkit-linear-gradient(#545454, #010101);
background: -moz-linear-gradient(#545454, #010101);
background: -ms-linear-gradient(#545454, #010101);
background: -o-linear-gradient(#545454, #010101);
}
.main-cart p {
margin: 0;
color: #fff;
font: 12px Tahoma, Arial, sans-serif;
}

 

Помогите сверстать меню, никак не могу понять как сделать так, чтобы блоки были одинаковой высоты (((

 

menu.jpg

 

задать одинаковый padding или line-height 

 

Шрифты то разные...одинаковый padding никак, будет опять слезать правый блок...С line-height  тоже не очень понятно...

Edited by migunov88
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