Семантика, разметка, наименование. Как выглядит идеальная разметка?
1. p — для набора параграфов, если это не он, то можно смело брать span.
2. Классы на p → идеально, исключением составляет пользовательский ввод.
3. Класс строго по БЭМ (ну почти).
4. Флексбоксами действительно не стоит бездумно злоупотреблять, так как всегда есть риск выстрелить себе в ногу.
5. PP → в макете стоит искать закономерности и их релизовывать, но проверять на переполнение, так как пользовательский ввод не дремлет.
6. position: absolut; → position: absolute;
7. Отступы всецело зависят от контекста, например если тебе надо сделать карточку с фоноцветом, то скорее всего ты применишь padding, дабы были отступы от краев.
Я использую только div, span и список. Ну и там по мелочам a, img. Потому что семантика эта вся нужна не для дизайна, а для текста на сайте. А если это дизайн сайта, то всякие p и другие попросту не нужны. А если делаешь сайты сам, то делай как тебе удобнее. Я к примеру, сам теги иногда придумываю, к примеру <mytag></mytag> для группировки элементов. Глупо, но мне удобнее