Дмитрий Кирсанов - Веб-дизайн

рис. 58Создание бесшовного фона перестановкой четвертей. Обратите внимание, как заметны стали в (б) нестыковки деталей фона между четвертями 4 и 2, 4 и 3

После этого измененное изображение будет, по сути, представлять собой фрагмент плоскости, заполненной исходным изображением — причем фрагмент этот выбран так, что на нем видны углы четырех соседних копий изразца. Разумеется, повторение этого изображения в окне броузера даст совершенно тот же результат, что и повторение исходного (с точностью до сдвига на половину его горизонтального и вертикального размера). Однако теперь края изразца уже не требуют никакой доводки, так как они только что были созданы заново разрезанием «по живому», — а все стыки, которые нужно замазать, теперь, наоборот, находятся внутри.

Из всех методов производства бесшовных фонов этот — самый гибкий и удобный, так как он позволяет пользоваться для уничтожения следов стыка любыми инструментами рисования, размывкой, растушевкой и т. п. Единственное, о чем следует помнить, — это то, что вы должны работать очень аккуратно в тех областях, где обрабатываемые стыки подходят к новым (после перестановки четвертей) границам изображения (например, на левом конце границы между четвертями 4 и 2 или на верхнем конце границы между четвертями 4 и 3 на рис. 58, б). Дело в том, что здесь вы можете по неосторожности ввести новые дефекты, которые, опять–таки, станут заметны только после размножения фона на плоскости.

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

Чтобы сделать аккуратный шов, этому методу нужен «запас материала» по краям прямоугольной «заплаты». Представьте, что вдоль внешних сторон выделения, которое надлежит превратить в бесшовный фоновый изразец, вырезаны четыре полоски определенной ширины (рис. 59, а). Затем каждая из этих полосок перенесена к внутреннему краю противоположной стороны и там наложена поверх старого изображения (рис. 59, б).

При этом прозрачность перенесенной полоски равна 50 % на самом краю и постепенно увеличивается вплоть до полной невидимости по направлению к центру прямоугольника. Прозрачность же того фрагмента изображения, который оказался под полоской, наоборот, уменьшается на этом отрезке от 50 % до нуля (рис. 59, в). Если вы мысленно покроете плоскость копиями такого изображения, то увидите, как соседние прямоугольники склеиваются друг с другом с помощью этих «клапанов». Очевидно, что для применимости этого метода нужно, чтобы по краям выделенной области, которую вы хотите превратить в элемент фона, оставалось достаточно места для выкраивания клапанов (как правило, их ширина составляет около 20 % от размера выделения). Этот метод дает хорошие результаты для нечетких, размытых текстур, не содержащих отчетливых деталей и контрастных переходов. Однако если изображение содержит текст или псевдотрехмерный рельеф, результаты будут, скорее всего, неудовлетворительными, так как в этом случае наложение одной копии изображения на другую слишком заметно для глаза.

Рис. 59Создание бесшовного фона «клапанами» с градиентами прозрачности. «Поперечное сечение» фоновой плитки (в) показывает, как в полученном этим методом фоне соседние изразцы частично накладываются друг на друга, так что на линии шва видимость каждого из них составляет по 50 %

Одномерные фоны.Как же превратить фон из вернейшего признака любительского, «побрякушечного» оформления в инструмент профессионального веб–дизайна? Одновременно избавляясь от назойливой повторяемости элементов фона и координируя фоновую графику с содержимым переднего плана, мы приходим к нескольким типичным схемам построения фонового слоя веб–страницы.