Es gibt zahlreiche Möglichkeiten, Ihre Plattform mit Bildern (Fotos oder gestalteten Grafiken) zu versehen, um sie ansprechender zu gestalten und ihr das richtige Aussehen zu verleihen. Hier finden Sie die genauen Richtlinien für jeden Bildtyp, um sicherzustellen, dass Ihre Bilder korrekt zugeschnitten werden und nicht verschwommen aussehen.
1. Arten von Bildern auf Ihrer Plattform
Ein Bild kann ein einfaches Foto oder eine gestaltete Grafik sein. Dies sind die verschiedenen Arten von Bildern, die Sie in Ihre Plattform und Projekte einbauen können:
Homepage-Banner
Projekt-/Ordnerkarte
Projekt/Ordner-Banner
Beitrags- (Ideen-)Karte
Logo
Bilder im Text
Vorschläge
2. Bildgrößen
Um verpixelte Bilder zu vermeiden, stellen Sie immer sicher, dass Ihr Bild groß genug ist, d.h. es muss eine Auflösung (dpi) von mindestens 72dpi haben. Die Bilder sollten im png- oder jpg-Format vorliegen und maximal 5 MB groß sein.
* dpi, oder dots per inch, ist ein Maß für die Auflösung eines Bildes. Je höher die Punktdichte, desto höher ist die Auflösung des Bildes.
3. Bildgröße, Verhältnis und Reaktionsfähigkeit
Die empfohlenen Abmessungen sind je nach Bildtyp unterschiedlich. Bitte beachten Sie, dass die Bilder je nach dem Gerät, mit dem Sie die Plattform besuchen, unterschiedlich angezeigt werden. Siehe Punkt 4 für Empfehlungen zur Anzeige.
In dieser Tabelle finden Sie die vorgeschlagenen Abmessungen und das Verhältnis pro Bildtyp. Das Tool zum Hochladen von Bildern hilft Ihnen dabei, jedes Bild jederzeit auf das richtige Verhältnis zuzuschneiden.
Bildtyp | Wo wird es angezeigt? | Abmessungen | Ratio |
|
Homepage-Banner | Je nach Ihren Einstellungen kann es sich um ein Banner über die gesamte Breite oder um 1 Zeile oder Spalte handeln. | 1440 x 480 px | 3:1 | Kann auf Mobiltelefonen ungefähr 1:1 angezeigt werden |
Projekt-/Ordnerkarte
- Quadratisch | Auf der Homepage oder in einem Ordner, um ein Projekt zu repräsentieren | 500 x 500 px | 4:3 | Wird auch auf Mobiltelefonen als 4:3 angezeigt |
Projekt-/Ordner-Banner | Wird oben auf der Seite Ihres Projekts oder Projektordners angezeigt | 1440 x360px | 4:1 | Kann auf Mobiltelefonen etwa im Verhältnis 3:1 angezeigt werden. |
Beitrags- (Ideen-)Karte | Wird oben auf dem Beitrag (der Idee, etc.) oder in der Beitragsübersicht angezeigt |
| 1:1 | Kann auf Mobiltelefonen etwa im Verhältnis 2:1 oder 3:1 angezeigt werden. |
Logo der Website | Oben links im Navigationsmenü | Mindesthöhe 45 px; keine Mindest- oder Höchstbreite | ||
Veranstaltungskarte innerhalb eines Projekts | Wird unten auf Ihren Projektseiten angezeigt | keine erzwungenen Bildgrößen angewendet | (empfohlenes Verhältnis 3:1 klassisch für Banner) | |
Vorschlagskarte | Das Hauptbild wird in der Liste mit allen anderen Vorschlägen angezeigt.
| 1000x500px | ||
Bild im Text | in Projekt-/Phasenbeschreibungen oder Umfragefragen
Bildtitel sind aus Gründen der Zugänglichkeit obligatorisch | können im Text in der Größe verändert werden |
Ihre Plattform ist reaktionsschnell. Das bedeutet, dass Bilder je nach Bildschirmtyp (Desktop, Tablet, Mobiltelefon) unterschiedlich angezeigt werden. Wir empfehlen daher, Text oder Informationen auf dem Bild zu vermeiden und nur dekorative Bilder zu verwenden.
Warum empfehlen wir, keinen Text oder Informationen auf Bildern zu verwenden?
Dies ist nicht nur besser für die Zugänglichkeit und Lesbarkeit, sondern auch dafür, dass der Text bei verschiedenen Browsergrößen abgeschnitten wird. Denken Sie daran, dass Ihre Bilder eher für visuelles Interesse sorgen als für kritische Inhalte. Sie können die Felder Titel und Beschreibung nutzen, um schriftliche Informationen zu übermitteln, und zusätzliche Bilder zu Ihren Projekt- und Ordnerbeschreibungen hinzufügen, wenn Sie den Besucher*innen Ihrer Plattform mehr Informationen bieten möchten.
4. Anzeige des Bildes im Homepage-Banner (inkl. Beispiele)
Für das Homepage-Banner können Sie zwischen 3 Optionen wählen: "Volle Breite", "Zwei Reihen" oder "Festes Verhältnis".
Für jede der 3 Layout-Optionen ist es wichtig, ein Bild zu wählen, das vorzugsweise keinen Text oder keine Informationen enthält.
Für jeden Bildtyp gibt es ein anderes Verhalten, um sicherzustellen, dass die Plattform auf allen Geräten gut funktioniert. Die "Sichere Zone" ist der Bereich, der immer angezeigt wird.
Banner über die gesamte Breite
Das Banner in voller Breite bietet den besten visuellen Effekt, aber die Größe von & wird am meisten verändert. Verwenden Sie dies nur bei abstrakten Bildern.
Zweireihiges Banner
Dieses Banner ist vor allem bei Bildern nützlich, die nicht gut mit dem Text des Titels, des Untertitels oder der Schaltfläche harmonieren. Diese Artikel werden unterhalb des Banners angezeigt.
Banner mit festem Seitenverhältnis
Das Banner mit festem Seitenverhältnis behält seine Höhe und den größten Teil seiner Breite immer bei. Dies ist ein guter Bannertyp, wenn Sie möchten, dass der Hauptbereich des Bildes jederzeit sichtbar ist.
Das empfohlene Verhältnis für das Banner mit festem Seitenverhältnis ist 3:1. Dieses Bild wird immer auf ein bestimmtes Verhältnis zugeschnitten, um sicherzustellen, dass alle wichtigen Aspekte jederzeit zu sehen sind. Wenn Sie ein Bild hochladen, das nicht bereits im Verhältnis 3:1 ist, können Sie das Bild nach oben und unten ziehen, um sicherzustellen, dass die wichtigen Teile im festen Bereich angezeigt werden.
5. Anzeige von Bildern in Projekten
In einem Projekt gibt es drei Stellen, an denen Sie Bilder hinzufügen können: Projekt-/Ordnerkarte, Projekt-/Ordnerbanner und eine Beitragskarte (Idee).
Wenn Sie ein Bild hochladen, das Sie als Projekt-/Ordnerkarte oder als Projekt-/Ordnerbanner verwenden möchten, können Sie das Bild ziehen und auswählen, welcher Teil des Bildes immer sichtbar ist. Das Raster zeigt, was immer sichtbar sein wird, und der unscharfe Teil des Bildes wird abgeschnitten. Wenn Sie ein Bild hochladen, das bereits die richtigen Abmessungen hat, können Sie das Bild nicht mehr verschieben.
Ideenkarten werden immer im Verhältnis 4:3 angezeigt. Hier gibt es keine Option zum Ziehen des Bildes im Raster.
6. Ein gutes Bild finden
💡 Haben Sie Schwierigkeiten, ein gutes Bild zu finden? Copyright-freie Bildergalerien wie Pexels und Unsplash oder Burst können oft ein guter Ausgangspunkt sein, um schöne Bilder in guter Qualität zu finden.
Benötigen Sie weitere Hilfe oder Unterstützung? Kontaktieren Sie unser Support-Team über die Chat-Bubble auf Ihrer Plattform.