FANDOM


Cette page fournit des conseils sur comment créer un arrière-plan optimal pour la mise en page fluide de FANDOM. L'image d'arrière-plan s'importe via le Concepteur de thème.

InformationsModifier

Voici quelques détails sur la mise en page fluide et la façon dont le site de FANDOM se comporte avec différents affichages :

  • Sur les affichages les plus petits, comme les iPads avec des écrans larges de 1024px, l'apparence fluide fait que le fond est complètement couvert par l'espace de contenu, aussi l'arrière-plan ne sera pas visible dans ce cas.
  • Sur des affichages plus larges (plus de 1066px), l'arrière-plan sera visible de chaque côté de la zone de contenu.
  • La zone de contenu arrête de s'étendre quand elle atteint sa largeur maximale de 1240px.

Comment est-il possible que la même image d'arrière-plan soit visible sur toutes ces différentes tailles quand on importe juste un seul fichier ? L'image est coupée et l'espace au centre (majoritairement couvert par la zone de contenu) est rempli avec une couleur unie choisie dans le Concepteur de thème. Une couleur unie sera aussi affichée au delà des bords de l'image, en bas et sur l'extérieur, pour les écrans très larges.

Note : Si vous ne souhaitez pas que votre arrière-plan soit coupé en deux, vous devez importer une image qui soit large de 2000px au moins, point à partir duquel l'option du Concepteur de thème (« pas de séparation ») permettant à l'arrière-plan de rester en un seul morceau, peu importe la taille de la zone de contenu, deviendra disponible.

Créer un arrière-plan qui peut s'adapter à ces différentes tailles peut paraître être un défi mais ne vous inquiétez pas, nous avons quelques astuces pour vous.

Créer l'arrière-plan Modifier

Pour créer le meilleur arrière-plan possible, il est utile d'utiliser un logiciel permettant de modifier des images, comme Photoshop, GIMP ou Paint.

Voici un modèle d'arrière-plan pour référence :

BackgroundDiagram

Cinq choses à noter à propos de cette image :

  • Arrière-plan : Les ballons colorés mettent en valeur l'aspect créatif de l'arrière-plan (parfois appelé skin).
  • Dégradé : Le bas et les côtés de l'arrière-plan sont dégradés (en utilisant l'outil de flou ou dégradé de votre logiciel de modification d'images) afin que la couleur d'arrière-plan se fonde progressivement dans votre image d'arrière-plan.
  • Marges : Les zones en rouge de chaque côté de l'espace de contenu. Ces rectangles rouges indiquent quelles parties de l'arrière-plan seront visibles la plupart du temps.
  • Espace de contenu : Le rectangle semi-transparent au milieu du modèle est là où la page de contenu ira. Par défaut, l'arrière-plan ne sera pas du tout visible sous cette zone, mais de la transparence peut être ajoutée dans le Concepteur de thème.
  • Ligne de séparation : La ligne jaune au milieu de la capture est là où l'arrière-plan est coupé en deux et séparé pour s'ajuster à la taille de l'espace de contenu. La couleur qui remplit cette espace peut être définie dans le Concepteur de thème.

Il peut être utile d'utiliser ce modèle d'arrière-plan pour réaliser vos propres arrière-plans créatifs ! Si vous le souhaitez, vous pouvez télécharger le modèle d'arrière-plan au format PSD, qui peut être ouvert sous Photoshop ou GIMP, via le lien suivant :

File:Background_template.psd

Quelques conseils pour le Concepteur de thèmeModifier

  • L'image que vous importerez au final via le Concepteur de thème ne peut excéder 300 kilooctets (Ko) en taille. Vous aurez peut-être besoin de réduire la qualité d'image à l'enregistrement pour atteindre cette taille.
  • Le plus large le flou (ou dégradé de couleur) sur l'arrière-plan sera et plus la transition avec la couleur d'arrière-plan sera fluide.
  • Vous ne devriez pas rendre l'espace de contenu trop transparent, parce qu'il sera alors plus difficile de lire le contenu.
  • Quand vous réalisez un arrière-plan, considérez toujours la plus grande possibilité de résolutions d'écran. Plus vous adaptez votre arrière-plan pour correspondre à différentes résolutions, plus votre communauté sera contente.
  • Recherchez des arrières-plans et images basés sur le sujet de votre communauté pour trouver l'inspiration pour votre arrière-plan.
  • Essayez de toujours utiliser le Concepteur de thème pour importer votre image d'arrière-plan et concevoir l'apparence de votre communauté. Les arrière-plans ajoutés en utilisant le CSS personnalisé peuvent être touchés de façon inattendue par des mises à jour système de FANDOM et peuvent aussi augmenter le temps de chargement des pages.

Voir aussiModifier

Plus d'aideModifier

Interférence d'un bloqueur de publicité détectée !


Wikia est un site gratuit qui compte sur les revenus de la publicité. L'expérience des lecteurs utilisant des bloqueurs de publicité est différente

Wikia n'est pas accessible si vous avez fait d'autres modifications. Supprimez les règles personnalisées de votre bloqueur de publicité, et la page se chargera comme prévu.