Welche Banner-Größe braucht deine Serverliste?
Eine Einheitsgröße für alle Serverlisten gibt es nicht. Jede Liste legt Breite, Höhe, Dateityp und maximale Dateigröße selbst fest, also schau vor dem Hochladen in ihre Regeln. Diese Größen exportiert Banner Studio, und dafür eignen sie sich:
| Format | Pixel | Geeignet für |
|---|---|---|
| Klassisches Web-Banner | 468×60 | Das alte „Full Banner“ der IAB. Viele Seiten und Listen nutzen es bis heute, obwohl die IAB es 2011 aus ihren Standardgrößen gestrichen hat. |
| Serverlisten-Karte | 740×200 | Das Banner auf deiner Karte und deiner Serverseite bei BestMCServerList, breiter und höher als ein klassisches Banner. |
| Breiter Header | 960×200 | Website-Header, Forenbeiträge und Discord-Ankündigungen. |
Bau für jede Größe ein eigenes Banner, statt eine Datei zu strecken. Ein 740×200-Design, das in 468×60 gequetscht wird, verliert fast seinen ganzen Text, und Pixel-Art wird bei krummen Skalierungen unscharf.
BestMCServerList nimmt Banner als GIF, PNG, WebP oder JPEG bis 2 MB an.
Schritt 1: Festlegen, was draufsteht
Ein Banner wird ungefähr so lange angeschaut, wie man zum Vorbeiscrollen braucht. Such dir drei Dinge aus und lass den Rest weg:
- Den Servernamen, so groß, wie der Platz es zulässt.
- Einen Aufhänger: den Spielmodus oder das eine, was dich von anderen unterscheidet, etwa „Survival mit Städten“ oder „Skyblock 1.21“.
- Die Adresse, damit Spieler sie abschreiben können, ohne deine Seite zu öffnen.
Feature-Listen, Discord-Links und lange Slogans passen nicht in 60 Pixel Höhe. Die gehören in deine Serverbeschreibung.
Schritt 2: Auf Lesbarkeit gestalten
- Große Pixelschrift. Auf einem 468×60-Banner sollte der Name fast die ganze Höhe füllen. Dünne Schriften und kleine Untertitel werden zu Pixelbrei.
- Kontrast. Helle Schrift mit dunkler Kontur funktioniert auf jedem Hintergrund, auch auf bunten Landschaften und vor Partikeln.
- Ein ruhiger Hintergrund. Ziehende Wolken, Sterne oder Wasser sind in Ordnung. Bewegt sich der Hintergrund so stark wie der Text, lenkt er vom Namen ab.
- Ein erstes Bild, das allein funktioniert. Name und Adresse sollten schon im ersten Frame zu sehen sein. Manche Stellen zeigen nur ein Standbild, und das ist meistens der erste Frame.
- Passende Farben. Nimm dieselben Farben und dasselbe Symbol wie bei deinem Server-Icon und deiner MOTD. So erkennen Spieler dich in der Liste, im Spiel und auf Discord wieder.
Schritt 3: Animieren, ohne zu blinken
Die Animation soll das Banner unterstützen, nicht schreien. Langsame Partikel, ein Lichtstreifen über dem Logo oder ziehende Wolken fallen auf, ohne den Text schwerer lesbar zu machen.
Verzichte auf harte Blitze und schnelles Blinken. Die Richtlinien für barrierefreie Webinhalte (WCAG 2.1, Erfolgskriterium 2.3.1) sagen, dass Inhalte nicht öfter als dreimal pro Sekunde aufblitzen sollen, weil Blitze Anfälle auslösen können. Auf einer Seite mit vielen Bannern wirkt eine ruhige Schleife ohnehin angenehmer.
Bau die Schleife nahtlos: Der letzte Frame sollte wieder in den ersten übergehen. Ein animiertes GIF kann sich endlos wiederholen; in der Datei steht dafür eine Wiederholungszahl von 0 in der NETSCAPE2.0-Erweiterung. Banner Studio exportiert GIFs, die endlos laufen.
Schritt 4: Das GIF klein halten
Ein GIF speichert jeden Frame, und jeder Frame kann eine eigene Palette mit bis zu 256 Farben haben. Die Datei wächst mit der Bildgröße, der Zahl der Frames und mit allem, was sich von Frame zu Frame ändert. Diese Schritte machen sie kleiner, ungefähr von der größten zur kleinsten Wirkung:
- Bildrate senken. 10 bis 12 Bilder pro Sekunde reichen für die meisten Pixel-Animationen.
- Schleife kürzen. Zwei bis vier Sekunden genügen für Partikel oder einen Lichtstreifen.
- Gröbere Pixel nehmen. Große Art-Pixel lassen sich viel besser komprimieren als feine Details.
- Feines Rauschen und Partikel reduzieren. Kleine Dinge, die sich in jedem Frame ändern, kosten am meisten.
- Weniger Farben nutzen. 64 statt 128 oder 256 Farben sehen bei Pixel-Art oft gleich aus.
In Banner Studio schätzt die Größenanzeige die Datei schon beim Bearbeiten. Ist das Banner zu groß, probiert „Make it fit 2 MB“ diese Schritte nacheinander durch und hört auf, sobald die Datei passt.
Schritt 5: Hochladen und woanders einsetzen
Exportier ein GIF für die Animation oder ein PNG, wenn eine Seite nur Standbilder annimmt. Bei BestMCServerList schickst du das fertige Banner mit „Use this banner“ direkt an einen deiner Einträge, oder du lädst die Datei im Banner-Feld deines Serverformulars hoch.
Auf deiner eigenen Website gibst du dem Bild eine feste Breite und Höhe, damit die Seite beim Laden nicht springt, und einen sinnvollen Alternativtext:
<a href="https://example.com/">
<img src="/img/banner-468x60.gif" width="468" height="60"
alt="MeinServer – Survival mit Städten – play.example.com">
</a>Für Discord-Ankündigungen und Forenbeiträge hat der breite 960×200-Header Platz für Namen, Aufhänger und Adresse in großer Schrift.
Typische Fehler
| Problem | Lösung |
|---|---|
| Der Upload wird als zu groß abgelehnt | Bildrate senken, Schleife kürzen oder weniger Farben nutzen. Das Limit jeder Liste prüfen. |
| Auf der 468×60-Version ist nichts lesbar | Für diese Größe ein eigenes Design bauen, nur mit Namen und Adresse. |
| Das Banner wirkt unscharf | Es wurde auf eine Größe skaliert, für die es nicht gemacht ist. In genau der Größe exportieren, die die Liste verlangt. |
| Die Farben zeigen Streifen oder Punkte | Ein Verlauf wurde auf zu wenige Farben reduziert. Flächige Farben nehmen oder mehr Farben erlauben. |
| Die Schleife springt | Der letzte Frame führt nicht zurück zum ersten. Bewegte Elemente mit gleichem Tempo aus dem Bild und wieder hinein laufen lassen. |
| Alles blinkt | Die Animation verlangsamen und Blitze vermeiden, vor allem mehr als drei pro Sekunde. |
Ist das Banner fertig, hilft es bei der größeren Aufgabe, die ersten Spieler auf deinen Server zu holen.
