И снова буду рад выслушать ваше мнение)

Joyfit · August 26, 2012

Думаю в ближайшие дни выкатить новую версию своего портфолио, хотелось бы услышать ваше мнение/возможные косяки, которые я не доглядел)

Линк

Edited August 26, 2012 by Joyfit

ShumNo · August 26, 2012

шрифт в шапке не для чтения лучше уж вердана, но все равно не спасет
Слово "привет" выглядит как "hello world" вы в интернете, да еще и с вырвиглаз тенью
фон в шапке ни о чем
"Делал классные штуки для:" не солидно и не профессионально
слишком темно
контактная информация должна быть у таких сайтов на виду, а не где-то там за тридесят земель 100500 ссылками
копирайты унылые

Joyfit · August 26, 2012

Спасибо за советы, постараюсь учесть их)

ar00 · August 26, 2012

Действительно, ой:

По поводу стилей - css можно было бы сделать в 1.5 - 2 раза короче. Лучше не используй названия цветов типа "black, white". И используй общие свойства типа "font", "background".

А также группируй одинаковые свойства, например:

.blog-nav li:first-child:before{content: url('../images/blog-back.png');}
.blog-nav li:last-child:after{content: url('../images/blog-forward.png');}
.blog-nav li:first-child:before, .blog-nav li:last-child:after {opacity: 0.5; margin: 0 5px 0 2px; }
.blog-nav li:first-child:hover:before, .blog-nav li:last-child:hover:after {opacity: 1 !important;}


.b-header {
    background: black; /*лишнее - убери*/
    background: rgba(0, 0, 0, 0.6);
    overflow: hidden;
    color:white;
    width:100%;
    position: fixed;
    z-index:10;
    top:-67px;
}
.b-header__logo {
    font-family: "Source Sans Pro", serif;
    font-size:20px;
    display: block;
    -webkit-text-shadow: 1px 1px 1px black;
    -moz-text-shadow: 1px 1px 1px black;
    text-shadow: 1px 1px 1px black;
    float: left;
    margin:6px 0 5px;
    color:white;
    text-decoration: none;
}

По поводу вёрстки - <!DOCTYPE HTML>, и ни одного HTML5 тега..

<ul class="b-works__list"> - делать через ul, с моей точки зрения, странно.

IE 7-8 нужен фон прозрачной картинкой

Edited August 26, 2012 by ar00

hedgehog · August 27, 2012

По поводу вёрстки - <!DOCTYPE HTML>, и ни одного HTML5 тега..

А зачем нужны другие доктайпы (кроме частных случаев)?

<ul class="b-works__list"> - делать через ul, с моей точки зрения, странно.

Почему странно, если это список тизеров? Чем его еще делать?

Joyfit · August 27, 2012

Какой браузер с версией на скрине?) где ни чекаю все ок) только н айпаде говорили похожая беда)

hedgehog · August 27, 2012

Какой браузер с версией на скрине?) где ни чекаю все ок) только н айпаде говорили похожая беда)

Да в любом при уменьшении ширины окна браузера. Поэтому, кстати, на айпаде багло вылазит сразу: разрешение и размеры экрана - небольшие.

Joyfit · August 27, 2012

Спасибо, поправил)

cyklop77 · August 27, 2012

Лучше не используй названия цветов типа "black, white".

а зачем?

Svatov · August 27, 2012

Какой браузер с версией на скрине?) где ни чекаю все ок) только н айпаде говорили похожая беда)

ССЫЛКА

По поводу общего восприятия портфолио, мне очень понравилось. Чистенько и аккуратно, вся нужная информация на главной странице с примерами работ в очень популярном на сегодня стиле (всяких аппсторов и метро дизайна). Контактная находится там, где ей и место. На самом деле, если вы разрабатывали интерфейс то у вас хорошо получилось. Единственное замечание это к тексту и неуместном приветствии на разных языках...выглядит нелепо. Не нужно рассказывать про себя так много, достаточно 2 или 3 предложения с акцентом на самые сильные ваши стороны, не надо втюхивать и навязывать свои услуги как любят маркетологи, если и хотите рассказывать про себя, то лучше сделать ссылку на более подробную информацию.

Edited August 27, 2012 by Svatov

ar00 · August 27, 2012

По поводу вёрстки - <!DOCTYPE HTML>, и ни одного HTML5 тега..
А зачем нужны другие доктайпы (кроме частных случаев)?
<ul class="b-works__list"> - делать через ul, с моей точки зрения, странно.
Почему странно, если это список тизеров? Чем его еще делать?

Я к тому что если используешь DOCTYPE html, то можно использовать и HTML5 разметку - она понятней, удобней, современней.

Тем более что автор предоставляет услуги по вёрстке сайтов... Не оптимизированный CSS и то что автор не использует html5 теги плохо повлияют на его репутацию как верстальщика.

Да ещё и не проходит валидацию W3.org - Result: 33 Errors, 2 warning(s).

В данном случае, Я бы сделал список тизеров с помощью <div>.

Так же в firefox скроллер начал себя очень странно вести, и во всех браузерах наблюдается "волшебная полоска" справа.

Svatov · August 27, 2012

Я к тому что если используешь DOCTYPE html, то можно использовать и HTML5 разметку - она понятней, удобней, современней.
Тем более что автор предоставляет услуги по вёрстке сайтов... Не оптимизированный CSS и то что автор не использует html5 теги плохо повлияют на его репутацию как верстальщика.

HTML5 теги: <header><section><article><nav><aside><footer> - это еще не весь HTML5. Вы можете их использовать или не использовать это еще ни о чем не говорит. Потрудитесь объяснить в чем вам они приносят

понятней, удобней, современней.

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

Joyfit · August 27, 2012

Мда уж, с полоской справа получился косяк) буду искать в чем беда)

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

По поводу тизеров: я сделал их списком потому что это можно сказать список моих работ) имхо вполне логично)

С текстом я еще планирую что-то поразмыслить, если прийдет в голову как там все оформить получше не ломая всю идею, то поправлю)

Еще раз всем спасибо за обсуждение

ar00 · August 27, 2012

Потрудитесь объяснить в чем вам они приносят

Моя точка зрения такова - зачем использовать старое, если можно использовать новое. Это приносит дополнительный опыт (как минимум). Тем более что в ближайшие годы html5 будет практически везде использоваться. Можно выразиться так: "вёрстка на будущее".

hedgehog · August 27, 2012

Моя точка зрения такова - зачем использовать старое, если можно использовать новое. Это приносит дополнительный опыт (как минимум). Тем более что в ближайшие годы html5 будет практически везде использоваться. Можно выразиться так: "вёрстка на будущее".

Что значит "зачем использовать старое"? Это вы уже хотите сказать, что разметка документа должна состоять из html5 тегов? HTML5, по большей части, несет в себе дополнительные теги, расширяющие семантику документа. Более того, их не особо рекомендуют использовать непосредственно для разметки и стилизации.

Так что же устарело, кроме доктайпа?

ar00 · August 27, 2012

Моя точка зрения такова - зачем использовать старое, если можно использовать новое. Это приносит дополнительный опыт (как минимум). Тем более что в ближайшие годы html5 будет практически везде использоваться. Можно выразиться так: "вёрстка на будущее".
Что значит "зачем использовать старое"? Это вы уже хотите сказать, что разметка документа должна состоять из html5 тегов? HTML5, по большей части, несет в себе дополнительные теги, расширяющие семантику документа. Более того, их не особо рекомендуют использовать непосредственно для разметки и стилизации.
Так что же устарело, кроме доктайпа?

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

P.S.:Есть отдельные личности, которые до сих пор верстают таблицами...

cyklop77 · August 27, 2012

которые до сих пор верстают таблицами...

да есть. яндекс например

Edited August 27, 2012 by cyklop77

eis · August 28, 2012

Rambler тоже

Joyfit · August 28, 2012

Rambler тоже

Я тебя огорчу - уже не верстает на таблицах рамблер)Это все пережитки прошлого)

amelice · August 29, 2012

Не вижу кодировку сайта. У вас префикс b, встречается во всех названиях классов кроме .clear в документе, может его не надо?

Sign In

И снова буду рад выслушать ваше мнение)

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information