Dmitry

https://unused-css.com/blog/css-shake-animation/

Чтобы не было, например, "обрезаний" при разных разрешениях экрана или "дополнения" пустых мест его дублированием

Геометрия говорит нам, что если пропорции блока и изображения не совпадают, то возможны три варианта:
- поля
- обрезка лишнего
- искажение пропорций

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

Но кроме пропорций, есть ещё поддержка форматов и плотность пикселей. Так что, сложность тут не одна.

Какие размеры файла желательны (в байтах)?

Минимальные. При этом нужно сохранять достаточное качество.

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

Для ретины и разных форматов файлов используйте image-set
Для разных размеров - @media
Для оптимизации размеров - форматы webp, avif

Без обрезки никак. Сами должны понимать. Если пропорции экрана отличаются от пропорций изображения, то обрезка будет по-любому.

Если это какой-то абстрактный фон, то без разницы. Берем несколько картинок разного размера (чтобы на мобилах не грузить лишнего) и подключаем их через медиа-запросы.

Если на фоне есть какой-то объект, то желательно, чтобы он был в центре (из-за обрезки по краям) и нужны два варианта изображения - вертикальное и горизонтальное. Так же через медиазапросы (portrait/landscape) подменяем. Плюс несколько размеров (2-3) под разрешение экранов, с учетом ретины - 2х.

Размер файла должен быть минимальным, это очевидно. Также очевидно, что точный желательный размер вам никто не скажет. Для уменьшения веса файла используйте конвертацию в webp формат.

Редактировать код компонентов Joomla можно, подключившись по FTP. Нужно понимать структуру этого компонента, а также структуру самой джумлы - это подскажет, где какие файлы лежат. Можете найти в телеграме чат "Joomla для профессионалов": там дружеский коллектив, всегда кто-то откликается на вопросы, или можно найти исполнителей на платной основе.

Для начала выбросить WP и сделать нормально.
Но в общем случае:
Создаете форму со всеми вопросами и показывает по одному, переключая через JS вопросы. В конце отправляете всю форму.
или
Если следующий вопрос зависит от ответа на предыдущий, то отправляете ajax-ом каждый вопрос отдельно и в ответе с бэкенда возвращаете следующий вопрос. Все необходимые данные (типа ID вопроса) можно хранить и обновлять в data-атрибутах.