Réussi
Paramètres d’en-tête
Personnalisez les titres, le texte d’accompagnement, les icônes et les boutons pour des introductions et des actions de page plus claires.
Utilisez ces paramètres pour créer une introduction claire pour les zones de contenu du thème. Un en-tête bien structuré aide les visiteurs à comprendre ce qui suit, améliore le balayage et donne aux contenus importants une introduction visuelle et sémantique plus forte. Pour un aperçu plus large de la manière dont le contenu du thème est organisé, consultez la documentation Shopify sur les sections et les blocs
Contenu de l’en-tête
Section intitulée « Contenu de l’en-tête »Ce groupe contrôle la pile de texte en haut d’une zone de contenu : l’alignement, une icône facultative, une légende, le titre principal et le texte d’accompagnement. Les en-têtes les plus efficaces restent généralement ciblés, chaque élément remplissant un rôle distinct au lieu de répéter le même message.
Choisissez l’alignement du texte en fonction du style de contenu qui l’entoure. L’alignement centré convient aux mises en page promotionnelles ou éditoriales, tandis que l’alignement à gauche est généralement plus facile à lire lorsque vous incluez un texte d’accompagnement plus long.
Le champ d’icône accepte soit un emoji, soit un nom d’icône. Utilisez-le lorsqu’un repère visuel rapide aide à cadrer le message, comme une mise en avant de fonctionnalité ou une étiquette de contenu à thème. Si cela vous semble décoratif plutôt qu’informatif, laissez-le vide pour un résultat plus épuré. Pour des conseils sur le nommage des icônes, consultez Icons.
Utilisez la légende du titre comme une courte étiquette au-dessus du titre principal. Elle fonctionne le mieux pour un contexte bref, comme une catégorie, une campagne ou un thème de contenu.
Le titre principal doit porter le message principal. Gardez-le précis et descriptif afin qu’il aide à la fois les visiteurs et la structure de la page. Le type de titre vous permet de choisir à quel point ce titre doit être visible et structurant.
Choisissez les niveaux de titre en fonction de la structure de la page, et pas seulement de l’apparence. Réservez les titres de niveau le plus élevé aux titres les plus importants afin que la page reste bien organisée.
Utilisez le sous-titre pour un contexte d’accompagnement court, une proposition de valeur ou une brève explication. Si le titre dit déjà suffisamment de choses, un sous-titre concis fonctionne généralement mieux qu’un long paragraphe.
Action du bouton
Section intitulée « Action du bouton »Vous pouvez ajouter un bouton facultatif lorsque l’en-tête doit mener à une prochaine étape claire. Cela est utile lorsque le contenu présente quelque chose d’actionnable, comme parcourir, en savoir plus ou ouvrir une destination mise en avant. Pour les détails de configuration dans l’éditeur, consultez la documentation Shopify sur l’éditeur de thème
Ajoutez ensemble le texte du bouton et un lien afin que l’action paraisse complète et claire. Si vous incluez une icône de bouton, elle doit soutenir l’étiquette plutôt que la remplacer. Le champ d’icône accepte des emoji ou des noms d’icônes ; pour des conseils sur le nommage, consultez Icons.
Le style du bouton contrôle le poids visuel donné à l’action. Les styles plus marqués fonctionnent bien lorsque le bouton est la principale prochaine étape, tandis que les styles plus légers aident le contenu à rester au premier plan.
La disposition du bouton contrôle si l’icône apparaît à côté de l’étiquette ou seule. Il est préférable de réserver les boutons avec icône seule aux cas où l’action est sans ambiguïté dans le contexte environnant.
Vous pouvez placer le bouton au-dessus ou en dessous du contenu textuel, avec une position mobile distincte si nécessaire. Cela facilite le maintien d’un équilibre dans la mise en page sur ordinateur tout en offrant aux visiteurs sur mobile un flux de lecture plus fluide.
Activez l’option de bouton mobile pleine largeur lorsque vous souhaitez que l’action ressorte plus clairement sur les petits écrans. C’est particulièrement utile lorsque le fait d’appuyer sur le bouton est l’objectif principal.
Ouvrir un lien dans un nouvel onglet est généralement préférable pour les destinations externes ou dans les cas où vous ne voulez pas que les visiteurs perdent leur position. Pour la navigation normale, rester dans le même onglet semble souvent plus naturel.
Notes d’utilisation
Section intitulée « Notes d’utilisation »- Gardez le message ciblé. Utilisez ensemble le titre, la légende et le sous-titre pour introduire une idée claire plutôt que de répéter le même texte dans plusieurs champs.
- Faites correspondre la hiérarchie à l’importance. Choisissez un type de titre qui correspond à la structure de la page afin que le contenu important se démarque sans affaiblir l’ordre général des titres.
- Utilisez les icônes avec intention. Ajoutez des icônes seulement lorsqu’elles aident les visiteurs à identifier plus rapidement le contenu ou l’action.
- Rendez les actions du bouton explicites. Associez un texte de bouton clair à un lien pertinent, et évitez de vous appuyer uniquement sur une icône sauf si l’action est évidente.
- Vérifiez l’affichage mobile. Contrôlez l’alignement, la position du bouton et le comportement pleine largeur sur les petits écrans afin que l’en-tête reste facile à lire et à toucher.
- Vérifiez les deux mises en page de viewport. Si vous utilisez des contrôles distincts pour ordinateur et mobile, vérifiez les deux tailles afin que l’alignement, la visibilité et le comportement des médias restent intentionnels.
- Conservez des remplacements pertinents. Laissez les valeurs de style par défaut en place lorsque vous souhaitez que l’en-tête se fonde dans la zone environnante ; utilisez des couleurs ou des médias explicites seulement lorsque vous souhaitez que l’en-tête se distingue.