ThunderCat

Насколько такой подход к разработке правильный?

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

В сегодняшних реалиях такой подход для новых проектов неприемлем, так как это лишняя работа и лишний код отдельно для мобильной версии, что еще и обслуживание усложняет. Все делают мобайл фирст верстку (так как ~80% траффика это мобилы), и сразу адаптив, так как современный цсс делает это на раз-два. Короче, сейчас так не делают.

Навряд ли многие люди так уменьшают окошко браузера вручную и для чего это нужно...

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

https://codepen.io/jo-asakura/pen/NWWrWj
https://web.archive.org/web/20160921141817/http://...

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

2) Цсс такая штука, специально придуманная для того, чтобы если завтра мода на круглое сменится модой на квадратное, то "легким движением руки брюки превращаются в элегантные шорты". И для этого не понадобится перепердоливать стотыщь картинок обратно в квадраты.

3) В обратную сторону так же работает - для смены дизайна с квадрата на круг достаточно просто скруглить углы контейнера.

4) Сделать тумб с "круглым видом" программно сложнее чем с квадратным.

5) Артефакты при нарезке из квадратного в круглое смотрятся хуже, чем, по сути, векторная маска, наложенная на цельное квадратное изображение.

Короче, не зря делают.

PS: На дом - научиться самостоятельно искать аргументы в пользу / против какого-либо замеченного технологического приема.

display: flex;
align-items: end;

Как избежать накопление неиспользуемого CSS-кода в ходе жизни и развития сайта?

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

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

1) Использовать медиа запросы и уменьшить размер шрифта/пробелы в меню
2) Браузер все равно будет уменьшать окно, зафиксировать можно только размер основного блока, окно будет просто иметь горизонтальный скролл.

1) ctrl+ "-" ctrl+ крутить колесико мышки вниз/вверх
2) Справа от разрешения есть масштаб, сделайте ~80% и все влезет.

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

Для отладки и проверки можно использовать mail() с заранее вставленными правильными данными, не через форму, и проверить работает ли вообще эта функция, и потом уже делать выводы.

Пару строчек на jquery. Можете переписать в ваниллу, суть одна.

<div id="DivContent"></div>
<script src="jquery.js"></script> 
    <script> 
    $(function(){
      $("#DivContent").load("another_file.html"); 
    });
    </script>

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

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

в 2020 нет. Приходите после пандемии.

В идеале так должно быть ТОЛЬКО если это компонент, формируемый программно, то есть каждый раз разное содержимое, в остальных случаях - вынести в файл и загружать из файла.
Это даст а) Кэшируемость, и б) асинхронность загрузки.

Насколько оправдано использование в html - php include?

Не оправдано. По умолчанию на большинстве серверов код пхп не выполняется внутри html файлов. Вы можете это настроить в конфигурации сервера, но это не рекомендуемое поведение. Обычно, если вы хотите использовать код, файлы изначально именуются с расширением php, что, впрочем, не мешает им содержать чисто хтмл без кода.

По вашему вопросу - да, код (в том числе и разметка) может и должен быть разбит на значимые повторяемые блоки. Так же читайте про шаблонизацию и разделение кода и представления.

шо делать?

Сдаваться, вариантов нет...

Установил sublime, всё настроил,

Видимо не все

и почему-то в хтмл файле не отображается ничего

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

И в bacground url я раньше вбивал путь к папке с картинкой, сейчас же даже в подсказках ничего не пишет.

Папка видимо не помечена как ресурс, и background про нее не в курсе.

1) https://www.google.com/search?q=free+landing+page+...
2) https://www.google.com/search?q=%D1%80%D0%B0%D0%B7...

https://habr.com/ru/post/42151/