Хорошая верстка с точки зрения:
- пользователя - верста должна выглядеть естественно, все должно быть на своих местах и не "скакать";
- менеджера проекта - семантика для поисковой выдачи и довольный пользователь;
- дизайнера - полное соответствие дизайн-макету (пиксель перфект);
- верстальщика - полное соответствие ТЗ и дизайн-макету + пройденый валидатор;
- клиентского программиста - зависит от программиста, но мне, как клиентскому программисту, былобы приятно просто "скопипастить" разные части верстки и вставлять их в шаблоны без лишних правок;
- серверного программиста - ну для сервера - чем меньше весит верстка тем лучше;
Если я правильно понял вопрос, то основная проблема (она же особенность) кроется в стилях:
- мертвый код;
- коллизия имен стилей;
- и, возможно, что-то еще;
По опыту верстки: в начале моего пути это БЭМ наименования классов в верстке + препроцессоры. Когда перешел на React, начал использовать библиотеку CSS-in-JS (styled-components), которая, на равне с CSS-modules, решает проблему коллизии имен. Опыта верстки крупных многостраничных сайтов нет. Те проекты, которые представлены в Ответе на Q8, не считаю большими.
Требовалось поддерживать современные браузеры (и IE11+) и устройства с шириной экрана от 360р. Основные особенности тут:
- медиа запросы и количество контрольных точек (разрешений экрана);
- использование относительных единиц измерения и технологии flexbox для резиновой верстки;
- для оптимизации, верстка по принципу "сначала мобильные"; Пример адаптивной верстки по принципу "сначала мобильные": https://tomcxa.github.io/adaptive__diplom-surface/
В качестве проверки результата использовался браузерный devtools и телефон на базе андроид. В качестве инструментов редактор с настроенной инфраструктурой (webpack).
Экономить время помогают: редакторы кода (я использую Visual Studio Code) и расширения к ним, фронтенд инфраструктура типа webpack+babel, браузер и его средства разработки.
Я воспользуюсь DevTools, а конкретно, исследую элемент и там уже выясню в чем проблема. С такими проблемами сталкивался и решал их.
В зависимости от абстоятельств, либо пообщаюсь с дизайнером если это возможно, либо начну импровизировать если у дизайнера творческий кризис.
Ресурсы:
- онлайн университет нетология https://netology.ru/programs/front-end (закончил программу);
- много youtube каналов (в том числе и на инглише);
- мой любимый youtube канал: https://www.youtube.com/channel/UCg8ss4xW9jASrqWGP30jXiw;
- сайты типа habr.com, medium.com, https://developer.mozilla.org/, https://learn.javascript.ru/;
- интерактивные курсы типа codecademy.com (закончил курсы по python, html+css);
- книги: Выразительный JavaScript,
Вы не знаете JS:
- типы и грамматические конструкции
- замыкания и объекты
- асинхронность и производительность
- поисковики;
Направления развития, которым хочется заниматься: JS-программирование (frontend-разработчик на react еще svelte нравится).
Чем интересуюсь:
- спорт (в основном футбол);
- компьютерные игры;
- кино, сериалы;
- современные гаджеты и технологии;
- инвестиции в ценные бумаги;
- возможно что-то еще...
Опыт разработки около года, приближенный к комерческому с использованием инфраструктуры типа git, webpack, ci/cd и т.д. Закончил обучение, по программе "frontend-разработчик с нуля", онлайн университета "НЕТОЛОГИЯ" (подробнее с программой можно ознакомиться по ссылке: https://netology.ru/programs/front-end).
Примеры проектов:
- Магазин обуви (React): https://tomcxa.github.io/bosa-noga-frontend/
- Приложение для контроля финансов (JS): https://tomcxa.github.io/bjs-diplom/
- Доска типа Trello (JS, DnD): https://tomcxa.github.io/CanbanDesk/
- Загрузчик картинок (JS, DnD) + свой сервер поэтому возможны баги при первой загрузке... : https://tomcxa.github.io/imgLoader/
- Тудушка (JS, удаление, добавление, редактирование, изменение статуса, просмотр подробностей) + свой сервер поэтому возможны баги при первой загрузке... : https://tomcxa.github.io/HelpDesk/
- Адаптивная верстка (HTML, CSS): https://tomcxa.github.io/adaptive__diplom-surface/
- И многое другое на странице гитхаб https://github.com/tomcxa
Не пью, не курю!