Fandom

Central de Wikia

Ayuda:Fondo

1.870páginas en
el wiki
Crear una página
Discusión0

Esta página tiene recomendaciones sobre cómo crear un fondo óptimo para tu comunidad. La imagen de fondo se carga mediante Diseñador de Temas.

InformaciónEditar

Aquí hay algunos detalles sobre el diseño fluido y la forma en que un sitio de Fandom se comporta en diferentes pantallas:

  • En pantallas más pequeñas, como en iPads con 1024px de ancho, el diseño fluido automáticamente ajusta el área de contenido para que llene toda la pantalla por lo cual el fondo no será visible.
  • En pantallas más grandes (más de 1066px), el fondo será visible a ambos lados del área de contenido.
  • El área de contenido deja de expandirse una vez que alcanza su máximo ancho de 1240px.

Para que la imagen de fondo se muestre correctamente en todos estos tamaños, la imagen se divide por la mitad y el espacio central (cubierto en su mayor parte por el área de contenido) se completa con un color sólido. Puedes elegir este color en el Diseñador de temas. Un color sólido también se verá más allá del borde de la imagen de fondo, en la parte inferior y los lados, para pantallas muy grandes.

Nota: Si no deseas que se divida tu fondo, debes cargar una imagen con un ancho mínimo de 2000px, momento en el que estará disponible una opción del Diseñador de temas ("no dividir") que permite que el fondo para permanezca en una sola pieza, sin importar el tamaño del área de contenido.

Crear un fondo que pueda adaptarse a estos diferentes tamaños puede parecer un desafío, pero no te preocupes. Tenemos algunos consejos para ayudarte.

Creando el fondo Editar

Para crear el mejor fondo posible, será de mucha ayuda utilizar programas que permitan editar las imágenes, como Photoshop, GIMP o Paint.

Aquí está una plantilla del fondo que usamos para Comunidad Central para que sirva de referencia:

BackgroundDiagram.png

Vamos a diferenciar en esa plantilla 5 cosas:

  • Fondo: Esos bocadillos de colores que parecen globos componen el fondo
  • Mezcla: La parte inferior y los lados de la piel se mezclan (utilizando la herramienta de mezcla o degradado en el programa de edición de imágenes) de modo que el color de fondo se mezcle perfectamente con la imagen de fondo.
  • Márgenes: Son las áreas rojas de los lados del área de contenido. Sirven para saber qué parte del fondo se verá hasta que el área de contenido alcance los 1600px de ancho.
  • Área de contenido: De color blanca y algo transparente. Es la parte en la que va contenido el artículo, lo que hay debajo no se verá a menos que pongas transparencia en el Diseñador de Temas.
  • Línea de división: Es el área amarilla, ahí es donde la imagen se partirá y aparecerá el degradado, lo que haya debajo, no se verá. Ese color se puede elegir desde el Diseñador de Temas.

Puede ser útil usar una plantilla para hacer un fondo personalizado. Puedes descargar aquí una plantilla como archivo PSD, que puede ser usado en Photoshop o GIMP.

Algunos consejos para el diseñador de temasEditar

  • La imagen final que subirás al Diseñador de Temas no puede ser mayor de 300 kilobytes (KB). Puede que quieras reducir la calidad de la imagen cuando guardes el archivo para lograr no superar este tamaño.
  • Cuanto más largo se haga el degradado en el fondo mejor se verá y más suave será la transición. Consulta Ayuda:Diseñador de temas/gradientes para más detalles sobre cómo crear degradados en los fondos.
  • No deberías hacer el área de contenido muy transparente, porque esto provocará que sea más difícil leer el contenido.
  • Cuando se hace un skin, siempre hay que considerar todos los tipos de anchos que tendrán las resoluciones. Cuanto mejor el fondo a todas las resoluciones, más feliz será la comunidad.
  • Busca fondos de pantalla e imágenes que estén basados en el tema de tu wikia para encontrar inspiración para tu fondo.
  • Intenta siempre usar el Diseñador de Temas para subir la imagen de fondo. Los fondos añadidos a través de CSS personalizado puede verse afectados de forma inesperada por las actualizaciones del sistema que realice Wikia y pueden incrementar el tiempo de carga de la página.
  • Si quieres fijar el fondo de la página al final de la pantalla en lugar de al comienzo, añade el siguiente código a la página MediaWiki:Wikia.css/Special:CSS de tu comunidad:
/* Fondo fijado al final de la página */
 body.background-dynamic:after,
 body.background-dynamic:before {
 bottom: 0 !important;
 top: inherit !important;
}

Ver tambiénEditar

¡Interferencia de bloqueo de anuncios detectada!


Wikia es un sitio libre de uso que hace dinero de la publicidad. Contamos con una experiencia modificada para los visitantes que utilizan el bloqueo de anuncios

Wikia no es accesible si se han hecho aún más modificaciones. Si se quita el bloqueador de anuncios personalizado, la página cargará como se esperaba.

También en Fandom

Wiki al azar