Habillage du site et thèmes Drupal

Dimension: px
Commencer à balayer dès la page:

Download "Habillage du site et thèmes Drupal"

Transcription

1 9 Habillage du site et thèmes Drupal Travailler sur l interface d un site pour lui donner un caractère à la fois distinctif et attractif requiert non seulement un savoir-faire technique mais aussi, comme pour toute activité de conception graphique, une certaine créativité. Votre site est pour le moment fonctionnel, et son apparence est loin d être épouvantable : elle est certes quelconque, mais elle remplit son rôle. Avec un minimum d efforts, il n est pas inconcevable de créer quelque chose d entièrement nouveau, et Drupal est par ailleurs livré avec un grand nombre de fonctionnalités destinées à nous faciliter la vie. Si, comme moi, vous appréciez particulièrement de travailler sur les aspects plus créatifs de la mise en place d un site web, ce chapitre devrait vous combler! Il est temps maintenant de concevoir, planifier et mettre en œuvre l environnement visuel dans lequel seront immergés les utilisateurs. Ce chapitre abordera donc les sujets suivants : la conception d une interface web ; les feuilles de style CSS ; les thèmes. Lorsque vous concevez l interface de votre site, prenez le temps d étudier les sites web existants. Parmi toutes les difficultés auxquelles vous serez confronté durant votre processus de conception, bon nombre ont déjà pu être résolues avec succès par d autres (qui ne sont pas nécessairement des utilisateurs de Drupal). N ayez pas peur de considérer la conception de votre site comme un processus en évolution permanente : s il n est jamais bon de changer totalement l apparence de votre site à la moindre occasion, vous pouvez néanmoins la maintenir au goût du jour par des adaptations et remises à niveau régulières. Concevoir une interface web Le principe suivant lequel la forme s adapte à la fonctionnalité est largement appliqué dans de nombreuses sphères de la connaissance humaine. Ce concept signifie, à la base, que la manière de construire ou de fabriquer un objet doit refléter le but pour lequel celui-ci a été conçu. Il s agit de fait d une notion extrêmement sensée, et l appliquer à la conception graphique de votre site vous fournira une mesure de sa qualité. Ceci ne signifie pas pour autant que votre site doive ressembler à n importe quel autre site jouant un rôle comparable. De fait, vous devez chercher à rendre votre site aussi original que possible, sans toutefois dépasser les limites de ce que votre utilisateur cible considère comme le bon goût ou le bon sens.

2 292 Drupal 7 Comment y parvenir? L astuce consiste à mettre en regard les caractéristiques de votre site web et votre public cible. Si vous comptez proposer des contenus intéressant potentiellement les hommes aussi bien que les femmes, quels que soient leur âge, leur nationalité ou leur religion, vous devez naturellement opter pour une solution utilisable par n importe qui. Ceci peut toutefois conduire à un site relativement insipide, si vous cherchez à éviter de marginaliser un groupe d utilisateurs en favorisant explicitement un autre groupe. Néanmoins, vous avez de la chance dans une certaine mesure, car votre public cible sera légèrement plus simple à définir que cela : vous pourrez généralement envisager quelques concessions pour un type d utilisateur particulier. Conception visuelle Cela ne sert à rien de tourner autour du pot sur ce sujet. Vous devez rendre le site visuellement aussi simple que possible, sans pour autant cacher d informations critiques ou utiles : ne craignez pas de laisser de longues listes d éléments sur une page si toutes ces informations sont utiles et fréquemment utilisées. Cacher aux utilisateurs des détails importants (même s ils sont extrêmement simples à trouver sur d autres pages) les frustrera assurément, ce qui peut avoir des conséquences néfastes sur votre popularité. L apparence que vous donnerez à votre site peut également avoir un impact notable sur la manière dont les utilisateurs perçoivent son fonctionnement. Si, par exemple, vous utilisez plusieurs polices pour différents types de liens, certains utilisateurs n envisageront probablement pas de cliquer sur l un ou l autre des liens du fait des différentes variantes de styles. Prenez le temps d y réfléchir : vous imaginez-vous réellement passer la souris sur chacun des éléments du contenu pour déterminer s il s agit ou non d un lien? Nous pouvons donc résumer ce point selon l encadré suivant. Veillez à rendre votre site visuellement cohérent et à ce qu il n y ait pas de différence dans les styles utilisés d une page à l autre. Dans un autre registre, si vous êtes en train de lire une page de texte et si les liens apparaissent tous dans la même police que le texte, la fonctionnalité de lien hypertexte est totalement oblitérée. Il existe un nombre assez important de prétendues règles de conception graphique que vous pourriez appliquer à votre site. Parmi les plus connues, citons en particulier : la règle des tiers, selon laquelle une page structurée en trois parties (lignes ou colonnes) est plus agréable à l œil que toute autre organisation ; la règle du centre visuel, selon laquelle le cœur visuel d une page (c est-à-dire le point d attraction maximal du regard) se situe juste au-dessus et à droite du centre réel d une page.

3 Habillage du site et thèmes Drupal 293 Vous pouvez consulter le site web A List Apart 1 ( qui présente de nombreux articles intéressants sur la conception graphique pour le Web ; vous pouvez également rechercher des sites dignes d intérêt par le biais de Google. Rédaction Voici une étape fort intéressante de la conception de votre site web : l art d écrire pour le Web est bien plus subtil qu une simple description de ce que vous avez en tête. En effet, vous rédigez dans un objectif non seulement de consommation humaine mais aussi de traitement par des machines. Dans la mesure où un programme ne peut suivre qu un nombre limité de règles lorsqu il analyse une page, c est aux auteurs des textes d accepter des concessions au niveau du langage utilisé (si tant est qu ils souhaitent faire figurer leur site en bonne place dans les moteurs de recherche!). Avant de vous préoccuper de l optimisation de vos textes pour les moteurs de recherche, voici quelques points fondamentaux à prendre en considération. Pour commencer, veillez à utiliser un langage clair et concis : c est un point primordial! N hésitez pas à sacrifier vos effets de style si le texte peut gagner en clarté et mettre davantage en lumière vos idées. L attention que peuvent vous accorder vos lecteurs est en général de courte durée lorsqu il s agit de documents web ; vous devez donc rester aussi synthétique que possible. Outre la qualité de votre expression, l apparence visuelle et la structure de vos textes ont également leur importance. Utilisez des polices grasses ou plus grandes pour mettre en valeur les titres et les points essentiels. Veillez à aérer votre texte pour rendre la page plus agréable à l œil et, par conséquent, plus facile à lire et à comprendre. Images La gestion des images pour le Web, c est tout un art! Je ne veux pas dire par là qu il faille avoir des qualités artistiques pour réussir vos images ; j entends plutôt souligner l importance de la gestion des fichiers d images eux-mêmes. Pour tout aspirant webmaster, créer un environnement visuel à la fois agréable et cohérent demande un travail important. En effet, le Web est un environnement qui repose essentiellement sur l effet produit par les images sur les utilisateurs : la vue et l ouïe sont, pour le moment, les deux seuls sens touchés par Internet. Pour pouvoir manipuler en toute liberté les images nécessaires pour votre site, vous aurez besoin d un outil raisonnablement puissant. 1. NdT : le site A List Apart publie uniquement des articles anglophones, mais vous pouvez trouver des traductions en français de la plupart de ces articles sur

4 294 Drupal 7 Dans le cas présent, nous parlons des images faisant partie de l interface du site. En ce qui concerne les images qui font partie des contenus du site, Drupal 7 offre une prise en charge sophistiquée et exhaustive, comme nous l avons indiqué au Chapitre 7, "Multimédia". Gimp ( est un excellent exemple d environnement de manipulation d images, mais tout logiciel qui vous permettra d enregistrer des fichiers dans différents formats ou de redimensionner vos images devrait être largement suffisant. Lorsque l on travaille avec des images, il faut se pencher attentivement sur un certain nombre de problématiques pour produire un environnement graphique intégré et agréable : L un des principaux problèmes liés aux images est le volume qu elles représentent (tant au niveau du stockage que pour la bande passante du site), considérablement plus important que du code ou du texte. Pour cette raison, vous aurez besoin d une méthodologie efficace pour gérer les images en grand format. Par exemple, vous pouvez exploiter les CSS pour répéter une petite image d arrière-plan suivant les axes X ou Y, plutôt qu utiliser une image de grande taille. Décider du format d images que vous souhaitez utiliser parmi la multitude de formats graphiques disponibles peut également se révéler difficile : certains formats sont plus volumineux, d autres sont tout simplement impossibles à rendre correctement dans un navigateur. Les trois formats graphiques les plus répandus sont le GIF, le PNG et le JPG. L utilisation que vous prévoyez pour ces images peut également être un facteur important dans le choix de la taille ou du format du fichier. Ainsi, il est conseillé d enregistrer les icônes et les logos au format GIF ou PNG, tandis que le format JPG doit être réservé aux photographies et aux images complexes ou de grande taille, pour lesquelles il est plus efficace. Présentons rapidement ces formats graphiques. Le format GIF (Graphics Interchange Format) est connu pour ses taux de compression élevés et sa capacité à stocker et à afficher plusieurs images dans un même fichier pour produire les GIF animés. Son inconvénient principal est qu il ne peut afficher plus de 256 couleurs. Toutefois, vous pouvez faire appel au format GIF pour : les images à fond transparent ; les animations graphiques ; les images plus petites et moins complexes qui ne requièrent pas plus de 256 couleurs. Le format PNG (Portable Network Graphics) a été conçu pour remplacer les fichiers GIF. De façon générale, il permet d atteindre de meilleurs taux de compression, offre une plus grande profondeur de couleurs et présente également d autres avantages. Contrairement aux fichiers GIF, les fichiers PNG ne gèrent pas les animations. Vous pouvez opter pour le format PNG pour tout fichier susceptible d être au format GIF, à l exception des animations.

5 Habillage du site et thèmes Drupal 295 Internet Explorer ne parvient pas toujours à rendre correctement la transparence dans les images PNG ; vous devez donc être conscient que cela peut affecter l opinion que certains lecteurs se feront de votre site. Des ombres non prévues autour des images de votre site peuvent le faire paraître de piètre qualité. Ce problème peut, la plupart du temps, être résolu en supprimant les informations gama du fichier PNG, par exemple à l aide d un outil comme TweakPNG ( tweakpng/). Incidemment, il existe aussi un format MNG permettant de stocker des animations : si vous recherchez une solution alternative aux GIF animés, ce format mérite un détour. Le format JPEG (Joint Photographic Experts Group) est conseillé pour la présentation des images de qualité photographique. Il permet de compresser des images de grande taille tout en conservant la qualité générale de l image. Les fichiers JPEG peuvent utiliser un nombre virtuellement illimité de couleurs. Le format JPEG est conseillé pour : les photographies ; les images complexes ou de grande taille nécessitant plus de 256 couleurs pour s afficher correctement. Notez que le format JPG repose sur une compression avec perte : pour gérer efficacement les images, il y a donc perte de qualité au cours du processus de compression. Avant d étudier plus en détail les thèmes qui permettent de gérer quasiment tous les aspects relatifs à l apparence de votre site, nous devons encore parler d une dernière technologie vitale : les CSS. Si vous êtes déjà familiarisé avec les CSS, n hésitez pas à sauter cette section pour vous rendre directement à la section "Thèmes". CSS Les pages d un site Drupal récupèrent toutes les informations relatives à leur mise en forme dans les feuilles de style (on parle également de CSS ou Cascading Style Sheets) associées au thème et hébergées dans les répertoires respectifs des thèmes ou modules. L utilisation des feuilles de style offre aux graphistes un contrôle très fin sur l apparence des pages web et permet des effets intéressants. Grâce aux feuilles de style des thèmes, vous pouvez contrôler l apparence de chaque aspect du site (ou presque), et vous aurez seulement besoin de quelques connaissances sur les polices de caractères, les couleurs et la syntaxe des feuilles de style. Cela vous facilitera les choses de préparer une liste des éléments que vous devez modifier au moyen de la feuille de style. Voici les éléments les plus courants pour lesquels les feuilles de style peuvent être utilisées : fond ;

6 296 Drupal 7 texte ; polices ; couleurs ; images ; bordures ; marges ; espacement des bords (padding) ; listes. En plus de pouvoir modifier tous ces aspects du code HTML, vous pourrez également appliquer des effets en fonction de certaines conditions, par exemple le passage de la souris sur une zone spécifique (ce que nous expliquerons un peu plus loin). Vous pouvez aussi spécifier des attributs directement dans certaines balises HTML et ainsi appliquer un style à une balise particulière, plutôt que définir des modifications pour l intégralité du site. Si, par exemple, vous disposez d un style de paragraphe dont l attribut class a été défini comme ici : <p class="signature"></p> vous pouvez alors spécifier ce type de paragraphe explicitement dans votre feuille de style, par exemple pour définir sa couleur : p.signature { color: green; } L analyse de cette ligne met en lumière la structure d un bloc de code standard d une feuille de style, qui apparaît constitué : d un sélecteur, dans notre cas p.signature ; d une propriété, ici color ; d un délimiteur, qui est toujours le caractère ":" ; d une valeur, ici green. Notez que toutes les paires propriété/valeur sont encadrées par des accolades et se terminent par un point-virgule. Pour chaque sélecteur, on peut renseigner plusieurs propriétés, mais aussi utiliser les mêmes propriétés dans différents sélecteurs. Ainsi, le bloc suivant est extrait de la feuille de style style.css du thème Garland ; elle sert à définir pour tous les titres du thème une apparence semblable en leur donnant les mêmes propriétés : h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-weight: normal; font-family: Helvetica, Arial, sans-serif; }

7 Habillage du site et thèmes Drupal 297 Dans cet exemple, nous avons spécifié plusieurs sélecteurs sous la forme d une liste d éléments séparés par des virgules, chaque sélecteur se voyant attribuer quatre propriétés (respectivement margin, padding, font-weight et font-family) pour contrôler l apparence des titres. Il est important de réaliser que l on peut référencer les balises soit au moyen de l attribut class, soit avec l attribut id, soit avec les deux. Ainsi, le code HTML suivant : <p class="signature" id="unique-signature"></p> permet de référencer cette balise d une part comme appartenant à une classe de balises possédant toutes la même propriété, d autre part par son attribut unique id. La distinction entre ces deux notions est importante car la classe offre un pouvoir plus étendu sur l ensemble des balises qu elle comprend, tandis que l identifiant offre un contrôle fin sur la balise présentant l identifiant unique. Cette introduction aux CSS a été très rapide, mais il existe un grand nombre de ressources disponibles sur ce sujet. Si vous souhaitez approfondir le thème des CSS (et nous le recommandons chaudement), consultez l un des nombreux tutoriels (disponibles aussi bien en français qu en anglais) disponibles sur Internet. Une simple recherche Google sur le mot clé CSS devrait vous renvoyer vers de nombreuses sources pertinentes. Thèmes Les thèmes confèrent à Drupal une exceptionnelle souplesse dès lors qu il s agit de travailler sur l interface du site. Comme les fonctionnalités du site sont découplées de la présentation, il est très simple de modifier l apparence sans s inquiéter de causer des dommages aux fonctionnalités. C est naturellement une caractéristique très intéressante car elle vous donne toute liberté pour expérimenter, avec l assurance que, dans le pire des cas, vous pourrez réinitialiser l ensemble pour revenir aux paramètres par défaut. Vous pouvez voir un thème comme un modèle ou template pour votre site, que vous pouvez modifier pour qu il corresponde à n importe quel critère graphique. Bien sûr, les attributs varient grandement d un thème à l autre : il est donc important de commencer par trouver le thème le plus proche de ce que vous cherchez à accomplir, de manière à réduire la charge de travail requise pour le faire correspondre exactement au graphisme que vous envisagez. Il faut bien comprendre que tous les thèmes disponibles en téléchargement ne sont pas de qualité équivalente. Certains sont mieux conçus que d autres. Dans ce chapitre, nous utilisons le thème Zen, qui est l un des plus propres et flexibles qui soient.

8 298 Drupal 7 Notez que chaque thème possède sa propre implémentation. Certains utilisent des mises en page figées et à base de tableaux (qu il vaut mieux éviter : les interfaces de sites web ne doivent pas reposer sur des tableaux), d autres utilisent des balises div et des CSS (préférez ce type de thème, plus souple et plus puissant). Jouez avec plusieurs thèmes afin de vous familiariser avec différentes méthodes de création de pages web. Comme nous l avons mentionné, nous ne pouvons traiter ici que le thème Zen, mais les leçons que vous pourrez tirer de cet exemple seront faciles à transposer à d autres modèles. Avant de nous lancer dans l étude d un exemple effectif, il est essentiel d avoir un aperçu général de la construction des thèmes. Anatomie d un thème Les thèmes Drupal sont constitués d un ensemble de fichiers définissant et contrôlant les caractéristiques des pages du site (cela va des fonctionnalités à inclure à la page jusqu aux données individuelles à présenter sur la page), à l aide de code PHP, HTML, CSS et d images. Les différents fichiers templates Drupal 7 contrôlent diverses régions de la page, comme illustré à la Figure 9.1. Figure 9.1 Chaque fichier template contrôle une zone dans la page web. html.tpl.php page.tpl.php region.tpl.php region.tpl.php node.tpl.php region.tpl.php block.tpl.php comment-wrapper.tpl.php comment.tpl.php region.tpl.php

9 Habillage du site et thèmes Drupal 299 L organisation des fichiers d un thème au sein de Drupal nous fournit des indications sur le processus général et sur la structure de ce thème. Gardez à l esprit qu il existe différentes manières de créer un thème fonctionnel et que tous les thèmes ne reposent pas forcément sur des fichiers templates. Pour le thème Garland, qui fait partie des thèmes livrés en standard avec le cœur Drupal, nous observons l organisation illustrée à la Figure 9.2. Figure 9.2 Répertoire du thème Garland. La colonne de gauche nous montre les dossiers apparaissant dans le répertoire themes. On y trouve les thèmes standard fournis avec Drupal, ainsi qu un répertoire engines qui héberge un fichier phptemplate.engine intégrant les modèles au système de thèmes de Drupal. Étudiez les fichiers présents dans le répertoire garland : notez la présence d un certain nombre de fichiers PHPTemplate d extension.tpl.php. Ces fichiers utilisent du code HTML et PHP pour modifier l apparence de Drupal. Les versions par défaut de ces fichiers (utilisées par un thème ne possédant pas ses propres fichiers PHPTemplate) sont visibles dans le répertoire modules approprié. Ainsi, le fichier comment.tpl.php par défaut se trouve dans le répertoire modules/comment, tandis que le fichier page.tpl.php par défaut se trouve dans le répertoire modules/system, avec d autres fichiers encore. Chaque fichier template se focalise sur une page ou un élément de page spécifique. Le fichier template.php, quant à lui, permet de changer le comportement des templates et de contourner les fonctions non standard d un thème (c est-à-dire autres que les blocs, cases, commentaires, nœuds ou pages). Le répertoire des thèmes héberge également les feuilles de style, ainsi que les images et, pour le thème par défaut du moins, les couleurs. Les fichiers.info sont particulièrement intéressants : ils contiennent des informations sur le thème permettant à Drupal d identifier et de configurer un grand nombre de paramètres différents.

10 300 Drupal 7 Le fichier.info d un thème contient les informations de base relatives à un thème et nécessaires au bon fonctionnement de Drupal, à savoir : nom, description, fonctionnalités mises en œuvre, régions du template, fichiers CSS et JavaScript. Voici le contenu du fichier.info du thème Garland : ; $Id: garland.info,v /11/07 00:27:20 dries Exp $ name = Garland description = A multi-column theme which can be configured to modify colors and switch between fixed and fluid width layouts. package = Core version = VERSION core = 7.x stylesheets[all][] = style.css stylesheets[print][] = print.css settings[garland_width] = fluid ; Information added by drupal.org packaging script on version = "7.0" project = "drupal" datestamp = " " Notez que ce fichier contient, entre autres : name : nom du thème lisible pour une personne ; description : description du thème ; core : version majeure de Drupal avec laquelle ce thème est compatible ; stylesheets : stipule les feuilles de style à utiliser pour ce thème. Ce ne sont pas les seules informations susceptibles de figurer dans un fichier.info. Comme nous le verrons un peu plus loin, lorsque vous souhaitez intégrer des scripts à un thème vous pouvez les ajouter dans le fichier.info. Pour voir exactement comment les fichiers.info sont utilisés, observez le fichier.info correspondant au répertoire update_test_subtheme dans tests : ; $Id: update_test_subtheme.info,v /11/07 00:27:20 dries Exp $ name = Update test subtheme description = Test theme which uses update_test_basetheme as the base theme. core = 7.x base theme = update_test_basetheme hidden = TRUE ; Information added by drupal.org packaging script on version = "7.0" project = "drupal" datestamp = " " Remarquez que ce fichier contient une directive base theme utilisée pour spécifier le thème parent (ou thème de base).

11 Habillage du site et thèmes Drupal 301 Un sous-thème partage le code de son parent, mais en modifie certains éléments pour produire une nouvelle apparence, de nouvelles fonctionnalités, ou les deux à la fois. Drupal nous permet de mettre en place un nouveau sous-thème simplement en créant un nouveau répertoire dans le répertoire themes et en exploitant la directive base theme dans le fichier.info, comme nous venons de le voir. En bref, Drupal offre un éventail de fonctions standard permettant d exhiber les données sous-jacentes et de les présenter à l aide des thèmes. Les thèmes peuvent choisir les éléments de contenu qu ils souhaitent afficher ou non (la méthode la plus populaire reposant sur l utilisation des fichiers PHPTemplate conjointement aux feuilles de style et à un fichier.info). Il est facile de créer et de modifier des thèmes et sous-thèmes, à condition d avoir quelques connaissances en CSS et HTML (PHP peut vous aider à réaliser des opérations plus complexes). Il doit vous apparaître clairement maintenant que ce système facilite grandement la création d un nouveau thème à condition d avoir quelques connaissances en PHP. Voici le processus à suivre : 1. Créez un nouveau dossier themes dans le répertoire sites/all de votre installation ; dans ce dossier, ajoutez le répertoire destiné à héberger votre thème (vous pouvez lui donner le nom de votre choix, à condition qu il diffère des noms de thème existants). 2. Copiez les fichiers templates par défaut (ou les fichiers d un autre thème que vous souhaitez modifier) vers le dossier de thème que vous venez de créer, ainsi que tous les fichiers nécessaires (par exemple les fichiers CSS). 3. Modifiez le fichier.info afin de refléter les attributs et conditions de fonctionnement du nouveau thème ; en particulier, n oubliez pas la directive base theme. 4. Modifiez la présentation des pages (c est ici que vos connaissances en PHP et HTML seront utiles) et ajoutez votre touche personnelle par le biais de votre feuille de style (incluse dans le nouveau thème grâce au fichier.info). Avant de poursuivre, nous devons soulever une petite question pratique. Lorsque vous aborderez le développement des thèmes, vous devrez vous rappeler qu il existe de nombreux navigateurs web qui ne sont pas tous égaux devant les contenus. Cela signifie qu une page dont le rendu est réussi sur un navigateur peut avoir une allure épouvantable sur un autre ou, pire, ne pas fonctionner correctement. Pensez bien à toujours tester votre site avec différents navigateurs web!

12 302 Drupal 7 Le site d aide Drupal vous donne également sur les navigateurs un conseil intéressant à lire dans l astuce suivante. Il est recommandé d utiliser le navigateur Firefox et de lui adjoindre des extensions de développement web qui vous permettent d inspecter le contenu d une page HTML ainsi que des feuilles de style qui lui sont associées. J approuve vigoureusement. Vous pouvez télécharger le navigateur Firefox à l adresse Vous devriez par ailleurs en étendre les fonctionnalités avec Firebug, qui est un outil particulièrement intéressant pour le débogage de site web côté client ; vous le trouverez à l adresse Choisir un thème de base Comme nous l avons déjà mentionné, Drupal est livré avec un certain nombre de thèmes par défaut. Par ailleurs, la section Downloads du site Drupal en propose bien d autres encore. La Figure 9.3 illustre la page principale de gestion des thèmes, accessible depuis le menu Apparence de la barre d outils. Figure 9.3 Les thèmes par défaut livrés avec le cœur Drupal. Dès que vous ajoutez un thème à votre site, vous devez passer par cette page pour l activer, le désactiver, le configurer ou l établir comme thème par défaut.

13 Habillage du site et thèmes Drupal 303 Certains thèmes n implémentent pas nécessairement des fonctionnalités qui sont par ailleurs importantes pour votre site. Veillez à tester chaque thème de manière approfondie avant d autoriser des utilisateurs à les sélectionner. Si nous activons le thème Stark et que nous l établissons comme thème par défaut, le site (présenté jusqu à présent suivant le thème standard Bartik) prend l apparence visible à la Figure 9.4. Figure 9.4 Le thème Stark sur le site de démonstration. Voilà un changement plutôt important par rapport à l apparence précédente du site. Remarquez que l agencement global du site a été modifié lui aussi : les colonnes sont moins bien définies, il n y a plus d en-tête visible, etc. Par ailleurs, les polices et couleurs précédentes sont également passées à la trappe. Prenez le temps d étudier chacun des thèmes disponibles par défaut dans Drupal afin d avoir une idée précise des résultats très différents que peuvent avoir les divers thèmes. Toutefois, les thèmes ne s arrêtent pas là : le site de Drupal nous propose également un grand nombre de thèmes à explorer. Dirigez-vous donc vers la page correspondante, drupal.org/project/themes/, et filtrez les thèmes suivant votre version de Drupal pour obtenir la liste des thèmes adaptés à votre installation.

Formation Webmaster : Création de site Web Initiation + Approfondissement

Formation Webmaster : Création de site Web Initiation + Approfondissement Contactez notre équipe commerciale au 09.72.37.73.73 Aix en Provence - Bordeaux - Bruxelles - Geneve - Lille - Luxembourg - Lyon - Montpellier - Nantes - Nice - Paris - Rennes - Strasbourg - Toulouse Formation

Plus en détail

Adobe Photoshop. Bonnes pratiques pour une utilisation professionelle CHAPITRE 7

Adobe Photoshop. Bonnes pratiques pour une utilisation professionelle CHAPITRE 7 M2 Caweb 2014-2015 Enseignant : Boris Epp Adobe Photoshop Bonnes pratiques pour une utilisation professionelle CHAPITRE 7 Sommaire 1. Les scripts a. Qu est-ce qu un script? b. La fenêtre script c. Créer

Plus en détail

Les outils de création de sites web

Les outils de création de sites web Tuto 1ère séance - p1 Les outils de création de sites web Sources : Réalisez votre site web avec HTML5 et CSS3 de Mathieu Nebra (Edition Le Livre du Zéro) site fr.openclassrooms.com (anciennement «site

Plus en détail

Description des pratiques à adopter pour la mise à jour du layout en utilisant le gestionnaire de conception de Sharepoint 2013

Description des pratiques à adopter pour la mise à jour du layout en utilisant le gestionnaire de conception de Sharepoint 2013 Exemple d utilisation du gestionnaire de conception Description des pratiques à adopter pour la mise à jour du layout en utilisant le gestionnaire de conception de Sharepoint 2013 6, rue de l Etang, L-5326

Plus en détail

Tutoriel BLOGGER. Pour vous donner une idée, voici un exemple de blog : http://formationlaragne.blogspot.fr/

Tutoriel BLOGGER. Pour vous donner une idée, voici un exemple de blog : http://formationlaragne.blogspot.fr/ Tutoriel BLOGGER Blogger est un outil Google gratuit de publication de blogs qui permet de partager du texte, des photos et des vidéos. C est un outil simple, bénéficiant du référencement de Google, ce

Plus en détail

Drupal Développeur. Theming et développement pour Drupal. Une formation T@hitiClic. Formateur : Fabien Crépin. Drupal Développeur.

Drupal Développeur. Theming et développement pour Drupal. Une formation T@hitiClic. Formateur : Fabien Crépin. Drupal Développeur. Theming et développement pour Drupal Une formation Formateur : Fabien Crépin Introduction Objectif : savoir développer un module et un thème 4 demi-journées Ce qu'on verra en théorie et en pratique : Environnement

Plus en détail

INTRODUCTION AU CMS MODX

INTRODUCTION AU CMS MODX INTRODUCTION AU CMS MODX Introduction 1. Créer 2. Organiser 3. Personnaliser UNE PETITE INTRODUCTION QUEST-CE QU UN CMS? CMS est l acronyme de Content Management System. C est outil qui vous permet de

Plus en détail

CRÉER, ROUTER ET GÉRER UNE NEWSLETTER, UN E-MAILING

CRÉER, ROUTER ET GÉRER UNE NEWSLETTER, UN E-MAILING CRÉER, ROUTER ET GÉRER UNE NEWSLETTER, UN E-MAILING Durée : 3J / 21H Formateur : Consultant expert en PAO et Web-marketing. Groupe de : 4 max Formation au web marketing Objectifs : Mettre en oeuvre des

Plus en détail

.. CSS. Damien Nouvel. Damien Nouvel (Inalco) CSS 1 / 15

.. CSS. Damien Nouvel. Damien Nouvel (Inalco) CSS 1 / 15 .. CSS Damien Nouvel Damien Nouvel (Inalco) CSS 1 / 15 Feuilles de styles Plan 1. Feuilles de styles 2. Sélecteurs 3. Attributs Damien Nouvel (Inalco) CSS 2 / 15 Feuilles de styles Déportation des styles

Plus en détail

Dans l Unité 3, nous avons parlé de la

Dans l Unité 3, nous avons parlé de la 11.0 Pour commencer Dans l Unité 3, nous avons parlé de la manière dont les designs sont créés dans des programmes graphiques tels que Photoshop sont plus semblables à des aperçus de ce qui va venir, n

Plus en détail

Administration du site (Back Office)

Administration du site (Back Office) Administration du site (Back Office) A quoi sert une interface d'administration? Une interface d'administration est une composante essentielle de l'infrastructure d'un site internet. Il s'agit d'une interface

Plus en détail

Le logiciel de création de site internet IZISPOT est un outil très puissant et qui est assez simple après quelques temps d utilisation.

Le logiciel de création de site internet IZISPOT est un outil très puissant et qui est assez simple après quelques temps d utilisation. 1 Le logiciel de création de site internet IZISPOT est un outil très puissant et qui est assez simple après quelques temps d utilisation. Voici un mode opératoire qui vous guidera dans l utilisation de

Plus en détail

Introduction aux concepts d ez Publish

Introduction aux concepts d ez Publish Introduction aux concepts d ez Publish Tutoriel rédigé par Bergfrid Skaara. Traduit de l Anglais par Benjamin Lemoine Mercredi 30 Janvier 2008 Sommaire Concepts d ez Publish... 3 Système de Gestion de

Plus en détail

LANGAGUE JAVA. Public Développeurs souhaitant étendre leur panel de langages de programmation

LANGAGUE JAVA. Public Développeurs souhaitant étendre leur panel de langages de programmation ING 01 LANGAGUE JAVA Durée : 21 heures 1090 HT / jour Dates : à définir en 2012 Concevoir et développer des programmes en langage Java Comprendre le fonctionnement de la machine virtuelle S approprier

Plus en détail

Créer un site WordPress

Créer un site WordPress Utilisation pédagogique d une solution de gestion de contenu Créer un site WordPress Portfolio, Blog, plateforme,... Les blogs et les plateformes d enseignants sont un moyen de poursuivre la relation élèveenseignant

Plus en détail

PHP 5.4 Développez un site web dynamique et interactif

PHP 5.4 Développez un site web dynamique et interactif Editions ENI PHP 5.4 Développez un site web dynamique et interactif Collection Ressources Informatiques Table des matières Table des matières 1 Chapitre 1 Introduction 1. Objectif de l'ouvrage.............................................

Plus en détail

GUIDE Excel (version débutante) Version 2013

GUIDE Excel (version débutante) Version 2013 Table des matières GUIDE Excel (version débutante) Version 2013 1. Créer un nouveau document Excel... 3 2. Modifier un document Excel... 3 3. La fenêtre Excel... 4 4. Les rubans... 4 5. Saisir du texte

Plus en détail

Initiation à html et à la création d'un site web

Initiation à html et à la création d'un site web Initiation à html et à la création d'un site web Introduction : Concevoir un site web consiste à définir : - l'emplacement où ce site sera hébergé - à qui ce site s'adresse - le design des pages qui le

Plus en détail

HMTL. Exemple de fichier HTML. Structure d un document HTML. Exemple de fichier HTML. Balises HTML. IFT1147 Programmation Serveur Web avec PHP

HMTL. Exemple de fichier HTML. Structure d un document HTML. Exemple de fichier HTML. Balises HTML. IFT1147 Programmation Serveur Web avec PHP IFT1147 Programmation Serveur Web avec PHP Un bref survol du langage HTML HMTL HTML: Hypertext Markup Language HTML est essentiellement un langage de description de structure de document (par exemple titre,

Plus en détail

Utiliser un CMS: Wordpress

Utiliser un CMS: Wordpress Utiliser un CMS: Wordpress Annie Danzart Annie.Danzart@telecom-paristech.fr Wordpress Concevoir un site web statique Concevoir un site web dynamique Choisir un hébergement Choix du CMS Wordpress: installation

Plus en détail

Optimiser pour les appareils mobiles

Optimiser pour les appareils mobiles chapitre 6 Optimiser pour les appareils mobiles 6.1 Créer un site adapté aux terminaux mobiles avec jquery Mobile... 217 6.2 Transformer son site mobile en application native grâce à PhoneGap:Build...

Plus en détail

JOOMLA 1.5 avancé SUPPORT DE COURS + annexe

JOOMLA 1.5 avancé SUPPORT DE COURS + annexe JOOMLA 1.5 avancé SUPPORT DE COURS + annexe SOMMAIRE 1. LA GESTION DES MODULES... Page 2 2. MODIFICATION DE SON TEMPLATE... Page 6 3. LA CREATION DE DIAPORAMA... Page 9 4. LA CREATION DE SONDAGE... Page

Plus en détail

LES GRANDES ETAPES DE CREATION D UN WEB DESIGN

LES GRANDES ETAPES DE CREATION D UN WEB DESIGN LES GRANDES ETAPES DE CREATION D UN WEB DESIGN PENSER LA STRUCTURE ET LE THEME DU SITE STRUCTURE ET THEME DU SITE Taille (le site sera-t-il extensible ou fixe?) Organisation Thème Couleurs Illustrations

Plus en détail

Sage 100 CRM - Guide de la Fusion Avancée Version 8. Mise à jour : 2015 version 8

Sage 100 CRM - Guide de la Fusion Avancée Version 8. Mise à jour : 2015 version 8 Sage 100 CRM - Guide de la Fusion Avancée Version 8 Mise à jour : 2015 version 8 Composition du progiciel Votre progiciel est composé d un boîtier de rangement comprenant : le cédérom sur lequel est enregistré

Plus en détail

WordPress : principes et fonctionnement

WordPress : principes et fonctionnement CHAPITRE 1 WordPress : principes et fonctionnement WordPress est à l origine un outil conçu pour tenir un blog, c est-à-dire un journal ou carnet de bord en ligne. Mais il a évolué pour devenir un système

Plus en détail

Freeway 7. Nouvelles fonctionnalités

Freeway 7. Nouvelles fonctionnalités ! Freeway 7 Nouvelles fonctionnalités À propos de ce guide... 3 Nouvelles fonctionnalités en un coup d'oeil... 3 À propos de la conception d'un site web réactif... 3 Travailler avec les pages pour créer

Plus en détail

Guide de réalisation d une campagne e-mail marketing

Guide de réalisation d une campagne e-mail marketing Guide de réalisation d une campagne e-mail marketing L ère des envois d e-mails en masse est révolue! Laissant la place à une technique d e-mail marketing ciblé, personnalisé, segmenté et pertinent. La

Plus en détail

Chapitre 22 Optimisation pour diffusion à l'écran, pour le web

Chapitre 22 Optimisation pour diffusion à l'écran, pour le web 1 1 9 9 7 7 Optimisation pour diffusion à l'écran, pour le web Diffusion pour le web........................ 31 Les paramètres avant l exportation................. 31 Optimisation pour le web......................

Plus en détail

Spip 2. Premiers pas pour créer son site web. Anne-Laure Quatravaux Dominique Quatravaux. Avec la contribution de Sandrine Burriel

Spip 2. Premiers pas pour créer son site web. Anne-Laure Quatravaux Dominique Quatravaux. Avec la contribution de Sandrine Burriel Anne-Laure Quatravaux Dominique Quatravaux Spip 2 Premiers pas pour créer son site web Avec la contribution de Sandrine Burriel Groupe Eyrolles, 2009, ISBN : 978-2-212-12502-3 Pourquoi choisir Spip? Vous

Plus en détail

SOUTENANCE ORALE RAPPORT DE PROJET D INFORMATIQUE

SOUTENANCE ORALE RAPPORT DE PROJET D INFORMATIQUE SOUTENANCE ORALE RAPPORT DE PROJET D INFORMATIQUE SITE INTERNET DE L ASSOCIATION Diapositive 1 RAPPORT DE PROJET Site internet de l association INTRODUCTION 1) Je m appelle Léonard STRONG. 2) Oral de présentation

Plus en détail

Cahier n o 6. Mon ordinateur. Fichiers et dossiers Sauvegarde et classement

Cahier n o 6. Mon ordinateur. Fichiers et dossiers Sauvegarde et classement Cahier n o 6 Mon ordinateur Fichiers et dossiers Sauvegarde et classement ISBN : 978-2-922881-10-3 2 Table des matières Fichiers et dossiers Sauvegarde et classement La sauvegarde 4 Enregistrer 4 De quelle

Plus en détail

TP 5 Les CMS, la forme et le fond Internet et Outils (IO2)

TP 5 Les CMS, la forme et le fond Internet et Outils (IO2) TP 5 Les CMS, la forme et le fond Internet et Outils (IO2) Un site, tel que vous avez appris à en programmer jusqu à maintenant, contenant un ensemble de pages HTML embellies de quelques feuilles de styles,

Plus en détail

Paiement sécurisé sur Internet. Tableau de bord Commerçant

Paiement sécurisé sur Internet. Tableau de bord Commerçant Paiement sécurisé sur Internet Tableau de bord Commerçant SOMMAIRE 1 Principe 4 1.1 Principe général 4 1.2 Environnement de validation 4 1.3 Environnement de Production 4 2 Accès au tableau de bord 5 2.1

Plus en détail

Création de maquette web

Création de maquette web Création de maquette web avec Fireworks Il faut travailler en 72dpi et en pixels, en RVB Fireworks étant un logiciel dédié à la création de maquettes pour le web il ne propose que les pixels pour le texte

Plus en détail

Introduction à HTML5, CSS3 et au responsive web design

Introduction à HTML5, CSS3 et au responsive web design 1 Introduction à HTML5, CSS3 et au responsive web design Jusqu à une période récente, les sites web étaient conçus avec une largeur fixe de l ordre de 960 pixels, en espérant que les visiteurs en tirent

Plus en détail

Chapitre 3 : outil «Documents»

Chapitre 3 : outil «Documents» Chapitre 3 : outil «Documents» L outil «Documents» fonctionne comme le gestionnaire de fichiers de votre ordinateur. Vous pouvez y transférer des documents de tous types (html, Word, Powerpoint, Excel,

Plus en détail

Introduction à Expression Web 2

Introduction à Expression Web 2 Introduction à Expression Web 2 Définitions Expression Web 2 est l éditeur HTML de Microsoft qui répond aux standard dew3c. Lorsque vous démarrez le logiciel Expression Web 2, vous avez le choix de créer

Plus en détail

KompoZer. Composition du site : _ une page d'accueil : index.html. _ une page pour la théorie : theorie.html. _ une page pour les photos : photos.

KompoZer. Composition du site : _ une page d'accueil : index.html. _ une page pour la théorie : theorie.html. _ une page pour les photos : photos. KompoZer Créer un site «simple» Composition du site : _ une page d'accueil : index.html _ une page pour la théorie : theorie.html _ une page pour les photos : photos.html _ une page avec la galerie : galerie.html

Plus en détail

Magento. Magento. Réussir son site e-commerce. Réussir son site e-commerce BLANCHARD. Préface de Sébastien L e p e r s

Magento. Magento. Réussir son site e-commerce. Réussir son site e-commerce BLANCHARD. Préface de Sébastien L e p e r s Mickaël Mickaël BLANCHARD BLANCHARD Préface de Sébastien L e p e r s Magento Préface de Sébastien L e p e r s Magento Réussir son site e-commerce Réussir son site e-commerce Groupe Eyrolles, 2010, ISBN

Plus en détail

Comment utiliser FileMaker Pro avec Microsoft Office

Comment utiliser FileMaker Pro avec Microsoft Office Guide d utilisation Comment utiliser FileMaker Pro avec Microsoft Office Comment utiliser FileMaker Pro et Microsoft Office page 1 Table des matières Introduction... 3 Avant de commencer... 4 Partage de

Plus en détail

145A, avenue de Port Royal, Bonaventure (Québec) G0C 1E0 Sans frais : 1 888 765 4636 www.solutioninfomedia.com

145A, avenue de Port Royal, Bonaventure (Québec) G0C 1E0 Sans frais : 1 888 765 4636 www.solutioninfomedia.com Guide de l utilisateur CMS 1 Navigation dans le CMS... 2 1.1 Menu principal... 2 1.2 Modules tableau... 3 1.3 Modules formulaire... 5 1.4 Navigation dans le site Web en mode édition... 6 2 Utilisation

Plus en détail

Rédiger pour le web. Objet : Quelques conseils pour faciliter la rédaction de contenu à diffusion web

Rédiger pour le web. Objet : Quelques conseils pour faciliter la rédaction de contenu à diffusion web Rédiger pour le web Objet : Quelques conseils pour faciliter la rédaction de contenu à diffusion web Sommaire 1. Rédiger des contenus... 2 Lire à l écran : une lecture contraignante... 2 Ecrire des phrases

Plus en détail

ContactForm et ContactFormLight - Gestionnaires de formulaire pour Prestashop Edité par ARETMIC S.A.

ContactForm et ContactFormLight - Gestionnaires de formulaire pour Prestashop Edité par ARETMIC S.A. ContactForm et ContactFormLight - Gestionnaires de formulaire pour Prestashop Edité par ARETMIC S.A. - 1 - PREAMBULE Les conditions générales d utilisation détaillant l ensemble des dispositions applicables

Plus en détail

Notes pour l utilisation d Expression Web

Notes pour l utilisation d Expression Web EICW Formation Webmaster Notes pour l utilisation d Expression Web G. Barmarin 2008-2009 1 /21 Table des matières 1 Introduction... 3 2 Installer Expression Web... 4 3 Explorer et personnaliser l interface

Plus en détail

Intégrateur Web HTML5 CSS3

Intégrateur Web HTML5 CSS3 Intégrateur Web HTML5 CSS3 L objectif de la 3W Academy est de former des petits groupes d élèves à l intégration de sites internet ainsi qu à la création d applications web simples telles qu un blog ou

Plus en détail

Création d un site Internet

Création d un site Internet Création d un site Internet Weebly.com Johanne Raymond Collège Lionel Groulx, mai 2010 Service du soutien à l enseignement et Plan de réussite Ouvrir un compte sur Weebly... 1 Modifier le modèle... 2 Ajouter

Plus en détail

Tutoriel. Votre site web en 30 minutes

Tutoriel. Votre site web en 30 minutes Tutoriel Votre site web en 30 minutes But du tutoriel Nous allons vous présenter comment réaliser rapidement votre site avec Web Creator Pro 6 en vous basant sur l utilisation des modèles fournis avec

Plus en détail

1.1 Des concepts et termes techniques à maîtriser... 20 1.2 La formule magique du référencement... 34 1.3 Tricher ou non en référencement... 35 1.

1.1 Des concepts et termes techniques à maîtriser... 20 1.2 La formule magique du référencement... 34 1.3 Tricher ou non en référencement... 35 1. 1 1.1 Des concepts et termes techniques à maîtriser... 20 1.2 La formule magique du référencement... 34 1.3 Tricher ou non en référencement... 35 1.4 Résumé de ce chapitre... 40 Optimiser des pages pour

Plus en détail

creer votre site internet en html/css

creer votre site internet en html/css 3 jours (21 heures) 1110 HT (Inter) 2670 HT (Intra) Toute personne (particulier ou professionnel) souhaitant créer son site Internet Créez son site Internet Assurez sa mise en ligne Gérer les mises à jour

Plus en détail

Tutoriel : Feuille de style externe

Tutoriel : Feuille de style externe Tutoriel : Feuille de style externe Vous travaillerez à partir du fichier cerise.htm que vous ouvrirez dans NVU. Commencez par remplacer le contenu de la balise Title par : Comment débuter une recherche?

Plus en détail

Bureautique Initiation Excel-Powerpoint

Bureautique Initiation Excel-Powerpoint Module de Formation Personnalisée : Bureautique Initiation Excel-Powerpoint Durée : jours ouvrables Prix : Formation personnalisée en vue d obtenir les notions de base indispensables pour : Excel Office

Plus en détail

Sommaire : Pourquoi créer un site web? Qu est-ce qu un site Web? Les différents types de sites. Quelles solutions peuvent être employées?

Sommaire : Pourquoi créer un site web? Qu est-ce qu un site Web? Les différents types de sites. Quelles solutions peuvent être employées? Sommaire : Pourquoi créer un site web? Qu est-ce qu un site Web? Les différents types de sites Quelles solutions peuvent être employées? Présentation d une des solutions Conclusion Aujourd hui le web est

Plus en détail

Agence Web innovatrice

Agence Web innovatrice QUI SOMMES NOUS? 02 n o v a t i s La théorie c est quand on comprend tout et que rien ne marche La pratique c est quand tout marche mais on ne sait pas pourquoi! Chez Novatis, nous avons réussi les deux...

Plus en détail

Tutoriaux : Faites vos premiers pas avec Microsoft Visio 2010

Tutoriaux : Faites vos premiers pas avec Microsoft Visio 2010 Tutoriaux : Faites vos premiers pas avec Microsoft Visio 2010 Les tutoriaux suivants vous guident dans l utilisation de Visio 2010. Certaines vidéos sont disponibles sur le site. Tutoriaux : Faites vos

Plus en détail

novatis Agence Web innovatrice

novatis Agence Web innovatrice QUI SOMMES NOUS? 02 novatis La théorie c est quand on comprend tout et que rien ne marche La pratique c est quand tout marche mais on ne sait pas pourquoi! Chez Novatis, nous avons réussi les deux... tout

Plus en détail

Création WEB avec DreamweaverMX

Création WEB avec DreamweaverMX Creation Web avec DreamweaverMX MX Initiation Sommaire.preparation.mise en forme.liens hypertextes.images.liens sur images.images avec zones sensibles.images survolees.liens de type courriel.apercu dans

Plus en détail

Un site web collaboratif avec Drupal. Judith Hannoun - Journées INSHS 16 Octobre 2012

Un site web collaboratif avec Drupal. Judith Hannoun - Journées INSHS 16 Octobre 2012 Un site web collaboratif avec Drupal Judith Hannoun - Journées INSHS 16 Octobre 2012 Site web Ensemble de pages en html Des liens hypertextes Une base de données si site dynamique Une interface graphique

Plus en détail

DÉFINITION DE LA NEWSLETTER : OUVERTURE DU LOGITIEL ETARGET

DÉFINITION DE LA NEWSLETTER : OUVERTURE DU LOGITIEL ETARGET DÉFINITION DE LA NEWSLETTER : La newsletter est un OUVERTURE document qui DU informe LOGITIEL le ETARGET client sur l'actualité, sur les nouveautés ou sur un sujet particulier. Elle est souvent rédigée

Plus en détail

Comment créer des rapports de test professionnels sous LabVIEW? NIDays 2002

Comment créer des rapports de test professionnels sous LabVIEW? NIDays 2002 Comment créer des rapports de test professionnels sous LabVIEW? NIDays 2002 De nombreux utilisateurs rencontrant l équipe de National Instruments nous demandent comment générer un rapport complet à partir

Plus en détail

Manuel d'utilisation du site Deptinfo (Mise en route)

Manuel d'utilisation du site Deptinfo (Mise en route) Manuel d'utilisation du site Deptinfo (Mise en route) 1)Nouveautés apportées par le nouveau site...2 2) Accès à l espace privé... 3 a) Accès... 3 b) Identification... 3 c)page d accueil de l espace privé...4

Plus en détail

HTML, CSS, JS et CGI. Elanore Elessar Dimar

HTML, CSS, JS et CGI. Elanore Elessar Dimar HTML, CSS, JS et CGI Elanore Elessar Dimar Viamen GPAs Formation, 13 avril 2006 Sommaire Qu est-ce que HTML? HTML : HyperText Marckup Language XML : extensible Marckup Language Qu est-ce que HTML? HTML

Plus en détail

Découvrir OpenOffice Comment optimiser et formater votre ebook avec OpenOffice

Découvrir OpenOffice Comment optimiser et formater votre ebook avec OpenOffice Comment optimiser et formater votre ebook avec OpenOffice Le blog : http://www.vendre-sur-kindle.com 1 Découvrir OpenOffice : comment optimiser et formater votre ebook avec OpenOffice 2013 Le blog : http://www.vendre-sur-kindle.com

Plus en détail

www.myfourchette.com

www.myfourchette.com Centralisez vos réservations - Fidélisez vos clients - Boostez votre chiffre d affaires www.myfourchette.com Pour toutes questions, nos équipes se tiennent à votre disposition 01 83 77 71 77 ou support@lafourchette.com

Plus en détail

Créer un site Internet dynamique

Créer un site Internet dynamique Créer un site Internet dynamique avec SPIP (version 3) Document de référence Denise St-Pierre animatrice au service local du Récit 1. Qu est-ce que SPIP?... 3 2. Caractéristiques de SPIP... 3 3. Quelques

Plus en détail

SITE I NTERNET. Conception d un site Web

SITE I NTERNET. Conception d un site Web SITE I NTERNET Conception d un site Web Conception de votre site Web Préambule Ce document a pour but de donner une méthode de travail afin de réaliser dans les meilleures conditions un site internet.

Plus en détail

Édu-groupe - Version 4.3

Édu-groupe - Version 4.3 Édu-groupe - Version 4.3 Guide de l utilisateur Gestion des fichiers Société GRICS, Équipe Évaluation Août 2012 2 CONSIDÉRATIONS GÉNÉRALES A. Importante mise en garde concernant les types de fureteur Les

Plus en détail

Dans cette Unité, nous allons examiner

Dans cette Unité, nous allons examiner 13.0 Introduction Dans cette Unité, nous allons examiner les fonctionnements internes d une des plateformes de publication web les plus largement utilisées de nos jours sur l Internet, WordPress. C est

Plus en détail

Votre site Internet avec FrontPage Express en 1 heure chrono

Votre site Internet avec FrontPage Express en 1 heure chrono 1.1. Précautions préliminaires Votre site Internet avec FrontPage Express en 1 heure chrono Le contenu de ce site n'est pas très élaboré mais il est conçu uniquement dans un but pédagogique. Pour débuter,

Plus en détail

Initiation à linfographie

Initiation à linfographie Ce support de cours de l Agence universitaire de la Francophonie est distribué sous licence GNU FDL. Permission vous est donnée de copier, distribuer et/ou modifier ce document selon les termes de la Licence

Plus en détail

www.imprimermonlivre.com

www.imprimermonlivre.com 0 www.imprimermonlivre.com Composition d une couverture avec Word L objectif de ce guide est de vous proposer un mode opératoire pour créer une couverture avec Word. Nous vous rappelons toutefois que Word

Plus en détail

Cahier des charges pour la création du site http://jrmasters.univ-toulouse.fr sous DRUPAL

Cahier des charges pour la création du site http://jrmasters.univ-toulouse.fr sous DRUPAL Document à diffusion restreinte Date : janvier 2010, MAJ février 2010 Rédacteurs : CAPLAN Emmanuelle, RAFENOMANJATO Jean Service Communication et Département Formation et Vie Étudiante Établissement :

Plus en détail

Travaux dirigés n 10

Travaux dirigés n 10 Travaux dirigés n 10 IMAC 1 Responsive Web Design Dans ce TD, vous verrez comment concevoir un design web qui s adaptera au terminal sur lequel il sera visualisé. Avant-propos Avec l avènement des smartphones

Plus en détail

Utilisation de l éditeur.

Utilisation de l éditeur. Utilisation de l éditeur. Préambule...2 Configuration du navigateur...3 Débloquez les pop-up...5 Mise en évidence du texte...6 Mise en évidence du texte...6 Mise en page du texte...7 Utilisation de tableaux....7

Plus en détail

MODE D'EMPLOI DU CONTRIBUTEUR WEB UAPV "CONTRIBUER DANS UNE RUBRIQUE DU SITE WEB"

MODE D'EMPLOI DU CONTRIBUTEUR WEB UAPV CONTRIBUER DANS UNE RUBRIQUE DU SITE WEB MODE D'EMPLOI DU CONTRIBUTEUR WEB UAPV "CONTRIBUER DANS UNE RUBRIQUE DU SITE WEB" Quelques conseils pour bien contribuer 1 Paramétrer votre navigateur web 2 Accéder au module de gestion des pages web 2

Plus en détail

EXTENSION WORDPRESS. Contact Form 7. Proposé par :

EXTENSION WORDPRESS. Contact Form 7. Proposé par : Contact Form 7 Proposé par : Sommaire Sommaire... 2 Présentation... 3 I. Le Tutoriel... 3 1) Espace de travail... 3 2) Téléchargez les extensions nécessaires... 3 3) Configuration du Formulaire... 7 1)

Plus en détail

Optimiser les e-mails marketing Les points essentiels

Optimiser les e-mails marketing Les points essentiels Optimiser les e-mails marketing Les points essentiels Sommaire Une des clés de succès d un email marketing est la façon dont il est créé puis intégré en HTML, de telle sorte qu il puisse être routé correctement

Plus en détail

CMS Open Source : état de l'art et méthodologie de choix

CMS Open Source : état de l'art et méthodologie de choix CMS Open Source : état de l'art et méthodologie de choix Définition d'un CMS (wikipedia) Les CMS sont une famille de logiciel de conception et de mise à jour dynamique de sites web partageant les fonctionnalités

Plus en détail

ENVOYER DES NEWSLETTER (POM0580) (/PORTAIL/SERVICES-AU-PUBLIC/1262- ENVOYER-DES-NEWSLETTER-POM0580)

ENVOYER DES NEWSLETTER (POM0580) (/PORTAIL/SERVICES-AU-PUBLIC/1262- ENVOYER-DES-NEWSLETTER-POM0580) 1 sur 7 12/05/2014 15:39 ENVOYER DES NEWSLETTER (POM0580) (/PORTAIL/SERVICES-AU-PUBLIC/1262- ENVOYER-DES-NEWSLETTER-POM0580) Catégorie : Services au public (/portail/services-au-public) Mis à jour le vendredi

Plus en détail

INTERNET est un RESEAU D ORDINATEURS RELIES ENTRE EUX A L ECHELLE PLANETAIRE. Internet : interconnexion de réseaux (anglais : net = réseau)

INTERNET est un RESEAU D ORDINATEURS RELIES ENTRE EUX A L ECHELLE PLANETAIRE. Internet : interconnexion de réseaux (anglais : net = réseau) CS WEB Ch 1 Introduction I. INTRODUCTION... 1 A. INTERNET INTERCONNEXION DE RESEAUX... 1 B. LE «WEB» LA TOILE, INTERCONNEXION DE SITES WEB... 2 C. L URL : LOCALISER DES RESSOURCES SUR L INTERNET... 2 D.

Plus en détail

LE CONCEPT DU CMS CHAPITRE 1

LE CONCEPT DU CMS CHAPITRE 1 CHAPITRE 1 LE CONCEPT DU CMS Techniques traditionnelles de construction de sites... 14 Les principes des CMS... 18 Le langage HTML... 26 Check-list... 41 11 Même s il est d usage de comparer Internet

Plus en détail

<Créer un site Web. avec/> Suzanne Harvey

<Créer un site Web. avec/> Suzanne Harvey aire l o c s texte n o c le Dans Suzanne Harvey Conseillère pédagogique en informatique Service local du RÉCIT Commission scolaire de Saint-Hyacinthe Québec, Canada suzanne.harvey@prologue.qc.ca

Plus en détail

Licence de Biologie, 1ère année. Aide. [Aide 1] Comment utiliser l'explorateur Windows? Comment créer des dossiers?

Licence de Biologie, 1ère année. Aide. [Aide 1] Comment utiliser l'explorateur Windows? Comment créer des dossiers? Aide [Aide 1] Comment utiliser l'explorateur Windows? Comment créer des dossiers? Au sein d'un ordinateur, les données et les fichiers sont stockés suivant une structure d'arbre appelée arborescence. Pour

Plus en détail

Fiches d aide à l utilisation

Fiches d aide à l utilisation alece.amd92.fr Un service proposé et géré par Liste des fiches d aide Fiche A. Se connecter à la plateforme... p. 3 Fiche B. Obtenir un code d accès pour la plateforme... p. 4 Fiche C. Rechercher des informations

Plus en détail

SOMMAIRE 1 INTRODUCTION 4 2 GUIDE D UTILISATION ET TUTORIAUX VIDEOS EN LIGNE 4 3 CONTACTER VOTRE SUPPORT 4 4 RACCOURCIS CLAVIER 5

SOMMAIRE 1 INTRODUCTION 4 2 GUIDE D UTILISATION ET TUTORIAUX VIDEOS EN LIGNE 4 3 CONTACTER VOTRE SUPPORT 4 4 RACCOURCIS CLAVIER 5 SOMMAIRE 1 INTRODUCTION 4 2 GUIDE D UTILISATION ET TUTORIAUX VIDEOS EN LIGNE 4 3 CONTACTER VOTRE SUPPORT 4 4 RACCOURCIS CLAVIER 5 5 ADMINISTRER SON SITE WEBGAZELLE CMS 2.0 5 5.1 Configuration minimale

Plus en détail

Base de Connaissances SiteAudit. Utiliser les Rapports Planifiés. Sommaire des Fonctionnalités. Les Nouveautés

Base de Connaissances SiteAudit. Utiliser les Rapports Planifiés. Sommaire des Fonctionnalités. Les Nouveautés Base de Connaissances SiteAudit Utiliser les Rapports Planifiés Avril 2010 Dans cet article: Sommaire des fonctionnalités Les nouveautés Planifier des rapports SiteAudit 4.0 fournit une nouvelle interface

Plus en détail

Normes techniques 2011

Normes techniques 2011 Normes techniques 2011 Display classique Formats Livrables Footer p 2 p 3 p 4 Opérations spéciales Publi-rédactionnel Jeu concours Quiz Lien partenaire Habillage Accueil panoramique Sponsoring de rubrique

Plus en détail

WORDPRESS : réaliser un site web

WORDPRESS : réaliser un site web WORDPRESS : réaliser un site web Wordpress est un système de gestion de contenu (ou CMS) libre. Il permet de créer des sites relativement complexes (blog, forum, site vitrine, site dynamique), sans qu

Plus en détail

Stage «Créer et animer un site Web en équipe»

Stage «Créer et animer un site Web en équipe» Stage «Créer et animer un site Web en équipe» EREA Jean Isoard - Montgeron Jour 1 21/12/2012 Réaliser un site web Pour quoi faire? Publier sur le Web réaliser un journal en ligne (blog) écrire une ou plusieurs

Plus en détail

Comment formater votre ebook avec Open Office

Comment formater votre ebook avec Open Office Comment formater votre ebook avec Open Office 1 2012 Nicolas Boussion Tous droits réservés. Important : ce livre numérique, comme toute œuvre de l'esprit, fait l'objet de droits d'auteur. Son contenu a

Plus en détail

OFFRE DE SERVICE. www.votreentreprise.com

OFFRE DE SERVICE. www.votreentreprise.com 2011 NOM ENTREPRISE OFFRE DE SERVICE CONCEPTION, REALISATION ET HEBERGEMENT SITE WEB www.votreentreprise.com AFConsulting Web Services Page 1 sur 19 SOMMAIRE Lettre, offre de services --------------------------------------------

Plus en détail

Préparation d un post (article) pour idweblogs

Préparation d un post (article) pour idweblogs Préparation d un post (article) pour idweblogs 30/09/2013 Préparation des documents... 2 Le texte... 2 Les images... 2 Les vidéos... 3 Transmission des documents à idweblogs... 4 Par mail... 4 Via notre

Plus en détail

Formation tableur niveau 1 (Excel 2013)

Formation tableur niveau 1 (Excel 2013) Formation tableur niveau 1 (Excel 2013) L objectif général de cette formation est de repérer les différents éléments de la fenêtre Excel, de réaliser et de mettre en forme un tableau simple en utilisant

Plus en détail

Guide d utilisation 2012

Guide d utilisation 2012 Guide d utilisation 2012 Tout ce dont vous avez besoin pour bien démarrer REACOM La performance marketing SOMMAIRE Démarrez avec reagiciel Accédez à votre console d administration 4 Gestion internet Aperçu

Plus en détail

Avant-propos FICHES PRATIQUES EXERCICES DE PRISE EN MAIN CAS PRATIQUES

Avant-propos FICHES PRATIQUES EXERCICES DE PRISE EN MAIN CAS PRATIQUES Avant-propos Conçu par des pédagogues expérimentés, son originalité est d être à la fois un manuel de formation et un manuel de référence complet présentant les bonnes pratiques d utilisation. FICHES PRATIQUES

Plus en détail

Ouvrir le compte UQÀM

Ouvrir le compte UQÀM Cliquez sur le titre pour visionner 1 Cliquez sur le titre pour visionner 2! Préliminaires! Ouvrir le compte UQÀM! Accéder au compte UQÀM! Paramètres de configuration! Les dossiers! Gérer les dossiers!

Plus en détail

Groupe Eyrolles, 2006, pour la présente édition, ISBN : 2-212-11782-5

Groupe Eyrolles, 2006, pour la présente édition, ISBN : 2-212-11782-5 Groupe Eyrolles, 2006, pour la présente édition, ISBN : 2-212-11782-5 Table des matières Chapitre A : Principes de base des scripts... 1 Élaboration de votre premier script... 1 Importance du modèle...

Plus en détail

Manuel d utilisation de l outil collaboratif

Manuel d utilisation de l outil collaboratif Manuel d utilisation de l outil collaboratif Réf OCPD-V2 Page 1 / 24 a mis en œuvre un outil collaboratif qui permet de partager des informations entre collaborateurs. Il permet à des utilisateurs travaillant

Plus en détail