Quina mida de bàner necessites?
No hi ha una única mida que facin servir totes les llistes de servidors. Cada llista fixa les seves pròpies regles d’amplada, alçada, tipus de fitxer i pes, així que revisa-les abans de pujar res. Aquestes són les mides que exporta Banner Studio i per a què serveixen:
| Mida | Píxels | Ideal per a |
|---|---|---|
| Bàner web clàssic | 468×60 | L’antic format "full banner" de l’IAB. Moltes webs i llistes el continuen fent servir, tot i que l’IAB el va treure de la seva llista estàndard el 2011. |
| Targeta de llista de servidors | 740×200 | El bàner de la teva targeta i de la teva pàgina de servidor a BestMCServerList, més ample i més alt que un bàner clàssic. |
| Capçalera ampla | 960×200 | Capçaleres de webs, posts de fòrums i anuncis a Discord. |
Fes un bàner per mida en lloc d’estirar un sol fitxer. Un disseny de 740×200 encongit a 468×60 perd gairebé tot el text, i escalar pixel art a mides estranyes el torna borrós.
BestMCServerList accepta bàners en GIF, PNG, WebP o JPEG, de fins a 2 MB.
Pas 1: decideix què ha de dir el bàner
Un bàner es llegeix més o menys en el temps que trigues a passar-lo de llarg fent scroll. Tria tres coses i deixa fora la resta:
- El nom del servidor, tan gran com permeti l’espai.
- Un ganxo: el mode de joc o allò que et fa diferent, per exemple "Survival amb pobles" o "Skyblock 1.21".
- L’adreça, perquè els jugadors la puguin copiar sense obrir la teva pàgina.
Llistes de característiques, enllaços de Discord i eslògans llargs no hi caben en 60 píxels d’alçada. Posa’ls millor a la descripció del teu servidor.
Pas 2: dissenya perquè es llegeixi
- Text pixelat gran. En un bàner de 468×60 el nom hauria d’ocupar gairebé tota l’alçada. Les fonts fines i els lemes petits es converteixen en soroll.
- Contrast. Text clar amb contorn fosc funciona sobre qualsevol fons, fins i tot paisatges carregats i partícules.
- Un fons tranquil. Núvols, estrelles o aigua en moviment estan bé. Un fons que es mou tant com el text aparta la mirada del nom.
- Un primer fotograma que funcioni sol. Assegura’t que el nom i l’adreça ja es veuen al primer fotograma. Alguns llocs mostren una imatge fixa, i sol ser el primer fotograma.
- Colors a joc. Fes servir els mateixos colors i símbol que la teva icona del servidor i el teu MOTD, perquè els jugadors et reconeguin a la llista, al joc i a Discord.
Pas 3: anima’l sense parpelleigs
L’animació ha de donar suport al bàner, no cridar. Partícules lentes, una lluentor suau que recorre el logo o núvols que es desplacen criden l’atenció sense dificultar la lectura del text.
Evita els flaixos forts i el parpelleig ràpid. Les pautes d’accessibilitat web (WCAG 2.1, criteri d’èxit 2.3.1) diuen que el contingut no hauria de fer flaixos més de tres vegades per segon, perquè els flaixos poden provocar convulsions. A més, un bucle suau és simplement més agradable en una pàgina amb molts bàners.
Fes que el bucle no es noti: l’últim fotograma ha d’enllaçar amb el primer. Un GIF animat es pot repetir per sempre; al fitxer això és un comptador de repeticions 0 a l’extensió NETSCAPE2.0. Banner Studio exporta GIF en bucle.
Pas 4: mantén lleuger el fitxer GIF
Un GIF desa cada fotograma, i cada fotograma pot tenir la seva pròpia paleta de fins a 256 colors. El fitxer creix amb la mida del llenç, el nombre de fotogrames i la quantitat de detall que canvia d’un fotograma a l’altre. Aquests passos el redueixen, més o menys de l’efecte més gran al més petit:
- Abaixa els fotogrames per segon. De 10 a 12 fotogrames per segon n’hi ha prou per a la majoria d’animacions pixelades.
- Escurça el bucle. De dos a quatre segons en sobren per a partícules o una lluentor.
- Fes servir píxels més gruixuts. Els píxels grans es comprimeixen molt millor que el detall fi.
- Treu soroll fi i partícules. Les coses petites que canvien a cada fotograma són el que més pesa.
- Fes servir menys colors. 64 colors en lloc de 128 o 256 sovint es veuen igual en pixel art.
A Banner Studio el mesurador de mida estima el fitxer mentre edites. Si el bàner supera el límit, "Make it fit 2 MB" (ajusta’l a 2 MB) prova aquests passos un darrere l’altre i s’atura tan bon punt el fitxer hi cap.
Pas 5: puja’l i fes-lo servir en altres llocs
Exporta un GIF per a l’animació, o un PNG si un lloc només accepta imatges fixes. A BestMCServerList pots enviar el bàner acabat directament a una de les teves fitxes amb "Use this banner" (fes servir aquest bàner), o pujar el fitxer al camp de bàner del formulari del teu servidor.
A la teva pròpia web, dona a la imatge una amplada i una alçada fixes, perquè la pàgina no salti mentre carrega el GIF, i un text alternatiu amb sentit:
<a href="https://example.com/">
<img src="/img/banner-468x60.gif" width="468" height="60"
alt="MyServer – Survival with towns – play.example.com">
</a>Per a anuncis a Discord i posts en fòrums, la capçalera ampla de 960×200 té lloc per al nom, un ganxo i l’adreça en lletra grossa.
Errors freqüents
| Problema | Solució |
|---|---|
| La pujada es rebutja per ser massa gran | Abaixa els fotogrames per segon, escurça el bucle o fes servir menys colors. Revisa el límit de cada llista. |
| El text no es llegeix a la versió de 468×60 | Fes un disseny a part per a aquesta mida amb només el nom i l’adreça. |
| El bàner es veu borrós | S’ha escalat a una mida per a la qual no estava fet. Exporta’l a la mida exacta que demana la llista. |
| Els colors tenen bandes o punts | Un degradat s’ha reduït a massa pocs colors. Fes servir zones de color planes o permet més colors. |
| El bucle fa un salt | L’últim fotograma no enllaça amb el primer. Fes que els elements en moviment surtin i entrin del quadre a la mateixa velocitat. |
| Tot parpelleja | Alenteix l’animació i evita els flaixos, sobretot més de tres per segon. |
Amb el bàner acabat tens una peça més per a la feina gran: aconseguir els primers jugadors per al teu servidor.
