Aide à la rédaction d`articles

Document d’aide à la rédaction d’articles
dans le site du LEGT Leclerc
Ce document a pour objectif de vous fournir un minimum de connaissances,
vous permettant de commencer à utiliser aisément les principales
fonctionnalités du site web du LEGT Leclerc. Vous pouvez le visualiser en mode
Diaporama.
Réalisateur : JJ Morel
Mail : [email protected]
http://www.lycee-leclerc.fr
Webmaster : Philippe Buttani
Accès aux
rubriques
et sous
rubriques
du site
Moteur de
recherche
du site
Plan
général du
site web
Accès à
l’espace
privé des
rédacteurs Demande de
du site
compte
utilisateur au
webmaster
Comment
contacter le lycée
et accéder à un
formulaire d’envoi
de mail
Liste des derniers
articles parus (tri
chronologique)
équivaut à l’éditorial
du site.
Accéder à l’espace rédacteur
Le Webmaster a déclenché une procédure d’inscription basée sur votre adresse mail et vous avez reçu le
mot de passe de votre compte, associé à votre pseudo. Vous possédez maintenant un compte utilisateur
permettant de rédiger les articles internes au site et de bénéficier de nouvelles fonctionnalités à l’intérieur
du site : Pour accéder à l’espace privé, il faut d’abord vous identifier.
Entrez votre nom d’utilisateur (login)
En cochant cette case, votre
navigateur se souviendra de
vos paramètres
d’identification et vous évitera
cette procédure pendant
quelque temps
Entrez votre mot de
passe : dans notre
exemple 0670057y
Site web sous SPIP : Notions générales et vocabulaire courant.
Le site hébergé sur le serveur web est
diffusé par le serveur et est
consultable (protocole http) par tous
les internautes
Le Webmaster (responsable de l’administration
d’un site web a la faculté de sélectionner les pages
web et les parties du site web diffusées. Il
configure son logiciel transfert de pages vers le
serveur pour réaliser la mise à jour du site web (on
parle de transfert ftp). Les pages sont réalisées en
principe avec divers logiciels permettant de créer
des pages en langage html lisibles dans le
navigateur internet (internet explorer). Ces logiciels
peuvent être ceux de la suite Office (dont
Frontpage) ou des logiciels spécialisés
(Dreamweaver) ou même le bloc notes qui suffit à
écrire du langage html pour les plus expérimentés.
Dans notre cas, le webmaster Philippe Buttani
(Administrateur du site du lycée) s’appuie sur le
logiciel SPIP (Gestionnaire de contenu) transférant
directement des articles de divers rédacteurs dans
une base SQL sur le serveur web (Hébergé par
Oléane).
Ainsi, il n’y a pas besoin de créer des pages web
complexes et de les transférer, chaque utilisateur
le fait en interagissant directement avec le site web
sous SPIP à condition d’y être autorisé et à partir
de son simple navigateur.
Serveur web :
Ordinateur assez puissant, fonctionnant sans
interruption avec un logiciel dédié au service web
(serveur IIS, Apache, Samba ou autre). La plupart des
FAI (fournisseurs d’accès internet) comme Free,
Wanadoo ou autre mettent en place une solution
d’hébergement des sites web ou des blogs qui inclut
pour chaque internaute la possibilité de disposer d’un
espace disque dur du serveur pour stocker ses pages
web, une ou plusieurs bases de données SQL gérées
par le serveur (pour les blogs, sites commerciaux, et
sites tels que celui du lycée qui ont vocation à faire
interagir les internautes, et éventuellement un nom de
domaine réservé (ex : lycee-leclerc.fr) en .fr, .com, .net
et déclaré auprès du NIC (organisme international de
gestion des noms de domaine attribués)
L’espace rédacteur
(0)
(1)
Contient un très grand
nombre de fonctionnalités
que vous pouvez
expérimenter :
- Le retour à l’accueil de
l’espace rédacteur (0)
- L’éditeur d’articles (1)
- Le forum interne du site
dans lequel chaque
message posté déclenche
un forum de discussion (2)
- La liste des auteurs (ceux
qui ont déjà publié des
articles) (3)
- Une aide complète sur la
manipulation de l’espace
rédacteur (4)
- La possibilité de retourner
visiter le site à partir de sa
page d’accueil (5)
(2)
(3)
(4)
(5)
Autres auteurs connectés
Menu déroulant des rubriques
Accès à la création d’un article
Suivi des forums et infos
contextuelles
Liste des rubriques
du site avec
développement (>)
de sous rubriques
L’accès aux informations personnelles d’un rédacteur (Auteur) en permet aussi la modification.
Vous pouvez y mettre à jour les informations vous concernant et votre mot de passe.
Rédaction d’un article
Pour publier un article qui sera lu par tous les visiteurs du site la procédure à suivre est simple et enrichie d’un contexte d’aide
permanent symbolisé par
Laissez vous guider
par l’application
La rubrique ou sous
rubrique de publication
souhaitée. Si vous
souhaitez qu’une
nouvelle rubrique soit
créée, demandez le au
webmaster
(…)
Pour donner un aperçu global du contenu (texte visible en tout ou partie
dans l’éditorial du site (page d’accueil)
Possibilités de mise en forme du
texte (avec infobulles d’aide)
CRÉER UN LIEN HYPERTEXTE
Le lien hypertexte est conçu à partir d’une partie
sélectionnée dans votre article, apparaîtra en bleu
souligné pour les visiteurs du site et permet de
charger une page web spécifique par son URL.
Aide à la compréhension des « raccourcis
typographiques » pour la mise en forme
Commencez à taper votre texte. Le saut de
ligne sera matérialisé par un simple passage à
la ligne dans la version publiée
Enregistrez
votre article
Le code html
adéquat sera
automatiquement
généré
Enrichir l’article
Après avoir enregistré le texte de votre article, vous pouvez le faire évoluer graphiquement, tout
en pouvant encore faire des modifications sur le texte. Attention à cliquer sur enregistrer après
les modifications du texte sinon celles-ci seront éliminées.
Enregistrez toujours votre texte avant toute insertion d’images ou documents pour éviter
toute perte de données.
Le ou les auteurs
(anonymat possible
en supprimant
l’auteur)
En cliquant votre lien
hypertexte vous pouvez
tester son fonctionnement.
Celui-ci lance une nouvelle
page du navigateur sur
l’URL (adresse) souhaitée.
Clic sur le symbole pour ajouter un logo, comme n’importe quel document (mêmes principes que cidessous). Un logo est une imagette gif ou jpg d’une taille maxi 256 Ko et de format 95 à 105 Pixels en
largeur et hauteur maxi (carré de préférence)
Cette boîte permet un enrichissement documentaire sous forme d’image (format GIF ou JPG) ou de fichier (tous
formats possibles) téléchargeable par le visiteur. Pour une photo, prendre une taille maximale de 640X480 pixels. En
bas d’article une photo miniature agrandissable sera automatiquement créée. L’image à insérer est contenue sur votre
ordinateur et sera recherchée avec le bouton « Parcourir » comme n’importe quel fichier. Une fois trouvée il faut
cliquer « Télécharger », ce qui aura pour effet de l’envoyer dans le dossier images du site chez l’hébergeur. Prenez
des fichiers de taille modeste, et dont vous êtes le propriétaire, sinon votre article pourrait voir sa publication
suspendue ou annulée.
Reste à choisir un titre à votre document (la vignette est créée automatiquement mais reste personnalisable, et
l’action de supprimer le document n’affecte que le site et pas votre ordinateur.
Plusieurs documents peuvent ainsi être ajoutés successivement.
Modifier un article
Nous allons pouvoir réviser le contenu de l’article mais trouver également la possibilité d’inclure des images
et documents à l’intérieur même du texte, à la différence de la technique précédente qui avait pour effet de
placer des documents en fin d’article avec une vignette miniaturisée (technique qui me semble toutefois la
plus efficace).
Ajout d’une image : même technique qu’avant
applicable pour un fichier gif ou jpg de votre
disque dur. L’insertion donne une boîte identique
à celle de gestion du document.
Copiez un de ces 3 codes html à l’intérieur de votre
texte pour que l’image y apparaisse. La même règle
s’applique aux documents. La largeur de l’image
devra être alors inférieure à 600 pixels.
Conseil : N’oubliez pas d’enregistrer votre article.
Pour être efficace en insérant plusieurs images,
téléchargez les d’abord toutes et n’insérez le code
html qu’à la fin dans l’article, sinon vous devriez
enregistrer chaque étape successivement.
Le Webmaster se
charge de publier
l’article après
éventuelles
corrections de forme
Récupérer le code html d’un tableau au format Word
Les tableaux sont peu aisés à réaliser dans SPIP. Une solution simpliste de diffusion des tableaux peut consister en une capture de l’image du
tableau, insérée en tant qu’image dans l’article. Toutefois les modifications du tableau conduisent à réeffectuer l’opération à chaque fois.
On va privilégier l’insertion de code html directement dans le texte de l’article en cours de rédaction. Pour cela il faut suivre la procédure cidessous.
Exemple de tableau réalisé initialement dans Word
Au préalable, le tableau sera
enregistré au format htm.
Activez le menu Fichier
Enregistrer en tant que page web.
A partir du fichier html, activez le
menu Affichage – Source html
pour lancer l’éditeur de script de
Word
Vous devez sélectionner le code html compris entre les 2 balises <body> délimitant le corps du document juste après l’en-tête (balises <head>) Elles
sont repérables avec le menu Edition – Rechercher.
(…)
Le code sélectionné peut
être alors copié puis collé
dans le texte de l’article en
cours de rédaction dans
SPIP. Vous pouvez
aisément ajouter du texte
courant avant et après vos
2 balises body.
Si votre tableau devait être modifié, effacez le code html implanté dans votre article et
copiez simplement à la place le code html de votre nouveau tableau.
L’utilisation de l’éditeur de script est facultative et on peut aussi bien faire cela avec un bloc
notes ou wordpad.
Les tableaux : suggestion de « sous-traitance » logicielle
Des différences d’affichage peuvent apparaître lorsque vous copiez dans SPIP le code html des tableaux réalisés à partir d’autres applications.
C’est le cas en particulier pour les tableaux faits dans Excel et convertis en page web qui n’affichent pas de bordure si la valeur « border » du
code html n’est pas mise à 1 au lieu de 0, ou autres cas techniquement insatisfaisants.
Mieux vaut réaliser un tableau au préalable dans un logiciel produisant un code html propre. On peut très bien utiliser un logiciel d’édition de pages
web comme Frontpage ou Dreamweaver pour la réalisation du tableau.
Le code html pourra être ensuite copié et collé dans l’article SPIP sans difficulté.
Exemple avec Frontpage :
Lancer Frontpage et activer le menu Tableau – insérer un tableau
L’utilisation de Frontpage est assez similaire à celle de
Word, c’est normal car ce sont des logiciels Microsoft.
La mise en forme du tableau peut alors avoir lieu assez
simplement. Une fois terminé, affichez le code html de
votre tableau en cliquant en bas à gauche sur :
Effectuez ensuite la
sélection du code
compris entre les
balises <body> et
copiez-collez le dans
votre article sous SPIP
Tableau
achevé
(Exemple)
Aperçu final
dans SPIP