2. Comment procéder pour enrichir le portail documentaire ?
On peut y ajouter des documents sur différents supports. Il faut
les héberger au préalable sur des sites spécialisés afin de leur
attribuer une adresse URL propre ou un code qui permettra de
les intégrer à e-sidoc.
La plupart des plateformes d’hébergements demandent la
création d’un compte gratuit. Il est conseillé d’utiliser un même
login et mot de passe pour tous. Par exemple :
Login : début de l’adresse du CDI
Mot de passe : RNE
Cela peut s’avérer utile lorsque l’on est plusieurs documentalistes
en poste ou en cas de mutation.
Avant de choisir une plateforme d’hébergement, il faut prendre
en compte les restrictions d’accès appliquées dans
l’établissement d’exercice.
3. Le langage HTML
Le HTML (« HyperText Mark-Up Language ») est un langage
dit de « marquage » (de « structuration » ou de « balisage ») dont
le rôle est de formaliser l'écriture d'un document avec des balises
de formatage. Les balises indiquent au navigateur comment
afficher le contenu de la page. (mise en valeur des paragraphes,
titre de la page, titre d'une partie, d'une sous-partie, caractères en
gras, retour à la ligne, etc).
Ces balises fonctionnent par paire, l'une définit le début d'un bloc
et l'autre la fin.
Remarquez que ces deux balises ne se différencient que par un
slash "/" mais il est indispensable.
Par exemple, le titre d'une page est codé grâce à la balise <title>,
et ce de la manière suivante dans votre éditeur de texte :
<title>Ceci sera le titre de la page</title>.
http://jlorenne.net/initiation-html.php
4. Quelques balises HTML
Balises Utilisation
<html>Texte</html> Obligatoire au début et à la fin du fichier HTML
<h1>Texte</h1> <h2>Texte</h2> et <h6>Texte</h6> Titre de niveau 1, 2 et 6
<i> Texte </i> Texte en italique
<strong> Texte </strong> ou <b>Texte</b> Texte en gras
<u>Texte </u> Texte souligné
<font face="Police de caractère">Texte</font>
exemple : Spécifie la police de caractère
<font face="Arial">Texte</font>
<font color="couleur">Texte</font> ou <font
Spécifie la couleur de la police (nom de la couleur en anglais
color=#RRVVBB>Texte</font> exemples :
ou paramétrage de la couleur en hexadécimal
<font color="brown"> Texte </font> ou
(voir http://www.code-couleur.net/)
<font color=#330000>Texte</font>
Spécifie la taille de la police, valeur allant de 1 à 7. Ces tailles
peuvent varier suivant le navigateur. Il est possible de
<font size=4>Texte</font> modifier ces valeurs de façon relative : La valeur "+1" indique
une augmentation de la police à la taille supérieure. Les
tailles varient de 1 à 7.
<font face="Comic Sans MS" color="brown" Combinaison des 3 balises précédentes : spécifie la police de
size=4>Texte</font> caractères, la couleur et la taille
<center>Texte</center>
Centrer le texte d'un titre ou d'un paragraphe
ou <p align="center">Texte</p>
<p align="justify">Texte</p> Justifier un paragraphe
<br> Saut de ligne
<hr> Barre horizontale
<hr color="couleur"> Barre horizontale de couleur
5. Le langage HTML
Posséder quelques rudiments d’HTML permet de modifier,
par exemple, la lettre de rappel proposée par défaut dans
BCDI :
C:BcdiServModelesInterfaces RestitutionLettreRappelsPage.htm
Ouvrir le fichier avec le bloc-notes installé par défaut sous
windows dans le répertoire Accessoires ou avec le logiciel
libre Nvu (prononcez n-view) qui propose un éditeur de
page graphique, du type WYSIWYG. Il faut au préalable le
télécharger et l’installer.
On peut alors modifier le texte situé entre deux balises ou
supprimer tel ou tel champ qui ne semble pas indispensable.
L’avantage avec Nvu c’est que plusieurs types d’affichage
sont proposés.
6. Le langage HTML : la lettre de rappel
En affichage normal apparaît à l’écran la page html telle qu’elle sera vue
par un usager. (exception faite des cadres roses qui seront invisibles).
On peut supprimer des balises.
Le texte de la lettre de rappel
apparait et peut-être modifié
quel que soit l’affichage.
7. Le langage HTML : la lettre de rappel
L’affichage balises HTML est un affichage de travail.
On peut supprimer des balises.
Le texte de la lettre de rappel apparait et
peut-être modifié quel que soit l’affichage.
8. Le langage HTML : la lettre de rappel
L’affichage Source montre le code HTML avec les balises en rose et les
indications de mise en page en bleu, le texte tel qu’il apparaitra est en noir.
Le texte de la lettre de rappel
apparait et peut-être modifié
quel que soit l’affichage.
9. C’est le langage HTML qui est utilisé pour la rédaction des
articles dans E-sidoc.
Nvu peut donc être utilisé pour mettre en page un article.
On le prépare en mode normal puis on copie le code
HTML obtenu en mode source.
10. Et on copie ce code dans l’éditeur de source HTML d’ E-sidoc.
12. L’utilisation du logiciel Nvu permet de mieux comprendre le
langage HTML mais n’est absolument pas indispensable pour
peaufiner la mise en page d’un article : E-sidoc propose une
option très pratique qui permet de copier directement un texte
préparé sous Word.
Pour mieux comprendre le HTML, vous pouvez consulter un
diaporama concocté par Christophe Poupet :
balises-du-html-au-xml
13. Insérer dans E-sidoc des documents déjà finalisés
1. sous forme de texte, tableur et diaporama
14. http://fr.calameo.com/
Permet de créer un livret feuilletable à partir d’un document déjà finalisé
Valorisation de travaux d’élèves :
Journal scolaire,
Recueil de textes,
Carnet de voyage…
Publicité autour d’une action en cours :
sélection de livres pour action lecture
15. 1. Créer un compte 2. Créer une publication
3. Charger le document à publier
16. 2. Créer une publication
3. Charger le document original à
publier
4. Pour que la publication soit accessible à tous
les utilisateurs d’ E-sidoc il faut cocher public
18. Il vaut mieux insérer un mini livret en fin d’article : en pleine
page l’affichage est trop petit pour être lisible et peu maniable.
Reste à copier ce code dans l’éditeur de source HTML d’ E-sidoc
19. Le mini livret feuilletable, il suffit
de cliquer dessus pour obtenir
l’affichage en plein écran.
21. Attention aux droits d’auteur et à la protection
des données et de la vie privée. En hébergeant
des données sur un site extérieur, on les publie
également dans le catalogue de ce site.
A quelles conditions ?
22. Changez éventuellement le titre du document puis cliquez sur
«save». Votre document est stocké et publié sur Scribd et possède
une adresse URL propre.
Pour obtenir le code permettant d’intégrer le document dans
votre article, copiez le code qui apparaît lorsque vous cliquez sur
le bouton </> puis « Embed ». Puis collez-le dans l’éditeur de
source HTML d’ E-sidoc.
24. Présentation d’ E-sidoc à Tours
http://www.slideshare.net/cddp37/esidoc-presentation-du-portail
25. copiez le code qui apparaît
dans l’éditeur de source
HTML d’ E-sidoc.
26. Récupérer & insérer dans E-sidoc des documents
déjà finalisés et mis en ligne par d’autres
3. de la vidéo
27. Intégrer une vidéo provenant de You tube
pour mettre en valeur des nouveautés
Bande annonce de Pluto
http://www.youtube.com/watch?v=LOGdeaf1pNw
Sous la vidéo,
cliquez sur le bouton « Partager ».
Cliquez ensuite sur « Intégrer »
et copiez le code qui apparaît dans
l’éditeur de source HTML d’ E-sidoc.
Pour intégrer une vidéo en plein écran il convient d’utiliser le cadre prévu pour le
texte d’introduction dans « configuration de la rubrique ». Il est situé en haut de
page et ne comporte pas de vignette d’où un meilleur affichage.
28. Intégrer une vidéo provenant de Dailymotion
Émanant de l’INPES pour la rubrique santé
copiez le code qui apparaît
et collez-le dans l’éditeur de
source HTML d’ E-sidoc.
29. Les aventures de Tintin sur l’INA
http://www.ina.fr/fictions-et-animations/animation/dossier/1898/les-aventures-de-
tintin.20090331.fr.html
30. Cliquez ensuite sur </>
et copiez le code qui
apparaît dans l’éditeur de
source HTML d’ E-sidoc.
32. Intégrer un plan
Dans la barre de recherche Google Maps
http://maps.google.fr/maps
tapez l'adresse que vous souhaitez. Un plan apparaît.
Cliquez sur l'icône « lien » en haut à droite du plan :
copiez le code qui apparaît
dans l’éditeur de source
HTML d’ E-sidoc.
33. Intégrer un Google agenda :
Via un compte sur Google Agenda
Exemple :
e-sidoc Médiathèque CDDP 37
Attention pour réaliser un Google agenda, vous devez au préalable créer un
compte Google.
Pour cela, cliquez sur « Connexion » en haut à droite de la page d'accueil de
Google, puis sur créer un compte.
Une fois connecté sur Google, cliquez sur l'onglet « Plus » et sélectionnez
« agenda ».
34. ouvrez le menu déroulant « mes
agendas »sélectionnez « paramètres de
l'agenda ». Ensuite cliquez sur
« Personnalisez la couleur, la taille et
d'autres options ».
35. copiez le code qui apparaît dans l’éditeur de
source HTML d’ E-sidoc.
36. Cette présentation a été conçue pour animer l’atelier
E-sidoc niveau 2 : Optimisation du portail
Il a été proposé le 5 puis le 17 octobre 2011 au CRDP d’Orléans .
Préparé par Priscilla Mommessin, documentaliste au Lycée des Métiers des Services Paul
Gauguin à Orléans
http://0450786k.esidoc.fr
avec l’aide de Sarah Bémer, documentaliste au Lycée Claude de France de Romorantin
http://0410017w.esidoc.fr
& de Laura Petiniot, documentaliste à la médiathèque du CRDP d’Orléans
http://0450090d.esidoc.fr