Персональные инструменты
 

Справка:Изображения — различия между версиями

Материал из CustisWiki

Перейти к: навигация, поиск
 
Строка 1: Строка 1:
==Загрузка файла изображения в {{SITENAME}}==
+
== Загрузка файла изображения в {{SITENAME}} ==
  
 
Загрузить любой файл может только зарегистрированный пользователь, представившийся системе. Последовательность действий описана на странице [[Special:Upload|Загрузить файл]]. При загрузке учитывайте некоторые особенности:
 
Загрузить любой файл может только зарегистрированный пользователь, представившийся системе. Последовательность действий описана на странице [[Special:Upload|Загрузить файл]]. При загрузке учитывайте некоторые особенности:
*для переименования изображения требуется новая загрузка файла. Старая версия должна быть стёрта администратором;
+
* Для переименования изображения выберите вкладку «переименовать» вверху страницы.
*при загрузке изображения более высокого качества под тем же названием старое изображение не стирается, а сохраняется в «Истории», как и любой файл;
+
* Для удаления — «удалить».
*в названии файлов различается написание «ПРОПИСНЫМИ» и «строчными» буквами.
+
* При загрузке другого изображения (или того же, но более высокого качества) под тем же названием старое изображение не стирается, а сохраняется в «Истории», как и любой файл;
*так как пространство имен для всех изображений одно, желательно давать файлам дескриптивные (пусть и длинные) названия. Т.е. картинка с названием Image1.jpg не является дескриптивной, и повышает вероятность того, что в результате опечатки будет включена другая картинка и т.п.
+
* В названии файлов различается написание «ПРОПИСНЫМИ» и «строчными» буквами.
 +
* Так как пространство имен для всех изображений одно, желательно давать файлам дескриптивные (пусть и длинные) названия. То есть картинка с названием Image1.jpg не является дескриптивной, и повышает вероятность того, что в результате опечатки будет включена другая картинка и т. п.
 
Загрузка и удаление файлов отражаются в [[Special:Newimages]]. Просмотреть ранее загруженные файлы можно [[Special:Imagelist|в списке загруженных изображений]] либо через категории изображений.
 
Загрузка и удаление файлов отражаются в [[Special:Newimages]]. Просмотреть ранее загруженные файлы можно [[Special:Imagelist|в списке загруженных изображений]] либо через категории изображений.
  
==Описание изображения==
+
== Описание изображения ==
  
 
После загрузки файла изображения появится ссылка на страницу '''описания''' этого изображения, которую желательно заполнить.
 
После загрузки файла изображения появится ссылка на страницу '''описания''' этого изображения, которую желательно заполнить.
  
==Вставка изображения в статью==
+
== Вставка изображения в статью ==
===Первоначальных размеров===
+
  
Чтобы вставить загруженное изображение в статью, достаточно указать ссылку на него: '''<nowiki>[[Image:Файл]]</nowiki>'''. Изображение будет воспроизводится слева в полную величину, а текст начинаться ниже его. Если вы хотите дать только ссылку на изображение, не воспроизводя его, поставьте двоеточие перед словом «Image»: <nowiki>[[:Image:Файл]]</nowiki>. Щелчок на такую надпись загружает страницу самого изображения. Вот попробуйте: [[:Image:2004-01-23-twins-computer-01-tmb.jpg]].
+
=== Первоначальных размеров ===
 +
 
 +
Чтобы вставить загруженное изображение в статью, достаточно указать ссылку на него: '''<nowiki>[[Image:Файл]]</nowiki>''' или '''<nowiki>[[File:Файл]]</nowiki>'''. Изображение будет воспроизводится слева в полную величину, а текст начинаться ниже его. Если вы хотите дать только ссылку на изображение, не воспроизводя его, поставьте двоеточие перед словом «Image»: <nowiki>[[:Image:Файл]]</nowiki>. Щелчок на такую надпись загружает страницу самого изображения. Вот попробуйте: [[:Image:2004-01-23-twins-computer-01-tmb.jpg]].
  
 
'''С альтернативным текстом.'''
 
'''С альтернативным текстом.'''
  
Чтобы в браузерах с отключённой функцией показа графики показывалось '''пояснение к изображению''', его вписывают в конце после вертикальной чёрточки: '''<nowiki>[[Image: Файл|Альтернативный текст для изображений]]</nowiki>'''. При наведении курсора мыши на пустующее место эта подпись всплывает.
+
Чтобы в браузерах с отключённой функцией показа графики показывалось '''пояснение к изображению''', его вписывают в конце после вертикальной чёрточки: '''<nowiki>[[Image: Файл|Альтернативный текст для изображений]]</nowiki>'''. При наведении курсора мыши на пустующее место эта подпись всплывает.
  
 
'''Пояснительная подпись.'''
 
'''Пояснительная подпись.'''
Строка 25: Строка 27:
 
|[[Image:2004-01-23-twins-computer-01-tmb.jpg|frame|Пояснительная подпись]]
 
|[[Image:2004-01-23-twins-computer-01-tmb.jpg|frame|Пояснительная подпись]]
 
Чтобы сделать поясняющую подпись, используется атрибут «'''frame'''»:
 
Чтобы сделать поясняющую подпись, используется атрибут «'''frame'''»:
<nowiki>[[Image:2004-01-23-twins-computer-01-tmb.jpg|frame|Пояснительная подпись]]</nowiki><br>
+
<nowiki>[[Image:2004-01-23-twins-computer-01-tmb.jpg|frame|Пояснительная подпись]]</nowiki><br />
 
Он заключает изображение в рамку и смещает изображение вправо. В области «Пояснительная подпись» можно применять wiki-разметку.
 
Он заключает изображение в рамку и смещает изображение вправо. В области «Пояснительная подпись» можно применять wiki-разметку.
 
|}
 
|}
  
===Уменьшение размеров===
+
=== Уменьшение размеров ===
 
[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|Пояснительная подпись]]
 
[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|Пояснительная подпись]]
<nowiki>[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|Пояснительная подпись]]</nowiki><br>
+
<nowiki>[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|Пояснительная подпись]]</nowiki><br />
 
Атрибуты «'''thumb'''» или «'''thumbnail'''», вставленные между именем файла и пояснительной подписью, уменьшают ширину изображения до 180рх (высота изменяется пропорционально), прижимают его вправо и помещают в рамку. Кроме того, справа от пояснительной подписи появляется значок, щёлкнув на который можно перейти на страницу изображения и посмотреть его в натуральную величину. Текст располагается слева от изображения.
 
Атрибуты «'''thumb'''» или «'''thumbnail'''», вставленные между именем файла и пояснительной подписью, уменьшают ширину изображения до 180рх (высота изменяется пропорционально), прижимают его вправо и помещают в рамку. Кроме того, справа от пояснительной подписи появляется значок, щёлкнув на который можно перейти на страницу изображения и посмотреть его в натуральную величину. Текст располагается слева от изображения.
  
 
[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|100px|Пояснительная подпись]]
 
[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|100px|Пояснительная подпись]]
<nowiki>[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|100px|Пояснительная подпись]]</nowiki><br>
+
<nowiki>[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|100px|Пояснительная подпись]]</nowiki><br />
 
Для получения изображения заданной ширины (высота изменяется пропорционально), запишите её в пикселах (рх) за атрибутом «thumb». При этом не забывайте о соотношении изображения с текстом. Если статья небольшая, то можно подобрать высоту изображения так, чтобы текст полностью охватывал его. В длинной статье не стоит делать изображения маленькими, иначе они «утонут» в тексте.
 
Для получения изображения заданной ширины (высота изменяется пропорционально), запишите её в пикселах (рх) за атрибутом «thumb». При этом не забывайте о соотношении изображения с текстом. Если статья небольшая, то можно подобрать высоту изображения так, чтобы текст полностью охватывал его. В длинной статье не стоит делать изображения маленькими, иначе они «утонут» в тексте.
  
===Расположение на странице===
+
=== Расположение на странице ===
 
'''Смещение вправо.'''
 
'''Смещение вправо.'''
  
Кроме рассмотренных выше атрибутов «frame», «class=rimage», «thumb» и «thumbnail»,   прижать изображение вправо можно html-атрибутом «'''right'''»:
+
Кроме рассмотренных выше атрибутов «frame», «class=rimage», «thumb» и «thumbnail», прижать изображение вправо можно html-атрибутом «'''right'''»:
 
{|
 
{|
 
|[[Image:2004-01-23-twins-computer-01-tmb.jpg|right|]]
 
|[[Image:2004-01-23-twins-computer-01-tmb.jpg|right|]]
 
<nowiki>[[Image:2004-01-23-twins-computer-01-tmb.jpg|right|]]</nowiki>
 
<nowiki>[[Image:2004-01-23-twins-computer-01-tmb.jpg|right|]]</nowiki>
  
Текст, помещённый ниже, обтекает его слева. Не забудьте поставить вертикальную чёрточку «'''|'''» в конце. Это нужно для того, чтобы слово не воспринималось как альтернативный текст для изображения.
+
Текст, помещённый ниже, обтекает его слева. Не забудьте поставить вертикальную чёрточку «'''|'''» в конце. Это нужно для того, чтобы слово не воспринималось как альтернативный текст для изображения.
 
|}
 
|}
 
'''Смещение влево.'''
 
'''Смещение влево.'''
Строка 59: Строка 61:
 
<center>[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|Пояснительная подпись]]</center>
 
<center>[[Image:2004-01-23-twins-computer-01-tmb.jpg|thumb|Пояснительная подпись]]</center>
  
===Пример===
+
=== Пример ===
 
Комбинируя таблицы и изображения, можно представлять информацию, например, в таком виде:
 
Комбинируя таблицы и изображения, можно представлять информацию, например, в таком виде:
 
<center>
 
<center>
Строка 80: Строка 82:
 
</center>
 
</center>
 
</nowiki></pre>
 
</nowiki></pre>
 
  
 
== Видео ==
 
== Видео ==
Совершенно аналогично операциям с картинками (загрузка, включение через <nowiki>[[Image:…]])</nowiki>, можно загружать и видео, в [[EnPedia:FLV|FLV]]-формате.
 
  
Чтобы преобразовать обычный AVI-файл в FLV, проще всего воспользоваться программой <tt>ffmpeg</tt>.
+
Совершенно аналогично операциям с картинками (загрузка, включение через <nowiki>[[Image:…]])</nowiki>, можно загружать и видео, в [[EnPedia:FLV|FLV]]-формате с кодеками FLV видео + MP3 аудио, или в MP4-формате (контейнере) с кодеками H.264 видео + AAC аудио.
Скачайте и установите ее (например, [http://www.paehl.com/open_source/?Convert_Tools:FFMPEG отсюда]). Опции можно не учить, просто заведите bat-файл <tt>!avi-to-flv.bat</tt>, состоящий всего из двух строк:
+
 
 +
FLV — проще (не нужно делать qt-faststart), но MP4 — качественнее, потому что кодек H.264 лучше, чем Flash Video.
 +
 
 +
Чтобы преобразовать практически любой видеоформат (например, AVI) в FLV или MP4, проще всего воспользоваться программой <tt>ffmpeg</tt>. Скачайте и установите ее (например, [http://www.paehl.com/open_source/?Convert_Tools:FFMPEG отсюда]).
 +
 
 +
Опции можно не учить, просто заведите bat-файл <tt>!avi-to-flv.bat</tt>, для FLV состоящий всего из двух строк:
 
  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 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
 
  ffmpeg -y -i %1 -vcodec libx264 -pass 2 -vpre hq -r 10 -b 579k -f flv %1.flv
Строка 92: Строка 97:
  
 
== SVG-графика ==
 
== SVG-графика ==
В дополнении к бинарным изображениям, есть возможность работы с векторными [[SVG]]-изображениями, как с обычным Wiki-текстом:
 
* хранить [[SVG]]-описания изображений в вики-тексте статьи (включая историю).
 
* по текстам [[SVG]]-графики ведется такая же diff-история, как и по текстам любой вики-статьи.
 
* тексты можно редактировать вручную (несмотря на некоторые сложности, это возможно, а при выполнении массовых операций, типа Replace/текста — это сверхэффективно).
 
* При редактировании статьи картинка растеризуется, и далее, в статье показывается ее растеризованный вариант. Если кликнуть по картинке, то будет показан исходный SVG-файл, для его просмотра, либо броузер должен поддерживать SVG (Developperская версия Mozilla Firefox, или Opera), либо должен быть установлен [http://www.adobe.com/SVG/ SVG-плагин от Adobe].
 
  
C IE плагин от Adobe, работает сразу, для работы под Mozilla Firefox, необходимо после установки плагина
+
В дополнении к растровым изображениям, есть возможность работы с векторными [[SVG]]-изображениями. Их можно загружать в вики и вставлять в статьи так же, как и любые другие:
найти файлы
+
 
NPSVG6.dll
+
<pre>[[File:Warning icon.svg]]</pre>
NPSVG6.zip
+
 
и положить их в каталог
+
Отображаются они парой растрового+векторного изображения, так что старые браузеры, не поддерживающие SVG, картинку всё равно отобразят.
\Mozilla Firefox\plugins
+
 
 +
{{Box|{{Warning}} Использовать СТАРЫЙ способ вставки SVG прямо в текст статьи через <tt>&lt;pic-svg&gt;</tt> - '''НЕ НУЖНО'''! Это очень некрасиво и неудобно.}}
 +
 
 +
С [[SVG]]-графикой работают графические редакторы «MS Visio» начиная с версии 2003 и бесплатный редактор [http://www.inkscape.org Inkscape].
 +
== PDF-файлы ==
 +
 
 +
С PDF-файлами в вики тоже можно работать, как с изображениями. Очевидный нюанс заключается в том, что в PDF-файле много страниц. Поэтому на странице файла (например, [[:File:Leeward.pdf]]) отображается поле с выбором страницы, а вставлять отдельные страницы в статью можно так:
 +
 
 +
<pre>
 +
[[File:Leeward.pdf|page=5|300px]]
 +
</pre>
 +
 
 +
[[File:Leeward.pdf|page=5|300px]]
  
С [[SVG]]-графикой работают графические редакторы «MS Visio» начиная с версии 2003,
+
Также можно вставить диапазон страниц или ВСЕ страницы:
и бесплатный редактор [http://www.inkscape.org Inkscape].
+
=== Размещение картинки ===
+
Для размещения [[SVG]]-изображения, нужно воспользоваться тэгом «pic-svg», внутрь которого разместить все содержимое корневого тэга «svg», включая сам тэг. (то есть начальную инструкцию «xml») включать не нужно:
+
  
<pic-svg>
+
<pre>
<svg
+
Диапазон: [[File:Leeward.pdf|page=4-6|300px]]
  id="svg559"
+
Все: [[File:Leeward.pdf|page=-|300px]]
  sodipodi:version="0.32"
+
</pre>
  width="400pt"
+
  height="400pt"
+
  sodipodi:docname="inkscape.logo.svg"
+
  sodipodi:docbase="/home/phillipsjd/temp/inkscape-project/inkscape/samples"
+
  inkscape:version="0.37"
+
  xmlns="http://www.w3.org/2000/svg"
+
  xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+
  xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+
  xmlns:xlink="http://www.w3.org/1999/xlink">
+
  <defs
+
    id="defs561" />
+
  <sodipodi:namedview
+
    id="base"
+
    inkscape:zoom="0.77250000"
+
    inkscape:cx="200"
+
    inkscape:cy="200"
+
    inkscape:window-width="400"
+
    inkscape:window-height="499"
+
    inkscape:window-x="4"
+
    inkscape:window-y="50" />
+
  <g
+
    id="g839"
+
    transform="translate(-109.7253,24.27184)">
+
    <path
+
      style="font-size:12;fill:#ffffff;fill-rule:evenodd;stroke:#000000;stroke-width:0.936193pt;"
+
      d="M 397.64309 320.25301 L 280.39197 282.517 L 250.74227 124.83447 L 345.08225 29.146783 L 393.59996 46.667064 L 483.89679 135.61619 L 397.64309 320.25301 z "
+
      id="whiteSpace" />
+
    <path
+
      style="font-size:12;fill-rule:evenodd;stroke-width:1pt;fill:#000000;fill-opacity:1;"
+
      d="M 476.95792 339.17168 C 495.78197 342.93607 499.54842 356.11361 495.78197 359.87802 C 492.01856 363.6434 482.6065 367.40781 475.07663 361.76014 C 467.54478 356.11361 467.54478 342.93607 476.95792 339.17168 z "
+
      id="droplet01" />
+
    <path
+
      style="font-size:12;fill-rule:evenodd;stroke-width:1pt;fill:#000000;fill-opacity:1;"
+
      d="M 286.46194 340.42914 C 284.6277 340.91835 269.30405 327.71337 257.16909 333.8338 C 245.03722 339.95336 236.89276 353.65666 248.22676 359.27982 C 259.56184 364.90298 267.66433 358.41867 277.60113 351.44119 C 287.53903 344.46477 287.18046 343.1206 286.46194 340.42914 z "
+
      id="droplet02" />
+
    <path
+
      style="font-size:12;fill-rule:evenodd;stroke-width:1pt;fill:#000000;fill-opacity:1;"
+
      d="M 510.35756 306.92856 C 520.59494 304.36879 544.24333 306.92856 540.47688 321.98634 C 536.71354 337.04806 504.71297 331.39827 484.00371 323.87156 C 482.12141 308.81083 505.53237 308.13423 510.35756 306.92856 z "
+
      id="droplet03" />
+
    <path
+
      style="font-size:12;fill-rule:evenodd;stroke-width:1pt;fill:#000000;fill-opacity:1;"
+
      d="M 359.2403 21.362537 C 347.92693 21.362537 336.6347 25.683095 327.96556 34.35223 L 173.87387 188.41466 C 165.37697 196.9114 161.1116 207.95813 160.94269 219.04577 L 160.88418 219.04577 C 160.88418 219.08524 160.94076 219.12322 160.94269 219.16279 C 160.94033 219.34888 160.88418 219.53256 160.88418 219.71865 L 161.14748 219.71865 C 164.0966 230.93917 240.29699 245.24198 248.79866 253.74346 C 261.63771 266.58263 199.5652 276.01151 212.4041 288.85074 C 225.24316 301.68979 289.99433 313.6933 302.8346 326.53254 C 315.67368 339.37161 276.5961 353.04289 289.43532 365.88196 C 302.27439 378.72118 345.40201 362.67257 337.5908 396.16198 C 354.92909 413.50026 391.10302 405.2208 415.32417 387.88252 C 428.16323 375.04345 390.6948 376.17577 403.53397 363.33668 C 416.37304 350.49745 448.78128 350.4282 476.08902 319.71589 C 465.09739 302.62116 429.10801 295.34136 441.94719 282.50217 C 454.78625 269.66311 479.74708 276.18423 533.60644 251.72479 C 559.89837 239.78398 557.72636 230.71459 557.62567 219.71865 C 557.62356 219.48727 557.62567 219.27892 557.62567 219.04577 L 557.56716 219.04577 C 557.3983 207.95812 553.10345 196.9114 544.60673 188.41466 L 390.54428 34.35223 C 381.87515 25.683095 370.55366 21.362537 359.2403 21.362537 z M 357.92378 41.402939 C 362.95327 41.533963 367.01541 45.368018 374.98006 50.530832 L 447.76915 104.50827 C 448.56596 105.02498 449.32484 105.564 450.02187 106.11735 C 450.7189 106.67062 451.3556 107.25745 451.95277 107.84347 C 452.54997 108.42842 453.09281 109.01553 453.59111 109.62808 C 454.08837 110.24052 454.53956 110.86661 454.93688 111.50048 C 455.33532 112.13538 455.69164 112.78029 455.9901 113.43137 C 456.28877 114.08363 456.52291 114.75639 456.7215 115.42078 C 456.92126 116.08419 457.08982 116.73973 457.18961 117.41019 C 457.28949 118.08184 457.33588 118.75535 457.33588 119.42886 L 414.21245 98.598549 L 409.9118 131.16055 L 386.18512 120.04324 L 349.55654 144.50131 L 335.54288 96.1703 L 317.4919 138.4453 L 267.08369 143.47735 L 267.63956 121.03795 C 267.63956 115.64823 296.69685 77.915899 314.39075 68.932902 L 346.77721 45.674327 C 351.55594 42.576634 354.90608 41.324327 357.92378 41.402939 z M 290.92738 261.61333 C 313.87149 267.56365 339.40299 275.37038 359.88393 275.50997 L 360.76161 284.72563 C 343.2235 282.91785 306.11346 274.45012 297.36372 269.98057 L 290.92738 261.61333 z "
+
      id="mountainDroplet" />
+
  </g>
+
</svg>
+
</pic-svg>
+
  
В результате, генерируется растровая PNG-картинка, с которой идет ссылка на SVG-изображение. К сожалению, у распространенных броузеров — Mozilla Firefox и Internet Explorer существует проблема с просмотром PNG-картинок с прозрачностью через альфа-канал:
+
[[File:Leeward.pdf|page=4-6|300px]]
* IE не показывает прозрачность при просмотре, см. описание проблемы и решения http://homepage.ntlworld.com/bobosola/
+
* Mozilla Firefox показывает, но при печати, печатает «прозрачность» черным цветом: https://bugzilla.mozilla.org/show_bug.cgi?id=235097
+
  
Если нужна прозрачность, и, например, возможность распечатки, а жертвовать прозрачностью нежелательно — можно воспользоваться тэгом «pic-svg-gif», растеризующего SVG-изображение не в PNG, а в 256-цветовой, «палитровый» GIF.
+
== Остальные типы файлов ==
  
=== Советы ===
+
Можно также загружать «бинарный» контент произвольных форматов — документы Word и LibreOffice, презентации PowerPoint, и т. п.
Несмотря на текстовость описания и разумностью их хранения под системой контроля версий [[{{SITENAME}}]], SVG-картинки могут быть весьма большими, и их редактирование вместе с остальным текстом, как правило неудобно (в частности, нельзя запускать «викификатор»).
+
Поэтому, разумно или размещать их в отдельных разделах (чтобы редактировать эти разделы отдельно от основного текста), либо в отдельных статьях, и включать их с помощью механизма шаблонов, например:
+
  
{{:orav.svg}}
+
По тексту офисных документов и презентаций работает поиск.
----
+
{{:ribbon.svg}}
+
----
+
{{:tux.svg}}
+
----
+
  
=== Кодировки ===
+
Прямо в вики (как обычные изображения) их, однако, просмотреть нельзя, но на них можно дать ссылку, и броузер пользователя сам разберется с переданным файлом (просмотрит его с помощью плагина, откроет какое-либо внешнее приложение или просто сохранит его, расчитывая, что читатель найдет, что делать с этим файлом.
Важный момент — редакторы типа Visio или Inkscape, обычно хранят SVG-файлы в кодировке UTF-8 (что указывается в заголовке первой инструкции «xml»). При помещении текста [[SVG]]-картинки в [[{{SITENAME}}]], нужно перекодировать текст в кодировку броузера (то есть если вы вставляете CopyPastом под Windows — то в кодировку «windows−1251».
+
  
== Загрузка произвольных файлов ==
+
Дать '''прямую ссылку''' на скачивание любого файла можно в формате
Можно также загружать «бинарный» контент произвольных форматов — документы в форматах PDF, DOC, презентации PowerPoint, и т. п.
+
Их нельзя просмотреть встроенными в верстку статьи (как с обычными изображениями), но на них можно дать ссылку, и броузер пользователя сам разберется с переданным файлом (просмотрит его с помощью плагина, откроет какое-либо внешнее приложение или просто сохранит его, расчитывая, что читатель найдет, что делать с этим файлом.
+
Ссылаться на такие файлы нужно в формате
+
 
  <nowiki>[[Media:<имя файла>]]</nowiki>
 
  <nowiki>[[Media:<имя файла>]]</nowiki>
 
Пример:
 
Пример:

Текущая версия на 13:59, 17 октября 2014

Загрузка файла изображения в CustisWiki

Загрузить любой файл может только зарегистрированный пользователь, представившийся системе. Последовательность действий описана на странице Загрузить файл. При загрузке учитывайте некоторые особенности:

  • Для переименования изображения выберите вкладку «переименовать» вверху страницы.
  • Для удаления — «удалить».
  • При загрузке другого изображения (или того же, но более высокого качества) под тем же названием старое изображение не стирается, а сохраняется в «Истории», как и любой файл;
  • В названии файлов различается написание «ПРОПИСНЫМИ» и «строчными» буквами.
  • Так как пространство имен для всех изображений одно, желательно давать файлам дескриптивные (пусть и длинные) названия. То есть картинка с названием Image1.jpg не является дескриптивной, и повышает вероятность того, что в результате опечатки будет включена другая картинка и т. п.

Загрузка и удаление файлов отражаются в Special:Newimages. Просмотреть ранее загруженные файлы можно в списке загруженных изображений либо через категории изображений.

Описание изображения

После загрузки файла изображения появится ссылка на страницу описания этого изображения, которую желательно заполнить.

Вставка изображения в статью

Первоначальных размеров

Чтобы вставить загруженное изображение в статью, достаточно указать ссылку на него: [[Image:Файл]] или [[File:Файл]]. Изображение будет воспроизводится слева в полную величину, а текст начинаться ниже его. Если вы хотите дать только ссылку на изображение, не воспроизводя его, поставьте двоеточие перед словом «Image»: [[:Image:Файл]]. Щелчок на такую надпись загружает страницу самого изображения. Вот попробуйте: Image:2004-01-23-twins-computer-01-tmb.jpg.

С альтернативным текстом.

Чтобы в браузерах с отключённой функцией показа графики показывалось пояснение к изображению, его вписывают в конце после вертикальной чёрточки: [[Image: Файл|Альтернативный текст для изображений]]. При наведении курсора мыши на пустующее место эта подпись всплывает.

Пояснительная подпись.

Пояснительная подпись

Чтобы сделать поясняющую подпись, используется атрибут «frame»: [[Image:2004-01-23-twins-computer-01-tmb.jpg|frame|Пояснительная подпись]]
Он заключает изображение в рамку и смещает изображение вправо. В области «Пояснительная подпись» можно применять wiki-разметку.

Уменьшение размеров

Пояснительная подпись

[[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»:

2004-01-23-twins-computer-01-tmb.jpg

[[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 Stas-fomin.jpg Фото2 Stas-fomin.jpg

Исходный текст для этой таблицы такой:

<center>
{| border="1" style="border-collapse:collapse"
!colspan="4"|Мои фото
|-
|Фото1|| [[Image:Stas-fomin.jpg]]
|Фото2|| [[Image:Stas-fomin.jpg]]
|}
</center>

Видео

Совершенно аналогично операциям с картинками (загрузка, включение через [[Image:…]]), можно загружать и видео, в FLV-формате с кодеками FLV видео + MP3 аудио, или в MP4-формате (контейнере) с кодеками H.264 видео + AAC аудио.

FLV — проще (не нужно делать qt-faststart), но MP4 — качественнее, потому что кодек H.264 лучше, чем Flash Video.

Чтобы преобразовать практически любой видеоформат (например, AVI) в FLV или MP4, проще всего воспользоваться программой ffmpeg. Скачайте и установите ее (например, отсюда).

Опции можно не учить, просто заведите bat-файл !avi-to-flv.bat, для FLV состоящий всего из двух строк:

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-изображениями. Их можно загружать в вики и вставлять в статьи так же, как и любые другие:

[[File:Warning icon.svg]]

Отображаются они парой растрового+векторного изображения, так что старые браузеры, не поддерживающие SVG, картинку всё равно отобразят.

Attention niels epting.svg Использовать СТАРЫЙ способ вставки SVG прямо в текст статьи через <pic-svg> - НЕ НУЖНО! Это очень некрасиво и неудобно.

С SVG-графикой работают графические редакторы «MS Visio» начиная с версии 2003 и бесплатный редактор Inkscape.

PDF-файлы

С PDF-файлами в вики тоже можно работать, как с изображениями. Очевидный нюанс заключается в том, что в PDF-файле много страниц. Поэтому на странице файла (например, File:Leeward.pdf) отображается поле с выбором страницы, а вставлять отдельные страницы в статью можно так:

[[File:Leeward.pdf|page=5|300px]]

Leeward.pdf

Также можно вставить диапазон страниц или ВСЕ страницы:

Диапазон: [[File:Leeward.pdf|page=4-6|300px]]
Все: [[File:Leeward.pdf|page=-|300px]]

Leeward.pdf Leeward.pdf Leeward.pdf

Остальные типы файлов

Можно также загружать «бинарный» контент произвольных форматов — документы Word и LibreOffice, презентации PowerPoint, и т. п.

По тексту офисных документов и презентаций работает поиск.

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

Дать прямую ссылку на скачивание любого файла можно в формате

[[Media:<имя файла>]]

Пример:

[[Media:Leeward.pdf|Лекция на тему «наветренный»/«подветренный»]].

Любые правки этой статьи будут перезаписаны при следующем сеансе репликации. Если у вас есть серьезное замечание по тексту статьи, запишите его в раздел «discussion».

Репликация: База Знаний «Заказных Информ Систем» → «Справка:Изображения»


Внимание! Данная статья выбрана для репликации в SMWiki.

Статья реплицируется в Wiki4IntraNet.