Communication & Édition numérique : Conception de site
←
→
Transcription du contenu de la page
Si votre navigateur ne rend pas la page correctement, lisez s'il vous plaît le contenu de la page ci-dessous
Communication & Édition numérique : Conception de site cyril.masselot@univ-fcomte.fr
Plan • 1. Analyser pour concevoir : Théories IC + linguistique + sémiologie = des outils ! • 2. Cahier des charges communicationnel. • 3. Projet pratique : de l’idée au projet, du projet à la réalisation.
Travaux pratiques
• Par groupes de deux, identifiez un site internet que vous considérez
comme « mauvais » et dont la refonte pourrait donner lieu à un projet
motivant, à la fois technique et éditorial.
• Dans un premier temps, élaborez une analyse, un diagnostic, nous
permettant de comprendre en quoi ce site est si « mauvais » et,
surtout, quelles seraient ses marges de progression. Vous formulerez
donc des recommandations stratégiques argumentées pour ce projet
web. Celles-ci seront ensuite déclinées au niveau technique, tant du
point de vue de la pertinence du format mobilisé, de celui de
l’interface, que de celui du contenu et du SEO.
• Proposez une maquette fonctionnelle du site refondu, hébergée sur le
serveur du département, et alimentée de manière à ce que nous
puissions prendre conscience de la stratégie éditoriale conçue et mise
en œuvre.
• Ce projet donne lieu à la production d’un rapport "retour
d’expérience" expliquant les éléments de contexte retenus, votre
analyse, vos recommandations et les phases de la mise en œuvre.
• Evaluation donc sur le site + dossier.
Information et
Communication
• Information
– selon Bougnoux [Bougnoux 2001], l'information "recouvre à la fois les
données, les nouvelles et la connaissance",
(data, news, knowledge)
– et J. Perriault [Perriault 1989] déclare qu'il s'agit d'"un ensemble de
données formatées, d’une certaine façon inertes ou inactives"
• Communication [Bougnoux 2001] :
– C'est l'homme agissant sur (les représentations de) l'homme par le détour
des signes
– données informationnelles vs "glu relationnelle"
– Notion de processus
• A. Mucchielli, 2001 :
– "on peut dire qu'une « communication » (généralisée) est une expression
d'un acteur social, porteuse d'une intentionnalité, analysable du point de
vue d'un observateur-lecteur capable d'en comprendre le sens, dans un
contexte pertinent pour l'acteur concerné. »
• Bougnoux Daniel, 2001. Introduction aux sciences de la communication, La
Découverte, collection Repères, 2°trimestre.
• Mucchielli Alex, 2003, Les sciences de l'information et de la communication, Paris,
Hachette
• Perriault Jacques, 1989. La Logique de l'Usage, Essai sur les machines à
communiquer, Flammarion
Cycle de la
communication
Alex Mucchielli, 2003
Les sciences de l'information et de la communication, Paris, Hachette
9
Schéma de la Communication de R.
JakobsonSchéma de R. Jakobson
• Le schéma de la communication de Roman Jakobson permet
d’analyser et de concevoir un objet ou une stratégie de
communication, en s’attachant à comprendre chacun des composants
d’une communication :
• Destinateurs, ou émetteurs : qui s’exprime, et quelle est sa place,
son importance dans le processus ? Plusieurs émetteurs, ou un seul ?
Doit-il convaincre par son implication, par ses émotions ?
• Destinataires, ou publics : à qui parle-t-on ? Quelles cibles
principale, secondaire, et autres ? À quel stade ou distance d’un
comportement du modèle transthéorique de Prochaska &
DiClemente ? Comment les identifier ? On leur demande de faire
quelque chose ? Comment permettre au lecteur de se reconnaître, de
se sentir concerné ?
• Messages : Qualité, complétude et clarté de l’information explicite ?
Poids de l’implicite, implications émotionnelles ?Schéma de R. Jakobson
• Contextes : lieux de diffusion adéquats ? Périodes, créneaux ou moments
opportuns ? Environnement de réception calme ou perturbé ? Références
sociales convoquées et/ou nécessaires ? Création de communauté ? Montrer
qu’émetteurs et récepteurs peuvent se comprendre ?
• Contacts : Comment créer le contact, l’accroche ? Comment maintenir
l’attention ? Comment dire au revoir, et non adieu ? Comment organiser le sens
de lecture ? Comment garder le contact en dehors du processus ? Doit-on jouer
sur des émotions, et si oui lesquelles, et comment ?
• Codes : en fonction de tout le reste, quels sont les meilleurs codes à utiliser,
les plus pertinents ? Ceux qui seront le mieux compris par nos cibles ? Qui
permettront d’améliorer le contact ? De mieux porter les signes nécessaires ?
Comment vérifier la compréhension de manière légère ?
• Note : pour concevoir un processus communicationnel, il est recommandé
d’utiliser ce schéma dans l’ordre suivant : Destinataires – Contextes –
Destinateurs – Messages – Contacts – Codes.Pourquoi utiliser
ces fonctions ?
• Objectifs de l'utilisation de ces fonctions lors de la conception d’un
objet communicationnel :
– Expressive : implication pour #conviction. Charge émotionnelle
provoque de la compassion, des sentiments.
– Conative : Faire agir ou réagir, pousser à l’#action (injonction)
– Poétique : la forme est au service du contenu du message, en en
renforçant le sens, en faisant rêver. Permet une #mémorisation
("musicale", "chantante", visuelle, psychologique etc.).
– Référentielle : Permet de montrer par le contexte qu'on est du même
monde, qu'on partage les mêmes références (culturelles). Création
d'une #communauté de personnes, d'idées, de valeurs.
– Phatique : construire la #relation ; implication réciproque pour
appropriation. Ne pas perdre le contact, ne pas être à l'origine de la
rupture de la communication. Être présent, montrer ainsi son
dynamisme et sa vitalité.
– Métalinguistique : reformulation, explicitation, pour la
#compréhension. Eclaircissements.Prochaska & DiClemente
UN PETIT JEU…
ALORS… ?
QUELQUES EXEMPLES…
Isotopies
• Chaque mot, chaque phrase, chaque image (animée ou non), chaque son,
chaque type de mise en page, et chaque association de ces divers
éléments renvoie, par un jeu de résonances, à des significations multiples
et souvent cachées : des isotopies.
• Bougnoux 2001 : "Trait commun à au moins deux unités (sémantiques)
situées sur l'axe syntagmatique."
• A. J Greimas (Du sens. Essais sémiotiques, Le Seuil, 1970. Cité par A. Hénault, Les
enjeux de la sémiotique, PUF, 1993) : « Par isotopie, nous entendons un
ensemble redondant de catégories sémantiques qui rend possible
la lecture uniforme du récit, telle qu'elle résulte des lectures partielles
des énoncés et de la résolution de leurs ambiguïtés qui est guidée par la
recherche de la lecture unique. »
è Applicable à la lecture de tout objet.Exemple de la marque Evian
Exemple de la marque Evian
Exemple de la marque Evian • Genre : Eau minérale • Discours : "La jeunesse selon Evian" - "Jeunesse de corps, Femmes d'Evian, Jeunesse d'esprit" cf. images associées : homme jeune et souple (!), femme allongée dans l'herbe, jouet d'enfant • Slogan : Pure - Inviolée - Éternelle - Contrôlée - Source de Jeunesse - Rare - Légère - Numéro 1 - Innovante – Festive • Contexte = la Ville, Evian-les-Bains, Haute-Savoie, rive Lac Léman, montagnes
Exemple de la marque Evian
Exemple de la marque Evian
• Pure - Inviolée - Éternelle :
– montagnes (filtre),
– neige + glace,
– bleu et blanc
• Contrôlée - Source de Jeunesse & Maternité :
– eau source de vie,
– Lac,
– rond autour du logo,
– rose, montagnes bleues, rouge
– Rondeur typo du nom
• Contexte spatial :
– montagnes enneigées,
– rondeur des rives du lac…
– nom !
– Bleu, blanc, rouge
• è Inscription dans un discours judéo-chrétien.M. Moore, Bowling For
ColumbineLe réalisateur :
Michael MOORE
• Ancien ouvrier de General Motors, Michael Moore est aujourd’hui journaliste,
documentariste, écrivain et activiste américain. Par ses films documentaires engagés,
il s’impose comme un observateur intransigeant des valeurs économiques, sociales et
politiques de son pays, les États-unis.
• Depuis quelques années et notamment grâce à ses films chocs, il est devenu une figure
médiatique incontournable et particulièrement influente dans le monde entier. Toutefois, il
est vivement critiqué par certains opposants qui n’apprécient pas son omniprésence, la
partialité de son regard, son manque de nuances et sa franchise.
• Il faut dire qu’à travers des documentaires militants, il n’hésite pas à rétablir sa vérité et
dénoncer certains comportements ou certaines valeurs propres à son pays.
• Dans ses documentaires, Michael pose une problématique initiale, qui est le fil rouge du
film et tente d’y apporter des réponses. Ceci permet de donner plus d’humanité au
documentaire, il incite dès lors le spectateur à s’identifier à son point de vue.
• La société américaine est la cible favorite de sa caméra et de son intransigeance. En effet,
tous ses documentaires ont comme point commun de dénoncer les déviations
mercantilistes de l'économie et la société américaine.
• Parallèlement à ces réalisations pour le cinéma, Michael Moore traque également les
injustices sociales à la télévision avec des émissions satiriques et il écrit aussi des essais.Synopsis (wikipedia)
• Ce film (11/10/2002) est un documentaire critique de la société
américaine qui tente de répondre à cette question : « Pourquoi le
nombre d'homicides par arme à feu est-il proportionnellement plus
élevé aux États-Unis que dans les autres pays ? ». Le titre fait
référence à la fusillade du lycée Columbine à Littleton (Colorado) en
1999 où 12 lycéens et un professeur furent assassinés par deux de
leurs camarades.
• Le frère de Terry Nichols (connu pour son rôle dans l'attentat
d'Oklahoma City), James, est également interviewé à domicile, ainsi
que Charlton Heston, qui était au moment du tournage du
documentaire le président de la National Rifle Association. Le musicien
Marilyn Manson est également questionné au sujet des critiques qui
lui reprochaient d'avoir influencé les tueurs par sa musique ; à la
question « Qu'auriez-vous dit à ces jeunes si vous aviez pu les
rencontrer avant leur crime », la star a répondu : « Je n'aurais rien
dit. Je les aurais écoutés, ce que personne n'a fait ».
• Le titre Bowling for Columbine provient de la dernière phrase
prononcée par Michael Moore dans le film, qui précise que les auteurs
du massacre, Eric Harris et Dylan Klebold, ont joué au bowling de 2h
à 6h du matin la veille de l'attaque.M. Moore, Bowling For
ColumbineIsotopie des USA • Présence (symbolisée) du drapeau des Etats-Unis (bandes rouges, blanches, fond bleu et étoiles blanches). • La casquette de base-ball, bowling • Le titre en anglais (non traduit) • lycée Columbine • Photo et nom de Michael Moore, célèbre réalisateur américain • Quille de bowling vu du dessus, référence au bowling. Jeu et sport pas uniquement américain, mais fortement répandu aux USA. • Signification : Tous les éléments répertoriés ci-dessus font référence aux Etats- Unis, où le baseball et le bowling sont des symboles/emblèmes de la culture américaine. Les USA sont le lieu de l’action du documentaire, mais ils sont également un acteur à part entière de ce documentaire. Le pays est clairement la cible visée par Michael Moore. En lisant l’affiche, le public perçoit rapidement qu’il va être question des USA.è Situer le contexte global.
M. Moore, Bowling For
ColumbineIsotopie de la violence
par arme
• La carabine dans les mains de Michael MOORE
• La cible rouge et blanche, formée par les bandes du drapeau
américain.
• Dans le titre, l’évocation de « Columbine » qui renvoie à la fusillade.
• La couleur orange : danger (+police locale)
• La couleur rouge peut aussi évoquer le sang des victimes par armes à
feu.
• Les 11 étoiles faisant référence aux 11 000 décès par armes à feu par an aux Etats-
Unis (cité dans le film, pas évident sur l’affiche… !).
• Signification :
La violence par arme à feu aux Etats-Unis est le sujet central du
documentaire comme peut le souligner la cible réalisée avec le
drapeau des USA. Il y a une volonté de dénoncer ce problème et de
mettre en avant les tristes conséquences qui en résultent : fusillades
dans des lieux publics, nombres de morts par armes à feu le plus
élevé du monde.
è Intriguer : pourquoi une arme et une caméra, sur ce décor
en fond ?M. Moore, Bowling For
ColumbineIsotopie de la vérité,
de la dénonciation
• La caméra (- carabine)
• « Cibler », mettre en lumière (éclairage, orange)
• La position de Michael Moore au centre de la cible
• Le personnage : journaliste, activiste
• Le sourire ironique
• Le titre à la manière d’une première de couverture de Newsweek.
• L’éclairage, l’ombre de la cible et des lettres.
• Signification
Dans son documentaire, Michael Moore veut rétablir sa vérité et
l ’ affiche traduit bien cette tonalité de dénonciation, armé de sa
caméra à l ’ épaule, il veut mettre en lumière (couleur orange,
éclairage) ce qui se passe dans son pays (sujet tabou).
è Moi, Michael Moore, je dénonce cette société américaine qui
rend possible cette violence gratuite.La mort… • Corps inerte, allongé sur une surface (?) • Bras le long du corps • Yeux fermés • Emballé dans du plastique, maintenu par du scotch noir • Eclairage • Mot “mort” • è Le sujet est grave, l’impact doit être fort. Jeu sur la relation (communauté) : ce mort, ça pourrait être toi • Veut être choquant pour mémorisation (fonction poétique).
Ministère des Affaires Sociales, de la Santé et de la Ville - 2007
La jeunesse • Typographie • Contenu texte : alcool pour “emballer” les filles. • “Y’a” pas mieux, syntaxe • Référence à la drague, à la fête, aux relations homme – femme (barbie…). • C’est une fille plutôt jeune étendue, visiblement morte. • è Cible principale : les jeunes, qui boivent en fête, et qui risquent de se tuer en voiture (slogan), fort pourcentage selon la prévention routière. • è Insiste sur l’identification.
Mise en scène • Logique par emboîtement : – Objet (affiche, page d'accueil) = Scénario – Scènes (S1, S2, …, Sn) = Univers sémantique (lieu où…) – Sous-Scènes (S1.1, S1.2, S2.1, S2.n…) • Arrière-scène (fond, décors…) • Avant-scène (scènes ou détails de scènes mis en avant)
S1 : Lieu de
Mise en scène, topographie
l’accroche,
où l'on plante
le décor.
Mots-clés. Style donne
l'ambiance.
Phatique +
métalinguistique.
S2.1 S2 : Lieu
de l’action, de la menace
Avant- ou de l’invitation.
Scène Accroche aussi.
Phat. + Poétique Ambiance
+ Expr ~~ étrange, inquiétante,
+ Conative + Réf violente, choquante…
Phatique, Poétique, Expr,
Conative, Référentielle
S2.2
S3 : Lieu du
destinateur. S'impli-
que dans son discours.
Arrière- Expressive
Scène
Phat. + Poétique
+ Conative + Réf
S4 : Lieu de la
profondeur, de l’intrigue.
Poétique
S5 : lieu du cartouche
Légal. Expr, RéfCahier des charges Des méthodes, pas des recettes !
Cahier des charges
communicationnel : méthode
1. Objet de communication
– De quel objet s’agit-il ?
– Quels sont ses objectifs et intentions de communication ?
– Schéma de R. Jakobson : décrire en répondant aux questions + préconisations
– Fonctions du langage : principale et secondaires
2. Ambiances (isotopies) : titre, indices, narration
3. Analyse structurelle : mise en scène et topographie
– Scènes : lieu où, lieu de…
– Sous-Scènes
– Avant Scène
– Arrière Scène
è Fonctions du langage dans ce scènes ? Rôle de chacun de ces éléments ?
4. Synthèse de recommandations, préconisationsDonc : des CMS !
• Du bidouillage à la modélisation
– le web statique a vite montré ses limites
– on veut faire "en ligne" ce qu'on fait habituellement
– et même plus !
– on "bidouille" des solutions personnelles par-ci par-là
– puis les informaticiens apportent la modélisation nécessaire (UML,
Merise…)
• CMS :
– système de gestion de contenu, ou SGC (en anglais Content Management
System ou CMS), logiciel de conception et de mise à jour dynamique de sites
Web.
Les CMS permettent :
– à plusieurs individus de travailler sur un même document ou sur un même site
(en gardant en général un historique du travail de chacun) ;
– d'organiser une chaîne de publication (workflow) avec différentes personnes qui
ont différents statuts (d'un droit de lecture à un droit de validation) ;
– de séparer les opérations de gestion de la forme et du contenu.
Source : définition dans Wikipédia de « système de gestion de contenu »Séparation forme et
contenu
• La « gestion de contenu » signifie que celui-ci est stocké dans une
base de données.
C'est le contenu des champs de la base qui est créé/modifié par le
rédacteur, et non pas la page elle-même.
On parle de site « dynamique ».
• La présentation est contenue dans un gabarit (« template ») qui
définit :
1. la mise en page des pages web - via le code html et les feuilles de styles (css),
2. les informations extraites de la base de données (et l'endroit où celles-ci doivent être
affichées dans la page et sous quelles conditions)
• Conséquence 1: Édition de page simplifiée
Les rédacteurs peuvent se concentrer sur le contenu. Saisir un article
est aussi simple que d'envoyer un mail. Des outils simplifiés aident à
mettre le texte en forme.
=> Tout le monde peut devenir rédacteur web, sans
aucune formation en informatique.Séparation forme et
contenu
• Conséquence 2 : les contenus sont structurés et gérés par
une base de données.
Les rubriques dépendent alors de l'administrateur de contenus,
des rédacteurs, et peuvent évoluer en fonction des besoins.
Les sauvegardes, déplacements, maintenances, sont faciles à
opérer sans aucune connaissance informatique.
• Conséquence 3 : on peut afficher sur son site des contenus
provenant d'autres sites (et exporter vers d'autres sites
ses propres contenus)
Ce mécanisme s'appelle la syndication de site et utilise les
fichiers RSS : on affiche sur un site A des articles provenant d'un
site B, avec la mise en page du site A.
L'affichage est tenu à jour en permanence et de façon
automatique.Site collaboratif/coopératif • Propose une administration de deux types : – Directe, dans l'interface grand public (en front office) – Spécialisée, par une interface spécifique (en back office) • Gère finement les utilisateurs par rôle (pas toujours très clair !) • CMS OpenSource, se complète par des composants externes (newsletter, documentation, forum, wiki…)
Quelques CMS • Spip (WebZine) • Lodel (revues.org) • Joomla (pro) • ezPublish (pro) • Drupal (pro) • WordPress (blog) • Wikis (divers) • Moodle (educ) • eGroupWare (pro) • Coospace (educ et pro) • Conftool (pro)
Bien rédiger pour le web ... et améliorer son
référencement naturel
Isabelle Canivet, Eyrolles, 2009
Une des références…
Ref : JC DomengetIntégrer les comportements de lecture Lecture par balayage des pages (en phase recherche) Lecture et action (en phase consommation)
Intégrer les comportements de recherche
Les requêtes dans les moteurs s'allongent
Etude Rankstat.com publiée en janvier 2007 sur la taille des requêtes saisies
par les internautes sur les moteurs de recherche :
– 1 seul mot : 13,48 %
– 2 mots : 28,38 %
– 3 mots : 27,15 %
– de 3 à 5 mots : 51,60 %
– de 4 à 10 mots : 30,98 %
– requête contenant plus d'un mot : 86,52 %Source de l'image : Chitika 2012 http://insights.chitika.com/2012/what%E2%80%99s-the-word-count-ask-com-sees-highest-word-count-per-search-across-engines/
3 règles de base • Résumé : réduire son texte de 50 % pour qu'il devienne facilement lisible à l'écran (on lit deux fois moins vite sur un écran que sur un support papier) • Restructurer : reconstruire son texte en faisant apparaître plusieurs niveaux de lectures (un court article central, une FAQ, un chiffre mis en exergue, etc.) • Réécrire : mettre en évidence certains éléments du texte en se servant du gras, de la ponctuation dynamique (points de suspension, point d'exclamation, etc).
Quelques règles :
Structuration
• Favoriser les parcours de lecture à 3 niveaux :
– Rapide, concise : résumés (information principale, rappel AFP à 50 mots titre
compris)
– Développement 1 : contenu développé mais non approfondi (article tenant max
en 3 pages écrans)
– Dossier de type synthèse : "lire la suite", structuration par étapes, max 3 * 3
pages écrans, donner document à télécharger
– Soigner le premier paragraphe (résumé, mots clés)
• Rédaction style journalistique
– Titre (compréhensible hors contexte, lien contenu)
– Accroche(s)
– Plan annoncé
– Intertitres : même assez longs
– Favoriser la lecture en diagonale (cursive)
– Illustration (rapport texte - image, statut) (cf. + loin)
– Textes en caractères et non en images
– Jouer avec le gras + italique (cf. moteurs de recherche)
– Pas de souligné, barré, ombré, etc.
– Utiliser des listes à puce, mais ne pas en abuser non plus
– Eviter l'abondance de majuscules, suivre les principes de rédactionLa règle d'or : mettre l'information la plus importante de votre page tout
en haut.
Elle permet de respecter la règle du balayage = manière dont nous
lisons à l'écran. En effet, la lecture à l'écran est plus difficile que sur
papier.
Il s'agit de placer
l'information
essentielle tout
en haut, afin
d'accrocher
l'intérêt du lecteur
= Technique de la
pyramide
inversée (Après
chapô. Point 1
plus important
que le 5).
Source : Fédéric RaussMécanismes de lecture et conséquences : • Le lecteur photographie des groupes de mots = conséquences : réduire la taille des mots le plus possible. + Il procède à la reconnaissance des mots (si échec = abandon de la lecture). • Pour faciliter la lecture à l'écran, le critère de lisibilité est essentiel (choix de la police, de la taille, des couleurs en comparaison de celle de la page). • De plus en plus d'internautes apprécient les textes bien écrits, organisés suivant une charte éditoriale claire. L'attente va vers des textes courts. Il est indispensable de découper les textes longs en plusieurs articles, rassemblés dans un dossier.
Quelques règles :
Abréviations
• Usuelles :
– Entendons par là les abréviations "que tout le monde connaît" parce qu'elles sont utilisées
dans tous les secteurs, dans tous types de textes, etc.
– Exemples: p. pour page, coll. pour collection, etc.
– Certaines prennent une ou plusieurs majuscules:
– M. Mme NB mais sprl, sa
– Elles ne prennent pas la marque du pluriel.
– Si l'abréviation est formée par suppression d'une partie d'un mot, elle prend un point.
– Exemples: M., ap. J.-C., arr. Exceptions: h, min, s, ex
– Si par contre l'abréviation est formée par condensation, il n'y a pas de point.
– Exemples: Mlle, Mgr, Me, Cie, Ets
• Non usuelles :
– Entendons par là les abréviations "que tout le monde ne connaît pas", par exemple parce
qu'elles se rapportent à une organisation, à une discipline, à un secteur, etc.
– La première fois qu'une abréviation non usuelle apparaît dans un document (ou dans une
page Internet), donner le terme en toutes lettres suivi de l'abréviation entre parenthèses.
– Ne pas insérer de points entre les lettres. Indiquer ces lettres en majuscules.
– Ex: Le Règlement Général sur la Protection du Travail (RGPT) est important. En effet, le RGPT
protège les travailleurs.
– Ne pas marquer le pluriel pour les abréviations, même anglaises: des DB, des SLA, etc.Illustrations et Liens
• Illustrations :
– légender ! c'est l'un des premiers éléments lus
– compréhensible hors contexte.
– représentative de l'illustration.
– Ne pas avoir peur de la faire assez longue et d'y inclure un appel à l'action
(fonction conative).
– Intégration différente pour fixes ou animées
– Statut de la vidéo et d'un diaporama est différent : temporalité "emprisonne"
l'internaute (voir multimédia)
• Liens hypertexte (pas un adjectif) :
– Insérer le lien dans une phrase normale (éviter les phrases ne servant que de
lien, type "cliquez ici"), de préférence au début ou à la fin de la phrase pour ne
pas rendre la lecture difficile.
– Le lien peut contenir plusieurs mots. Le plus important: en ne lisant que le lien
(sans les mots qui l'entourent), le lecteur doit avoir une idée précise de la
destination du lien.
– Si le lien ne dirige pas vers une page standard du site mais déclenche une action
(ouverture d'une nouvelle fenêtre, du client mail, lien externe, fichier pdf,
vidéo…), le lecteur doit en être averti soit textuellement soit par un icône.
– Respecter la mise en forme standard des liens : bleu souligné (et violet souligné
si déjà visité).Installation & Paramétrages
CMS : installation 1. Télécharger WordPress sur votre ordinateur https://fr.wordpress.org/ 2. Décompresser le fichier obtenu (en .zip) sur votre ordinateur 3. Connectez-vous en FTP à votre espace web, à l’aide du logiciel Filezilla (cf. paramètres donnés ensuite) 4. Déposez les fichiers de WordPress (tout le contenu du dossier décompressé) dans votre dossier sur le serveur 5. Munissez-vous des informations de connexion à la base de données (dia suivante) 6. Lancez l'installation concrète, cf. instructions ensuite
CMS : installation
• Déposez vos fichiers par ftp :
– Serveur FTP : ftp.cluster011.ovh.net
– login FTP : fonderiecs-G1 à fonderiecs-G10
– pwd : webGroupe1 à webGroupe10
– ATTENTION : de nombreuses erreurs COUPENT l’accès !
– Respectez bien les majuscules - minuscules
– VOTRE dossier : http://fonderie-infocom.net/webavance/gX/
• INSTALLATION :
Site WordPress dit :
« Lancer le script d'installation en ouvrant l'adresse de
WordPress dans votre navigateur Web préféré. Suivez les
instructions de l'installateur, et validez. »
http://fonderie-infocom.net/webavance/g1/
• ATTENTION Sous WORDPRESS :
– PENSEZ à MODIFIER le préfixe de la base de données en :
– wp-gX (X étant votre numéro de groupe !)Site : qqs principes • Templates – Design, aspects graphiques, mise en scène, mise en page – Outils disponibles : diapo, calendrier, fils twitter et fb… etc. – è Personnalisation +/- aisée • Modules – Liés aux templates – Suppose une conception avant de se lancer ! • Catégories – Pour ranger les articles, les organiser, les retrouver – Principe du blog : afficher tous les articles d'une catégorie par exemple • Articles – Toujours classés dans une catégorie – Donc faut avoir créé les catégories nécessaires avant… • Menus – Pour organiser l'accès aux diverses catégories (liaisons) – Dépendent aussi des templates donc è Conception !
Extensions - exemples
• Askimet = la base pré-installée, AntiSpam
• ContactForm 7 = comme son nom l’indique ;)
• NextGen Gallery = galeries photos
• Shareaholic = ajoute des boutons de partage (attention aux « Trusted 3rd
Party Data Services »)
• Custom Facebook Feed = fil FB
• Twitter feeds = display a Twitter search (or a Twitter hashtag) in your
sidebar
• UpdraftPlus = sauvegardes et restauration
• ExtraWatch FREE (Live Stats, Heatmap, Click tracking, Download Monitor
and more)
• Yoast SEO = guide le référencement naturel
• Google Analytics Dashboard for WPSite, attendus
• Liste des éléments demandés pour chaque site :
– Au moins 2 ou 3 articles ou pages par étudiant.e, identifié.e comme
tel.le (les groupes sont de 2 ou 3)
– Au moins 2 catégories
– Au moins 2 rubriques ou items de menu
• Pour chaque article :
– Méta-données présentes, ainsi que les info-bulles !
– Utilisation des formats de texte prévus pour les titres, intertitres,
sous-titres
– Des illustrations légendées dès que possible et à propos
– Des liens hypertexte
– Intégration de 1 vidéo au minimum (tendance montante)
– Intégration systématique des outils de partage (réseaux sociaux, à
choisir)
– Au moins un commentaire par catégorie
– Respect des règles d’écriture multimédia vues en cours (s’y
reporter)Dossier – rapport
• Adresse du site source, et du nouveau, avec un compte admin pour
moi (identifiant=cmasselo et password=HAL9000+!) afin que je
puisse voir les coulisses ;) ) [N’oubliez pas de mettre à jour thème et extensions
avant fermeture des accès !]
• Votre cahier des charges communicationnel complet, avec analyses et
préconisations (cf. méthode plus haut)
• Réalisation :
– Explication du choix – développement du thème – template, son adaptation
– Explication du choix des extensions diverses (plug-ins, composants etc)
– Explication de l’architecture : catégories, menus, navigation
• Tout commentaire qui vous semblera opportun ;/)Vous pouvez aussi lire
