Как создавать превьюшки в верстаке
Эта страница в первую очередь КАТЕГОРИЧНО необходима тем, кто выкладывает свои модели. Если вы выкладываете полноразмерные фото на страницу, вы в первую очередь наказываете себя - потому что люди, сидящие на диал-апе и медленных каналах, просто не станут прокачивать все эти сотни килобайт, и в итоге не станут смотреть вашу модель. Оно вам надо? Если нет, то тогда изучайте нижеследующую матчасть.
1. Подготовка фотографий
Отберите фотографии для публикации. Уменьшите их размер, если это необходимо. (Помните, что фотографии работ, предназначенных для конкурса, не должны превышать 800х600 пикселей для одинарных фотографий и 1024х768 пискелей для мозаичных (собранных из нескольких) фото). Используйте степень сжатия jpg от 6 до 8 - так, чтобы один кадр имел объем не больше 100 килобайт.
Все вышеописанные манипуляции (уменьшение линейного размера кадра и задание степени его сжатия) можно выполнять как в программах типа Photoshop, так и в многочисленных программах-просмотровщиках (например, ACDSee версии 4.0 и старше).
Подготовьте комплект кадров-превьюшек (желательно с размером по длинной стороне 160 пикселей). Для вашего же удобства полезно, чтобы картинки и превьюшки с них назывались однотипно, например: полномасштабная - 1.jpg, 2.jpg, а превьюшки - 1s.jpg, 2s.jpg.
2. Создание страницы-исходника
Вам придется создать в верстаке ДВЕ страницы - первую (страницу-исходник) и вторую (страницу модели).
Займемся созданием страницы-исходника.
В верстаке создайте страницу, куда и поместите попарно полноразмерные кадры и превьюшки. Для вашего же удобства полезно, чтобы основная страница модели и страница-исходник назывались однотипно, например, БТ-7 и БТ-7_pict.
Полностью создав страницу-исходник, откройте ее в отдельном окне.
3. Размещение превьюшек на странице модели
Теперь нужно создать отдельно ВТОРУЮ страницу (страницу модели).
Разместите на этой странице заголовок, заглавное полноразмерное фото (одно) и нужный вам текст. Дойдя до места, где вы хотите вставить превьюшки, щелкните правой клавишей мыши и в выпавшем контекстном меню выберите пункт "вставить HTML".
Скопируйте следующий код и вставьте его в открывшийся параграф:
<DIV>
<DIV align=center>
<CENTER>
<TABLE cellSpacing=10 width=120 border=0>
<TBODY>
<TR>
<TD vAlign=top align=middle width=160><A href="Полный адрес полноразмерной картинки1">
<IMG src="Полный адрес картинки-превьюшки1"> </A></TD>
<TD vAlign=top align=middle width=160><A href="Полный адрес полноразмерной картинки2">
<IMG src="Полный адрес картинки-превьюшки2"> </A></TD>
<TD vAlign=top align=middle width=160><A href="Полный адрес полноразмерной картинки3">
<IMG src="Полный адрес картинки-превьюшки3"> </A></TD>
<TD vAlign=top align=middle width=160><A href="Полный адрес полноразмерной картинки4">
<IMG src="Полный адрес картинки-превьюшки4"> </A></TD>
</TR>
<TR>
<TD vAlign=top align=middle width=160><I>Текст подписи к картинке1</I></TD>
<TD vAlign=top align=middle width=160><I>Текст подписи к картинке2</I></TD>
<TD vAlign=top align=middle width=160><I>Текст подписи к картинке3</I></TD>
<TD vAlign=top align=middle width=160><I>Текст подписи к картинке4</I></TD>
</TR>
</TBODY></TABLE></CENTER></DIV></DIV>
Это полный список кода для таблицы, в которой размещены четыре превьюшки и четыре подписи к ним, например, как здесь:
| | | |
| Народ отогрелся, ожил, и пошел развлекаться -... | ... кто - снимать хозяйскую полку с моделями... | ...кто - общаться за коньячком... | Саша Хонанов: -Мне! Можно я... коньячку... |
Адреса картинок и превьюшек берутся со страницы-исходника (_pict) - щелкнув правой клавишей мыши на картинке, выберите из выпадающего меню графу Properties (Свойства) и скопируйте адрес (выделите мышкой, нажмите на клавиатуре Ctrl+C). Вставьте адрес в нужное место кода (установив курсор между кавычками и нажав Ctrl+V). Кавычки в коде должны сохраниться.
При необходимости скорректировать код...
Если картинок (ячеек таблицы) нужно больше или меньше...
Как хорошо видно, в первоначальном коде имеется два крупных блока почти одинаковых строк. В каждом блоке по четыре строки, начинающихся обозначениями (их называют тэгами) <TD> и заканчивающихся </TD>. Каждая такая строка - это код одной ячейки в строке таблицы. Поэтому, если нужно больше или меньше картинок в строке, то нужно в каждом блоке вырезать или добавить нужное кол-во таких строк. Вставлять строки нужно до тэга </TR> в каждом из блоков.
Если надо без строки с подписями...
необходимо удалить второй блок, т.е. все, расположенное между вторыми тэгами <TR> и </TR> (включая сами тэги).
Закончив редактировать код, разместив в нем все адреса и т.п., нажимаете Ctrl+Enter и переходите к дальнейшему созданию страницы...
Успехов в освоении!