Comment configurer une section Héros
Création et édition d'une page de garde de site Web
Comment choisir la bonne image de fond : dimensions, format et proportions
Configuration de votre titre, sous-titre et autre texte
Comment faire une page de garde étroite qui ne prend pas toute la hauteur du premier écran
Comment augmenter la lisibilité en créant un filtre de couleur pour une image d'arrière-plan, remplir une page de garde avec une couleur unie et effectuer la transition vers le bloc suivant
Configuration d'une vidéo qui sera lue en arrière-plan ou lorsque vous cliquez sur le bouton Lecture
Comment rendre une page de garde attrayante sur les appareils mobiles
Mise en place d'un formulaire de collecte de données sur la page d'accueil
Ajouter des comptes à rebours à une heure et une date spécifiques
Comment convertir et modifier une page de couverture dans Zero Block
La couverture est la première chose que les gens voient sur votre page. Il présente le contenu et les invite à le faire ou résume ce qui rend votre projet unique. Une couverture contient généralement une image d’arrière-plan : une photo élégante, une vidéo convaincante, une couleur, un dégradé ou une texture.
Voici quelques conseils qui vous aideront à travailler plus efficacement avec les couvertures, les arrière-plans et les vidéos.
Voici quelques conseils qui vous aideront à travailler plus efficacement avec les couvertures, les arrière-plans et les vidéos.
Zone visible
Contrairement aux pages de magazines, les pages de sites Web n'ont pas de zone visible fixe. Chaque appareil a une taille d'écran et un format d'image différents. De plus, les zones visibles varient d'un navigateur à l'autre. Par exemple, les navigateurs avec une barre de favoris fixe offrent une zone visible plus petite. L'image de couverture est recadrée pour apparaître sans bordure à l'écran.
Image de fond
Téléchargez une image d’arrière-plan de couverture dans le panneau Contenu du bloc → Image d’arrière-plan.
Pour que l'image soit superbe, suivez ces conseils sur les meilleurs paramètres pour l'image d'arrière-plan.
Meilleure taille:
Voici les meilleurs paramètres pour les images téléchargées :
Format: JPG
Largeur: 1680px
Résolution: 72 dpi
Modèle de couleur: RVB
Compression: 10
Voici les meilleurs paramètres pour les images téléchargées :
Format: JPG
Largeur: 1680px
Résolution: 72 dpi
Modèle de couleur: RVB
Compression: 10
Si vous n'êtes pas satisfait de la qualité de l'image, modifiez-la au préalable dans un éditeur graphique à l'aide de l'article de référence ci-dessous
Avant de choisir une image, lisez notre article « Comment créer une couverture pour un site Web » sur Tilda Education. Il contient des conseils pour créer votre propre page de couverture et des liens vers des sites Web de photographie de qualité.
Formatage du texte
Le texte est la partie la plus importante de toute page de couverture, car c'est le premier message qu'un visiteur du site Web voit. Les pages de couverture comportent un titre, un sous-titre, une description et une note supérieure pour transmettre le message et mettre en évidence ce qui est important.
Vous pouvez remplir les couvertures avec du texte de deux manières : en utilisant le panneau Contenu du bloc ou en cliquant sur le texte lors de l'édition de la page.
Vous pouvez remplir les couvertures avec du texte de deux manières : en utilisant le panneau Contenu du bloc ou en cliquant sur le texte lors de l'édition de la page.
Modification du texte lors d'un clic sur un bloc
Modification de texte dans la section Contenu d’un bloc
Vous pouvez mettre en forme le texte à l’aide du panneau de configuration situé en haut ou en modifiant la taille, la couleur ou d’autres paramètres du texte dans le panneau Paramètres du bloc → Typographie.
Mise en forme du texte à l'aide du panneau de configuration supérieur
Changements de mise en forme dans le panneau Paramètres du bloc
Pour créer une couverture sympa, consultez l'article Comment créer une couverture pour un site Web avec des exemples pratiques de combinaisons de texte et d'images d'arrière-plan et le guide Création d'une proposition de vente unique (USP) pour un site Web pour rendre votre page de couverture attrayante pour les visiteurs. moins de dix secondes.
Hauteur de couverture
Une couverture mince a une hauteur de 60% ou 70%, pas 100%. Il remplit une fonction plus formelle car l’attention de l’utilisateur se déplace vers les informations qui suivent la couverture.
Pour créer une telle couverture, allez dans le champ « Hauteur » dans les paramètres du bloc. Vous pouvez définir la hauteur en pixels (par exemple, 400px) ou les unités de hauteur de la fenêtre d’affichage, en pourcentage (1vh est 1 % de la zone d’affichage). Nous vous recommandons de régler la hauteur en vh.
Pour créer une telle couverture, allez dans le champ « Hauteur » dans les paramètres du bloc. Vous pouvez définir la hauteur en pixels (par exemple, 400px) ou les unités de hauteur de la fenêtre d’affichage, en pourcentage (1vh est 1 % de la zone d’affichage). Nous vous recommandons de régler la hauteur en vh.
Couleur de couverture : paramètres de filtre
Comment changer le ton de l’image d’arrière-plan
Nous changeons le ton de l’image lorsque nous voulons rendre le texte de couverture facilement lisible. Pour ce faire, ouvrez le panneau Paramètres du bloc de couverture et ajustez la couleur du filtre. Ici, vous pouvez voir une image de couverture à laquelle une couleur de filtre a été appliquée. Parfois, c’est la couleur de la marque ou la couleur primaire d’un site Web qui est utilisée pour la tonification.
Nous changeons le ton de l’image lorsque nous voulons rendre le texte de couverture facilement lisible. Pour ce faire, ouvrez le panneau Paramètres du bloc de couverture et ajustez la couleur du filtre. Ici, vous pouvez voir une image de couverture à laquelle une couleur de filtre a été appliquée. Parfois, c’est la couleur de la marque ou la couleur primaire d’un site Web qui est utilisée pour la tonification.
Paramètres de filtre dans le panneau Contenu du bloc
Couverture du Centre d’aide Tilda : le filtre se transforme progressivement en couleur orange unie
Comment mélanger la couleur dans la couleur du bloc suivant
Parfois, le couvercle doit se fondre doucement dans le bloc suivant. Pour obtenir cet effet, la couleur du filtre d’extrémité doit être réglée à 100% d’opacité. La couleur du filtre doit être la même que celle du bloc suivant.
Parfois, le couvercle doit se fondre doucement dans le bloc suivant. Pour obtenir cet effet, la couleur du filtre d’extrémité doit être réglée à 100% d’opacité. La couleur du filtre doit être la même que celle du bloc suivant.
Rendre la couverture deux fois plus haute tout en appliquant ces deux paramètres à la fois vous aidera à obtenir l'effet illustré ci-dessous :
Dégradé et remplissage de couleur
Il existe deux paramètres de tonification dans les paramètres de bloc : l’opacité et la couleur. Réglez l’opacité sur 100 % et sélectionnez une couleur, ce sera la couleur de la couverture.
Si vous sélectionnez différentes couleurs, l'une se fondra harmonieusement dans l'autre.
Couverture vidéo
Vous pouvez utiliser une vidéo au lieu d'une image. Il y a deux façons de le faire.
Comment ajouter une vidéo YouTube
Téléchargez une vidéo sur YouTube ou trouvez-en une existante. Ensuite, allez dans le panneau Contenu du bloc de couverture et collez le lien vidéo dans le champ approprié. De cette façon, vous pouvez créer une couverture vidéo.
Notre compagnie
Experts dans l'art
Art Basel organise des expositions d'art moderne et contemporain de haute qualité et se tient chaque année à Bâle, Miami Beach et Hong Kong
Comment ajouter des vidéos WebM et MPEG-4
Vous pouvez utiliser des convertisseurs en ligne pour créer des vidéos WebM et MPEG-4 et les héberger sur votre serveur ou sur le site Web du service de conversion. Par exemple, gfycat.com permet à la fois la conversion et l’hébergement.
Ouvrez le panneau Paramètres du bloc de couverture et ajoutez les liens vidéo aux champs correspondants.
Ouvrez le panneau Paramètres du bloc de couverture et ajoutez les liens vidéo aux champs correspondants.
Pourquoi utiliser les deux formats ?
Les navigateurs utilisent différents formats, il n’y a donc pas de format unifié. Lorsqu’un utilisateur arrive sur votre site Web, il verra une vidéo que son navigateur peut lire. Sinon, le couvercle apparaîtra vide.
Les navigateurs utilisent différents formats, il n’y a donc pas de format unifié. Lorsqu’un utilisateur arrive sur votre site Web, il verra une vidéo que son navigateur peut lire. Sinon, le couvercle apparaîtra vide.
Point important : Actuellement, il n’est pas possible de télécharger votre fichier vidéo sur Tilda, mais vous pouvez utiliser des services tiers qui fournissent un lien direct vers le fichier vidéo.
Certains des services cloud les plus populaires fournissent également un lien direct vers un fichier. Par exemple, pour obtenir un lien direct vers un fichier vidéo sur Dropbox, vous devez remplacer le lien dropbox.com par dl.dropboxusercontent.com. Vous pouvez également télécharger le fichier sur vos services d’hébergement tels que Selectel, et autres.
Certains des services cloud les plus populaires fournissent également un lien direct vers un fichier. Par exemple, pour obtenir un lien direct vers un fichier vidéo sur Dropbox, vous devez remplacer le lien dropbox.com par dl.dropboxusercontent.com. Vous pouvez également télécharger le fichier sur vos services d’hébergement tels que Selectel, et autres.
Page de garde pour l'affichage mobile
Les écrans ont une large gamme de rapports d'aspect, et la couverture peut apparaître différemment sur différents appareils. Bien que les rapports d'aspect courants n'apportent pas de changements spectaculaires à l'image de couverture, les appareils mobiles peuvent la modifier au-delà de la reconnaissance. Veuillez prendre le temps d'apprendre à créer une couverture adaptée aux mobiles (ou tout autre bloc) à l'aide de ce guide complet.
Pourquoi les vidéos de couverture ne sont pas lues sur mobile
En raison des particularités du système d’exploitation mobile, les couvertures vidéo ne seront pas lues sur les appareils mobiles. Mobile OS désactive la lecture automatique. Si vous avez réalisé une couverture vidéo en lecture automatique, n’oubliez pas d’ajouter une image dans le panneau Contenu du bloc de couverture. L’image apparaîtra lorsque la vidéo ne peut pas être lue, c’est-à-dire lorsque les visiteurs accèdent à votre site Web à partir de smartphones ou de tablettes.
En raison des particularités du système d’exploitation mobile, les couvertures vidéo ne seront pas lues sur les appareils mobiles. Mobile OS désactive la lecture automatique. Si vous avez réalisé une couverture vidéo en lecture automatique, n’oubliez pas d’ajouter une image dans le panneau Contenu du bloc de couverture. L’image apparaîtra lorsque la vidéo ne peut pas être lue, c’est-à-dire lorsque les visiteurs accèdent à votre site Web à partir de smartphones ou de tablettes.
Formulaire sur une page de garde
Vous trouverez un formulaire de saisie sur les pages de garde suivantes : CR26 (Couverture avec champ de saisie), CR26AN (Couverture avec plusieurs entrées), CR32 (Couverture avec formulaire aligné à droite), CR34 (Couverture avec compte à rebours et formulaire de souscription ), CR36 (Couvrir avec une image ou vidéo YouTube et formulaire en deux colonnes)
Vous pouvez prévisualiser à quoi ressemblera le formulaire en visitant la bibliothèque de blocs → la couverture et en choisissant votre option préférée.
Vous pouvez prévisualiser à quoi ressemblera le formulaire en visitant la bibliothèque de blocs → la couverture et en choisissant votre option préférée.
Les formulaires sur les pages de garde remplissent la même fonction et peuvent être personnalisés de la même manière que les formulaires ordinaires. Pour personnaliser votre formulaire, lisez l’article Comment configurer des formulaires de capture de données.
Ajout d'un compte à rebours
Les pages de couverture des blocs CR34 et CR35 comportent un compte à rebours jusqu'à un moment précis dans le futur. Cette fonctionnalité est particulièrement pratique si vous créez une page pour une promotion ou un événement.
Dans le panneau Contenu de ces blocs, vous pouvez définir la date, l'heure et le fuseau horaire de l'heure de début de l'événement.
Dans le panneau Contenu de ces blocs, vous pouvez définir la date, l'heure et le fuseau horaire de l'heure de début de l'événement.
Si la date est réglée correctement, une minuterie apparaîtra sur la page de couverture.
Conversion d’une page de couverture en Zero Block
Les blocs avec couvercles sont des exemples éprouvés de bonne conception qui s’adaptent automatiquement à tous les appareils. Mais parfois, vous avez besoin d’ajouter un élément ou de créer une page de couverture personnalisée. Cela peut être fait en utilisant l’éditeur Zero Block de Tilda.
De nombreux blocs de couverture peuvent être convertis en Zero Block pour une édition supplémentaire. Pour ce faire, allez dans les paramètres de bloc, faites défiler vers le bas et cliquez sur le bouton « Convertir en Zero Block ».
Suite à cela, la couverture est convertie en Zero Block. Le format sera adapté correctement. Si vous avez déjà effectué vos modifications, elles ne seront pas enregistrées, soyez donc prudent lors de la conversion de la couverture.
Exemple : Comment recadrer une couverture
Image verticale
Image carrée
Image horizontale étroite
Image horizontale, format d'image 16:9
