Bandeau

Site de démonstration du jeu de squelettes ESCAL fonctionnant sous SPIP3 et mis à la disposition des Etablissements SColaires de l’Académie de Lyon.

Utilisé à ce jour dans 1414 sites
Les articles
Article mis en ligne le 29 décembre 2016
dernière modification le 12 octobre 2017

par Jean Christophe Villeneuve
logo imprimer
Enregistrer au format PDF

Que de choses à dire sur les articles !

C’est en effet l’essentiel du contenu d’un site. Si le texte à proprement dit dépend du rédacteur, il y a de nombreux éléments à prendre en compte pour que ces articles soit agréables à lire.

Cet article va justement utiliser quelques-uns de ces éléments. Et tenter de vous apporter aussi quelques astuces.

Les liens hypertextes

Même si c’est trivial pour certains, d’autres ne savent pas faire de liens hypertextes dans un article. Voici donc comment procéder.
  • les liens externes
    • aller d’abord sur le site cible et copier l’adresse URL de ce site
    • dans l’article taper un texte "En savoir plus" par exemple et sélectionner ce texte
    • cliquer sur l’icône de lien dans la barre d’édition et coller l’URL précédemment copiée
    • valider en cliquant sur "OK"
  • les liens internes
    La démarche est la même sauf qu’on ne copie pas l’URL de la page
    • aller sur l’article ou la rubrique cible et notez son numéro
    • dans l’article taper un texte "Allez voir ici" par exemple et sélectionner ce texte
    • cliquer sur l’icône de lien dans la barre d’édition et indique "artXX" ou rubXX" (XX étant le numéro précédemment noté)
    • valider en cliquant sur "OK"

Les images

Agrémenter vos articles d’images est une bonne idée mais attention aux droits de ces images et attention à la taille et au poids de ces images. Voici quelques conseils .

Le droit à l’image

Toutes les images sur Internet ne sont pas réutilisables. Certaines le sont à condition de citer leur auteur ou leur site source à minima. Pour trouver de images et logos réutilisables, on peut aller sur des sites dédiés comme par exemple :

et pour trouver des icônes et des logos

On peut aussi demander à Google de ne proposer que des images réutilisables. Pour cela, dans le moteur de recherche, on clique sur "Outils" puis sur "Droits d’usage" et enfin sur "Réutilisation autorisée"

Taille et poids

Une erreur classique est de téléverser une image prise avec un appareil photo directement dans un article sans aucune modification de cette image qui souvent fait plus de 4000px de large et pèse plus de 4Mo.
Il est donc nécessaire de retravailler cette image en amont pour qu’elle ne fasse que 500 ou 600 px de large, voire moins.
Utile aussi de vérifier sa résolution qui ne doit pas dépasser 72 ppp. Au delà, aucun intérêt pour un affichage sur un écran.
Et votre image aura subi une sérieuse cure d’amaigrissement et ne fera plus que 100 à 200 Ko, d’où un gain non négligeable en terme de vitesse d’affichage et de d’occupation de votre espace web.

Des outils

Quels outils pour travailler ses images ? Pas besoin de logiciels hautement performants comme Photoshop ou GIMP. Quelques logiciels plus basiques suffisent amplement comme par exemple :

Mettre du texte en évidence

Vous voulez mettre du texte en évidence pour que vos lecteurs ne le ratent pas ? Escal a pensé à vous !

Le gras et l’italique sont déjà 2 façons de mettre du texte en évidence mais parfois, on en voudrait plus.
Le plugin Enluminures Typographiques permet (entre autres) de mettre du texte en couleur. Seulement 2 couleurs sont proposées, ce qui est une bonne chose car cela évite les articles "sapin de Noël" dont certains rédacteurs raffolent ...

Escal va plus loin en proposant 4 raccourcis permettant de mettre un texte en évidence.
Voir ici pour plus de détails.

Amélioration des articles longs

Un article long peut rebuter certains de vos lecteurs. Voici quelques astuces pour ne pas les perdre.

Le plugin Le couteau suisse permet des améliorations notables de la présentation d’articles longs comme celui que vous êtes en train de lire.
Une fois ce plugin installé, vous pouvez activer 3 de ses lames :

  • la lame Sommaire automatique dans "Améliorations des textes" qui va donc ajouter un sommaire en haut de chaque article. Ce sommaire est construit à partir des intertitres de votre article.
  • la lame Blocs dépliables dans "Raccourcis typographiques" qui permet de créer des blocs dont le titre cliquable peut les rendre visibles ou invisibles, comme les différentes parties de cet article
  • la lame Découpe en pages et onglets dans "Raccourcis typographiques" qui permet de créer un bloc avec des onglets comme dans la partie "Les images" de cet article

L’activation de ces 2 dernières lames fait apparaître des icônes dans la barre d’édition des des articles, vous permettant d’utiliser simplement ces raccourcis typographiques.

NB : Escal a retravaillé pour vous le rendu graphique de ces 2 lames

Les contenus distants : vidéo, exercice, cartes, ...

En plus des images, on peut vouloir enrichir son article d’une vidéo ou d’un autre contenu. On peut parfois l’insérer comme une image mais on peut aussi vouloir préserver son espace web. Voici comment intégrer un contenu distant sans surcharger son site.

Un certain nombre de sites proposent d’intégrer du contenu dans vos articles tout en laissant ce contenu sue ce site distant. Il fournit donc un code commençant le plus souvent par <iframe ... que l’on peut copier-coller dans son article.

Quelques exemples :

Vidéos

  • Dailymotion : on récupère le code en cliquant sur "Partager"
  • Vimeo : on récupère le code en cliquant sur "Partager"
  • Youtube : on récupère le code en cliquant sur "Partager" puis "Intégrer"

Cartes

  • OpenStreetMap : on récupère le code en cliquant sur l’icône "Partager" puis sur "HTML"
  • GoogleMaps : on récupère le code en déroulant le menu puis en cliquant sur "Partager ou intégrer la carte" puis sur "Intégrer"

Exerciseurs

  • LearningApps : le code est visible sur la page de l’exercice

Publication

  • Calaméo : on récupère le code en cliquant sur "Intégrer" puis en cochant "HTML". Options possibles pour personnaliser le rendu.

Radio

  • France Culture : on récupère le code en cliquant sur le bouton "Exporter"

Nhésitez pas à m’en proposer d’autres !

Un article en pleine page

La colonne réservée à l’affichage des articles vous parait trop étroite pour certains articles ? Pas de souci, Escal prévoit d’afficher certains articles en pleine page, sans les colonnes latérales.

C’est très simple : il suffit d’ajouter le mot-clé pleinepage du groupe "affichage" à votre article et Escal se charge du reste.
Attention néanmoins aux textes trop larges qui peuvent devenir difficiles à lire. Une ligne devrait idéalement contenir une quinzaine de mots maximum.

Créer un article à partir d’un fichier .odt

Vous avez déjà le contenu d’un article dans un fichier LibreOffice avec ses intertitres, ses images et/ou vous n’avez pas envie de vous casser la tête à construire un tableau un peu sophistiqué dans SPIP ? Voilà une solution.

La dernière version de ce plugin fait planter le site (page blanche).
Ne surtout pas installer ou mettre à jour pour l’instant

Il vous faut d’abord installer et activer le plugin odt2spip qui va vous permettre de créer un article reprenant tous les éléments de votre fichier .odt : titres, paragraphes, listes, images, tableaux, ...

Voir un exemple ici

Avec tout cela vos articles seront maintenant aussi beaux qu’intéressants !


Forum
Répondre à cet article

Dans la même rubrique



Plan du site Contact Mentions légales Espace rédacteurs squelette

RSS Valid XHTML 1.0 Strict

2009-2017 © Escal V3 - Tous droits réservés
Site réalisé sous SPIP
avec le squelette ESCAL-V3
Version : 3.87.58