Jump to content

Сверстал свеженький макетик


shvv
 Share

Recommended Posts

  • 1 month later...
  • Replies 117
  • Created
  • Last Reply

Top Posters In This Topic

Отлично, давно пора уже.

Изучил пару книг с момента последней цитаты, сверстал пару макетов, решил выложить и испросить экспертного мнения, улучшилось ли что в уровне качества верстки, в области семантики; по всей строгости и суровости, как полагается. Ссылка: http://newbie-asd.narod.ru/index.html

Персонально тов. Psywalker'у: макет UTA переверстал, но так как по сути вышло примерно то же самое, что и в выложенном тобою образце, то смысла повторно выкладывать на обсуждение не вижу

Кому интересен сам макет в png, могу выложить

Link to comment
Share on other sites

Эй, товарщи модераторы(да и не только), ну нет у меня 30-ти сообщений для создания новой темы для нового макета, флудить просто так(чем щас приходится заниматься, может хоть кто то откликнется) я не люблю, но не хорошо же вот так человека игнорить, я ж очень прошу, пожалуйста, посмотрите мое творение!Мастер без критики - дело без прогресса!

Link to comment
Share on other sites

Я готов посмотреть, что оценить надо? Уж я заценю будте уверены :)

Вот сверстал макет http://newbie-asd.narod.ru/index.html, просто сообщений до отдельной темы не хватает, вот и пристроился тут боком к товарищу; а оценить - качество верстки в целом(лаконичность кода(т е не много ли всего)) и семантику; жду любой, самой суровой критики, рекомедаций, но по делу и конкретно, а не так что мол все отстой; спасибо что откликнулся!

Я готов посмотреть, что оценить надо? Уж я заценю будте уверены :)

Вот сверстал макет http://newbie-asd.narod.ru/index.html, просто сообщений до отдельной темы не хватает, вот и пристроился тут боком к товарищу; а оценить - качество верстки в целом(лаконичность кода(т е не много ли всего)) и семантику; жду любой, самой суровой критики, рекомедаций, но по делу и конкретно, а не так что мол все отстой; спасибо что откликнулся!

Link to comment
Share on other sites

<h1><a class="logo" href="#"><img class="logo" src="images/logo.png" alt="logo"></a></h1>

Вот тут можно было б обойтись без класса на картинке (<img>).

<label>User Login</label> 
User Name:
<input class="text" type="text" value="enter your name">

у инпута должен быть атрибут name, а у лейбла - for, а у <form> должен быть атрибут method.

Блок "News & Updates" я бы сделал при помощи списка определений (<dl><dt><dd>), а не городил бы параграфы с дивами вперемешку.

А че у вас сразу "News & Updates", "Some lines about us" и "Photo Gallery" разные заголовки (<h3> и <h2>)? По контексту они должны быть заголовками одного уровня.

<div id="space"> 
</div>

Это что еще за кака? Семантика говорите?

<p> 
<a class="purpose" href="">Conubia nostra per inceptos</a>
<a class="purpose" href="#">Etiam porta ullam sodales libe</a>
<a class="purpose" href="#">Lobortis ac mauris mauris</a>
<a class="purpose" href="#">Sed varius ante roin sed</a>
</p>

Что мешает сделать этот кусок списком? (<ul>)

<p> 
<a href="#"><img src="images/gallery_chess.gif" alt="chess"></a>
<a href="#"><img src="images/gallery_jug.gif" alt="jug"></a>
<a href="#"><img src="images/gallery_roulette.gif" alt="roulette"></a>
<a class="button" href="#">view more</a>
</p>

Тут аналогично...

Блок "Creative Story" тоже можно сделать при помощи списка определений.

<a class="button g" href="#">read more</a>

Эти кнопки все-таки нужно сделать по методу "раздвижных дверей" (см. Google). А то мало ли какой в них текст впихнуть захочет заказчик.

А вообще макетик приятный. Только тень от коня есть, а от слона тень дизайнер пририсовать забыл... могли бы и поправить, продублировав тень от коня. Ну не резина опять же...

Верстка нормальная, только не ясно почему вы выбрали именно такой доктайп?

Link to comment
Share on other sites

<h1><a class="logo" href="#"><img class="logo" src="images/logo.png" alt="logo"></a></h1>

Вот тут можно было б обойтись без класса на картинке (<img>).

<label>User Login</label> 
User Name:
<input class="text" type="text" value="enter your name">

у инпута должен быть атрибут name, а у лейбла - for, а у <form> должен быть атрибут method.

Блок "News & Updates" я бы сделал при помощи списка определений (<dl><dt><dd>), а не городил бы параграфы с дивами вперемешку.

А че у вас сразу "News & Updates", "Some lines about us" и "Photo Gallery" разные заголовки (<h3> и <h2>)? По контексту они должны быть заголовками одного уровня.

<div id="space"> 
</div>

Это что еще за кака? Семантика говорите?

<p> 
<a class="purpose" href="">Conubia nostra per inceptos</a>
<a class="purpose" href="#">Etiam porta ullam sodales libe</a>
<a class="purpose" href="#">Lobortis ac mauris mauris</a>
<a class="purpose" href="#">Sed varius ante roin sed</a>
</p>

Что мешает сделать этот кусок списком? (<ul>)

<p> 
<a href="#"><img src="images/gallery_chess.gif" alt="chess"></a>
<a href="#"><img src="images/gallery_jug.gif" alt="jug"></a>
<a href="#"><img src="images/gallery_roulette.gif" alt="roulette"></a>
<a class="button" href="#">view more</a>
</p>

Тут аналогично...

Блок "Creative Story" тоже можно сделать при помощи списка определений.

<a class="button g" href="#">read more</a>

Эти кнопки все-таки нужно сделать по методу "раздвижных дверей" (см. Google). А то мало ли какой в них текст впихнуть захочет заказчик.

А вообще макетик приятный. Только тень от коня есть, а от слона тень дизайнер пририсовать забыл... могли бы и поправить, продублировав тень от коня. Ну не резина опять же...

Верстка нормальная, только не ясно почему вы выбрали именно такой доктайп?

обо всем по поядку:

1.Класс уберем

2.У input и label это обязательные атрибуты по умолчанию?С form лоханулся;) кстати по ходу дела вопрос:что прописывается в реальном сайте в атрибуте action(если есть ссылка на какую-нить инфу, буду признателен)

3.С dd, dt, dl еще не сталкивался, попробую переделать

4.Заголовки в png макете разных размеров, потому я их и в верстке разными сделал

5.

<div id="space"> 
</div>

- это как часть метода прижатия footer'а, но в общем-то он действительно ни на кой болт не нужен; если знаете другой корректный и более красивый метод, буду рад узнать о таковом(это вопрос!)

6."Переходный HTML более «спокойно» относится к некоторым огрехам кода, поэтому этот тип использовать предпочтительнее. " - цитата из "Шаг за шагом" с сайта htmlbook.ru, поэтому такой и использовал, а какой более уместный?

7.Спасибо за потраченное на анализ моего труда время!Надеюсь получить ответы на заданные здесь вопросы.И еще раз прошу прощение за нарушение порядков раздела, дотяну до 30-ти, а там...

Link to comment
Share on other sites

У input и label это обязательные атрибуты по умолчанию?

А вы проверьте валидатором. Только проверяйте методом непосредственного ввода (direct input), а то со вставками Народа, ни один сайт валидацию не проходит.

В режиме strict эти атрибуты обязательны, а на счет transitional не знаю.

В атрибуте action пишется путь до файла-обработчика формы. Например:

<form action="test.php" method="post">

при сабмите этой формы все данные, отправленные на сервер, будут обрабатываться скриптом test.php

при верстке макета и передаче его программисту я лично предпочитаю оставлять этот метод пустым (как у вас и сделано впрочем)

Заголовки в png макете разных размеров, потому я их и в верстке разными сделал

а, внатуре... ну тогда извиняюсь, не заметил

Вообще я противник прижимания футера, но если заказщику надо, то никуда не денешься... В таком случае, наверное этот <div> оправдан...

"Переходный HTML более «спокойно» относится к некоторым огрехам кода, поэтому этот тип использовать предпочтительнее. " - цитата из "Шаг за шагом" с сайта htmlbook.ru, поэтому такой и использовал, а какой более уместный?

Я бы эту фразу убрал с сайта... Предпочтительней режим strict, а "некоторых огрех" в коде быть не должно.

Link to comment
Share on other sites

сделайте страницу валидной потом будем дальше *оценивать* ;)

А все валидно, только с transitional в Doctype(щас под strict по совету Great Rush подгоняю) и через direct input или file upload в validator, а через uri из-за того что яндекс бороду какую-то вешает, не проходит валидацию

Link to comment
Share on other sites

Не понял, а чего проверять и оценивать?

Шаблон с Template Monster (или какого-то подобного ресурса, не помню где видел) к которому вы не имеете ни малейшего отношения, за исключением пары измененных вами тэгов?

Эх, сказал бы я, да обещал не выражаться.

Link to comment
Share on other sites

Может человек сам верстал... Да у них там есть верстка готовая, но это еще ничего не значит.

Но это ж бред. Лучше свое сделать, а так получается что в любом случае будешь периодически смотреть на их верстку.

UPD. Нихрена он не сам врестал, глянь на названия и комменты в коде. Чисто шаблонный вариант, продажный.

Link to comment
Share on other sites

Не понял, а чего проверять и оценивать?

Шаблон с Template Monster (или какого-то подобного ресурса, не помню где видел) к которому вы не имеете ни малейшего отношения, за исключением пары измененных вами тэгов?

Эх, сказал бы я, да обещал не выражаться.

Уважаемый, я конечно понимаю ваши претензии, но не принимаю их не разу.Как вы считаете, человек которому нравится верстать и который хочет на перспективу работать в области web технологий будет выкладывать сверстанный КЕМ-ТО КРОМЕ НЕГО САМОГО макет?Для того что ли чтоб прибавить работы модераторам или занять зевак? Если хотите, выложу вам ссылку на сверстанный макет, прилагавшийся к папке с шаблоном(то есть к которому я действительно не имею ни малейшего отношения), результат я думаю будет внятно различим

Link to comment
Share on other sites

Может и так. Только вроде как на сайте Templatemonster предлагают XHTML-верстку, а у Newie стоит HTML transitional.

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

Хотя глянул тут на CSS - явно оттуда...

Newie, колитесь сами делали или нет?

Link to comment
Share on other sites

Уважаемый, я конечно понимаю ваши претензии, но не принимаю их не разу.Как вы считаете, человек которому нравится верстать и который хочет на перспективу работать в области web технологий будет выкладывать сверстанный КЕМ-ТО КРОМЕ НЕГО САМОГО макет?Для того что ли чтоб прибавить работы модераторам или занять зевак? Если хотите, выложу вам ссылку на сверстанный макет, прилагавшийся к папке с шаблоном(то есть к которому я действительно не имею ни малейшего отношения), результат я думаю будет внятно различим

Мотивы у всех разные.Выложи пожалуйста.

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

Просто сразу такие вещи видно.

Newie, как по английски правильно будет построить фразу - "Истребители уходили из-под обстрела скольжением".

Если будет перевод типа транслейт.ру я сразу пойму.

Edited by Verder
Link to comment
Share on other sites

Но это ж бред. Лучше свое сделать, а так получается что в любом случае будешь периодически смотреть на их верстку.

UPD. Нихрена он не сам врестал, глянь на названия и комменты в коде. Чисто шаблонный вариант, продажный.

что лучше самому сделать?нарисовать шаблон в png?навыков дизайнера в себе пока что не обнаружил, уж извините!И что не так в коде? И почему-бы не взять комменты на вооружение(я например их видел, когда смотрел видос на sdelaysite.com? или по-вашему это уже плагиат?)?удобно по-моему, или вы используете ТОЛЬКО свои мозги и постоянно изобретаете велосипед?

Может и так. Только вроде как на сайте Templatemonster предлагают XHTML-верстку, а у Newie стоит HTML transitional.

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

Хотя глянул тут на CSS - явно оттуда...

Newie, колитесь сами делали или нет?

Про сам не сам я уже Verder'у думаю обстоятельно объяснил, и что же у меня с css теперь не так?рекомендация использовать комменты взята с сайта cssschool.ru подробнее http://www.w3school.ru/blog/css/improving-...tyleguides.html

Link to comment
Share on other sites

что лучше самому сделать?нарисовать шаблон в png?навыков дизайнера в себе пока что не обнаружил, уж извините!И что не так в коде? И почему-бы не взять комменты на вооружение(я например их видел, когда смотрел видос на sdelaysite.com? или по-вашему это уже плагиат?)?удобно по-моему, или вы используете ТОЛЬКО свои мозги и постоянно изобретаете велосипед?

Уход от ответа. Более доказательств не требуется.

Извини, но я не один год в этом бизнесе и такие вещи вижу за милю.

Да, когда делаю сайт я использую ТОЛЬКО свои мозги. Названия тегов и комменты тоже сам называю. Сетку тоже сам делаю.

В данном случае мы видим верстку, измененную максимум на 5%. Это не плагиат?

Link to comment
Share on other sites

Уход от ответа. Более доказательств не требуется.

Извини, но я не один год в этом бизнесе и такие вещи вижу за милю.

Да, когда делаю сайт я использую ТОЛЬКО свои мозги. Названия тегов и комменты тоже сам называю. Сетку тоже сам делаю.

В данном случае мы видим верстку, измененную максимум на 5%. Это не плагиат?

вот тебе пока http://narod.ru/disk/18847134000/index.html.html и http://narod.ru/disk/18847133000/style.css.html рисунки догрузятся ссылки кину

Link to comment
Share on other sites

вот тебе пока http://narod.ru/disk/18847134000/index.html.html и http://narod.ru/disk/18847133000/style.css.html рисунки догрузятся ссылки кину

А зачем мне это? Я сейчас нашел в гугле, по ключевым словам Artificial Casting оригинальный макет. CSS один в один практически, HTML тоже. Я ж говорю, разница 5-10% максимум между оригинальной и твоей версткой.

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

Edited by Verder
Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
 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