Passer au contenu

2 – Soignez l’apparence de vos pages

Police bien choisie, image de fond ou message d’accueil… Autant d’astuces qui embellissent un site et lui donnent une touche personnelle.

1 – Donnez du caractère à vos textes

FrontPage Express, ou tout autre éditeur de pages Web, propose une police de caractères par défaut (en général Times New Roman, corps 12). Mais rien ne vous empêche de modifier la police et sa taille. De la même façon, vous pouvez mettre en forme vos paragraphes.Dans votre page, sélectionnez le texte puis cliquez sur le bouton droit de la souris. Dans le menu contextuel, sélectionnez la commande Propriétés de la police puis modifiez les attributs (police, style et taille).Toujours en conservant votre texte sélectionné, cliquez sur le bouton droit de la souris et sélectionnez

Propriétés du paragraphe
. Dans le menu déroulant situé en face d’Alignement du paragraphe, sélectionnez Justifié afin de caler chaque fin de ligne de la même façon.Enregistrez votre fichier en appuyant simultanément sur les touches Ctrl et S. Puis recommencez avec les paragraphes suivants.

2 – Adaptez vos images pour la publication sur le Web

Outre un éditeur de pages Web, il est nécessaire de vous procurer un logiciel de retouche photo afin de pouvoir travailler vos images avant de les inclure dans vos pages.Aujourd’hui, la plupart des ordinateurs sont livrés avec un logiciel de retouche d’images. Ce type de programme est généralement donné avec les scanners et les appareils photo numériques. Si vous n’en possédez aucun, vous pouvez en acheter un (notre préférence va à Paint Shop Pro, mais il coûte 160 euros).Solution plus économique : télécharger sur votre disque dur XN-View. Gratuit et en français, il permet de convertir une image, d’y affecter quelques effets et de recadrer une photo. Vous pouvez le trouver sur Telecharger.com, dans la sélection de Micro Hebdo (environ trois minutes avec un modem 56K).Enregistrez le fichier sur le bureau de Windows. Une fois que le téléchargement est terminé, double-cliquez sur le fichier pour lancer l’installation. Celle-ci terminée, une icône XN-View apparaît sur le bureau. – Convertir une imageSur le Web, les images doivent être au format Gif ou Jpeg. Si l’image que vous souhaitez utiliser est d’un autre format (bmp ou Tiff par exemple), vous devez la convertir. Cliquez sur Fichier, Ouvrir, cherchez et sélectionnez la photo. Puis, cliquez sur le bouton droit de la souris et sélectionnez la commande Convertir dans le menu contextuel.Dans la fenêtre Conversion multiple, cliquez sur le bouton Répertoire et choisissez le dossier Images de votre site Web. Ensuite, déroulez la liste des différents types de fichier puis choisissez ” JPG-JPEG/JFIF “. Cliquez sur Lancer pour valider. – Redimensionner une imageLes photos de grande dimension sont à bannir pour deux raisons : elles sont très longues à télécharger, et il faut un écran de très grande taille pour les voir dans leur intégralité. Il est donc préférable que leur poids ne dépasse pas les 100 Ko et leur largeur les 770 pixels au maximum.Pour modifier la largeur de vos images, lancez XN-View puis sélectionnez un cliché particulièrement grand, par exemple une photo qui mesure 1 084 points sur 1 126 points et pèse environ 500 Ko. Double-cliquez sur cette image. Puis, déroulez le menu Image puis choisissez Redimensionner.
Modifiez la largeur ou la hauteur (par exemple 400 points sur 300 points) en vérifiant bien que la case Ratio est cochée. Nous obtenons ainsi une photo de 70 Ko.Cliquez sur OK pour valider puis appuyez simultanément sur les touches Ctrl et S pour sauvegarder.

3 – Personnalisez l’arrière-plan

 – Créer une image d’arrière-planPar défaut, l’arrière-plan de votre page est blanc. Vous pouvez le modifier en sélectionnant une autre couleur ou en choisissant une petite image qui se reproduira à l’infini sur le fond de votre page. Nous vous conseillons d’opter dès le départ pour cette deuxième solution, même si vous n’avez pas encore d’image ! Dans ce cas, utilisez un simple carré blanc.Ensuite, il vous suffira de le modifier (ou de remplacer ce fichier par un autre) pour que le chargement s’applique automatiquement à toutes vos pages.Pour créer l’image d’arrière-plan, nous allons utiliser
Paint
, le logiciel de dessin livré avec Windows. Cliquez sur le menu Démarrer, accédez aux dossiers Programmes et Accessoires puis cliquez sur le raccourci Paint.Au lancement du logiciel, l’image affichée est beaucoup trop large pour être utilisée comme arrière-plan. Pour modifier la largeur et la hauteur de l’image, déroulez le menu Image puis cliquez sur Attributs. Remplacez les valeurs des largeur et hauteur par 10. Cliquez sur OK pour valider.Pour modifier l’aspect de l’image, cliquez sur l’une des couleurs proposées par la palette, puis cliquez sur Remplissage.Pour sauvegarder l’image, déroulez le menu Fichier et cliquez sur Enregistrer. Nommez le fichier (par exemple fond) puis sélectionnez Gif dans le menu déroulant Type et enregistrez votre fond dans votre dossier Images. – Afficher l’arrière-planLancez
FrontPage Express
puis ouvrez la page d’accueil de votre site. Déroulez le menu Format puis cliquez sur Arrière-plan. Cochez la case Image d’arrière-plan puis cliquez sur Parcourir.Dans l’onglet Autre emplacement, cliquez sur Parcourir puis sélectionnez le fichier fond.gif enregistré dans le dossier Images du dossier Siteperso. Cliquez successivement sur les boutons Ouvrir, OK puis à nouveau sur OK.

4 – Ajoutez des couleurs à vos liens

Par défaut, les liens hypertextes que vous avez placés dans votre page sont de couleur bleue et deviennent violets lorsqu’un visiteur clique dessus. Nous vous proposons de personnaliser vos liens en leur affectant d’autres couleurs. Petit plus non négligeable, vos liens changeront aussi de couleur au passage du pointeur de la souris sur eux.

Sur le site commentcamarche.net, un cadre s’affiche lorsque la souris survole un lien. Ouvrez la page souhaitée avec
FrontPage Express
, déroulez le menu Affichage et cliquez sur la commande Html. Vous avez devant vous le code HTML de votre page. Positionnez votre curseur après la balise en haut de page et appuyez sur la touche Entrée.
Recopiez ensuite le texte ci-contre. Cliquez sur OK. Appuyez ensuite simultanément sur les touches Ctrl et S pour enregistrer les modifications.Répétez l’opération pour toutes les pages de votre site.

5 – Protégez vos images

Grâce à une astuce, vous pouvez éviter que des visiteurs copient sur leur disque dur les images présentes sur votre site. Pour cela, il faut simplement leur interdire l’usage des fonctions correspondant au clic droit de la souris. Lorsque le visiteur cliquera sur lui, un message apparaîtra en lieu et place du traditionnel menu contextuel permettant d’enregistrer l’image.Dans FrontPage Express, ouvrez l’une de vos pages qui contient des photos à protéger. Ensuite, déroulez le menu Affichage puis cliquez sur HTML. Placez le curseur de la souris derrière puis appuyez sur la touche Entrée. Recopiez ensuite les lignes de code ci-dessous. Cliquez sur OK puis appuyez simultanément sur les touches CTRL et S pour enregistrer les modifications.
A noter : Vous pouvez changer le m essage de la boîte de dialogue en modifiant le texte situé entre parenthèses après alert.

🔴 Pour ne manquer aucune actualité de 01net, suivez-nous sur Google Actualités et WhatsApp.


Fabrice Auclert et Emmanuel Genty