И так обычно при разработке сайтов есть две версии (это пример как у меня) папка ля разработки в ней все разбито на отдельные (css(less)/html/js/картинки) и т.д.
Что, где? fonts - шрифты, less(все файлы less разбитые по страницам/модулям), img(логично - картинки, ну и там внутри разбито - иконки, фоны, обычные картинки и т.д.) js(там все скрипты по файлам), ну и moduls (разбиты повторяющиеся html блоки аля header/footer/aside которые просто подключаю в нужном мне месте)
Это все папка, чисто для меня для разработки.
Ну и вторая папка так называемая продакшен
Там уже собственно весь js собран в один файл main.js/ css в main.css, сжатые картинки, убраны комментарии кода, ну и т.д.(тобишь, то к чему в дальнейшем буду писать бек/епредавать заказчику.)
То есть, то что пойдет в общий доступ. Обычно передаю обе версии (продакшен - ну логично, а вторая на случай если будут дописывать функционал/править, ну и т.д.)
Ну а теперь ответ как правильно все это оформлять?
Тут вам точного ответа никто не даст - разве, что общие рекомендации - так как разбивка и т.д. проводиться, чисто для удобства разработчика (как вам будет удобней работать.)
P.S. Насчет мобильной версии, ну тут довольно логично делаем файлик media(ну или любое другое название)
И просто пишем к нему медиа запросы - тоже довольно логично)
Простой
