Задать вопрос
@Nevada18

Мнение о верстке?

Доброго времени суток!
Прошу оценить мою верстку и сказать, какие есть косяки и недостатки моего творения.
Ссылка.
Пункт меню "Каталог товаров" рабочий.

P.S. Буду рад найти людей, которые начинают свой путь разработчика для общения, обмена опытом и мнениями. Приветствуются и старшие товарищи, желающие поделиться опытом, попробовать себя в роли наставника в некоторых вопросах или просто "поболтать о фронте":)
  • Вопрос задан
  • 359 просмотров
Подписаться 2 Оценить 2 комментария
Пригласить эксперта
Ответы на вопрос 4
webirus
@webirus
Тыжверстальщик! Наверстай мне упущенное...
На линуксе всё довольно грустно, относительно верстки.
Думаю, основная проблема со шрифтами, которые не подцепились правильно.
Из-за этого некоторые блоки "едут" основательно.

Вообще, верстку оценивать нужно по макету - так было, так стало.
Трудно оценить верстку, когда не знаешь, как оно должно выглядеть в оригинале.

Буду рад найти людей, которые начинают свой путь разработчика для общения, обмена опытом и мнениями.

И что начинающие могут обсудить? Только косяков наплодите компашкой.

Приветствуются и старшие товарищи, желающие поделиться опытом, попробовать себя в роли наставника в некоторых вопросах или просто "поболтать о фронте":)

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

В общем, моя рекомендация такова.
1) Относительно помощи - найти работу или команду, которая возьмет джуниора.
2) Относительно верстки - больше тестировать в разных браузерах и системах.

44261d7f879e414d9f5b155111373da7.png
Ответ написан
Комментировать
@m1roku
Начинающий
Да это ж макет с htmlacademy с интенсива базовый, вроде, там должны быть наставники которые дают код ревью и даже болтают с учениками.
Оплати курс и найдешь себе собеседников. Не обязательно этой школы, есть другие.
Ответ написан
Комментировать
Exploding
@Exploding
wtf?
Качество верстки, как по мне, помимо кроссбраузерности, это "стресс-тест", как она поведет себя в разных условиях, а не так как нарисовал дизайнер.
Вот как бы, на скорую руку... картинка не адаптируется, line-height описания не оправданно большой, заголовки разным шрифтом на разных страницах... вобщем скрин...
7342e80c12494e4f83ada41ac7b5952a.jpg
И раз уж в разметке Вы стараетесь следовать семантике/seo-френдли, так следуйте ей во всем, а не только nav/footer и че-то там еще...
Поиск че-то не открывается. Как я буду искать корзинки?))
Ответ написан
Krasnodar_etc
@Krasnodar_etc
fundraiseup
Сразу скажу, что ты ж просил недостатки указать, а не хвалить) У меня первый сайт был в разы хуже.

Каталог товаров: Решение с классами left-center-right очень неудобное.
Представь, что у тебя таких товаров куча и берутся они из базы (то есть точное число ты не знаешь, выводятся в цикле) . Надо будет ставить костыль, чтоб задавать эти классы корректно.
А адаптивность? Тебе нравится им флоаты убирать?) Выглядит не круто.
Читай про flexbox , это просто и универсально

Чтоб не было такой шляпы, как показал Exploding на скрине, карточкам фиксируют высоту.
Для картинок - если картинка - фон, то background-size: cover/contain;
Кстати, в данном случае всё таки я бы поставил тэг img , а не фон. И центрировал картинку через флексы или
position: relative
transform: translate(....)


Кнопка на видео. Нельзя менять ей ширину и высоту. По многим причинам, можно погуглить их. В данном случае идеально подойдёт transform: scale(...)

Теперь по главной:
"Коротко о нас" - загуглить таки flexbox и не делать костыль из двух списков больше никогда))
position: absolute для таких целей надо стараться не применять, это плохая практика как-минимум из-за адаптивности
Я смотрю, что у тебя почти все svg позиционированны отступами и абсолютом. Не надо так, серьёзно.

Обёртка div.wrapper - не знаю, зачем она тебе, но... пусть чтоли main.wrapper будет. И логичнее и html5
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы