Оцените верстку?

Question

[Диас Галымбек]

Сверстал один макетик на фигме. Прошу оценить и подсказать, где у меня основные ошибки, что подучить и так далее.
Ссылка на макет фигму на самом сайте в левом верхнем углу Free files
Ссылка на сайт --> https://github.com/diasgalymbek47/Valorant

Примечание: размер макета 3099px на 2333px желательно смотреть в уменьшенном размере экрана браузера

Начал изучать верстку активно 3месяца назад, до этого был знаком поверхностно, чисто смотрел видосы в ютубе.

Comments

[Ankhena]

В браузере 25% или 33% экрана.

По-хорошему, на этом можно закончить просмотр.

Знаете, валидатор с ошибками, в коде бардак и т.д. - это всё не так страшно, как ваша фраза из цитаты.
Сайт на любом экране должен выглядеть нормально. Не выпирать, не разваливаться, быть читаемым и используемым.

[Виталий Першин]

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

position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 2660px;
height: 1716px;

[Одиночка Айс]

3099px на 2333px - это для кого вообще?

[xdevelx]

Хотя бы у бутстрапа посмотрите, как работает dropdown меню https://getbootstrap.com/docs/5.3/components/navbar/
У вас оно раскрывается только при клике на стрелку и клик должен отрабатывать на button или элемент с role="button", но никак не на обычный span с иконкой

Фиксированные width и height убирайте

Шрифт один подключен локально с одним только форматом ttf, второй - через гугл фонтс.

Изображения 3 штуки по 500kB и одно больше мегабайта.

Вообщем рано выставили сайт на оценку. Там косяк на косяке. Все находить и объяснять никто не будет.

[Модератор]

Не надо лепить как можно больше тэгов.
См.п.3.1 Регламента. Также обратите внимание на п.3.4

Answer 1

[psiklop]

Хз че за стиль, меняешь размер окна - не адаптации не скролла.

Answer 2

[Станислав]

Довольно странно брать чужие работы, портить их и спрашивать "ребят, а как вам моя верстка?" Вы из HTML хотя бы копирайт убрали бы :)

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

Comments

[Диас Галымбек]

Это же верстка по макету при чем тут копипасти текста из макета))

[Станислав]

Диас Галымбек, Я написал "при чем" он здесь.

[psiklop]

Вы ошибаетесь, макет делает дизайнер, верстает по нему либо верстальщик либо этакий фуллстек разработчик. И да, сделать правильную верстку не легче макета, а просто расставить теги - ну это значит и макет был фуфло.

[Станислав]

Диас Галымбек, хотите оценки конкретно верстки? 7 из 10 (если не брать в расчет тот факт, что нет адаптивности). Если вы планируете быть верстальщиком, то должны понимать, что есть заказчики, которые будут придираться даже к тому, что у вас border-radius 3, а не 4 и oplicaty не 0.85, а 0.84, хотя по вашему может быть и выглядит лучше. В целом я повторюсь, нужно искать свой стиль и верстать "придуманные" макеты - это действительно сложно в верстке, а HTML + css можно хорошо освоить за 2 - 3 недели (от и до).

[Станислав]

psiklop, как много компаний в которых есть и дизайнеры и "HTML программисты" и отдельные люди, которые пишут выпадающие менюшки на JS? В 99% случаев всё это совмещает один человек. Нужно быть реалистом и учить то, что действительно нужно.

[psiklop]

Станислав, да ну, я знаю про фулстек разрабов, я сам недавно верстал макет с фигма, попросил дать мне сверстать хотя требовалось только настроить функционал. В принципе справился, но у меня был опыт фронтэнда.

Блин, но что могли не поделить кодеры и художники? Просто в вашей компании нет повышенных требований к внешнему виду и устраивает какой-нибудь обычный бутстрап. Черт у них даже инструменты разные, у одного photoshop и все семейство программ adobe, у другого всякие эклипсы справочники по php и js

[psiklop]

Станислав, стандартная менюшка - не работа дизайнера, а брать его на работу 99% не нужно, это разовая работа, и он сам это понимает.

[psiklop]

Станислав, как не печально, но выходит как-то так, некто берущий менюшки из бутстрапа, а код копипастом отсюда, где его написал сеньор, считает себя мега-универсалом, а по сути он вообще не тот и не другой, даже фулстек это перебор, а еще если считает, что он может и кодить и рисовать - просто буратино (либо Леонардо). А еще бывают разрабы-менеджеры, еще и управляют.

[Ankhena]

Станислав,

а HTML + css можно хорошо освоить за 2 - 3 недели (от и до).

Хе-хе ))

С теми кто считает, что года опыта достаточно, уже более или менее весело проводить собеседования.
А с теми, кто за 2-3 недели, совсем тоскливо.

Не стоит так обнадеживать людей.

[Hellanio]

Станислав, Т.е по вашему фронтэнд, бэкенд и дизайнеры это миф?) Верстальщик, а уж тем более фронтэнд программист не выдумывает макет из головы. Этим занимается дизайнер.

[Виталий Першин]

Что за бред вы придумали? Работа верстальщика/фронта заключается в том чтобы создать html/css/js из дизайна который ему предоставят. Он ни в коем случае не должен придумывать свой стиль, в серьезных компаниях ему вообще не позволят работать с графикой, все будет рисоваться через дизайнера.

[Вадим]

Станислав, Ждём Вашего авторского курса "HTML & CSS с нуля до гуру за 2 недели"

[Ярослав Александров]

Автор комментария - я такого бреда давно не читал, удалите и не позорьтесь

[Станислав]

Вадим, Ankhena, по вашему сколько времени нужно на изучение валидных HTML тегов и базового CSS, несколько лет, десять лет? Мне смешно видеть комментарии, когда люди пишут, что HTML и CSS это тяжело и требует значительного времени. Возможно как раз с вами что то не так, если для вас CSS и HTML - это тяжело. Интересно, на тот же dot.net у вас бы ушло лет 50 на изучение?

[Вадим]

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

хорошо освоить за 2 - 3 недели (от и до)

Ну и определились бы сначала.

Хорошо освоить от и до

или все таки

на изучение валидных HTML тегов и базового CSS,

?
Между этими формулировками - пропасть.
Сходу стали соскакивать...
Так что во имя сообщества, пожалуйста, воздержитесь от таких высказываний, не морочьте новичкам голову.

[Ankhena]

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

Когда ваш уровень выйдет из "за 2 - 3 недели (от и до)" и вы хоть как-то сможете оценить реальный объем, можно и продолжить.

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

[Станислав]

Ankhena, я всё же останусь при своем мнение касательно того, что HTML + CSS - это не сложная технология, опять же, каждому своё. Если для вас нужно 2 - 5 лет для изучения HTML + CSS, то это ваше личное дело.

[Ankhena]

Станислав, я не удивилась ;)

[Hellanio]

Ankhena, Так и представляю собеседование с человеком)
- Расскажите о вашем опыте?
- Да я ваш фронтэнд за 2 недели прошел.