Справка:Изображения
Содержание
Загрузка файла изображения в Uml2Wiki
Загрузить любой файл может только зарегистрированный пользователь, представившийся системе. Последовательность действий описана на странице Загрузить файл. При загрузке учитывайте некоторые особенности:
- для переименования изображения требуется новая загрузка файла. Старая версия должна быть стёрта администратором;
- при загрузке изображения более высокого качества под тем же названием старое изображение не стирается, а сохраняется в «Истории», как и любой файл;
- в названии файлов различается написание «ПРОПИСНЫМИ» и «строчными» буквами.
- так как пространство имен для всех изображений одно, желательно давать файлам дескриптивные (пусть и длинные) названия. Т.е. картинка с названием Image1.jpg не является дескриптивной, и повышает вероятность того, что в результате опечатки будет включена другая картинка и т.п.
Загрузка и удаление файлов отражаются в Special:Newimages. Просмотреть ранее загруженные файлы можно в списке загруженных изображений либо через категории изображений.
Описание изображения
После загрузки файла изображения появится ссылка на страницу описания этого изображения, которую желательно заполнить.
Вставка изображения в статью
Первоначальных размеров
Чтобы вставить загруженное изображение в статью, достаточно указать ссылку на него: [[Image:Файл]]. Изображение будет воспроизводится слева в полную величину, а текст начинаться ниже его. Если вы хотите дать только ссылку на изображение, не воспроизводя его, поставьте двоеточие перед словом «Image»: [[:Image:Файл]]. Щелчок на такую надпись загружает страницу самого изображения. Вот попробуйте: Image:2004-01-23-twins-computer-01-tmb.jpg.
С альтернативным текстом.
Чтобы в браузерах с отключённой функцией показа графики показывалось пояснение к изображению, его вписывают в конце после вертикальной чёрточки: [[Image: Файл|Альтернативный текст для изображений]]. При наведении курсора мыши на пустующее место эта подпись всплывает.
Пояснительная подпись.
 Пояснительная подпись Чтобы сделать поясняющую подпись, используется атрибут «frame»:
[[Image:2004-01-23-twins-computer-01-tmb.jpg|frame|Пояснительная подпись]] |
Уменьшение размеров
[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|Пояснительная подпись]]
Атрибуты «thumb» или «thumbnail», вставленные между именем файла и пояснительной подписью, уменьшают ширину изображения до 180рх (высота изменяется пропорционально), прижимают его вправо и помещают в рамку. Кроме того, справа от пояснительной подписи появляется значок, щёлкнув на который можно перейти на страницу изображения и посмотреть его в натуральную величину. Текст располагается слева от изображения.
[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|100px|Пояснительная подпись]]
Для получения изображения заданной ширины (высота изменяется пропорционально), запишите её в пикселах (рх) за атрибутом «thumb». При этом не забывайте о соотношении изображения с текстом. Если статья небольшая, то можно подобрать высоту изображения так, чтобы текст полностью охватывал его. В длинной статье не стоит делать изображения маленькими, иначе они «утонут» в тексте.
Расположение на странице
Смещение вправо.
Кроме рассмотренных выше атрибутов «frame», «class=rimage», «thumb» и «thumbnail», прижать изображение вправо можно html-атрибутом «right»:
[[Image:2004-01-23-twins-computer-01-tmb.jpg|right|]] Текст, помещённый ниже, обтекает его слева. Не забудьте поставить вертикальную чёрточку «|» в конце. Это нужно для того, чтобы слово не воспринималось как альтернативный текст для изображения. |
Смещение влево.
Чтобы прижать изображение к левому краю страницы, даже при наличии вышеперечисленных атрибутов, используйте html-атрибут «left» или «none».
Расположение по центру.
Для расположения изображения в центре странице используется html-атрибут «center»:
<center>[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|Пояснительная подпись]]</center>
Пример
Комбинируя таблицы и изображения, можно представлять информацию, например, в таком виде:
| Мои фото | |||
|---|---|---|---|
| Фото1 | 
|
Фото2 |
|
Исходный текст для этой таблицы такой:
<center>
{| border="1" style="border-collapse:collapse"
!colspan="4"|Мои фото
|-
|Фото1|| [[Image:Stas-fomin.jpg]]
|Фото2|| [[Image:Stas-fomin.jpg]]
|}
</center>
Видео
Совершенно аналогично операциям с картинками (загрузка, включение через [[Image:…]]), можно загружать и видео, в FLV-формате.
Чтобы преобразовать обычный AVI-файл в FLV, проще всего воспользоваться программой ffmpeg. Скачайте и установите ее (например, отсюда). Опции можно не учить, просто заведите bat-файл !avi-to-flv.bat, состоящий всего из двух строк:
ffmpeg -y -i %1 -vcodec libx264 -pass 1 -vpre fastfirstpass -r 10 -b 579k -f flv %1.flv ffmpeg -y -i %1 -vcodec libx264 -pass 2 -vpre hq -r 10 -b 579k -f flv %1.flv
и пользуйтесь им.
SVG-графика
В дополнении к бинарным изображениям, есть возможность работы с векторными SVG-изображениями, как с обычным Wiki-текстом:
- хранить SVG-описания изображений в вики-тексте статьи (включая историю).
- по текстам SVG-графики ведется такая же diff-история, как и по текстам любой вики-статьи.
- тексты можно редактировать вручную (несмотря на некоторые сложности, это возможно, а при выполнении массовых операций, типа Replace/текста — это сверхэффективно).
- При редактировании статьи картинка растеризуется, и далее, в статье показывается ее растеризованный вариант. Если кликнуть по картинке, то будет показан исходный SVG-файл, для его просмотра, либо броузер должен поддерживать SVG (Developperская версия Mozilla Firefox, или Opera), либо должен быть установлен SVG-плагин от Adobe.
Шаблон:CONFIDENTIAL-BEGIN У нас дистрибутив плагина от Adobe можно взять на [1] Шаблон:CONFIDENTIAL-END
C IE плагин от Adobe, работает сразу, для работы под Mozilla Firefox, необходимо после установки плагина найти файлы
NPSVG6.dll NPSVG6.zip
и положить их в каталог
\Mozilla Firefox\plugins
С SVG-графикой работают графические редакторы «MS Visio» начиная с версии 2003, и бесплатный редактор Inkscape. Шаблон:CONFIDENTIAL-BEGIN У нас его дистрибутив можно взять на [2] Шаблон:CONFIDENTIAL-END
Размещение картинки
Для размещения SVG-изображения, нужно воспользоваться тэгом «pic-svg», внутрь которого разместить все содержимое корневого тэга «svg», включая сам тэг. (то есть начальную инструкцию «xml») включать не нужно:
В результате, генерируется растровая PNG-картинка, с которой идет ссылка на SVG-изображение. К сожалению, у распространенных броузеров — Mozilla Firefox и Internet Explorer существует проблема с просмотром PNG-картинок с прозрачностью через альфа-канал:
- IE не показывает прозрачность при просмотре, см. описание проблемы и решения http://homepage.ntlworld.com/bobosola/
- Mozilla Firefox показывает, но при печати, печатает «прозрачность» черным цветом: https://bugzilla.mozilla.org/show_bug.cgi?id=235097
Если нужна прозрачность, и, например, возможность распечатки, а жертвовать прозрачностью нежелательно — можно воспользоваться тэгом «pic-svg-gif», растеризующего SVG-изображение не в PNG, а в 256-цветовой, «палитровый» GIF.
Советы
Несмотря на текстовость описания и разумностью их хранения под системой контроля версий Uml2Wiki, SVG-картинки могут быть весьма большими, и их редактирование вместе с остальным текстом, как правило неудобно (в частности, нельзя запускать «викификатор»). Поэтому, разумно или размещать их в отдельных разделах (чтобы редактировать эти разделы отдельно от основного текста), либо в отдельных статьях, и включать их с помощью механизма шаблонов, например:
Кодировки
Важный момент — редакторы типа Visio или Inkscape, обычно хранят SVG-файлы в кодировке UTF-8 (что указывается в заголовке первой инструкции «xml»). При помещении текста SVG-картинки в Uml2Wiki, нужно перекодировать текст в кодировку броузера (то есть если вы вставляете CopyPastом под Windows — то в кодировку «windows−1251».
Загрузка произвольных файлов
Можно также загружать «бинарный» контент произвольных форматов — документы в форматах PDF, DOC, презентации PowerPoint, и т. п. Их нельзя просмотреть встроенными в верстку статьи (как с обычными изображениями), но на них можно дать ссылку, и броузер пользователя сам разберется с переданным файлом (просмотрит его с помощью плагина, откроет какое-либо внешнее приложение или просто сохранит его, расчитывая, что читатель найдет, что делать с этим файлом. Ссылаться на такие файлы нужно в формате
[[Media:<имя файла>]]
Пример:
[[Media:Leeward.pdf|Лекция на тему «наветренный»/«подветренный»]].
