21 mai 2005

COMMENCER À BLOGUER

Les codes qui m'ont été utiles pour débuter un blog de tricot il y a quelques mois, sous blogger , on peut sinon choisir Typepad, 20six, canalblog, livejournal etc... qui sont aussi gratuits. Les codes sont valables pour toute page en html (vos messages comme vos barres latérales).

De façon générale, il faut mettre un code avant et un code après la partie (texte ou image) à modifier. Dans les exemples suivants, j'ai mis les codes en gras pour qu'on les voie bien.




IMAGE





1. Hébergeurs d'images
Il y a des sites spécialisés et gratuits qui permettent de stocker votre image sur internet et de la rendre disponible à tout moment. L'hébergeur de votre blog le fait parfois, sinon en général il vous en conseille un. Vous NE DEVEZ PAS mettre en ligne une image que vous n'hébergez pas sur votre hébergeur.

2. Compresser les images
Pour que votre image ne soit pas trop longue à charger et stockable, il faut l'alléger. Je ne suis pas une pro en la matière, je fais ça avec Photoshop, il y a une option d'enregistrement pour le web.

3.Insérer une image (ce code ne se ferme pas)
Une fois que votre hébergeur d'image a attribué une adresse pour une image, voici le code pour la faire apparaitre:

< img src="http://adressedevotreimage.jpg">



On peut changer la taille, personnellement je donne la largeur et l'image est recalibrée en gardant les proportions :

< img src="http://adressedevotreimage.jpg" width=100>




< img src="http://adressedevotreimage.jpg" width=300>






MISE EN PAGE




1. Centrer un texte ou une image


< center> ici votre texte à centrer </center>
ici votre texte à centrer


< center> < img src="http://adressedevotreimage.jpg" width=100> </center>




2. Changer la couleur d'un texte
Vous trouverez les codes correspondant aux couleurs dans divers sites comme :
La trousse du Webmaster
Lissa explains it all
Les couleurs de la police sont prédéfinies, on peut les changer ponctuellement ainsi:

< font color=#ff0066 > ce texte est en rose < /font >
ce texte est en rose

< font color=#0066ff > ce texte est en bleu < /font >
ce texte est en bleu

< font color=#00ff66 > ce texte est en vert < /font >
ce texte est en vert



3.Mettre un texte en gras, italique, ou souligné

< i >Ce texte est en italique< /i >
ce texte est en italique

< b >Ce texte est en gras< /b >
ce texte est en gras

< u >Ce texte est souligné< /u >
ce texte est souligné



4. Aller à la ligne, Sauter une ligne (ce code ne se ferme pas)

Après cette première partie, < br > on continue à la ligne< br >< br >puis on saute une ligne.

Après cette première partie,
on continue à la ligne

puis on saute une ligne.



5. Insérer une barre de séparation (ce code ne se ferme pas)

Après cette partie on met une barre < hr >puis on continue

Après cette partie on met une barre
puis on continue



6. faire un lien vers une autre page à partir d'un texte, d'une image ou d'un bouton

En cliquant sur un mot (ici "le coin de la souris") on arrive sur un site.
< a href="http://le-site-d'arrivée.com" > Le coin de la souris < /a >

La coin de la souris


En cliquant sur une photo on arrive sur un site :
< a href="http://le-site-d'arrivée.com" > < img src="http://adressedevotreimage.jpg" > < /a >




En cliquant sur une photo calibrée pour qu'elle apparaisse petite (càd un bouton), on arrive sur un site:
< a href="http://le-site-d'arrivée.com" > < img src="http://adressedevotreimage.jpg" > < /a >






7. faire un lien permettant d'envoyer un e-mail

< a href=MAILTO:votreadresse@hotmail.com >Ecrivez-moi < /a >

Ecrivez-moi




Il existe bien d'autres codes très intéressants et pratiques. Je vous conseille d'aller voir La coin de la souris pour approfondir et partager vos connaissances. D'ores et déjà, suivez les conseils de . N'hésitez pas à me prévenir en cas d'erreurs, merci!

Et bonne journée à vous, Hélène !

1 commentaire:

  1. SUPER merci, moi qui me casse la tête avec la taille des images limitée proposée par Photobucket.

    RépondreSupprimer

Votre commentaire apparaitra après validation mais Blogger ne me transmet pas votre adresse mail... si vous posez une question dans les commentaires j'y répondrai à la suite par un nouveau commentaire.

LinkWithin

Blog Widget by LinkWithin