Ardapedia:Bilder: Unterschied zwischen den Versionen

Aus Ardapedia
Keine Bearbeitungszusammenfassung
(Vorlage:Brotkrumen)
 
(13 dazwischenliegende Versionen von 3 Benutzern werden nicht angezeigt)
Zeile 1: Zeile 1:
{{Brotkrumen|Hilfe}}
{{Navigationsleiste Ardapedia Bilder}}
Diese Seite erklärt, wie du Bilder, Grafiken und Karten in Artikel einfügst. Wie du Bilder hochladen kannst, erfährst du im [[Ardapedia:Bildertutorial|Bildertutorial]]. Welche Bilder du hochladen darfst, erläutert [[Ardapedia:Bildrechte]]. Weitere Informationen findest du in den [[Ardapedia:FAQ zu Bildern|FAQ zu Bildern]].
== Grundregeln ==
== Grundregeln ==
Hier ist eine kleine Liste mit Punkten, die Du beim Einbinden von Bildern in Ardapedia beachten solltest:
 
*'''Du musst bei Ardapedia [[Ardapedia:Anmeldung|angemeldet]] sein, um Bilder/Dateien hochladen zu können.'''
* Du musst bei Ardapedia [[Ardapedia:Registrierung|registriert]] und angemeldet sein, um Bilder/Dateien hochladen zu können.
* '''Lies Dir vor dem Upload von Bildern die [[Ardapedia:Urheberrecht|Hinweise zum Urheberrecht bei Bildern]] durch und halte Dich daran!'''
* Lies dir vor dem Upload von Bildern die Hinweise zum [[Ardapedia:Bildrechte|Urheberrecht bei Bildern]] durch und halte dich daran!
* Benutze die Beschreibungsseite (siehe unten) des Bildes für Information zu Quelle und Copyright.
* Benutze die Beschreibungsseite des Bildes für Information zu Urheber, Quelle und Lizenz.
* Gib Deinem Bild einen klaren und detaillierten Dateinamen (zum Beispiel "Marienkirche_Hintertupfing.jpg" statt "Bild 1.jpg").
* Gib deinem Bild einen klaren und detaillierten Dateinamen (zum Beispiel "Marienkirche_Hintertupfing.jpg" statt "Bild 1.jpg").
* Bearbeite das Bild so, dass es das Wesentliche zeigt.
* Bearbeite das Bild so, dass es das Wesentliche zeigt.


== Prinzipelles zur Anordnung ==
Weil das Aussehen einer Webseite in erster Linie davon abhängt, wie sie der jeweilige Browser darstellt, nicht, wie der Autor sie plant, soll bei Anordnung, Ausrichtung und Größe möglichst auf zu spezielle Vorgaben verzichtet werden. Gutes Webdesign zeichnet sich durch Flexibilität aus.


== Urheberrecht ==
Die Bilder sollten möglichst in die jeweiligen Kapitel gesetzt werden. Zuviele Bilder am Anfang des Artikels angeführt, um sich „von selbst“ auf den Artikel zu verteilen, sind ungüstig: Sie zeigen leicht unerwüschte Nebenwirkungen im Layout, und bringen auch manche Browser zum Absturz.


Wenn Du ein Bild hochlädst, dann nur, wenn es Dein Bild oder es ein Public Domain-Bild ist bzw. der Copyright Inhaber es unter die [[Ardapedia:GNU Freie Dokumentationslizenz|GNU Freie Dokumentationslizenz]] (GFDL) gestellt hat. Zu jedem Bild '''muss''' eine '''Quellenangabe''' und die '''Lizenz''' auf der Beschreibungsseite gespeichert werden. Nach Möglichkeit sollten außerdem eine Beschreibung des Bildes, der Name des Urhebers und das Erstellungsdatum eingefügt werden.
== Originalgröße ==


'''Screenshots aus den "Herr der Ringe" - Filmen dürfen also NICHT hochgeladen werden!'''
Bilder lassen sich mit {{Code|<nowiki>[[Bild:Dateiname|Beschreibung]]</nowiki>}} in Artikel einfügen. Das Bild wird dann in Originalgröße links im Artikel angezeigt. Mit der Option {{Code|framed}}, z.&nbsp;B. {{Code|<nowiki>[[Bild:Dateiname|framed|Beschreibung]]</nowiki>}} wird das Bild mit einem Rahmen umgeben.


''Siehe auch:'' [[Ardapedia:Urheberrecht|Urheberrecht]], [[Ardapedia:FAQ Rechtliches|FAQ Rechtliches]]
{| {{Tabellendesign}}
|- {{Highlight}}
! Eingabe
! Ergebnis
|-
| <tt><nowiki>[[Bild:Wolf.jpg|Wolf]]</nowiki></tt>
| [[Bild:Wolf.jpg|Wolf]]
|-
| <tt><nowiki>[[Bild:Wolf.jpg|framed|Wolf mit Rahmen]]</nowiki></tt>
| [[Bild:Wolf.jpg|framed|Wolf mit Rahmen]]
|}


=== Fehlendes Copyright ===
Da durch große Bilder die Seiten dann sehr lange zum Laden brauchen, solltest du aus Rücksicht auf die Modembenutzer dies nur in Ausnahmefällen so handhaben, zum Beispiel wenn das Originalbild sehr klein ist. Benutze sonst besser verkleinerte Vorschauansichten (so genannte [[#Thumbnails|Thumbnails]]), die der Leser – wenn es ihn interessiert – dann mit einem Klick auf das Icon vergrößern und genauer betrachten kann.


Es ist nicht die Aufgabe der Ardapedia-User, die Rechte jedes Bildes wegen Urheberrechtsverletzungen zu überprüfen. Aber wenn Du ein Bild findest, bei dem die Angaben zum Copyright fehlen, hinterlass bitte dem, der das Bild hochgeladen hat, eine Nachricht auf seiner Diskussionsseite, dass er die Quellenangaben ergänzen soll. Reagiert der Betreffende nicht, setz das Bild auf die [[Ardapedia:Löschkandidaten/Bilder|Löschkandidaten/Bilder]].
== Thumbnails ==
[[Bild:Wolf.jpg|thumbnail|Wolf]]


=== Weblinks ===
Die von der Ardapedia verwendete Software Mediawiki kann automatisch Vorschaubilder erzeugen. Dazu fügt man den Zusatz {{Code|thumb}} oder {{Code|thumbnail}} zwischen Dateiname und Alternativtext ein, zum Beispiel {{Code|<nowiki>[[Bild:Wolf.jpg|thumb|Wolf]]</nowiki>}}. Das erzeugte Vorschaubild wird rechtsbündig ausgerichtet und vom Artikeltext umflossen. Der Alternativtext wird unter dem Bild als Beschreibung angezeigt. Über die Lupe springt man zur großen Version des Bildes auf seiner Beschreibungsseite. Angemeldete Benutzer können die Bildgröße der Thumbnails in ihren [[Ardapedia:Einstellungen|Benutzereinstellungen]] festlegen; für nichtangemeldete Leser erscheinen diese Bilder mit einer Bildbreite von 180 Pixeln. Diese Art der Bilddarstellung sollte im Allgemeinen in Artikeln verwendet werden. Bildunterschriften unterstützen alle [[Ardapedia:Textgestaltung|Möglichkeiten der Textgestaltung]].
* http://www.photographie.de/magazin/Fotorecht_main.cfm Allgemeine Hinweise zum Fotorecht
<br style="clear:both" />
* http://de.wikipedia.org/wiki/Wikipedia:Public-Domain-Bilderquellen Public-Domain-Bilderquellen der deutschen Wikipedia


=== Abweichende Thumbnails ===


== Hochladen von Bildern==
Mit der Option {{Code|<nowiki>[[Bild:Beispielbild.jpg|thumbnail=Beispielthumb.jpg|Bildbeschreibung]]</nowiki>}} lässt sich ein Thumbnail darstellen, das nicht dem hinterlegten Bild entspricht. Eine sinnvolle Anwendung besteht darin, einen Ausschnitt aus einem großen Bild als Thumbnail zu nehmen, beispielsweise um auf ein Detail hinzuweisen oder bei einer Panoramaaufnahme (extremes Seitenverhältnis) ein Teil mit gängigem Format (4:3) als Thumbnail anzuzeigen. Eine andere Anwendung: Bei einigen Bildern verschwinden in der Thumbnail-Ansicht wichtige Details. Beim Vergrößern erscheint dann das komplette Bild.


Zum Bild-Upload dient die Spezialseite '''[[Spezial:Upload|Dateien hochladen]]'''. Das hochgeladene Bild ist dann in der [[Spezial:Imagelist|Bilderliste]] zu finden.
== Bilder skalieren ==


Fotografien sollten im JPEG-Format, Icons, Zeichnungen, Karten, Flaggen im PNG-Format hochgeladen werden. GIF-Bilder sollten nach PNG konvertiert werden, ausgenommen animierte GIFs. PNG-Photographien sollten in JPEG umgewandelt werden (wenn der Größenunterschied groß ist).  
Grundsätzlich sollten starre Bildgrößen nur in Ausnahmefällen verwendet werden, da dies die individuellen Anzeigeeinstellungen für Vorschaubilder (Thumbnails) der Benutzer ignoriert. Wann immer möglich, lass die Benutzer selbst wählen, in welcher Größe sie Vorschaubilder sehen wollen.


'''Dateigröße:''' Es ist oft möglich die Größe von Bildern im PNG-Format stark zu reduzieren. Bei Zeichnungen/Diagrammen usw. kann dies auf bis zu 25%, im Vergleich zur Standardabspeicherung üblicher Grafikprogramme, geschehen. Frei verfügbare Programme, mit denen man seine Bilder verkleinern kann, sind:
=== Feste Skalierung ===
[[Bild:Wolf.jpg|thumb|100px|Wolf]]


:* [http://www.numbera.com/software/pnggauntlet.aspx PNGGauntlet] Mit graphischer Oberfläche; nur für Windows
Mit {{Code|<nowiki>[[Bild:Wolf.jpg|thumb|100px|Wolf]]</nowiki>}} wird die Breite des generierten Miniaturbildes auf 100 Pixel festgelegt (Standardgröße sind 180&nbsp;Pixel). Die Höhe wird aus dem Seitenverhältnis automatisch berechnet. Es ist auch möglich, eine Maximalhöhe festzulegen. Wird etwa als Größe {{Code|<nowiki>100x200px</nowiki>}} angegeben, wird das Bild so skaliert, dass es in einem gedachten Rechteck von 100 Pixel Breite und 200 Pixel Höhe Platz findet. Das Seitenverhältnis bleibt dabei in jedem Fall erhalten.
:* [http://advsys.net/ken/utils.htm PNGOUT] ''Commandlinetool''; erreicht zur Zeit die besten Ergebnisse
:* [http://www.cs.toronto.edu/~cosmin/pngtech/optipng/ OptiPNG] ''Commandlinetool''
:* [http://entropymine.com/jason/pngrewrite/ pngrewrite] ''Commandlinetool''
:* [http://pmt.sourceforge.net/pngcrush Pngcrush] ''Commandlinetool''
:* [http://village.infoweb.ne.jp/~fwga3304/gmaskd_e.htm GMASK] ''Bild öffnen-->speichern-->fertig''


Diese Maßnahme hilft die Ladezeiten von Beiträgen zu verkürzen, denn die Menge und Bedeutung von Bildern nimmt zu.
[[Bild:Wolf.jpg|left|100px|Wolf ohne Thumbnailrahmen]]
Mit {{Code|<nowiki>[[Bild:Wolf.jpg|left|100px|Wolf ohne
Thumbnailrahmen]]</nowiki>}} skalierst du das Bild und lässt es ohne einen Thumbnailrahmen anzeigen.
<br style="clear:both" />


=== Hoch- und querformatige Bilder kombinieren – automatische Skalierung ===


'''Hinweise:'''
Werden hoch- und querformatige Bilder untereinander gesetzt, ohne dass eine Breite vorgegeben wird, wirken die hochformatigen Thumbs meist übermäßig groß. Es empfiehlt sich in solchen Fällen, dem hochformatigen Bild den Parameter {{Code|upright}} mitzugeben. Damit wird es standardmäßig um den Faktor 0,75 schmaler als das querformatige Bild dargestellt, was in der Regel zu einer schöneren Aufteilung führt. Der große Vorteil liegt in der automatischen Skalierung, die für anonyme Benutzer genau so funktioniert wie für angemeldete Benutzer, die sich in ihren persönlichen Einstellungen eine andere Bildbreite vorgegeben haben. Die Verhältnisse bleiben immer gewahrt.
#Um eine Datei umzubenennen, ist das erneute Hochladen unter einem anderen Dateinamen notwendig, anschließend sollte die alte Version von Admins gelöscht werden.
#Bei einem schon vorhanden Bildtitel wird die alte Datei in der Wikipedia durch die neuere ersetzt (nicht überschrieben, auch hier gibt es die Versionshistorie). So können Bilder in einer besseren Qualität hochgeladen werden.  
#In Dateinamen unterscheidet die Wikipedia zwischen Groß- und Kleinbuchstaben.


Beispiel:


==Beschreibung==
{{Code|<nowiki>[[Bild:Bildname.jpg|thumb|upright|Ohne px, aber mit "upright" Angabe]]</nowiki>}}
Zu jedem Bild existiert eine Seite zur Bildbeschreibung. Auf diese gelangt man, indem man auf das entsprechende Bild im Artikel klickt. Dort sind die Bildhistorie und alle Seiten aufgelistet, die dieses Bild nutzen. Nachdem man eine Datei hochgeladen hat, erscheint ein Link zur Beschreibungsseite.


Idealerweise enthält die Beschreibung Informationen zu Lizenz, Quelle, Fotograf und eine Beschreibung des Bilds, verpflichtend sind '''Lizenz''' und '''Quelle'''. In Ardapedia verwendete Bilder müssen entweder unter die [[Ardapedia:GNU Freie Dokumentationslizenz|GNU Freie Dokumentationslizenz]] gestellt werden oder Public Domain sein (siehe [[Ardapedia:Urheberrecht|Urheberrecht]]). Wenn Bilder aus anderen Wikipedias hochgeladen werden, dann sollte in der Beschreibung nicht nur die Quell-Wikipedia, sondern auch die dort angegebenen Lizenz- und Bilddaten angegeben werden.
Dem Parameter {{Code|upright}} kann auch ein Faktor mitgegeben werden, falls es sich um sehr hohe Bilder handelt, bei der eine Skalierung auf 0,75 noch nicht reicht:


{|  
{{Code|<nowiki>[[Bild:Bildname.jpg|thumb|upright=0.5|Ohne px, aber mit "upright=0.5" Angabe]]</nowiki>}}
!Zum Rausschnippeln und Ausfüllen
!Beispiel
|-
||
<small><pre><nowiki>
*Beschreibung:
*Quelle:
*Fotograf oder Zeichner:
*Andere Versionen:
*Lizenzstatus: GNU FDL oder Public Domain
</nowiki></pre></small>
|
<small>
*Beschreibung: Goldfisch in einem runden Wasserglas
*Quelle: fotografiert am 3. März 2003
*Fotograf: Hans Müller
*Andere Versionen: <nowiki>[[Media:Goldfisch2.jpg|anderer Blickwinkel]] ([[:Bild:Goldfisch3.jpg|Info]]) </nowiki>
*Lizenzstatus: GNU FDL
</small>
|}


Bitte keine Quellenangaben, keine Copyrightvermerke oder längere Beschreibungen in die Artikel oder in die Bilder selbst! Texte im Bild lassen sich kaum bearbeiten und lenken vom Bildinhalt ab.
Auf diese Weise können auch sehr breite Bilder, z.B. Panoramen, skaliert werden. Mit einem upright-Wert > 1 werden sie entsprechend breiter als das Standard-Thumbnail dargestellt. Die Proportionen bleiben dadurch in jeder Darstellung erhalten:


{{Code|<nowiki>[[Bild:Panorama.jpg|thumb|upright=1.8|Panorama, es wird mit 180% der Standardbreite dargestellt.]]</nowiki>}}


==Bilder einbinden==
Die Breite der so berechneten Thumbnails wird immer auf den nächsthöheren 10er-Wert aufgerundet. Dieser automatischen Skalierung sollte der Vorzug gegeben werden vor der Verwendung fester Bilderbreiten.
<br style="clear:both" />


=== Originalgröße ===
== Ausrichten im Text ==


Bilder lassen sich mit <tt><nowiki>[[Bild:Dateiname|Beschreibung]]</nowiki></tt> in Artikel einfügen.  
Die Optionen {{Code|left}}, {{Code|right}}, {{Code|center}} und {{Code|none}} richten Bilder im Text aus. Dabei ist jedoch zu beachten, dass die Darstellung je nach Browser sehr unterschiedlich sein kann. Um Probleme bei der Darstellung zu vermeiden, empfiehlt es sich, alle Bilder als thumbs auf der rechten Seite, bei längeren Absätzen auch absatzweise unter der Absatzüberschrift einzufügen.
Das Bild wird dann in Originalgröße links im Artikel angezeigt. Da bei großen Bilder Seiten dann sehr lange zum Laden brauchen, solltest Du aus Rücksicht auf die Modembenutzer dies nur in Ausnahmefällen so handhaben, sondern lieber verkleinerte Vorschauansichten (Thumbnail) benutzen.


{| border="1" style="border-collapse:collapse"
{| {{Tabellendesign}}
!Eingabe
|- {{Highlight}}
!Ergebnis
! Eingabe
! Ergebnis
|-
| <tt><nowiki>[[Bild:Smile smile.png|left|Ein Smiley]] Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.</nowiki></tt>
| [[Bild:Smile smile.png|left|Ein Smiley]] Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.
|-
| <tt><nowiki>[[Bild:Smile smile.png|right|Ein Smiley]] Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.</nowiki></tt>
| [[Bild:Smile smile.png|right|Ein Smiley]] Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.
|-
|-
|valign="top" |
| <tt><nowiki>[[Bild:Smile smile.png|center||Ein Smiley]] Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.</nowiki></tt>
<pre><nowiki>
| [[Bild:Smile smile.png|center||Ein Smiley]] Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.
[[Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras]]
</nowiki></pre>
|
[[Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras]]
|}
|}
Der Parameter {{Code|none}} schaltet jegliche automatische Ausrichtung (bei Thumbnails) ab und stellt das Bild inline dar. Das ist vor allem zum Einfügen von Thumbnails in [[Ardapedia:Tabellen|Tabellen]] praktisch.


=== Thumbnails ===
Alle Optionen lassen sich beliebig, jeweils durch senkrechte Striche getrennt, miteinander kombinieren, unbekannte Optionen ignoriert die Software.


[[Bild:Ardapedia-bilder_beispiel_edoras.jpg|thumbnail|Text der Bildbeschreibung]]
=== Thumbs nebeneinander am rechten Rand ===
Mediawiki kann automatisch Vorschaubilder erzeugen. Dazu fügt man den Zusatz <tt>thumb</tt> oder <tt>thumbnail</tt> zwischen Dateiname und Alternativtext ein, zum Beispiel


<tt><nowiki>[[Bild:Ardapedia-bilder_beispiel_edoras.jpg|thumb|Text der Bildbeschreibung]]</nowiki></tt>.
Gelegentlich möchte man zwei oder mehr Bilder am rechten Rand vergleichend nebeneinander darstellen. Auch hierzu sind Tabellen nützlich:
<pre style="width:60%">
{| style="float:right; background:transparent; padding:0px; margin:0px;"
|[[Bild:Ardapedia-bilder_beispiel_baum1.jpg|thumb|Baum1]]
|[[Bild:Ardapedia-bilder_beispiel_baum2.jpg|thumb|Baum2]]
|}
</pre>


Das erzeugte Vorschaubild wird rechtsbündig ausgerichtet und vom Artikeltext umflossen. Der Alternativtext wird unter dem Bild als Beschreibung angezeigt. Über die Lupe springt man zur großen Version des Bildes auf seiner Beschreibungsseite.
{| style="float:right; background:transparent; padding:0px; margin:0px;"
|[[Bild:Ardapedia-bilder_beispiel_baum1.jpg|thumb|upright=0.5|Baum1]]
|[[Bild:Ardapedia-bilder_beispiel_baum2.jpg|thumb|upright=0.5|Baum2]]
|}
<br style="clear:both" />


<br style="clear:both;"/>
Die üblichen Tabellenformatierungen funktionieren auch, so dass Bilder unterschiedlicher Ausrichtung oder Seitenverhältnisse beispielsweise durch Einfügen von {{Code|<nowiki>|- valign="top"</nowiki>}} oben ausgerichtet werden können.
<pre style="width:60%">
{| style="float:right; background:transparent; padding:0px; margin:0px;"
|- valign="top"
|[[Bild:Ardapedia-bilder_beispiel_baum3.jpg|thumb|Baum]]
|[[Bild:Ardapedia-bilder_beispiel_edoras.jpg|thumb|Edoras]]
|}
</pre>


=== Bilder skalieren===
{| style="float:right; background:transparent; padding:0px; margin:0px;"
|- valign="top"
|[[Bild:Ardapedia-bilder_beispiel_baum3.jpg|thumb|upright=0.5|Baum]]
|[[Bild:Ardapedia-bilder_beispiel_edoras.jpg|thumb|upright=0.5|Edoras]]
|}
<br style="clear:both" />


[[Bild:Ardapedia-bilder_beispiel_edoras.jpg|thumb|100px|Beschreibung]]
In beiden Fällen können auch Skalierungen eingesetzt werden, wegen der besseren Flexibilität sollte der Parameter {{Code|upright}} verwendet werden.
Mit <tt><nowiki>[[Bild:Ardapedia-bilder_beispiel_edoras.jpg|thumb|100px|Beschreibung]]</nowiki></tt> legt man die Breite des generierten Thumbnails auf 100 Pixel fest (Standardgröße, wenn man nichts angibt, sind 180 Pixel). Die Höhe wird aus dem Seitenverhältnis automatisch berechnet.


Es sollte darauf geachtet werden, dass die gewählte Bildgröße in Einklang mit dem Textumfang steht, ein Bild sollte nicht den Text erschlagen, der Text jedoch auch nicht das Bild begraben. Bei kürzeren Artikeln kann das Bild ruhig etwas größer ausfallen, man sollte jedoch z.B. darauf achten, dass der Text vollständig die Höhe des Bildes erfasst. Auch sollte man versuchen, den kürzeren Artikelinhalt mit Bild auf einer Bildschirmseite zu halten. Ihr werdet schon den harmonischen Mittelweg finden.
== Galerie ==


<br style="clear:both;"/>
Die Galerie eignet sich, um mehrere Bilder tabellarisch anzuordnen. Das Einfügen von Galerien mit mehr als vier Bildern ist aber nur in Ausnahmefällen sinnvoll.


=== Bildunterschrift ===
=== Standard ===


Wie man eine Bildunterschrift auch für das nicht verkleinerte Bild zur Verfügung stellt, ist im entsprechendem Abschnitt von [[Ardapedia:Tabellen|Tabellen]] beschrieben.
Standardmäßig werden vier Bilder pro Zeile angeordnet.


===Ausrichten im Text===
<pre>
<gallery>
Bild:Ardapedia-bilder_beispiel_baum1.jpg|Baum1
Bild:Ardapedia-bilder_beispiel_baum2.jpg|Baum2
Bild:Ardapedia-bilder_beispiel_baum3.jpg|Baum3
Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras
</gallery>
</pre>


Die Optionen <tt>left</tt>, <tt>right</tt> und <tt>none</tt> richten Bilder im Text nach links bzw. rechts aus.
<gallery>
Bild:Ardapedia-bilder_beispiel_baum1.jpg|Baum1
Bild:Ardapedia-bilder_beispiel_baum2.jpg|Baum2
Bild:Ardapedia-bilder_beispiel_baum3.jpg|Baum3
Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras
</gallery>


{| border="1" style="border-collapse:collapse"
=== Bilder pro Zeile ===
!Eingabe
!Ergebnis
|-
| |
<pre><nowiki>[[Bild:Ardapedia-bilder_beispiel_smiley.png|left|Ein Smiley]]
Ein '''Smiley''' ist ein vor allem im Chat
beliebtes Emoticon.
</nowiki></pre>
| |
[[Bild:Ardapedia-bilder_beispiel_smiley.png|left|Ein Smiley]]
Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.
|-
| |
<pre><nowiki>[[Bild:Ardapedia-bilder_beispiel_smiley.png|right|Ein Smiley]]
Ein '''Smiley''' ist ein vor allem im Chat
beliebtes Emoticon.
</nowiki></pre>
||
[[Bild:Ardapedia-bilder_beispiel_smiley.png|right|Ein Smiley]]
Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.
|-
| |
<nowiki><center>[[Bild:Ardapedia-bilder_beispiel_drache.jpg|thumbnail|none|200px|Ein gefährlicher Drache]]
</center>
</nowiki>
| |
<center>[[Bild:Ardapedia-bilder_beispiel_drache.jpg|thumbnail|none|200px|Ein gefährlicher Drache]]</center>
Die Option "none" zusammen mit <nowiki><center></nowiki>-Tags zentriert ein Bild innerhalb einer Tabellenzelle.
|}


Der Parameter <tt>none</tt> schaltet jegliche automatische Ausrichtung (bei Thumbnails) ab und stellt das Bild inline dar. Das ist vor allem fürs Einfügen von Thumbnails in Tabellen praktisch:
Mit dem Schlüsselwort {{Code|perrow}} kann angegeben werden, wieviele Bilder pro Zeile gezeigt werden sollen:


{| border="1" style="border-collapse:collapse"  
<pre>
!colspan=6| Verschiedene Aufnahmen desselben Baums
<gallery perrow="2">
|----
Bild:Ardapedia-bilder_beispiel_baum1.jpg|Baum1
| Aufnahme 1|| [[Bild:Ardapedia-bilder_beispiel_baum1.jpg|thumb|none|150px|Baum 1]]
Bild:Ardapedia-bilder_beispiel_baum2.jpg|Baum2
| Aufnahme 2|| [[Bild:Ardapedia-bilder_beispiel_baum2.jpg|thumb|none|150px|Baum 2]]
Bild:Ardapedia-bilder_beispiel_baum3.jpg|Baum3
| Aufnahme 3|| [[Bild:Ardapedia-bilder_beispiel_baum3.jpg|thumb|none|150px|Baum 3]]
Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras
|}
</gallery>
</pre>


Alle Optionen lassen sich beliebig, jeweils durch senkrechte Striche getrennt, miteinander kombinieren, unbekannte Optionen ignoriert die Software.
<gallery perrow="2">
Bild:Ardapedia-bilder_beispiel_baum1.jpg|Baum1
Bild:Ardapedia-bilder_beispiel_baum2.jpg|Baum2
Bild:Ardapedia-bilder_beispiel_baum3.jpg|Baum3
Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras
</gallery>


=== Einfügen eines Links zur Bildbeschreibung ===
=== Skalierung in Galerien ===
Durch einen Klick auf ein hochgeladenes Bild erscheint eine Seite mit einer Beschreibung dieses Bildes. Auf diese kann auch direkt verwiesen werden, indem man vor das Wort Bild einen ''Doppelpunkt'' setzt.


[[:Bild:Ardapedia-bilder_beispiel_edoras.jpg|Bildbeschreibung]]
Mit den Schlüsselwörtern {{Code|heights}} bzw. {{Code|widths}} wird die Breite und/oder Höhe der Bilder vorgegeben. Das jeweils breiteste bzw. höchste Bild wird für die Galerie als Maßstab genommen und die kleineren Bilder entsprechend angepasst. Kombinationen von {{Code|heights}} und {{Code|widths}} sind möglich.


<table  ><tr><td>
<pre>
<pre>
<nowiki>[[:Bild:Ardapedia-bilder_beispiel_edoras.jpg|Bildbeschreibung]]</nowiki>
<gallery heights="300">
Bild:Ardapedia-bilder_beispiel_baum1.jpg|Baum1
Bild:Ardapedia-bilder_beispiel_baum2.jpg|Baum2
Bild:Ardapedia-bilder_beispiel_baum3.jpg|Baum3
Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras
</gallery>
</pre>
</pre>
</td></tr></table>


<gallery heights="300">
Bild:Ardapedia-bilder_beispiel_baum1.jpg|Baum1
Bild:Ardapedia-bilder_beispiel_baum2.jpg|Baum2
Bild:Ardapedia-bilder_beispiel_baum3.jpg|Baum3
Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras
</gallery>


== Bilderquellen ==
=== Überschrift ===


Wenn Du gerne ein Bild zu einem Artikel einbauen würdest, aber selbst über kein passendes verfügst, dann sieh Dich mal auf [[Wikipedia:Public-Domain-Bilderquellen]] um, vielleicht ist da ein Bild dabei, das Du gebrauchen kannst. Auf [[Wikipedia:Bilderwünsche|Bilderwünsche]] kannst Du auch andere Wikipedianer nach Bildern fragen.
Mit dem optionalen Schlüsselwort {{Code|caption}} lässt sich eine Überschrift einfügen: {{Code|<nowiki><gallery caption="Bäume"></nowiki>}}


Eine Übersicht der Bilder in Wikipedia liefert der [[Google]]-[[Cache]]: [http://images.google.com/images?as_q=png&svnum=100&hl=en&ie=UTF-8&oe=UTF-8&newwindow=1&btnG=Google+Search&as_epq=&as_oq=&as_eq=&imgsz=&as_filetype=&imgc=&as_sitesearch=de.wikipedia.org&safe=off png], [http://images.google.com/images?hl=en&lr=&ie=UTF-8&oe=UTF-8&newwindow=1&safe=off&q=jpg+site%3Ade.wikipedia.org jpg], [http://images.google.com/images?hl=en&lr=&ie=UTF-8&oe=UTF-8&newwindow=1&safe=off&q=gif+site%3Ade.wikipedia.org gif]
== Panoramabilder ==


Panoramabilder einzubinden ist immer mit Problemen verbunden; wichtig dabei ist, dass wir nicht wissen, wie groß das Browser-Fenster des Lesers ist: Also sollte das Bild nie größer werden als die Breite der Druckversion (ca. 780px).


== Rahmen ==


{| style="border:1px solid #388240; background-color:#336633;padding:5px;font-size:95%;"
Vor allem einfache Grafiken, Flaggen usw. die einen weißen Untergrund haben und nicht mit {{Code|thumb}} dargestellt werden sollen, benötigen einen Rahmen. Dieser kann mit dem Parameter {{Code|border}} erzeugt werden:
|
 
Dieser Artikel basiert auf dem Artikel [http://de.wikipedia.org/wiki/Wikipedia:Bilder Bilder] aus der freien Enzyklopädie [http://de.wikipedia.org Wikipedia] und steht unter der [http://www.gnu.org/licenses/fdl.txt GNU Lizenz für freie Dokumentation]. In der Wikipedia ist eine [http://de.wikipedia.org/w/wiki.phtml?title=Bilder&amp;action=history Liste der Autoren] verfügbar, dort kann man den [http://de.wikipedia.org/w/wiki.phtml?title=Bilder&amp;action=edit Artikel bearbeiten].
{{Code|<nowiki>[[Bild:Beispiel.jpg|border|right|100px]]</nowiki>}}
|}
 
== Einfügen eines Links zur Bildbeschreibungsseite ==
 
Durch einen Klick auf ein hochgeladenes Bild erscheint eine Seite mit der Beschreibung und einer meist höher aufgelösten Version dieses Bildes. Wenn das Bild im Text nicht angezeigt werden soll, kann auf diese Seite verwiesen werden, indem man im Link vor das Wort
„{{Code|Bild}}“ einen ''Doppelpunkt'' setzt: Aus {{Code|<nowiki>[[</nowiki>:Bild:Beispiel.jpg<nowiki>|</nowiki>Bildbeschreibung<nowiki>]]</nowiki>}} wird [[:Bild:Beispiel.jpg|Bildbeschreibung]].


[[Kategorie:Ardapedia Hilfe|Bilder]]
{{Wikipedia|Hilfe:Bilder}}
[[Kategorie:Hilfe|Bilder]]

Aktuelle Version vom 8. Dezember 2011, 20:22 Uhr

» Hilfe » Bilder

Hilfe

Diese Seite erklärt, wie du Bilder, Grafiken und Karten in Artikel einfügst. Wie du Bilder hochladen kannst, erfährst du im Bildertutorial. Welche Bilder du hochladen darfst, erläutert Ardapedia:Bildrechte. Weitere Informationen findest du in den FAQ zu Bildern.

Grundregeln

  • Du musst bei Ardapedia registriert und angemeldet sein, um Bilder/Dateien hochladen zu können.
  • Lies dir vor dem Upload von Bildern die Hinweise zum Urheberrecht bei Bildern durch und halte dich daran!
  • Benutze die Beschreibungsseite des Bildes für Information zu Urheber, Quelle und Lizenz.
  • Gib deinem Bild einen klaren und detaillierten Dateinamen (zum Beispiel "Marienkirche_Hintertupfing.jpg" statt "Bild 1.jpg").
  • Bearbeite das Bild so, dass es das Wesentliche zeigt.

Prinzipelles zur Anordnung

Weil das Aussehen einer Webseite in erster Linie davon abhängt, wie sie der jeweilige Browser darstellt, nicht, wie der Autor sie plant, soll bei Anordnung, Ausrichtung und Größe möglichst auf zu spezielle Vorgaben verzichtet werden. Gutes Webdesign zeichnet sich durch Flexibilität aus.

Die Bilder sollten möglichst in die jeweiligen Kapitel gesetzt werden. Zuviele Bilder am Anfang des Artikels angeführt, um sich „von selbst“ auf den Artikel zu verteilen, sind ungüstig: Sie zeigen leicht unerwüschte Nebenwirkungen im Layout, und bringen auch manche Browser zum Absturz.

Originalgröße

Bilder lassen sich mit [[Bild:Dateiname|Beschreibung]] in Artikel einfügen. Das Bild wird dann in Originalgröße links im Artikel angezeigt. Mit der Option framed, z. B. [[Bild:Dateiname|framed|Beschreibung]] wird das Bild mit einem Rahmen umgeben.

Eingabe Ergebnis
[[Bild:Wolf.jpg|Wolf]] Wolf
[[Bild:Wolf.jpg|framed|Wolf mit Rahmen]]
Wolf mit Rahmen

Da durch große Bilder die Seiten dann sehr lange zum Laden brauchen, solltest du aus Rücksicht auf die Modembenutzer dies nur in Ausnahmefällen so handhaben, zum Beispiel wenn das Originalbild sehr klein ist. Benutze sonst besser verkleinerte Vorschauansichten (so genannte Thumbnails), die der Leser – wenn es ihn interessiert – dann mit einem Klick auf das Icon vergrößern und genauer betrachten kann.

Thumbnails

Wolf

Die von der Ardapedia verwendete Software Mediawiki kann automatisch Vorschaubilder erzeugen. Dazu fügt man den Zusatz thumb oder thumbnail zwischen Dateiname und Alternativtext ein, zum Beispiel [[Bild:Wolf.jpg|thumb|Wolf]]. Das erzeugte Vorschaubild wird rechtsbündig ausgerichtet und vom Artikeltext umflossen. Der Alternativtext wird unter dem Bild als Beschreibung angezeigt. Über die Lupe springt man zur großen Version des Bildes auf seiner Beschreibungsseite. Angemeldete Benutzer können die Bildgröße der Thumbnails in ihren Benutzereinstellungen festlegen; für nichtangemeldete Leser erscheinen diese Bilder mit einer Bildbreite von 180 Pixeln. Diese Art der Bilddarstellung sollte im Allgemeinen in Artikeln verwendet werden. Bildunterschriften unterstützen alle Möglichkeiten der Textgestaltung.

Abweichende Thumbnails

Mit der Option [[Bild:Beispielbild.jpg|thumbnail=Beispielthumb.jpg|Bildbeschreibung]] lässt sich ein Thumbnail darstellen, das nicht dem hinterlegten Bild entspricht. Eine sinnvolle Anwendung besteht darin, einen Ausschnitt aus einem großen Bild als Thumbnail zu nehmen, beispielsweise um auf ein Detail hinzuweisen oder bei einer Panoramaaufnahme (extremes Seitenverhältnis) ein Teil mit gängigem Format (4:3) als Thumbnail anzuzeigen. Eine andere Anwendung: Bei einigen Bildern verschwinden in der Thumbnail-Ansicht wichtige Details. Beim Vergrößern erscheint dann das komplette Bild.

Bilder skalieren

Grundsätzlich sollten starre Bildgrößen nur in Ausnahmefällen verwendet werden, da dies die individuellen Anzeigeeinstellungen für Vorschaubilder (Thumbnails) der Benutzer ignoriert. Wann immer möglich, lass die Benutzer selbst wählen, in welcher Größe sie Vorschaubilder sehen wollen.

Feste Skalierung

Wolf

Mit [[Bild:Wolf.jpg|thumb|100px|Wolf]] wird die Breite des generierten Miniaturbildes auf 100 Pixel festgelegt (Standardgröße sind 180 Pixel). Die Höhe wird aus dem Seitenverhältnis automatisch berechnet. Es ist auch möglich, eine Maximalhöhe festzulegen. Wird etwa als Größe 100x200px angegeben, wird das Bild so skaliert, dass es in einem gedachten Rechteck von 100 Pixel Breite und 200 Pixel Höhe Platz findet. Das Seitenverhältnis bleibt dabei in jedem Fall erhalten.

Wolf ohne Thumbnailrahmen

Mit [[Bild:Wolf.jpg|left|100px|Wolf ohne Thumbnailrahmen]] skalierst du das Bild und lässt es ohne einen Thumbnailrahmen anzeigen.

Hoch- und querformatige Bilder kombinieren – automatische Skalierung

Werden hoch- und querformatige Bilder untereinander gesetzt, ohne dass eine Breite vorgegeben wird, wirken die hochformatigen Thumbs meist übermäßig groß. Es empfiehlt sich in solchen Fällen, dem hochformatigen Bild den Parameter upright mitzugeben. Damit wird es standardmäßig um den Faktor 0,75 schmaler als das querformatige Bild dargestellt, was in der Regel zu einer schöneren Aufteilung führt. Der große Vorteil liegt in der automatischen Skalierung, die für anonyme Benutzer genau so funktioniert wie für angemeldete Benutzer, die sich in ihren persönlichen Einstellungen eine andere Bildbreite vorgegeben haben. Die Verhältnisse bleiben immer gewahrt.

Beispiel:

[[Bild:Bildname.jpg|thumb|upright|Ohne px, aber mit "upright" Angabe]]

Dem Parameter upright kann auch ein Faktor mitgegeben werden, falls es sich um sehr hohe Bilder handelt, bei der eine Skalierung auf 0,75 noch nicht reicht:

[[Bild:Bildname.jpg|thumb|upright=0.5|Ohne px, aber mit "upright=0.5" Angabe]]

Auf diese Weise können auch sehr breite Bilder, z.B. Panoramen, skaliert werden. Mit einem upright-Wert > 1 werden sie entsprechend breiter als das Standard-Thumbnail dargestellt. Die Proportionen bleiben dadurch in jeder Darstellung erhalten:

[[Bild:Panorama.jpg|thumb|upright=1.8|Panorama, es wird mit 180% der Standardbreite dargestellt.]]

Die Breite der so berechneten Thumbnails wird immer auf den nächsthöheren 10er-Wert aufgerundet. Dieser automatischen Skalierung sollte der Vorzug gegeben werden vor der Verwendung fester Bilderbreiten.

Ausrichten im Text

Die Optionen left, right, center und none richten Bilder im Text aus. Dabei ist jedoch zu beachten, dass die Darstellung je nach Browser sehr unterschiedlich sein kann. Um Probleme bei der Darstellung zu vermeiden, empfiehlt es sich, alle Bilder als thumbs auf der rechten Seite, bei längeren Absätzen auch absatzweise unter der Absatzüberschrift einzufügen.

Eingabe Ergebnis
[[Bild:Smile smile.png|left|Ein Smiley]] Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.
Ein Smiley
Ein Smiley ist ein vor allem im Chat beliebtes Emoticon.
[[Bild:Smile smile.png|right|Ein Smiley]] Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon.
Ein Smiley
Ein Smiley ist ein vor allem im Chat beliebtes Emoticon.
[[Bild:Smile smile.png|center||Ein Smiley]] Ein '''Smiley''' ist ein vor allem im Chat beliebtes Emoticon. center Ein Smiley Ein Smiley ist ein vor allem im Chat beliebtes Emoticon.

Der Parameter none schaltet jegliche automatische Ausrichtung (bei Thumbnails) ab und stellt das Bild inline dar. Das ist vor allem zum Einfügen von Thumbnails in Tabellen praktisch.

Alle Optionen lassen sich beliebig, jeweils durch senkrechte Striche getrennt, miteinander kombinieren, unbekannte Optionen ignoriert die Software.

Thumbs nebeneinander am rechten Rand

Gelegentlich möchte man zwei oder mehr Bilder am rechten Rand vergleichend nebeneinander darstellen. Auch hierzu sind Tabellen nützlich: 

{| style="float:right; background:transparent; padding:0px; margin:0px;"
|[[Bild:Ardapedia-bilder_beispiel_baum1.jpg|thumb|Baum1]]
|[[Bild:Ardapedia-bilder_beispiel_baum2.jpg|thumb|Baum2]]
|}
Baum1
Baum2


Die üblichen Tabellenformatierungen funktionieren auch, so dass Bilder unterschiedlicher Ausrichtung oder Seitenverhältnisse beispielsweise durch Einfügen von |- valign="top" oben ausgerichtet werden können. 

{| style="float:right; background:transparent; padding:0px; margin:0px;"
|- valign="top"
|[[Bild:Ardapedia-bilder_beispiel_baum3.jpg|thumb|Baum]]
|[[Bild:Ardapedia-bilder_beispiel_edoras.jpg|thumb|Edoras]]
|}
Baum
Edoras


In beiden Fällen können auch Skalierungen eingesetzt werden, wegen der besseren Flexibilität sollte der Parameter upright verwendet werden.

Galerie

Die Galerie eignet sich, um mehrere Bilder tabellarisch anzuordnen. Das Einfügen von Galerien mit mehr als vier Bildern ist aber nur in Ausnahmefällen sinnvoll.

Standard

Standardmäßig werden vier Bilder pro Zeile angeordnet. 

<gallery>
Bild:Ardapedia-bilder_beispiel_baum1.jpg|Baum1
Bild:Ardapedia-bilder_beispiel_baum2.jpg|Baum2
Bild:Ardapedia-bilder_beispiel_baum3.jpg|Baum3
Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras
</gallery>
  • Baum1

    Baum1

  • Baum2

    Baum2

  • Baum3

    Baum3

  • Edoras

    Edoras

Bilder pro Zeile

Mit dem Schlüsselwort perrow kann angegeben werden, wieviele Bilder pro Zeile gezeigt werden sollen: 

<gallery perrow="2">
Bild:Ardapedia-bilder_beispiel_baum1.jpg|Baum1
Bild:Ardapedia-bilder_beispiel_baum2.jpg|Baum2
Bild:Ardapedia-bilder_beispiel_baum3.jpg|Baum3
Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras
</gallery>
  • Baum1

    Baum1

  • Baum2

    Baum2

  • Baum3

    Baum3

  • Edoras

    Edoras

Skalierung in Galerien

Mit den Schlüsselwörtern heights bzw. widths wird die Breite und/oder Höhe der Bilder vorgegeben. Das jeweils breiteste bzw. höchste Bild wird für die Galerie als Maßstab genommen und die kleineren Bilder entsprechend angepasst. Kombinationen von heights und widths sind möglich. 

<gallery heights="300">
Bild:Ardapedia-bilder_beispiel_baum1.jpg|Baum1
Bild:Ardapedia-bilder_beispiel_baum2.jpg|Baum2
Bild:Ardapedia-bilder_beispiel_baum3.jpg|Baum3
Bild:Ardapedia-bilder_beispiel_edoras.jpg|Edoras
</gallery>
  • Baum1

    Baum1

  • Baum2

    Baum2

  • Baum3

    Baum3

  • Edoras

    Edoras

Überschrift

Mit dem optionalen Schlüsselwort caption lässt sich eine Überschrift einfügen: <gallery caption="Bäume">

Panoramabilder

Panoramabilder einzubinden ist immer mit Problemen verbunden; wichtig dabei ist, dass wir nicht wissen, wie groß das Browser-Fenster des Lesers ist: Also sollte das Bild nie größer werden als die Breite der Druckversion (ca. 780px).

Rahmen

Vor allem einfache Grafiken, Flaggen usw. die einen weißen Untergrund haben und nicht mit thumb dargestellt werden sollen, benötigen einen Rahmen. Dieser kann mit dem Parameter border erzeugt werden:

[[Bild:Beispiel.jpg|border|right|100px]]

Einfügen eines Links zur Bildbeschreibungsseite

Durch einen Klick auf ein hochgeladenes Bild erscheint eine Seite mit der Beschreibung und einer meist höher aufgelösten Version dieses Bildes. Wenn das Bild im Text nicht angezeigt werden soll, kann auf diese Seite verwiesen werden, indem man im Link vor das Wort „Bild“ einen Doppelpunkt setzt: Aus [[:Bild:Beispiel.jpg|Bildbeschreibung]] wird Bildbeschreibung.


Diese Seite basiert auf der Seite Hilfe:Bilder aus der freien Enzyklopädie Wikipedia und steht unter der Creative Commons Attribution/Share-Alike-Lizenz. In der Wikipedia ist eine Liste der Autoren verfügbar.
Abgerufen von „https://www.ardapedia.org/w/index.php?title=Ardapedia:Bilder&oldid=90157“