Бэуграунды - сверху, светлый с простой текстуркой, снизу (у футера) - просто белая заливка,
посередине - фон с узором (не паттерн) и рваными верхним краем.
Кстати, чуть выше есть блок с той же текстурой и верхними и нижними рваными краями:
Как быть с этой довольно сложной текстуркой, искать повторяющийся участок и тиражировать его? И как при этом добиться рваных краев...
сверху можно сделать прозрачный png-24bit с белыми волнами на прозрачном фоне
снизу - без новомодных, мало где работающих масок не обойтись.
Так, что или забейте на часть своих пользователей у которых такой css не заработает - или заставьте дизайнера нарисовать так, чтобы можно было кроссбраузерно сверстать
На бело-коричневой границе паттерн из гифа, у которого верхняя часть непрозрачная с белым паттерном (верхняя прямоугольная граница на таких шумах незаметна), а нижняя часть прозрачная, но цвет matte не дефолтный белый, а цвета коричневого фона. Будет немного шумновато, но визуально незаметно.
На нижней картинке придётся использовать полупрозрачный png.
