guide utilisateur de l'outil le-siteweb.com

29
Guide de l Guide de l Guide de l Guide de lutilisateur utilisateur utilisateur utilisateur

Upload: guillon-christophe

Post on 12-Mar-2016

218 views

Category:

Documents


0 download

DESCRIPTION

Ce guide vous aidera dans la création de votre site internet avec l'outil le-siteweb.com. Créer un site web n'a jamais été aussi facile !

TRANSCRIPT

Page 1: Guide Utilisateur de l'outil le-siteweb.com

Guide de lGuide de lGuide de lGuide de l’utilisateurutilisateurutilisateurutilisateur

Page 2: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 2/29

SOMMAIRESOMMAIRESOMMAIRESOMMAIRE

INTRODUCTION 3

AJOUTER DU TEXTE A VOTRE SITE : 4

AJOUT D’IMAGES 6

MODIFIER LA PRESENTATION D’UNE PAGE AVEC L’ELEMENT 2 COLONNES 10

CHOIX DU THEME ET MODIFICATION DES POLICES DE CARAC TERE 12

MODIFIER L’EN-TÊTE 16

AJOUTER DES PAGES AU SITE 21

AJOUTER UN BLOG A VOTRE SITE 24

PUBLIEZ VOTRE SITE ET ETAPES SUIVANTES 28

CONCLUSION 29

Page 3: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 3/29

INTRODUCTION Lors de votre première connexion, vous arriverez sur la page suivante :

Tout au long du processus de construction de votre site, vous allez utiliser les outils suivants : Eléments :

Les éléments sont les briques de base de votre site. Tout contenu de votre site, que soit texte, images, vidéos ou autres, est ajouté via un élément. Design :

Vous pouvez sélectionner n’importe lequel des thèmes proposés et passer à un thème différent à tout moment. Cela affecte l’apparence de votre site. Toutes vos pages et éléments restent en place, quel que soit le thème que vous choisissez. Pages :

Selon votre abonnement, votre site peut avoir jusqu’à 15 pages (Plus), 40 pages (Premium) ou un nombre de pages illimitées (Ultimate). Nous vous expliquerons ensuite comment ajouter des pages.

Page 4: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 4/29

AJOUTER DU TEXTE A VOTRE SITE : Comme indiqué sur la page précédente, les éléments sont des blocs de construction de votre site. Tout votre contenu (mis à part quelques exceptions comme l’image d’en-tête, que nous aborderons plus tard) est ajouté via un élément. Examinons certains de ces éléments afin de vous aider à les ajouter à votre site. Eléments du texte : Ajouter un élément à un site se fait en cliquant sur un site et en le faisant glisser sur le contenu de la page. Faisons glisser l’élément le plus fondamental à notre exemple : le paragraphe.

L’élément « Paragraph » est un élément d’écriture du texte. Vous pouvez écrire tout ce que vous souhaitez dans un seul élément. Il suffit de cliquer dans l’élément pour commencer à éditer votre texte :

Page 5: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 5/29

Lorsque vous écrivez votre texte, une barre d’outils bleue apparaît en haut de l’éditeur. Chaque élément a sa propre barre d’outils avec des fonctions propres à chaque élément.

La barre d’outils texte vous permet de mettre en gras, mettre en italique, souligner, changer la couleur, augmenter ou diminuer la taille de la police du texte sélectionné. Vous pouvez également créer un lien vers un autre site, vers une autre page de votre site, vers une adresse mail ou vers un fichier téléchargé. Vous pouvez aussi aligner tout le texte dans un élément soit à gauche, soit à droite, soit au centre, soit le justifier. Vous pouvez créer des listes à puces ou numérotées. Vous disposez également des flèches retour ou recommencer. La modification de la police se fait quant à elle pour le thème complet et non pas pour un seul élément. Pour cela, il vous suffit de cliquer sur « conception », puis changer la police par défaut. Nous reviendrons sur ce point un peu plus tard. Voici comment apparaît votre texte, une fois que vous l’avez ajouté :

Pour ajouter plus de texte, nous pourrions continuer à écrire dans ce même élément, ajouter un autre élément paragraphe à la page ou ajouter un des trois autres éléments de texte :

- Title : utilisé pour ajouter des titres ou en-tête de page - Paragraph with title : un paragraphe avec une zone de titre déjà intégrée - Paragraph with picture : un paragraphe avec une zone de titre et une zone d’image déjà

intégrées.

Chacun de ces éléments utilise la barre d’outils d’édition de texte. Vous pouvez empiler autant d’éléments que vous le souhaitez sur une même page. Après avoir ajouté du texte, nous allons vous expliquer comment intégrer des images à votre site.

Page 6: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 6/29

AJOUT D’IMAGES Il y a 4 éléments qui peuvent être utilisés pour ajouter des images à un site :

- Paragraph with picture précédemment présenté - Picture : télécharge une image par élément - Galerie : télécharge autant d’images que vous le souhaitez - Diaporama : télécharge et fait défiler autant d’images que vous le souhaitez

L’ajout de tout élément d’image à votre site fonctionne de la même façon que l’ajout d’un élément de texte : il suffit de faire glisser l’élément sur la page. Ensuite, pour télécharger une image, il suffit de cliquer sur l’image bleue ci-dessous :

Cela ouvre une boîte de dialogue dans laquelle vous choisirez comment vous voulez télécharger votre image. Vous pourrez :

- Télécharger une image à partir de votre ordinateur - Télécharger une image provenant de Flickr, une bibliothèque consultable d’images sous

licence. (Si vous choisissez cette solution, un lien sera apparaîtra automatique en pied de page de votre site vers le site du photographe ayant capturé l’image)

- Entrer l’adresse d’une image à partir d’internet. Vous ne devriez pas utiliser cette troisième option si vous possédez déjà l’image que vous souhaitez intégrer.

Page 7: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 7/29

Dans cet exemple, nous avons sélectionné « poste de travail » puis avons cliqué sur « choisissez fichier ». Cela ouvre un navigateur de fichier sur l’ordinateur dans lequel une image peut être sélectionnée.

Il y a un certain nombre de façons différentes pour changer et modifier une image téléchargée. La première que vous remarquerez est celle par le menu pop-over qui apparaît au dessus de l’image lorsque vous faites défiler la souris sur elle. Vous pouvez ainsi :

- Créer un lien - Ajouter une légende à l’image - Enlever l’image

Page 8: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 8/29

La seconde est la barre d’outils bleue qui apparaît en haut de l’écran lorsque vous cliquez directement sur l’image. Utiliser cette barre d’outils, de gauche à droite, vous permet de :

- Remplacer l’image actuelle par une nouvelle - Définir une taille de bordure à l’image - Sélectionner une bordure grise ou noire - Positionner l’image vers la gauche, le centre ou la droite de l’élément. - Utiliser les options avancées pour définir les marges autour de l’image et saisir du texte Alt si

nécessaire. (Si vous ne savez ce qu’est le texte Alt, alors ne l’utilisez pas)

La troisième façon de modifier une image est le bouton « modifier » qui apparaît dans le coin supérieur gauche de l’image lorsque vous passer votre souris sur l’image.

Ceci fait apparaître notre éditeur ImagePerfect. Vous pouvez utilisez cet outil pour faire pivoter ou ajouter des effets à l’image.

Vous pouvez changer la taille des images en cliquant et glissant sur le petit carré rouge en bas à droite de l’image. Vous connaissez désormais l’essentiel pour travailler avec une image. Si vous souhaitez apprendre comment utiliser une galerie ou un diaporama, nous vous l’expliquerons dans la suite du guide.

Page 9: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 9/29

Notre site ressemble maintenant à ceci :

Comme vous pouvez le voir, chaque élément que nous avons ajouté est empilé au dessus ou en dessous d’un autre élément, comme une colonne de construction. Mais comment faire si nous voulons placer deux ou plusieurs éléments côte à côte ? Pour ce faire, nous allons maintenant vous expliquer comment modifier votre mise en page.

Page 10: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 10/29

MODIFIER LA PRESENTATION D’UNE PAGE AVEC L’ELEMENT 2 COLONNES Par défaut, la zone de contenu d’une page vous permet d’empiler les éléments les uns au dessus des autres. Vous pouvez toutefois aligner vos éléments côte à côte dans plusieurs colonnes. C’est là que la disposition en 2 colonnes entre en jeu.

L’élément 2 colonnes fonctionne comme n’importe quel autre élément. Il suffit de la glisser vers le contenu de la page. Il sera soit en dessous, soit au dessus de tout autre élément que vous avez déjà placé sur la page. Il est composé de 2 colonnes vides séparées d’une barre bleue.

Cette barre bleue peut être glissée vers la droite ou la gauche si vous souhaitez agrandir ou diminuer la taille d’une colonne. Il est important de préciser que cette barre ne s’affiche pas sur votre site lorsque vous publierez. L’ajout de contenu dans une colonne se fait en glissant un élément dans la colonne.

Page 11: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 11/29

Le déplacement d’un élément se fait en en cliquant sur la barre bleue puis en glissant l’élément vers l’emplacement souhaité.

Le texte et l’image que nous avions insérés au préalable a été placé dans les deux colonnes.

Une colonne peut contenir plus d’un élément. Vous pouvez mettre autant d’éléments que vous le voulez dans chaque colonne. Vous pouvez également placer d’autres éléments au-dessus ou en dessous de la disposition en deux colonnes. Nous allons aborder les changements aux thèmes prédéfinis.

Page 12: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 12/29

CHOIX DU THEME ET MODIFICATION DES POLICES DE CARACTERE Il convient désormais de décider quel thème utiliser pour la conception de notre site. Un thème peut être sélectionné à tout moment (au début, au milieu ou la fin du processus de création) et en sélectionnant un nouveau thème, le contenu du site n’est jamais modifié ou supprimé. Pour changer de thème, allez sur l’onglet « conception ».

La première chose que vous voyez est la section « favoris » dans laquelle nous affichons un certains nombre de nos thèmes favoris. C’est aussi là que vos propres thèmes préférés apparaissent lorsque vous les sélectionnez.

Si vous placez votre souris sur un thème dans la zone favoris, vous pourrez apercevoir comment serait votre site si vous choisissiez ce thème. Pour sélectionner un thème ensuite, il suffit de cliquer dessus.

Page 13: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 13/29

Si vous allez à la section « tous les thèmes » de l’onglet « conception », vous pourrez alors visionner tous les thèmes disponibles.

Quand vous voyez un thème que vous aimez, passer votre souris dessus et cliquez sur le bouton « Aperçu » pour voir à quoi ressemblerait votre site avec ce thème.

Page 14: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 14/29

Voici à quoi notre site ressemble avec le thème que nous avons sélectionné pour obtenir un aperçu :

Cliquez ensuite sur :

- Use Theme pour utiliser le thème pour votre site, - Favorite pour l’ajouter à vos favoris, - Cancel pour annuler et revenir à la page de sélection des thèmes.

Après avoir sélectionné un thème, utilisez la section « Design Options » pour définir les polices par défaut pour ce thème.

Page 15: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 15/29

Vous pouvez modifier les polices du titre de votre site, des titres de paragraphe, du texte courant et celle de vos liens. Nous disposons d’une centaine de polices différentes à choisir. Pour notre site, nous choisissons Josefin Std Sans.

Maintenant que nous avons choisi notre thème et notre police de site, regardons comment modifier l’en-tête d’un thème.

Page 16: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 16/29

MODIFIER L’EN-TÊTE Un grand nombre de nos thèms comprennent une zone d’image en en-tête (vous savez que votre thème inclut cela s’il y a une image par défaut en haut du thème). Puisqu’il est très improbable que vous vouliez utiliser une image par défaut sur vos pages, nous avons conçu un outil facile à utiliser : ImagePerfect.

Après cela, vous aurez probablement envie de supprimer l’image par défaut : cliquez sur l’image puis sur le X rouge dans le coin pour le faire.

Page 17: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 17/29

Pour ajouter une image à l’en-tête, cliquez sur le bouton « Ajouter une image » en haut à droite :

Cela vous donne la possibilité de sélectionner votre propre image.

Ou de choisir une photo Creative Commons licence provenant de Flickr. Vous pouvez utiliser le champ prévu pour la recherche d’une image appropriée à votre site.

Page 18: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 18/29

Une fois que vous avez téléchargé ou sélectionné une image, vous pouvez l’éditer. Cette image est trop grande pour l’en-tête de la page.

Page 19: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 19/29

Les images peuvent être redimensionnées en utilisant les petites bulles à chaque coin et côté de l’image.

Et une image peut être déplacée en cliquant n’importe où sur elle et en la faisant glisser.

Utilisez les outils fournis dans le haut de la page pour éditer et ajouter du texte / effets à l’image si nécessaire.

Page 20: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 20/29

Lorsque vous êtes satisfait, sélectionner le bouton « enregistrer » pour l’enregistrer. Vous pouvez utiliser la flèche à droite du bouton « enregistrer » pour choisir d’enregistrer l’image sur chaque page du site ou seulement sur certaines pages. De cette façon, vous pouvez avoir un en-tête différent sur vos différentes pages.

Et voici comment la page s’affiche avec l’image enregistrée.

Nous allons maintenant vous expliquer comment ajouter des pages à votre site.

Page 21: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 21/29

AJOUTER DES PAGES AU SITE Le nombre de pages que vous pouvez insérer dépend de votre abonnement :

- Plus : 15 pages - Premium : 40 pages - Ultimate : nombre de pages illimité.

Pour créer une nouvelle page, il vous suffit de cliquer sur « Pages », puis de cliquer sur « ajouter une page ».

Vous pouvez également ajouter un blog mais pour l’instant, concentrons-nous sur les pages. Après avoir cliqué sur « ajouter une page », une nouvelle page s’ajoute à votre liste :

En travaillant à partir du haut vers le bas, vous pouvez :

- Modifier la page (qui vous ramènera à la zone des éléments de l'éditeur que nous avons déjà vue)

- Copier la page à utiliser comme base pour une nouvelle page - Supprimer la page - Changer le nom de la page - Cacher la page dans le menu de navigation. Si cette case n'est pas cochée la page est

accessible via la navigation du site. Si la case est cochée, la page est cachée de la navigation (vous pouvez facilement créer vos propres liens vers les pages cachées)

- Mot de passe : Protéger cette page, ce qui nécessite un abonnement à notre service Pro

Page 22: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 22/29

- Lien vers cette page à un site externe (en créant un lien de navigation qui mène à un autre site entièrement).

- Ajustez les paramètres avancés.

Les paramètres avancés de chaque page sont utiles pour améliorer l'optimisation de votre référencement. Si vous ne savez pas ce que c'est, tout simplement l'ignorer pour l'instant. Vous pouvez en apprendre plus sur le référencement via la section appropriée de notre site d'aide. Ajoutons plusieurs nouvelles pages au site par exemple (en cliquant sur Ajouter Page à plusieurs reprises et enregistrez les modifications à la page que vous travaillez).

Vous pouvez modifier l’ordre des pages en les faisant glisser de haut en bas de la liste.

Page 23: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 23/29

Créons une sous-page en faisant glisser la page « Write Us » au-dessous et à droite de la page « Visit our Shop ». Les sous-pages apparaissent dans le menu de navigation du site dans le cadre d'un menu déroulant.

Pour créer une sous-page, il suffit de glisser une page sous une autre page, puis faites-la glisser vers la droite jusqu'à ce qu’elle soit connectée à la page principale par une ligne pointillée. Vous pouvez avoir autant de sous-pages que vous voulez. Maintenant, le menu de navigation pour notre site d'échantillonnage (qui, auparavant, juste montré un lien vers Accueil) comprend des liens vers toutes les pages que nous avons créées.

Et si nous défilons sur le lien « Visit Our Shop » avec le pointeur de la souris, un menu déroulant apparaît avec un lien vers chacune des sous-pages que nous avons créées.

Pour modifier le contenu d'une page, il suffit de cliquer sur son lien dans le menu de navigation ou allez à l'onglet Pages, sélectionnez la page de la liste et cliquez sur le bouton Modifier la page. Maintenant, nous allons jeter un oeil à la façon d'ajouter un blog à un site.

Page 24: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 24/29

AJOUTER UN BLOG A VOTRE SITE Pour créer un blog, allez dans l'onglet Pages de l'éditeur et cliquez sur le bouton Nouveau blog.

Cela va ajouter le blog à votre liste de pages.

Donner un nom à votre blog et puis cliquez sur Modifier la page pour commencer à ajouter du contenu.

Page 25: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 25/29

Un nouveau blog commence par un poste d'échantillonnage (que vous pouvez soit modifier ou supprimer) et une barre latérale avec une partie du contenu par défaut que vous pouvez facilement changer.

Pour créer un nouveau post pour votre blog, utilisez le bouton Nouveau message dans le haut du blog lui-même.

Votre blog a un titre et une zone de contenu. Le titre doit généralement être court - pas plus d'une longue phrase ou deux. La zone de contenu comprend un élément de paragraphe de base que vous pouvez modifier ou supprimer.

Page 26: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 26/29

L’ajout de contenu à un blog fonctionne de la même façon que l'ajout de contenu à une page régulière. Il suffit de faire glisser des éléments dans le post et de les éditer pour ajouter du contenu.

Une fois que vous avez ajouté votre contenu, vous pouvez classer le post - les catégories apparaîtront sur votre barre latérale, ce qui rend plus facile pour les visiteurs de votre blog de trouver des postes qui couvrent certains sujets. Les catégories peuvent être ce que vous voulez et il n'est pas nécessaire de les utiliser.

Page 27: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 27/29

Maintenant, vous pouvez le publier sur votre site en direct (ce qui le rendra immédiatement disponible) ou Enregistrer dans Brouillons pour éditer / publier plus tard.

Si vous enregistrez le message comme un projet, il sera accessible à vous à travers une zone de courants d'air dans le haut de la page du blog de l'éditeur (ainsi que tous les autres projets que vous avez sauvegardés). Il suffit de cliquer sur le lien du post de cette région projets pour l'éditer plus loin et Save / Publier.

Chaque nouveau post que vous publiez apparaîtra tout en haut de la page, en poussant des messages plus anciens plus bas de la page. Après avoir ajouté sept ou huit posts à la page, les anciens posts seront déplacés hors de la page principale vers des pages d'archives encore accessibles. Maintenant que vous avez appris les bases, regardons les prochaines étapes.

Page 28: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 28/29

PUBLIEZ VOTRE SITE ET ETAPES SUIVANTES Maintenant que vous avez ajouté quelques contenus de base à votre site, c'est le bon moment de le publier. Pour ce faire, il suffit d'utiliser le bouton Publier dans le coin supérieur droit de l'éditeur.

Cela fera apparaître une boîte de vérification vous permettant de savoir votre site a été publié. Vous pouvez cliquer sur l'adresse publiée pour voir votre site (vous pouvez aussi donner cette adresse de telle sorte que d'autres personnes peuvent l'utiliser pour visiter votre site), utilisez les boutons de Facebook et Twitter pour relier vos amis et disciples à chaque prestataire à votre site, et cliquez sur le «x» dans le coin de la boîte pour fermer la boîte et continuer l'édition de votre site.

Page 29: Guide Utilisateur de l'outil le-siteweb.com

Guide de l’utilisateur Page 29/29

CONCLUSION Bien sûr, vous n'avez probablement pas fini avec votre site et cela ne pose pas de problème. Vous pouvez continuer à ajouter du contenu à travers le générateur quand vous le souhaitez puis cliquer sur le bouton Publier pour intégrer tout nouveau à votre site en direct. Vous pouvez également dépublier votre site (si besoin est) en allant dans Paramètres> dépublier. Contactez nous pour tout autre renseignement complémentaire ! A vous de jouer !