Imprimer
Catégorie : NamoWeb

AVERTISSEMENT: Le tuto ci dessous est conçu pour pouvoir être réalisé avec la version 5(et supérieure)de Namo.Certains des éléments cités ci après n'existent pas pas la version précédente (clipart/animaux  notament)

Entrons dans le vif du sujet: Il est important de bien ranger les différents éléments qui vont composer votre site:

-Les pages elles même qui auront   .htm  pour indice

-Les images ,que l'on rangera dans un dossier appelé "images"

1)Pour cela nous allons créer les dossier necessaire a l'aide de l'explorateur de window

Pour cela ouvrez votre explorateur.Dans cet exemple j'ai créé mon repertoir SiteNamo  sous  /C   .Clique droit dans la fenêtre de droite de votre explorateur>Nouveau Dossier,   Donnez lui pour nom : SiteNAMO   ici vous rangerez les autres futurs sites  Double clique sur le dossier"SiteNamo" >nouveau dossier nommez le "Namo1" se sera dans ce dossier que seront rangées nos pages .html et notre dossier "images"

 

 

Règle d'or:   banissez les majuscules et signes de ponctuation de vos noms de dossiers et de fichiers

Vous devriez obtenir l'arborescence suivante,sans le dossier" images Flash"

Ceci fait , fermez l'explorateur de Windows

2) Lancez maintenant NamoWebEditor5

Fermez les fenêtres d'acceuil, car nous allons créer notre page sans l'assistant de création , ceci afin d'être plus libre dans nos choix        Ci dessous les barres d'outils que nous utiliserons , je me refererai aux différents numéros , pour plus de simplicitée

 

Si vous n'avez pas d'onglet "sansnom1.htm" d'ouvert ,cliquez sur nouveau (1)  Vous avez maintenant votre page blanche

Assurez vous que l'onglet "Edition"(31) et selectionné en bas a gauche de la fenêtre

 

Nous allons tout de suite enregistrer cette  page qui sera notre page d'acceuil:  Cliquer sur "Enregistrer"(3)

La Namo vous propose un dossier par defaut , que nous n'utiliserons pas

Dans la fenêtre qui est ouverte cherchez>C>>SiteNamo>>Namo1  Donnez comme nom de fichier: "index.html"

IMPORTANT: Ce nom de fichier est important car tous les navigateurs ouvrent la page "index.html"ou index.htm lorsqu'ils arrivent sur un site Web

3)Mettre de la couleur dans sa page

Faites un clic droit dans votre page blanche      Clic gauche proriétés du document

Onglet "General" vous pouvez le renseigner , sans trop d'importance

Onglet "Apparence"là nous ferons le choix des différente couleurs d'arrière plan et police d'écriture dans notre page. Attention au contraste pour une bonne lisibilitée

Nous pourrions choisir une couleur d'arrière plan, mais nous ici nous utiliserons un motif mis en modele avec NamoWeb  Cliquez sur l'icone clipart   (vous pourriez aussi bien cliquer sur l'onglet explorateur et ainsi choisir l'image de votre choix ,qui se trouve sur  votre PC comme image d'arrière plan)

 

Pour faire simple nous choisirons un motif clair , celui qui porte le nom de wire02

 

 

Faites >OK puis encore OK pour fermer cette fenêtre. Votre page a maintenant un arrière plan.

On aime ou on aime pas .......je suis d'accord :)

Maintenant quelque chose de simple , mais tellement essentie l , enregistrer

A chaque fois que vous ferez enregistrer  ,après avoir importé une image sur vos pages, Namo va vous demander OU doit il enregistrer cette image ..............dans quel dossier !   J'insiste sur ce point car qui n'a pas connu un jour l'angoisse de la petite croix rouge ,en lieu et place  de son image chérie .

4)Enregistrer une ou des images

Faites enregistrer  (3)

Cette fenêtre"Copie des ressources" s'ouvre

Cliquez sur dossier afin de controler l'endroit ou votre (vos)image sera enregitrée

S'ouvre maintenant la fenêtre"Choix du dossier"

Cherchez dans l'arborescence

C>>SiteNamo >>Namo1>> Dossier "images" et faites OK   (Namo2 dans ma capture imagen'en tenez pas compte)

J 'insiste encore une fois sur l'importance qu'a le fait d'enregistrer ses images dans le bon dossier,cela vous evitera de vous arracher les cheveux ,lors de la publication de votre site ...et je sais de quoi je parle :(

 

5) Enrichir sa page

Placez votre curseur en haut de votre page, il doit clignoter maintenant,  ce sera l'endroit ou nous allons inserer un tableau dans lequel sera notre titre de page

Les tableaux sont très pratique pour faire de la mise en page rigoureuse,mais ils ont leurs limites..............

Cliquez maintenant sur l'outil "Tableau"(20)

Faites maintenant glisser votre curseur pour obtenir 1ligne et trois colonnes

Cliquez sur cette troisieme colonne

Votre page est maintenant equipée d'un tableau

Nous allons donner un couleur d'arrière plan différente de celle de notre page

Placer votre curseur dans la cellule du milieu de votre tableau  >clique droit>>Propriété des cellules , Choisissez une couleur

d'arrière plan (ou une image) ici le bleu>>>>OK

 

Votre curseur toujours dans la colonne du milieu ,tapez un titre "Notre premier site"  , la couleur et la taille ne sont pas terrible

Ca va s'arranger : selectionnez tout votre texte     Centrez le (45)   ;  Changez la taille  (37) choisissez 27pts ;

Changer la couleur  (41)  choisissez le jaune ;   changez la police  (36)   enfin comme dans un traitement de texte modifiez ce que vous avez envie

Placez votre curseur dans la colonne de gauche  et allez sur l'outils "Inserer un clipart" (17)

Dans la fenêtre choisissez >image>animaux> celui que vous voulez>>>>>OK

 

 

Cette image se trouve maintenant sur votre page

Enregistrez la modif (3)  Cliquer sur dossier C>>SiteNamo >>Namo1>> Dossier "images"

Donc en haut de notre page , nous avons un tableau:1ligne;3colonnes

Colonne du milieu :le titre     colonne de gauche une image qui nous servira a créer un hyperlien

Toujours la même rigueur pour enregistrer vos images

Vous n'êtes pas obligé d'enregistrer après chaque insertion d'image bien sur, vous

pourrez le faire par   "lot"  , mais ne vous trompez pas de dossier!

6)Creation d'une autre page sur le site

Une page c'est bien , mais vous aurez surement envie d'en créer plusieurs,donc utiliser la fonction hyperlien, pour naviguer entre les pages de votre site

Pour cela il vous faut reprendre les différentes étapes utilisées pour créer cette première page

Nouvelle page (1) , puis toutes les etapes suivantes  , enregistrez votre nouvelle page dans le dossier Namo1, par exemple " Page2.html ", et les images qui la compose  dans le même dossier "images"

Vous avez créé votre seconde page?? oui alors passons a la création d'hyperlien

7) Créer des hyperliens

C'est en cliquant sur nos images que nous naviguerons sur notre site

Cliquez sur l'onglet portant pour nom "index.html",  cliquez maintenant sur l'i mage à droite de notre titre, l'image étant selectionnée

cique sur l'outil "Hyperlien"  (24)  ou touche F9

 

Cette fenêtre s'ouvre, cliquez sur "parcourir" et retouvez votre dossier "Namo1" >ouvrez le et cliquez sur " page2.html "

 

Faites OK, votre Hyperlien et maintenant créé. Pas si dur que cela !  ;)

Procedez de la même façon avec votre page " page2.html " ou la évidement vous crerez un hyperlien vers la page "index.html" toujours dans le dossier Namo1

Vous pouvez en selectionant l'onglet Aperçu (33) naviguer sur votre site, entre ces deux pages , il faut pour cela avoir enregistré chaque page (3)

Voila votre premier site Web est créé , visible seulement sur votre PC pour l'instant, il faut maintenant le publier, le mettre en ligne pour qu'il s'offre à la planète entière