Cette fenêtre initiale, la première de l'étape 1, sert à collecter dans des champs appropriés certaines informations nécessaires pour configurer les paramètres de base du Projet sur lequel vous êtes en train de travailler, comme par exemple le titre, l'URL ou la langue.
Tous les paramètres peuvent être définis immédiatement ou par la suite.
Plus précisément, les Informations sur le site requises sont les suivantes :
| ▪ | Titre du site : dans ce champ, tapez le titre du site. Ce titre qui est affiché dans la barre de titre du Navigateur est, bien évidemment, un paramètre important pour permettre aux utilisateurs et aux moteurs de recherche d'identifier correctement le site. Comme titre du site, le programme prend automatiquement le nom affecté au projet (voir Modifier un Projet existant) : en tout cas, le titre du site peut être modifié et établi en fonction du sujet traité et des exigences d'optimisation spécifiques. |
Appuyez sur le bouton 
disponible dans ce champ pour ouvrir MagicText, l'assistant de génération de texte basé sur l'intelligence artificielle. MagicTexte comprend le langage naturel : il vous suffit de saisir les informations nécessaires pour définir le type de texte que vous souhaitez qu'il compose.
En plus d'être inséré comme valeur de la balise <title>, le titre est inséré dans le code des Pages également à l'aide de la balise Open Graph og:title.
| ▪ | Description du site : tapez une brève description de votre site. La description du site doit être succincte, efficace et précise : elle sera en effet utilisée dans le code HTML comme contenu de la Métabalise <description> et sera analysée par les spiders des moteurs de recherche. |
Même ici, vous pouvez appuyer sur le bouton disponible dans ce champ pour ouvrir MagicText et l'utiliser pour créer le texte nécessaire.
Cette description sera reprise également comme valeur de la balise Open Graph og:description.
|
La Description du site insérée dans ce champ est automatiquement associée à la page d'accueil du site. Pour optimiser le site, il est conseillé d'associer à chaque page, ou au moins aux plus importantes, une description et une liste des mots-clé spécifiques. Pour ce faire, accédez à la fenêtre Création du plan, sélectionnez la page voulue et cliquez sur la commande Propriétés. |
| ▪ | Icône du site : ce champ permet de choisir une icône (fichier .ICO, .PNG, .GIF et .JPG) à associer aux pages Web du site. Cette icône sera affichée à gauche de l'URL dans la barre d'adresses du navigateur Internet. |
|
Comme icône associée à un site (ou favicon, de l'anglais favorites icon), vous pouvez utiliser une image au format .ICO, .PNG, .GIF et .JPG. Alors que les fichiers .ICO sont utilisés tels qu'ils sont, pour les fichiers au format .PNG, .GIF et .JPG, de n'importe quelle taille, WebSite X5 crée automatiquement une copie en fichier .PNG de 16x16 pixels et utilise cette copie comme favicon. |
En plus des informations mentionnées, les Détails suivants peuvent être ajoutés pour plus de complétude :
| ▪ | Auteur du site : champ où vous tapez le nom de la personne ou de la société étant l'auteur du site. Le nom de l'auteur est indiqué dans le code HTML des pages réalisées comme valeur du Méta tag <author>: vous mettez ainsi votre signature sur votre travail. |
| ▪ | Catégorie du site : on peut choisir une catéogorie selon les contenus du site web. |
|
Les catégories sont les mêmes que celle que vous retrouvez dans la Gallery de sites créés avec WebSite X5, où vous pouvez insérer votre site une fois qu'il soit complet. |
| ▪ | Langue du contenu : vous définissez la langue du site. Selon la langue choisie, le programme utilise la version relative des textes qu'il insère automatiquement: des liens vers des ancres internes, des étiquettes de l'Objet Formulaire de Contact, des étiquettes et des textes du Panier e-commerce, des textes du Plan du Site. |
|
Pour modifier les textes insérés automatiquement par le programme ou ajouter une nouvelle langue, cliquez sur le bouton |
| ▪ | Direction de l’écriture : spécifie le sens d’écriture à suivre dans le projet. Il est possible d’appliquer automatiquement le sens d’écriture en fonction de la langue définie pour le site grâce à l’option Langue du contenu : dans ce cas, le mode LTR (Left-To-Right) sera utilisé pour des langues telles que l’italien, l’anglais ou l’allemand, et le mode RTL (Right-To-Left) pour des langues telles que l’arabe ou l’hébreu. Il est également possible de forcer manuellement la direction de l’écriture en LTR ou en RTL. |
Si, lors de la définition de la direction de l’écriture, le projet passe de LTR à RTL ou inversement, une fenêtre de dialogue s’affiche pour demander comment les contenus doivent être traités :
| • | Miroir automatique des contenus : dans ce cas, non seulement la direction des textes change, mais également la disposition du contenu dans la page, qui est alors réfléchie par rapport à un axe vertical imaginaire au centre de la page. Ce paramètre est utile, par exemple, lorsqu’un site a été créé dans une langue LTR et qu’une nouvelle version doit être créée pour une langue RTL. |
| • | Laisser les contenus inchangés : dans ce cas, même si la direction des textes change, les contenus de la page restent à leur position d’origine. Ce paramètre est utile si les contenus ont déjà été positionnés selon la nouvelle direction de lecture et ne doivent donc pas être modifiés par le logiciel. |
|
Si les contenus sont reflétés, la modification affectera à la fois la disposition des objets dans la grille à l’étape 3 et les pages finales du site. |
Pour gérer au mieux le paramètre Partage sur les réseaux sociaux, l’option suivante est disponible :
| ▪ | Image du Site : spécifie l'image (fichier JPG, .PNG e .GIF) à associer au Site. À l'aide de la balise Open Graph og:image, cette image sera insérée dans le code de toutes les Pages du Site et sera utilisée en cas de partage sur les Réseaux Sociaux (Facebook, Twitter, Google+, ecc.). Si un post du Blog dans lequel figure un diaporama est partagé, au lieu de l'image spécifiée pour le Site, la première image figurant dans le diaporama sera reprise. |
|
Facebook suggère d'utiliser des images de 1200x630 pixels, mais les dimensions minimum permettant d'afficher l'image en grand format (et pas carrée et petite sur la gauche) sont de 600x315 pixels. Pour plus d'informations sur le Protocole Open Graph, cliquez sur le bouton |
Enfin, il est possible de faire en sorte que le site soit installé comme une Application Web pour appareils mobiles, grâce à la technologie PWA – Progressive Web App. Pour ce faire, il convient d’activer l’option Afficher la bannière pour installer l’application sur l’appareil mobile. Une fois cette option activée, les options suivantes peuvent être configurées :
| ▪ | Nom court : champ permettant de saisir le nom de l’icône de l’application qui sera installée sur l’écran d’accueil de l’appareil. |
| ▪ | Couleur du thème : indique la couleur à utiliser pour la fenêtre du navigateur dans laquelle le site sera affiché. |
|
Une PWA (Progressive Web App) est un site web conçu pour offrir une expérience similaire à celle d’une application traditionnelle. Elle peut être installée sur l’appareil de l’utilisateur, fonctionner en plein écran et, dans certains cas, même hors ligne. Contrairement aux applications natives, elle ne nécessite toutefois pas de passer par un store. |
Bonnes pratiques :
Approfondissements :
et utilisez les options de la fenêtre 
et accédez au Site officiel: