Для создания дизайн-макета сайта с резиновой вёрсткой рекомендуется:

• Задавать ширину блоков в процентах. 1 Проценты считаются от ширины родительского блока. 1 Если поместить такой блок внутрь body, то его ширина будет пропорциональна ширине экрана. 1
• Комбинировать элементы резиновой и фиксированной вёрсток. 1 Например, в макете голубые полоски могут быть резиновыми и занимать всю ширину экрана, а блок по центру соответствовать фиксированной вёрстке. 1
• Использовать минимальную возможную ширину блока. 1 Если задать ширину блока в процентах, то при сжатии окна блок также будет сжиматься. 1 Чтобы остановить этот процесс, можно задать минимальную ширину блока. 1
• Пропорционально изменять ширину и высоту блоков. 1 Для этого нужно поставить высоту блока 0px, а padding-top равным ширине. 1

Для создания резинового дизайна можно использовать графический редактор Figma, в котором предусмотрены шаблоны для разных разрешений экранов (фреймы). 3 Достаточно выбрать подходящий и расположить в рабочей области, а сервис сам задаст параметры ширины и высоты. 3

Для более подробной консультации по созданию дизайн-макета для сайта с резиновой вёрсткой рекомендуется обратиться к специалисту.