Jump to content

Портфолио продолжается))


psywalker
 Share

Recommended Posts

Вот сегодня закончил верстать один макетик, хочу поделится им с вами, а точнее хотелось-бы по традиции услышать ваши мнения насчёт всего кроме дизайна. Интересует Только код!.

Выкладываю на обсуждение, потому что работа не стандартная, думаю многим будет интересно даже просто взглянуть, я например раньше такие вещи не делал, а особенно для ИЕ6 пришлось постараться :D

http://psywalker.ru/Portfolio/Chiropractor.../main-page.html :o

Link to comment
Share on other sites

И почему везде бытует мнение, что в СПА-салон ходят только особы женского пола? :D

По теме:

<a href="#">
<img src="img/fly.png" alt="" />
Chiropractor Salon
<span>the best professional services for your youth</span>
</a>

1) Мне кажется кощунством, вставлять спан в а. Да и по валидации ето неправильно.

<!-- right_bg -->
<div class="right_bg"></div>
<div class="left_bg"></div>

2) Вполне можно обойтись и без этих дивов. Сложней, но зато код красивей будет.

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

1. Лого

2. Зона контента

3. Меню

4. Правая колонка(со всякой фигней)

5. Футер

<address>
11 Street Second Floor<br />
New York WA 02020<br />

Tel: 1(800) 111-1111<br />
<span>E-mail: <a href="#">OurSalon@info.com</a></span>
</address>

4) Зачем ты три раза использовал бр, а только на четвертый - спан??

5) 42

Edited by Павел Билькис
Link to comment
Share on other sites

Павел Билькис

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

1)

  Quote
1) Мне кажется кощунством, вставлять спан в а. Да и по валидации ето неправильно.

Нет, не кажется, он там к месту и что тут такого, никогда не думал, что это неправильно?

2)

  Quote
2) Вполне можно обойтись и без этих дивов. Сложней, но зато код красивей будет.

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

3)

  Quote
3) Почему у тебя правая колонка идет первая по коду, а не левая? По идее семантики кода, должен быть такой порядок дивов.

1. Лого

2. Зона контента

3. Меню

4. Правая колонка(со всякой фигней)

5. Футер

Потому что так я делаю трёхколоночный, как правило, это занимает меньше кода и прибавляет мне большую свободу и гибкость на поле. Что в этом плохого?

4)

  Quote
Зачем ты три раза использовал бр, а только на четвертый - спан??

потому что спан там нужен для другого цвета шрифта, в котором ещё и ссылка тоже с отличием цвета

5)

  Quote
42

Не понял?

Link to comment
Share on other sites

Потому что так я делаю трёхколоночный, как правило, это занимает меньше кода и прибавляет мне большую свободу и гибкость на поле. Что в этом плохого?

Простой пример: я загляделся на атомный гриб над Морквой и ослеп. А мне хочется каждый божий день читать около 25 блогов. Есть специальная программа которая озвучивает сайты. Я захожу на absolvo.ru и жду когда программуля прочитает холодным женским голосом меню, партнеры и прч. Именно поэтому надо с начало поставить лого, потом контент а потом все остальное.

  psywalker said:
Не понял?

http://ru.wikipedia.org/wiki/%D0%9E%D1%82%...%BE%D0%B3%D0%BE

Link to comment
Share on other sites

Павел Билькис

1)

  Quote
Простой пример: я загляделся на атомный гриб над Морквой и ослеп. А мне хочется каждый божий день читать около 25 блогов. Есть специальная программа которая озвучивает сайты. Я захожу на absolvo.ru и жду когда программуля прочитает холодным женским голосом меню, партнеры и прч. Именно поэтому надо с начало поставить лого, потом контент а потом все остальное.

Боюсь щас далеко не всех заботят программки такого рода, да и Дима тоже не исключение.

2)

  Quote

Как это относится к вёрстке?

Link to comment
Share on other sites

  psywalker said:
Павел Билькис

1)

Боюсь щас далеко не всех заботят программки такого рода, да и Дима тоже не исключение.

2)

Как это относится к вёрстке?

Знаешь Паш, я заметил за тобой одну вещь, ты всегда отличался своими странными темами:

Пример: Человек просит оценить код и вёрстку, а ему пишут: "42" :D и понимай как хочешь)))

Link to comment
Share on other sites

Павел Билькис - кофе убивает в таких количествах, судя по ответам процесс уже пошел :(:D

psywalker - отличный код, <span> в ссылке никто не запрещал, не понимаю откуда у Павла такая инфа...

Про порядок инфы в коде в принципе согласен, это важно не только для слепых, но и для seo оптимизации.

Еще лично я не очень люблю использование <br />, но откуда это пошло уже не помню... :( И не встречал давно напоминаний :D Так что нормуль все.

Тебе, psywalker, уже пора самому оценивать чужой код! :o

Link to comment
Share on other sites

  Searcher said:
Павел Билькис - кофе убивает в таких количествах, судя по ответам процесс уже пошел

psywalker - отличный код, <span> в ссылке никто не запрещал, не понимаю откуда у Павла такая инфа...

Про порядок инфы в коде в принципе согласен, это важно не только для слепых, но и для seo оптимизации.

Еще лично я не очень люблю использование <br />, но откуда это пошло уже не помню... И не встречал давно напоминаний :D Так что нормуль все.

Тебе, psywalker, уже пора самому оценивать чужой код! :(

Спасибо тебе дружище в 100-ый раз за то, что ты никогда мимо не проходишь.

1) Насчёт <span> в ссылке тоже нареканий ни разу не слышал, поэтому и удивился сам.

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

3) По поводу <br /> не считаю, что его нельзя или не семантично использовать, правда стараюсь делать это редко, в случаях на подобии моего, где в элементе адрес нужно сделать прерывание строки в определённом месте, вместо того, что-бы использовать лишние теги

4)

  Quote
Тебе, psywalker, уже пора самому оценивать чужой код! :D

Вот насчёт этого пока ещё согласиться не могу, так как считаю, что ещё не готов выйти на большую арену, так как опыта мало ещё, такк стараюсь что-то, вроде выходит, значит двигаюсь в правильном направлении, но думаю мне ещё долго нужно будет познавать эту науку, но всё равно спасибо за мнение :o

Link to comment
Share on other sites

Зато моя жизнь стала просто неральной :D Я голосом выключаю компьтер, во сне общаюсь на форуме. При одном только желании вокруг меня появляются полуобнаженные нимфы. Газовую плиту я поджигаю пальцем хД

Link to comment
Share on other sites

2) Поисковики кушают не всю страницу, а только первую часть, размер первой части зависит от поисковика. А если в начале страницы куча слабо имеющей отношение к теме сайта инфы, то поисковик скушает только эту дребедень и в нечетких поисковых запросах место этого сайта будет на —--ысячной странице :D

У тебя уникальная для этого сайта информация идет в самом низу, а до этого почти неиндексируемая инфа. Это конечно не совсем хорошо...

Павел, похоже, не только кофе пъет... :o

Link to comment
Share on other sites

Searcher

  Quote
Поисковики кушают не всю страницу, а только первую часть, размер первой части зависит от поисковика. А если в начале страницы куча слабо имеющей отношение к теме сайта инфы, то поисковик скушает только эту дребедень и в нечетких поисковых запросах место этого сайта будет на —--ысячной странице smile.gif

У тебя уникальная для этого сайта информация идет в самом низу, а до этого почти неиндексируемая инфа. Это конечно не совсем хорошо...

Спасибо, я понял, а какой вариант можешь предложить, желательно пример трёхколоночного макета :D

Great Rash

  Quote
Код посмотрел мельком, вроде косяков нет, а углубляться не хочется. В способностях автора сомнений нет smile.gif

Спасибо дружище, я старался :o

Link to comment
Share on other sites

  shvv said:
Кажется, что нужно поставить больший min-width, поскольку пропадает ощущение воздушности. Хотя, наверное, это больше про дизайн. Или на стыке.

Да это у меня есть такая привычка, ненавижу вообще ширину и стараюсь сделать как можно меньше, если бы вообще без неё получилось и сайт бы сузился до 1мм, я был бы не против :)

Link to comment
Share on other sites

  psywalker said:
Да это у меня есть такая привычка, ненавижу вообще ширину и стараюсь сделать как можно меньше, если бы вообще без неё получилось и сайт бы сузился до 1мм, я был бы не против :)

Если макет портфолио то, что сейчас находится по ссылке в первом посте, то *ля буду, где то уже видел этот шаблон.

Link to comment
Share on other sites

  Verder said:
Если макет портфолио то, что сейчас находится по ссылке в первом посте, то *ля буду, где то уже видел этот шаблон.

Да, это он и есть, но где ты его мог видеть? :)

http://psywalker.ru/Portfolio/Chiropractor.../main-page.html

Link to comment
Share on other sites

  psywalker said:
Да, это он и есть, но где ты его мог видеть? :)

http://psywalker.ru/Portfolio/Chiropractor.../main-page.html

Где-то на просторах инета :( Помоему это произведение от наших то ли корейских, то ли китайских "коллег" :(

Link to comment
Share on other sites

  Verder said:
Где-то на просторах инета :) Помоему это произведение от наших то ли корейских, то ли китайских "коллег" :(

Порылся в инете, смари чё намутил: https://www.bulkwebtemplate.com/web-templat...salon/457.phtml :(

Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
 Share

  • Обсуждения

    • Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ    
    • Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com   Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ   Портфолио https://www.behance.net/d4d4186e
    • Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение.  .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } }  
    • Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок.
×
×
  • 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