Двойное дно

Еще один недостаток табличного позици­онирования — невозможность наложения элементов друг на друга (иными словами, расстояние между двумя объектами не может быть отрицательным). Изобретательные дизайне­ры и здесь нашли выход из положения: неповторяющиеся фоновые изображения (стр. 283) становятся в их компози­циях самостоятельным слоем, содержимое которого так или иначе соотносится с элементами переднего плана. К сожа­лению (стр. 194), совмещения с точностью до пиксела при этом достигнуть не удается; однако и то, что есть, позволяет добиться интересных результатов (пример 1). Прием этот вполне допустим в тех случаях, когда он пре­следует чисто художественные цели. Иногда, однако, в фон выносится часть значимой информации страницы, в неко­торых случаях — текст и даже ссылки, реализуемые с по­мощью прозрачных графических вставок, залинкованных и наложенных на нужные области фона. Такое трюкачество одобрить уже нельзя — «выпавшая на дно» информация безвозвратно теряется для невизуальных броузеров и ав­томатических сборщиков информации: ведь даже если бы у фонового изображения был свой alt-текст, его место

237

в линейном текстовом эквиваленте страницы определить было бы невозможно.

Белое место

Возможности табличной верстки были бы сильно ограничены, если бы дизайнер не мог управлять расстоянием между содержимым ячеек. Интервалы вокруг всех ячеек одновременно можно менять с помощью атрибутов cellspacing и cellpadding тега TABLE (чаще всего оба эти атрибута обнуляются). Но чтобы раздвинуть всего некое заранее заданное расстояние отдельно взятую пару объектов, между ними нужно поставить какую-то распорку.

Общепринятый способ изготовления распорок (тот самый, изобретенный Сигелем) основан на том, что, если указан­ные в атрибутах width и height размеры изображения не совпадают с его естественными размерами (записанными в самом GIF- или JPEG-файле), броузер обязан масштаби­ровать это изображение до размеров, указанных в HTML. Достаточно, таким образом, взять полностью прозрачный GIF-файл минимальных размеров — 1 на 1 пиксел — и при­писать ему требуемую ширину (не забыв указать height=l, чтобы подавить пропорциональное увеличение высоты) или, соответственно, высоту (не забыв width=l) — и мы полу­чим невидимую графическую вставку требуемых размеров, вполне годящуюся на роль распорки.

Достаточно иметь единственную копию такого однопиксельного GIF'a на весь сайт; HTML-файлы могут содержать сколько угодно не мешающих друг другу ссылок на эту копию с указанием разных размеров. Важно также не забы­вать указывать alt="" при всех таких распорках (как и при любой другой служебной графике), чтобы не раздражать «исподним» визуального форматирования тех, кому нужен лишь текстовый образ вашей страницы.

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

238

самого высокого элемента текущей строки; гарантирован­ную вертикальную раздвижку можно получить, вставив между элементами вертикальную распорку, с обеих сторон отбитую тегами BR). В частности, в абзацах текста гра­фическими распорками можно пользоваться для имитации абзацных отступов и даже для увеличения интерлиньяжа (в последнем случае по вертикальной, одинаковой высо­ты распорке нужно поставить вплотную к каждому слову текста); сейчас, к счастью, ничто не мешает пользовать­ся CSS для достижения тех же результатов без всяких распорок.

Если вы никак не можете разобраться в странностях поведения невиди­мых распорок на ваших страницах, для отладки можно порекомендовать такой прием: заведите еще один однопиксельный GIF-файл, но не про­зрачный, а какого-нибудь яркого цвета, и временно подставьте его вместо прозрачного пиксела в тот каталог, где у вас хранятся изображения. Все не­видимые распорки при этом станут видимыми, и расставить их по местам будет намного легче.

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

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