Les standards du web

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

Download "Les standards du web"

Transcription

1 COURS - Partie 1 Le HTML5 et le CSS3, petits frères du HTML (ou XHTML) et du CSS viennent, alors que l ère actuelle est à l interconnexion et aux média multiples. Dans le but de satisfaire la demande grandissante des utilisateurs en terme de fonctionnalités web et mobile, l HTML5 apporte des solutions aux développeurs afin que ceux-ci puissent créer plus rapidement et facilement de nouvelles solutions multi-support. Afin de mieux comprendre le langage HTML5 et le CSS3, essayons, tout d abord, de comprendre le fonctionnement d une page web. La page web est un assemblage de textes, d images, d objets multimédia et de fichiers. Afin de mettre en forme tout cela, on utilise des langages de programmation. Ces langages ne sont pas visibles (bien que pouvant être affichés, pour les petits curieux). Ils sont comme le moteur d une voiture, en arrière-plan, ils font fonctionner le site web On peut diviser en 2 catégories les langages de programmation utilisés, les standards du web et les langages propriétaires. Nous nous attarderons que sur une seule catégorie : (Le JavaScript, nous ne nous attarderons pas dessus, comprenez simplement qu il gère, entre autre, les boutons et les champs de texte ) Les standards du web L HTML : le code HTML, il définit tous les éléments de la page, indique où les trouver et décrit la façon dont ils s agencent les uns par rapport aux autres. Il détermine la structure de la page web. C est en quelque sorte le squelette. La feuille de style CSS : cascading style sheets ou feuilles de style en cascade. C est un document définissant le visuel rendu à l écran de chaque élément : polices, web, couleurs, emplacement, dimensions

2 COURS - Partie 2 Ces langages présentés, sont dit «basique», ils sont supportés par tous les navigateurs et sont, bien évidemment, libres de droits Les normes de ces langages sont régis par des organismes comme le W3C et L ECMA. Ces langages sont interprétés par les navigateurs web, ceux que vous utilisez tous les jours pour vous rendre sur vos sites favoris. Le navigateur web est un logiciel capable de lire l HTML et la feuille de style CSS pour afficher tous les éléments du site web sur votre écran. Les principaux navigateurs sont : Internet Explorer, Firefox, Google Chrome, Safari, Opera... Et le HTML5 dans tous ça? Sous cette appelation, sont regroupées les nouvelles fonctionnalités de l HTML. Ces nouvelles fonctionnalités permettent de reproduire très simplement des fonctionnalités qui étaient jusqu à présent assurées par des langages propriétaires comme le Flash. En résumé, L HTML5 permet : d intégrer des vidéos, des pistes audio sur un page web mais aussi d intégrer des animations et des éléments dynamiques 2d/3d sans utiliser Flash. Plus besoin d applications tierce pour se rendre sur youtube par exemple! Il est également possible de créer des jeux entièrement en HTML5. Il est donc plus optimisé et plus pratique. Qu en est-il du CSS? En résumé : la structure des balises utilisées est plus simple. Il y a une amélioration des possibilités graphiques. Tout est plus compact, l intégrations d images vectorielles est plus simple. ces nouveautés offrent de nombreuses possibilités de mise en page et une expérience utilisateur qui s en voit enrichie.

3 COURS - Partie 3 Le HTML, dans les grandes lignes : Les éléments sont délimités par des balises. On place une balise de début avant le contenu de l élément et une balise de fin après. Mais dans certains cas, la balise de fin n est pas nécessaire. Une balise est formée en encadrant le nom de l élément avec les symboles < et > (soit <element> où element est le nom de l élément). Pour une balise de fin on ajoute le caractère / avant le nom de l élément (soit </element>. exemple d une structure en html de base : Le CSS, dans les grandes lignes : Dans un code CSS, on trouve trois éléments différents : Des noms de balises : on écrit les noms des balises dont on veut modifier l apparence. Par exemple, si je veux modifier l apparence de tous les paragraphes <p>, je dois écrire p. Des propriétés CSS : les «effets de style» de la page sont rangés dans des propriétés. Il y a par exemple la propriété color qui permet d indiquer la couleur du texte, font-size qui permet d indiquer la taille du texte, etc. Il y a beaucoup de propriétés CSS... Les valeurs : pour chaque propriété CSS, on doit indiquer une valeur. Par exemple, pour la propriété color, il faut indiquer le nom de la couleur. Pour font-size, il faut indiquer quelle taille on veut, etc. exemple d un code CSS :

4 Dans ce tutoriel, nous allons créer une bannière publicitaire destinée au web. Pour ce faire nous utiliserons Photoshop cs6 et Dreamweaver cs6. Nous créerons une bannières aux dimensions standards de 804px par 80px. Créer un nouveau document : CTRN+N J ouvre cette image de nourriture dans photoshop, vous pouvez la télécharger à ce lien : hpics.li/3ae19db à l aide de l outil lasso polygonal, je sélectionne le fruit ou le légume qui m intéteresse. Je copie la sélection : CTRL+C.

5 Je reviens sur mon document, je colle ma sélection : CTRL+V. J efface le blanc se trouvant autour en le sélectionnant avec l outil baguette magique (W) et en le supprimant en appuyant sur la touche SUPR de mon clavier. J effectue cette même étape pour les autres éléments à importer sur la bannière. J intègre mon texte. Ici j utilise la police museo disponnible à cette adresse : com/museo.html J effectue un clic droit sur mon calque d arrière plan et me rend dans les options de fusion. Je créer un dégradé de telle sorte :

6 Notre bannière est terminé, je me rend dans : fichier > enregistrer pour le web et les périphérique et enregistre en PNG-8 avec ces paramètres : Maintenant passons sur Dreamweaver pour la création du code.

7 Je créer un nouveau document HTML, menu > fichier > nouveau. Je configure la fenêtre comme ceci et valide. Je veille à bien être dans l onglet design avant d importer mon image. J intègre la bannière web : menu>insérer>image. Je choisis la bannière préalablement enregistré. Une fenêtre s ouvre, j insère un texte qui défini le nom de l image.

8 La bannière s affiche ainsi dans le logiciel. Application - Création d une bannière web En me rendant dans l onglet code, je constate que le code s est généré de lui même. Se rendre dans : menu>fichier>enregistrer-sous, enregistrer dans un fichier html.

9 Mon document s affiche alors de cette manière dans mon dossier, le fichier s allie avec onnavigateur par défault, dans cet exemple google chrome. Maintenant sous Indesign Créer un document avec les mêmes dimensions en pixels. Je place les visuels et les textes. J exporte la bannière en HTML en me rendant dans menu>fichier>exporter. Tout valider. Je peut l ouvrir dans mon navigateur et me servir du fichier pour de futures pages web!

PAGE 1. L écran du logiciel NVU. Barre de menu: Les commandes du logiciel

PAGE 1. L écran du logiciel NVU. Barre de menu: Les commandes du logiciel PAGE L écran du logiciel NVU Nom du document : Nom d enregistrement Barre de mise forme: Texte, couleurs, fond,... Barre de menu: Les commandes du logiciel Barre d outils: Les boutons de commande Gestionnaire

Plus en détail

Initiation à Internet

Initiation à Internet Internet Initiation à Internet INFORMATIQUE >> Internet A l issue de ce stage, les stagiaires seront capables de naviguer sur des sites internet. Ils connaîtront le vocabulaire relatif à l utilisation

Plus en détail

Apprendre à travailler avec des calques dans un logiciel de graphisme fait gagner beaucoup de temps et d'énergie.

Apprendre à travailler avec des calques dans un logiciel de graphisme fait gagner beaucoup de temps et d'énergie. calques W utilisation des calques dans 7 Apprendre à travailler avec des calques dans un logiciel de graphisme fait gagner beaucoup de temps et d'énergie. 1 PhotoFiltre7 permet de travailler avec des calques

Plus en détail

Initiation à POWERPOINT

Initiation à POWERPOINT Initiation à POWERPOINT Apprenez à : - Composer des diaporamas - Gérer des effets de transitions - Insérer différents médias (images, sons et vidéos) Partie 1 : Composition 1. Interface Nouvelle page Mise

Plus en détail

Mise en Forme avec CSS

Mise en Forme avec CSS Mise en Forme avec CSS Une feuille de style permet de définir la police, la taille, le style (gras, italique, souligné) la couleur du texte, des liens etc. A peu près tout ce qui concerne la présentation

Plus en détail

Éditeur Moodle. L'éditeur de Moodle se présente de la façon suivante : Vous y retrouverez les icônes traditionnelles d'un éditeur de texte.

Éditeur Moodle. L'éditeur de Moodle se présente de la façon suivante : Vous y retrouverez les icônes traditionnelles d'un éditeur de texte. Éditeur Moodle Ce tutoriel décrit comment utiliser l'éditeur de Moodle, que vous allez retrouver dans la plupart des activités et des ressources de la plateforme. L'éditeur de Moodle se présente de la

Plus en détail

Sommaire. 1 Créer un premier site Élaborer un contenu...69

Sommaire. 1 Créer un premier site Élaborer un contenu...69 Partie 1 Votre site web personnel...25 1 Créer un premier site...27 1.1 Installer le serveur web personnel de Microsoft...29 1.2 Créer un nouveau site web...31 1.3 Découvrir et personnaliser l environnement

Plus en détail

Faire des zones sensibles dans une image : image mappée

Faire des zones sensibles dans une image : image mappée Insérer une image Avec l ADSL la vitesse de transfert s est considérablement améliorée et l utilisation des images, des animations et du son a littéralement explosé. Malgré tout, les utilisateurs ne doivent

Plus en détail

Faire sa BD. Vous obtiendrez alors cette fenêtre, choisissez alors partir de zéro. Fermez la fenêtre suivante ensuite en cliquant sur la croix

Faire sa BD. Vous obtiendrez alors cette fenêtre, choisissez alors partir de zéro. Fermez la fenêtre suivante ensuite en cliquant sur la croix Cet atelier a pour but de vous faire réaliser une BD à partir d éléments existants (personnages, décors). Il ne s agit pas de dessiner des personnages mais plus d inventer votre propre histoire. Etape

Plus en détail

Table des matières 1. Editions ENI - Toute reproduction interdite

Table des matières 1. Editions ENI - Toute reproduction interdite Table des matières 1 Introduction L'Internet aujourd'hui...7 Le World Wide Web Consortium et les standards...7 Les logiciels de conception de sites web...7 L'objectif du livre...8 Interface de conception

Plus en détail

INITIATION A UN LOGICIEL DE PHOTOGRAPHIES

INITIATION A UN LOGICIEL DE PHOTOGRAPHIES INITIATION A UN LOGICIEL DE PHOTOGRAPHIES - Maîtriser ce logiciel de gestion de vos clichés - Maîtriser ce logiciel de gestion de photographies PICASA SOMMAIRE : I DIFFUSER DES IMAGES ET DES PHOTOGRAPHIES...

Plus en détail

Traitement de photos (Photoshop 7) Par : Patrick Kenny

Traitement de photos (Photoshop 7) Par : Patrick Kenny Traitement de photos (Photoshop 7) Par : Patrick Kenny 23 mars 2005 Table des matières Création d un nouveau document :... 3 Activer les barres d outils :... 4 Barre d outils :... 5-10 Redimensionner une

Plus en détail

Adobe Photoshop. Bonnes pratiques pour une utilisation professionelle CHAPITRE 1

Adobe Photoshop. Bonnes pratiques pour une utilisation professionelle CHAPITRE 1 M2 Caweb 2014-2015 Enseignant : Boris Epp Adobe Photoshop Bonnes pratiques pour une utilisation professionelle CHAPITRE 1 Sommaire 1. Organisation et nommage des fichiers a. Organiser ses dossiers b. Nommer

Plus en détail

Liste de formations informatiques l a c a s t i n e

Liste de formations informatiques l a c a s t i n e Liste de formations informatiques l a c a s t i n e Toutes les formations ont lieu à la castine, sur des horaires et dates définis avec les participants (principalement des débuts de soirée). Pour participer

Plus en détail

Manipuler une vidéo. 5. Utiliser Windows Movie maker

Manipuler une vidéo. 5. Utiliser Windows Movie maker Manipuler une vidéo 1. Capturer une vidéo de YouTube à l aide de Download helper 2. Capturer le son d une vidéo YouTube 3. Capturer une vidéo de la tnt 4. Utiliser format factory 5. Utiliser Windows Movie

Plus en détail

Réussir. avec XHTML et CSS. 3e édition. son site web. Nebra. Mathieu. Préface de Laurent Denis

Réussir. avec XHTML et CSS. 3e édition. son site web. Nebra. Mathieu. Préface de Laurent Denis Mathieu Nebra Réussir son site web avec XHTML et CSS 3e édition Préface de Laurent Denis Groupe Eyrolles, 2006, 2008, 2010, ISBN : 978-2-212-12485-9 Table des matières 1. UN SITE WEB, COMMENT ÇA MARCHE?...

Plus en détail

Classes : PREMIERES A-C-D

Classes : PREMIERES A-C-D LYCEE SECOND CYCLE DEPARTEMENT D'INFORMATIQUE Année scolaire 2011-2012 Classes : PREMIERES A-C-D Horaire hebdomadaire : 2 heures PRÉ REQUIS Connaissances de la Classe de 2 nde Savoir lire le français ou

Plus en détail

télécharger un fond d'écran

télécharger un fond d'écran Page 1 / 7 Connaître sa résolution d écran Avant toutes choses, il vous faut connaître votre résolution d écran. La résolution ou définition d'écran représente le nombre de points ou pixels que votre écran

Plus en détail

Programme Formation WebDesign

Programme Formation WebDesign Programme Formation WebDesign Objectif : Connaître les règles et les techniques de création d'une charte graphique. Savoir utiliser une charte graphique pour le développement web. Compétences visées :

Plus en détail

Guide d utilisation. Version 0715

Guide d utilisation. Version 0715 Guide d utilisation Version 0715 SOMMAIRE PRINCIPALES FONCTIONNALITÉS Résumé... p. 3 ACTUALITÉS gestion / création des actualités... p. 4 PAGES / RUBRIQUES Créer une page... p.5 Intégrer du contenu...p.6-9

Plus en détail

CRÉER, PRODUIRE, TRAITER, EXPLOITER DES DONNÉES : dia

CRÉER, PRODUIRE, TRAITER, EXPLOITER DES DONNÉES : dia CRÉER, PRODUIRE, TRAITER, EXPLOITER DES DONNÉES : dia Organiser la composition du document, prévoir sa présentation en fonction de sa destination Saisir et mettre en page un texte Traiter une image, un

Plus en détail

Starter Kit. KompoZer. Apprenez, pratiquez, créez

Starter Kit. KompoZer. Apprenez, pratiquez, créez Starter Kit KompoZer Apprenez, pratiquez, créez PARTIE 1 Découvrir Kompozer CHAPITRE 4 Mes premières pages web La publication sur le Web possède ses propres techniques. Une page d un site n est pas une

Plus en détail

Windows 7 / 8 / 8.1 / 10 Net Framework 4.0 ou plus Microsoft Media Player 10.0 ou plus Flash Player 10 ou plus Microsoft Office 2007 ou plus

Windows 7 / 8 / 8.1 / 10 Net Framework 4.0 ou plus Microsoft Media Player 10.0 ou plus Flash Player 10 ou plus Microsoft Office 2007 ou plus Guide de l utilisateur Table des matières 1 Fonctionnalités principales : barre d outils 2 Menu principal : fichiers et paramètres 3 Fenêtre Outils 4 Fonctionnalités avancées 4 Menu Formes et reconnaissance

Plus en détail

Réaliser une carte de voeux GIMP

Réaliser une carte de voeux GIMP Réaliser une carte de voeux GIMP I - IMPORTER ET PERSONNALISER UNE PHOTOGRAPHIE... 2 1.1 - Ouvrir la photographie... 2 1.2 - Choisir les couleurs... 2 1.3 - Ajouter un calque... 2 1.4 - Ajuster le filtre

Plus en détail

On le retrouve dans plusieurs modules tels que le courrier, le forum, l agenda, les tâches, les communiqués et plus particulièrement dans Édu-Notes.

On le retrouve dans plusieurs modules tels que le courrier, le forum, l agenda, les tâches, les communiqués et plus particulièrement dans Édu-Notes. 154 L éditeur de texte L ÉDITEUR DE TEXTE L éditeur de texte du portail est une application destinée à créer et modifier des textes pour créer des documents HTML. L éditeur de texte possède certaines fonctions

Plus en détail

STUDIO - TI6 TABLE DES MATIÈRES. NOUVELLE MATIÈRE (suite) 9. Intégration du logo. Sujet. HTML - CSS révisions - suite.

STUDIO - TI6 TABLE DES MATIÈRES. NOUVELLE MATIÈRE (suite) 9. Intégration du logo. Sujet. HTML - CSS révisions - suite. STUDIO - TI6 PASCAL PLACEMAN Sujet HTML - CSS révisions - suite TABLE DES MATIÈRES Nouvelle matière: 9. Intégration du logo 10. Un titre devant la vidéo 11. Utiliser des polices typographiques grâce à

Plus en détail

Atelier du 25 et 26 avril 2014 Mozilla firefox : présentation, fonction, atouts MOZILLA FIREFOX

Atelier du 25 et 26 avril 2014 Mozilla firefox : présentation, fonction, atouts MOZILLA FIREFOX MOZILLA FIREFOX C est quoi? C est un navigateur internet qui : Permet de bloquer des fenêtres publicitaires Propose une protection contre les invasions (spywares) Permet une navigation par onglet Permet

Plus en détail

COURS DE PROGRAMMATION DE SITE WEB 1

COURS DE PROGRAMMATION DE SITE WEB 1 COURS DE PROGRAMMATION DE SITE WEB 1 Chapitre 1 Les bases PLAN DU COURS 1.1 L histoire du WEB 1.2 Du HTML au XHTML et le CSS 1.3 Définition (HTML, XTML, CSS, ASP, PHP, FLASH, CGI, PEARL) 1.4 Les éditeurs

Plus en détail

Création d'un site Web avec KompoZer

Création d'un site Web avec KompoZer Création d'un site Web avec KompoZer Table des matières 1Rudiments sur le langage HTML.1 1.1Structure d'une page web :.1 1.2Le langage des pages Web.2 2Préparation du site web..2 3Utilisation d'une feuille

Plus en détail

Izinoa / octobre

Izinoa / octobre Connexion à Izinoa Fonctionnement de l arborescence Gestion d une page Edition Création Suppression Les éléments de page Texte simple Texte avec mise en page Image Date Lien Mot clés Spécification des

Plus en détail

UTILISER MCK3. - Utilisez les boutons à gauche pour ajouter des objets sur la page. (Voir Chap. III)

UTILISER MCK3. - Utilisez les boutons à gauche pour ajouter des objets sur la page. (Voir Chap. III) UTILISER MCK3 1.C Pour bien commencer Après avoir installé et démarré MCK, vous pouvez créer un nouveau projet. 1 Cliquez sur " Créer un nouveau projet ". 2 Après avoir donné un nom à votre projet, vous

Plus en détail

CHARGÉE DE COURS : N. VANASSCHE

CHARGÉE DE COURS : N. VANASSCHE CHARGÉE DE COURS : N. VANASSCHE WWW.NATHALIEVANASSCHE.BE DE NOMBREUSES PERSONNES CONFONDENT (À TORT) INTERNET ET LE WEB. le Web fait partie d'internet. Internet est donc un grand ensemble qui comprend,

Plus en détail

Créer un bouton pour le Web

Créer un bouton pour le Web Lorsqu'un internaute place le pointeur de sa souris sur un dessin dans une page Web, ce pointeur entre physiquement dans la zone de l'écran occupée par le graphique. L'internaute peut alors soit cliquer

Plus en détail

Chapitre 1 Découvrir PowerPoint

Chapitre 1 Découvrir PowerPoint Chapitre 1 Découvrir PowerPoint 2010 13 1.1. Qu est-ce que PowerPoint?... 15 1.2. Lancer PowerPoint... 15 1.3. Découvrir l interface... 15 La fenêtre PowerPoint... 15 Le Ruban... 16 La barre d outils Accès

Plus en détail

Diaporama. Préparation de la mise en forme du diaporama

Diaporama. Préparation de la mise en forme du diaporama Diaporama M. PERES LEBLANC Recueil des données Le préalable à la création d un diaporama est de choisir une thématique et de recueillir des données en notant les sources et en les vérifiant (croiser les

Plus en détail

Grille d évaluation d un site web

Grille d évaluation d un site web Grille d évaluation d un site web Mayoukou Jordan Teixeira Jérémy Nom du site : URL du site : Description : Type d ordinateur : PC Mac Navigateur utilisé : Internet Explorer Mozilla FireFox Chrome Safari

Plus en détail

Bonnes pratiques du Webdesign

Bonnes pratiques du Webdesign Bonnes pratiques du Webdesign Rencontre Tisserands 17 mars 2012 Aldric de Villartay Présentation Aldric de Villartay Responsable des développements web à la CEF depuis le 1 er mars. Membre de Technologiae

Plus en détail

Réussir son site web avec XHTML et CSS

Réussir son site web avec XHTML et CSS Leçon 06 Réussir son site web avec XHTML et CSS CSS, le langage de mise en page du Web 1. Insérer du code CSS...1 Dans un fichier.css...1 Dans l en-tête du fichier XHTML...3 2. Appliquer un style à des

Plus en détail

Table des matières. Microsoft PowerPoint. Présentation de la nouvelle interface (1)

Table des matières. Microsoft PowerPoint. Présentation de la nouvelle interface (1) Microsoft PowerPoint Table des matières Présentation de la nouvelle interface (1) Interface utilisateur Ruban (1) Onglets contextuels (2) Onglets Programmation (3) Menus, barres d outils et autres éléments

Plus en détail

DAWAN Plan de la formation

DAWAN Plan de la formation DAWAN Plan de la formation www.dawan.fr Formation Informatique pour les débutants (PCIE) : Windows 7 + Internet + Office Formation éligible au CPF, contactez-nous au 09.72.37.73.73 pour en savoir plus

Plus en détail

Isn, Loud Jouhar Projet Projet ISN : Création d un site pour l apprentissage de l alphabet.

Isn, Loud Jouhar Projet Projet ISN : Création d un site pour l apprentissage de l alphabet. Projet ISN : Création d un site pour l apprentissage de l alphabet. 1 Sommaire I) Création du site internet II) Mise en forme du site III) Intégration du JavaScript 2 I) Création d un site internet. A)

Plus en détail

Utilisation du navigateur Google Chrome

Utilisation du navigateur Google Chrome Utilisation du navigateur Google Chrome ~91% des français utilisent Google contre (seulement) ~67% aux Etats-Unis En 2016 : Google répond à plus de 2000 milliards de requêtes par an (2 trillions comme

Plus en détail

Support de cours Dreamweaver CS5. MC Benveniste

Support de cours Dreamweaver CS5. MC Benveniste Support de cours Dreamweaver CS5 MC Benveniste 2011 Présentation du logiciel Il s agit d un logiciel d intégration de pages web, avec une interface wysyiswg (what you see is what you get = ce que vous

Plus en détail

Vous avez dit Navigateurs?

Vous avez dit Navigateurs? «Bonnes» Pratiques Nous avons tous une idée, plus ou moins précise de ce qu'est un Navigateur, Browser Microsoft Windows nous donnait accès à l'internet au moyen d'internet Explorer plus connu sous le

Plus en détail

Tutoriel d utilisation de PADLET. Novembre mhamoud - ac poitiers Tutoriel d utilisation de Padlet Page 1 sur 12

Tutoriel d utilisation de PADLET. Novembre mhamoud - ac poitiers Tutoriel d utilisation de Padlet Page 1 sur 12 Tutoriel d utilisation de PADLET Novembre 206 mhamoud - ac poitiers Tutoriel d utilisation de Padlet Page sur 2 I. Inscription / Connexion 3 II. Configuration de mon compte Padlet 5 III. Création d un

Plus en détail

MATHIEU LAVANT. Cahier. Flash. Spécial débutants. Avec tous les fichiers des exercices. Gratuit!

MATHIEU LAVANT. Cahier. Flash. Spécial débutants. Avec tous les fichiers des exercices. Gratuit! Cahier 1 MATHIEU LAVANT Flash Spécial débutants Gratuit! Avec tous les fichiers des exercices Cahier1 Flash Spécial débutants Cahier1 MATHIEU LAVANT Flash Spécial débutants Le code de la propriété intellectuelle

Plus en détail

Dossier ISN : Tracés de fonctions mathématiques :

Dossier ISN : Tracés de fonctions mathématiques : Dossier ISN : Tracés de fonctions mathématiques : Par Crosetti Pauline et Depoers Quentin. Lycée Colbert Tourcoing. Année scolaire 2012/2013. Sommaire : - Recherches et étude du projet - Html - Css - Javascript

Plus en détail

ISN - HTML : Apprendre HTML5. M. Lagrave HTML5. Code source Site classique CSS Bluefish. M. Lagrave. Lycée Beaussier

ISN - HTML : Apprendre HTML5. M. Lagrave HTML5. Code source Site classique CSS Bluefish. M. Lagrave. Lycée Beaussier Lycée Beaussier 2012 2013 Sommaire Le HTML «HyperText Markup Language» est un langage de balisage pour la création de site internet, il sert à structurer votre document. D autres langages peuvent s ajouter

Plus en détail

VLC Média Player : quelques fonctionnalités à découvrir

VLC Média Player : quelques fonctionnalités à découvrir MboaSoftwares Consulting Présente VLC Média Player : quelques fonctionnalités à découvrir Ce que vous ne savez pas sur VLC By Ariel Nathan ADA MBITA Quelques fonctionnalités à découvrir à tout prix Vous

Plus en détail

Fiche TD n 1 Le langage HTML

Fiche TD n 1 Le langage HTML Fiche TD n 1 Le langage HTML 1 Introduction Le HTML est le langage utilisé pour formaliser l information échangée sur internet. Il est constitué de balises qui indiquent de quelle manière les informations

Plus en détail

Modification d image avec Gimp

Modification d image avec Gimp Modification d image avec Gimp *Il est à noter que l explication détaillée des outils encerclés en rouge se retrouve dans la section Créer des images avec Gimp, car cela allègera cette section dédiée à

Plus en détail

Animate CC - Animations publicitaires HTML 5

Animate CC - Animations publicitaires HTML 5 Formations Multimédia Web Design et Design d'applications mobiles Animation Web Animate CC - Animations publicitaires HTML 5 Référence ANIM-CC Durée 3 jours (21 heures) Certification Aucune Appréciation

Plus en détail

Formation TBI (Notebook10)/ Enseignants de Maths /Créfoc Radès /06/12/2010. Ahmed Mohjer sous la direction de Mr L Inspecteur Mr Abdelmajid Elayeb.

Formation TBI (Notebook10)/ Enseignants de Maths /Créfoc Radès /06/12/2010. Ahmed Mohjer sous la direction de Mr L Inspecteur Mr Abdelmajid Elayeb. Formation TBI (Notebook10)/ Enseignants de Maths /Créfoc Radès /06/12/2010. Ahmed Mohjer sous la direction de Mr L Inspecteur Mr Abdelmajid Elayeb. DESCRIPTIF DE FORMATION SUR LE TABLEAU BLANC INTERACTIF

Plus en détail

Flash. Spécial débutants. Flash. Flash CS4. Flash CS4. Flash en 37 recettes. À qui s adresse ce livre? Cahier. Mis à jour ave MATHIEU LAVANT

Flash. Spécial débutants. Flash. Flash CS4. Flash CS4. Flash en 37 recettes. À qui s adresse ce livre? Cahier. Mis à jour ave MATHIEU LAVANT c Mis à jour ave en 37 recettes Vous souhaitez créer de petites animations pour parfaire votre site Web? Y intégrer du son, de la vidéo? Ou réaliser des interfaces plus sophistiquées, mais sans devoir

Plus en détail

Chapitre 1 : Prise en main d Excel

Chapitre 1 : Prise en main d Excel Chapitre 1 : Prise en main d Excel I. Qu'est-ce qu'un tableur? Un tableur permet de saisir des données, de faire des traitements sur ces données et de les afficher. Les originalités du tableur sont l'organisation

Plus en détail

Support de cours Word. Version 2010

Support de cours Word. Version 2010 Support de cours Word Version 2010 Sommaire + Aperçu du support Copyright 2012 - Workinlive - Tous droits réservés I. NOUVEAUTES ET GENERALITES... 5 A. LES NOUVEAUTES... 5 B. LA BARRE D OUTILS D ACCES

Plus en détail

Modifier des images avec le logiciel GIMP

Modifier des images avec le logiciel GIMP Modifier des images avec le logiciel GIMP Guide pour enfant Ouvrir une image à modifier Pour modifier une image, tu dois d abord ouvrir son fichier. Pour ouvrir un fichier à modifier, clique sur Fichier.

Plus en détail

Cours Multimédia Le photo montage avec GIMP 2

Cours Multimédia Le photo montage avec GIMP 2 Cours Multimédia Le photo montage avec GIMP 2 1 Ouvrir et enregistrer un fichier avec GIMP Pour ouvrir GIMP 2, il faut choisir Démarrer -> Programmes -> GIMP -> GIMP 2 Pour ouvrir un fichier dans le logiciel,

Plus en détail

Il est possible de naviguer à travers les étapes de la construction d'une figure à l'aide du menu Affichage Protocole de construction.

Il est possible de naviguer à travers les étapes de la construction d'une figure à l'aide du menu Affichage Protocole de construction. Fiche technique 27 Le protocole de construction 1 Paramétrer l'affichage du protocole de construction 2 Naviguer dans le protocole de construction 3 Modifier la figure depuis le protocole de construction

Plus en détail

1. Fonctionnalités du module de base

1. Fonctionnalités du module de base 1. Fonctionnalités du module de base 1.13. Imprimer des documents et des récapitulatifs... 1 1.13.1. Aspect et styles des documents originaires du Générateur de prix... 2 1.13.2. Modèles de listes... 5

Plus en détail

ESPACE MULTIMEDIA DU CANTON DE ROCHESERVIERE

ESPACE MULTIMEDIA DU CANTON DE ROCHESERVIERE ESPACE MULTIMEDIA DU CANTON DE ROCHESERVIERE 11 Presentation de de Windows Live Live Movie Maker Windows Live Movie Maker est le logiciel de montage vidéo gratuit de Microsoft, il propose une interface

Plus en détail

Étape 6 : Le montage. 6.1 Faire de l ordre. Pour faire de l ordre, on va créer un nouveau dossier sur le bureau

Étape 6 : Le montage. 6.1 Faire de l ordre. Pour faire de l ordre, on va créer un nouveau dossier sur le bureau Étape 6 : Le montage 6.1 Faire de l ordre Pour faire de l ordre, on va créer un nouveau dossier sur le bureau Glisser dans ce dossier tous les éléments médias utiles (chronique(s) filmée(s), vidéo(s) et

Plus en détail

firefox - premiere installation 1 / 5

firefox - premiere installation 1 / 5 firefox - premiere installation 1 / 5 firefox - premiere installation Pourquoi Firefox? Firefox est de loin le meilleur navigateur web du monde. Ceci est bien évidemment mon avis personnel. Mais si ce

Plus en détail

EXERCICE D INITIATION À LA BUREAUTIQUE

EXERCICE D INITIATION À LA BUREAUTIQUE EXERCICE D INITIATION À LA BUREAUTIQUE L objectif de cet exercice d initiation à la bureautique est de sa familiariser avec les fonctions de base de bureautique comme la gestion des dossiers, la rédaction

Plus en détail

Installer Firefox. Installer le navigateur «firefox»:taper firefox pour aller sur le site.

Installer Firefox. Installer le navigateur «firefox»:taper firefox pour aller sur le site. Installer Firefox. Installer le navigateur «firefox»:taper firefox pour aller sur le site. Enregistrer ce fichier, puis double clic sur «firefox setup stub 29.0.exe». cict44.free.fr 1 Un clic sur exécuter.

Plus en détail

Partie 1 Le format EPUB 3.0

Partie 1 Le format EPUB 3.0 Partie 1 Le format EPUB 3.0 1 Un nouveau cap La force de l EPUB est de s appuyer sur les standards du Web pour devenir luimême un standard. Ainsi l EPUB est voué à évoluer au rythme des progrès du Web

Plus en détail

TABLE DE MATIÈRES WINDOWS XP Module 1 - L environnement de Windows XP Présentation de Windows XP Comprendre le rôle de Windows...

TABLE DE MATIÈRES WINDOWS XP Module 1 - L environnement de Windows XP Présentation de Windows XP Comprendre le rôle de Windows... TABLE DE MATIÈRES WINDOWS XP Module 1 - L environnement de Windows XP Présentation de Windows XP Comprendre le rôle de Windows...1-1 Démarrer Windows...1-2 Reconnaître les éléments visuels de Windows XP...1-3

Plus en détail

HTML CSS Fiche numéro 6

HTML CSS Fiche numéro 6 HTML CSS Fiche numéro 6 Sources : https://openclassrooms.com/ L'ancien site 2minuteslearning.fr qui à malheureusement disparu https://www.vectorskin.com/balises-html5/ Mettre en place le CSS Dans un premier

Plus en détail

Atelier n 3c : Commencer à utiliser Windows 10

Atelier n 3c : Commencer à utiliser Windows 10 Atelier n 3c : Commencer à utiliser Windows 10 La version 10 de Windows diffère assez notablement des versions précédentes, même si on trouve les mêmes fonctionnalités et programmes complétées de nouveautés

Plus en détail

Photoshop CS2 propose des nouveautés d un grand intérêt pour

Photoshop CS2 propose des nouveautés d un grand intérêt pour Chapitre 1 Quoi de neuf dans Photoshop CS2? Photoshop CS2 propose des nouveautés d un grand intérêt pour les photographes, lesquelles seront détaillées dans ce chapitre. Pour commencer, évoquons rapidement

Plus en détail

HTML5 et CSS3 Maîtrisez les standards de la création de sites Web (3e édition)

HTML5 et CSS3 Maîtrisez les standards de la création de sites Web (3e édition) Le HTML5 et les CSS 1. L'évolution de HTML 15 2. L'évolution des CSS 16 2.1 La notion de module 16 2.2 L'évolution des statuts 16 2.3 Les préfixes vendeurs 17 2.4 Utiliser les préfixes vendeurs 18 3. La

Plus en détail

Guide d utilisation pour utilisateur «userpsa»

Guide d utilisation pour utilisateur «userpsa» Guide d utilisation pour utilisateur «userpsa» Site Internet du comité d entreprise http://cepcacharleville.fr Page 1 sur 13 SOMMAIRE 1 VERSION DU DOCUMENT... 3 2 COMMENT BIEN UTILISER CE GUIDE... 4 3

Plus en détail

Créer des images avec le logiciel GIMP

Créer des images avec le logiciel GIMP Créer des images avec le logiciel GIMP Gimp est un logiciel libre permettant de créer et de modifier des images matricielles. Ces images sont composées de pixels, de petits carrés colorés. GIMP offre une

Plus en détail

Création d'une bannière animée

Création d'une bannière animée Création d'une bannière animée Pour réaliser la bannière insérée sur la page http://www.bricabracinfo.fr/details/photofv6.phpnous utiliserons deux images : anim2.gif et logo_pf.gif. CONSEIL : ENREGISTRER

Plus en détail

Dreamweaver Image survolée

Dreamweaver Image survolée Dreamweaver Image survolée Image retournée (rollover) Un lien peut également être une surprise! Par exemple, vous passez votre souris et l image s illumine, la couleur change, l image se transforme. Comment

Plus en détail

PRESENTATION DE WORD 2007 A Présentation générale 2 B L écran de Word 3 C Barres d outils et rubans de fonctions 4

PRESENTATION DE WORD 2007 A Présentation générale 2 B L écran de Word 3 C Barres d outils et rubans de fonctions 4 S ommaire PRESENTATION DE WORD 2007 A Présentation générale 2 B L écran de Word 3 C Barres d outils et rubans de fonctions 4 MODES OPERATOIRES 1 Gestion de Word et de l écran 9 2 Gestion des fichiers (documents)

Plus en détail

Création d un diaporama

Création d un diaporama Création d un diaporama B.5.1 Communiquer le résultat de ses travaux en s appuyant sur un outil de PréAO TD OpenOffice IMPRESS Attention : ce TD formatif nécessite une part de recherches et d investigations

Plus en détail

Club Informatique du Biterrois. Bienvenue à ce cours à thème.

Club Informatique du Biterrois. Bienvenue à ce cours à thème. Club Informatique du Biterrois Bienvenue à ce cours à thème. Club Informatique du Biterrois La semaine dernière nous avions parlé de One Drive le cloud de Microsoft One Drive est votre sac de voyage dans

Plus en détail

Chapitre 1 Prise en main d Illustrator 11. Chapitre 2 Dessiner dans Illustrator 29

Chapitre 1 Prise en main d Illustrator 11. Chapitre 2 Dessiner dans Illustrator 29 Chapitre 1 Prise en main d Illustrator 11 1.1. Présentation... 13 1.2. Contenu du livre... 13 1.3. Les nouveautés... 14 1.4. Composants de l interface... 15 La boîte à outils... 16 Les menus... 16 Le panneau

Plus en détail

MAÎTRISER L'ART DU PINCEAU NUMÉRIQUE

MAÎTRISER L'ART DU PINCEAU NUMÉRIQUE SOMMAIRE 1 MAÎTRISER L'ART DU PINCEAU NUMÉRIQUE 1 Utiliser les outils de dessin... p.8 2 Dessiner au pinceau... p.10 3 Créer des formes de pinceau... p.12 4 Importer des formes de pinceau... p.14 5 Créer

Plus en détail

Configurer Google Chrome

Configurer Google Chrome Chrome est le navigateur proposé par Google. Il est téléchargeable ICI. Il existe en version Windows et Linux. Pour ios, il se limite à iphone, l'ipad et ipod touch. Ce navigateur peut être utilisé sans

Plus en détail

Que peut-on faire sur Internet?

Que peut-on faire sur Internet? Internet.. Internet est un réseau mondial permettant de connecter les ordinateurs entre eux, un peu comme le réseau téléphonique qui relie les téléphones. D'ailleurs le réseau Internet passe par les lignes

Plus en détail

Réussir son site web avec XHTML et CSS

Réussir son site web avec XHTML et CSS Leçon 08 Réussir son site web avec XHTML et CSS Couleur et fond 1. La couleur du texte...1 Indiquer la couleur du texte avec un nom...1 Indiquer la couleur du texte en hexadécimal...2 Indiquer la couleur

Plus en détail

a A û ë. = Règles d or de la frappe de texte.

a A û ë. = Règles d or de la frappe de texte. La lettre à l Inspecteur Saisie au clavier Pour faire une seule majuscule (en début de phrase, ou au début d un nom propre) : taper sur la lettre en tenant un doigt appuyé sur la touche majuscule. = }

Plus en détail

Guide d'utilisation. OpenOffice Writer

Guide d'utilisation. OpenOffice Writer Guide d'utilisation OpenOffice Writer CRÉER UN NOUVEAU DOCUMENT Fiche Guide N 1 cliquer sur l outil sur la flèche de l'outil Nouveau OUVRIR UN DOCUMENT EXISTANT Fiche Guide N 2 Cliquer sur l'outil Ouvrir

Plus en détail

MATHIEU LAVANT. Cahier1. À la découverte de

MATHIEU LAVANT. Cahier1. À la découverte de MATHIEU LAVANT Cahier1 À la découverte de sonmac A n n e x e s A n n e x e A Raccourcis clavier Action Raccourci clavier Utilisation Menu Annuler la dernière opération Cmd + Z Partout Édition Enregistrer

Plus en détail

Fil RSS Une nouveauté au Conseil

Fil RSS Une nouveauté au Conseil Fil RSS Une nouveauté au Conseil www.montrealmetro.ftq.qc.ca Fil RSS des nouvelles du Conseil régional FTQ Montréal métropolitain Le Conseil régional FTQ Montréal métropolitain offre dorénavant à ses internautes

Plus en détail

GUIDE Word (version intermédiaire) Version 2010 Table des matières

GUIDE Word (version intermédiaire) Version 2010 Table des matières GUIDE Word (version intermédiaire) Version 2010 Table des matières 1. Les rubans... 2 2. Pagination... 4 3. En-tête et pied de page... 5 4. Note de bas de page ou des notes de fin de document... 7 5. Table

Plus en détail

Mode d emploi de l interface de saisie des produits 10/09/2015

Mode d emploi de l interface de saisie des produits 10/09/2015 Mode d emploi de l interface de saisie des produits 10/09/2015 I. Sommaire I. Sommaire...1 II. Navigateurs conseillés...2 III. Connexion à l interface...2 IV. Saisie du code-barres EAN de votre produit...3

Plus en détail

Coffret : Les fondamentaux de Photoshop et Illustrator CS4

Coffret : Les fondamentaux de Photoshop et Illustrator CS4 La formation vidéo efficace Coffret : Les fondamentaux de Photoshop et Illustrator CS4 Le kit indispensable pour les graphistes! Bonus en ligne Découvrez les scripts Transformer une forme vectorielle La

Plus en détail

Formation Interwrite Workspace. Fonctions du programme

Formation Interwrite Workspace. Fonctions du programme Formation Interwrite Workspace Lancement et réglages Lancer le programme Fonctions du programme Déplacer la barre d outils sur le bureau, adapter sa forme Modifier les réglages par défaut de la barre d

Plus en détail

Cours sur le navigateur de Microsoft : Internet Explorer 7

Cours sur le navigateur de Microsoft : Internet Explorer 7 Cours sur le navigateur de Microsoft : Internet Explorer 7 Le navigateur Internet Explorer La mise à jour d'internet Explorer 6 à Internet Explorer 7 se fait par la mise à jour de Windows update. Vous

Plus en détail

Créer son premier diaporama PowerPoint Partie 4/4 - Diffuser un diaporama

Créer son premier diaporama PowerPoint Partie 4/4 - Diffuser un diaporama Créer son premier diaporama PowerPoint Partie 4/4 - Diffuser un diaporama Ce tutoriel est la suite de l article sur la mise en page d un diaporama, l article sur les animations des objets des diapositives

Plus en détail

Francis Draillard. Premiers pas HTML 5 CSS 3 & 6 e édition. Mise à jour. Groupe Eyrolles, 2006, 2008, 2010, 2012, 2013, 2015, ISBN :

Francis Draillard. Premiers pas HTML 5 CSS 3 & 6 e édition. Mise à jour. Groupe Eyrolles, 2006, 2008, 2010, 2012, 2013, 2015, ISBN : Francis Draillard Premiers pas en CSS 3 & HTML 5 6 e édition Mise à jour Groupe Eyrolles, 2006, 2008, 2010, 2012, 2013, 2015, ISBN : 978-2-212-13944-0 Table des matières 1. INTRODUCTION AU HTML ET AUX

Plus en détail

TUTORIEL POUR CRÉER UNE VIDEO EN LIGNE SUR LE SITE INTERNET JAYCUT.COM

TUTORIEL POUR CRÉER UNE VIDEO EN LIGNE SUR LE SITE INTERNET JAYCUT.COM TUTORIEL POUR CRÉER UNE VIDEO EN LIGNE SUR LE SITE INTERNET JAYCUT.COM Sommaire Se connecter à JayCut - page 1 Ouvrir une vidéo existante - page 1 Créer une nouvelle vidéo - page 1 Ecran de montage de

Plus en détail

CRÉER UN FORMULAIRE GOOGLE

CRÉER UN FORMULAIRE GOOGLE CRÉER UN FORMULAIRE GOOGLE AVEC LA NOUVELLE INTERFACE GOOGLE FORMS Source : http://jemeformeaunumerique.fr/2016/02/27/creer-unformulaire-google-avec-la-nouvelle-interface-google-forms/ Adaptation et mise

Plus en détail

Rédaction d une fiche thématique Mutuelles étudiantes : Se grouper pour agir

Rédaction d une fiche thématique Mutuelles étudiantes : Se grouper pour agir Rédaction d une fiche thématique Mutuelles étudiantes : Se grouper pour agir Philippe Marcy (webmaster) Table des matières 1. QU EST-CE QU UNE FICHE THÉMATIQUE?... 2 2. FAIRE UNE PROPOSITION DE FICHE THÉMATIQUE...

Plus en détail

Sommaire. Chapitre 1 > Les nouveautés de Photoshop Chapitre 2 > L espace de travail... 43

Sommaire. Chapitre 1 > Les nouveautés de Photoshop Chapitre 2 > L espace de travail... 43 Chapitre 1 > Les nouveautés de Photoshop 7... 11 1.1 L explorateur de fichiers... 13 1.2 Des outils de correction inédits... 18 1.3 Les transformations en vue du Web simplifiée... 19 1.4 Correction colorimétrique

Plus en détail

Tutoriel. Editeur de tableau

Tutoriel. Editeur de tableau Tutoriel Editeur de tableau All information in this document is subject to modification without prior notice. No part or this manual may be reproduced, stored in a database or retrieval system or published,

Plus en détail