D autres balises HTML Exercice récapitulatif

Save this PDF as:
 WORD  PNG  TXT  JPG

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

Download "D autres balises HTML Exercice récapitulatif"

Transcription

1 D autres balises HTML Exercice récapitulatif

2 Le titre de la page Apparait dans la partie <head> Est affiché dans la barre de titre du navigateur Décrit ou résume le contenu de la page (10 mots maximum) <title> Université Lyon 2 - Accueil</title>

3 La balise <meta> Permet d ajouter des méta données (des informations sur les données de la page) Attributs : name et content à utiliser ensemble Quelques valeurs pour name : author, copyright, description, keywords, etc. (voir par exemple Exemple : <head> <meta name="description" content="cours HTML" /> <meta name="keywords" content="html, XHTML, Dreamweaver" /> </head> (http://www.laboratoire-referencement.fr/balise-meta-keywords.php)

4 Jeu de caractères UTF-8 permet, théoriquement, d encoder les caractères de toutes les langues En HTML5 : <meta charset="utf-8"> En XHTML 1.1 : <meta http-equiv="content-type" content="text/html; charset=utf-8" />

5 Définition de la langue En HTML 4.0 : <html lang="fr"> En XHTML 1.0 : <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> L utilisation simultanée de 2 attributs (xml:lang et lang) est préconisée par W3C pour des raisons de compatibilité avec les anciens navigateurs

6 Définition de la langue Utilisez l attribut «lang» pour signaler tout changement de langue dans le texte de la page Exemple : <p lang="en"> Text in English </p> Avantage : permet aussi le référencement des pages selon les préférences linguistiques de l utilisateur Pour des langues lues de droite à gauche spécifiez le sens de la lecture en utilisant l attribut «dir» de la balise «bdo» <bdo dir="rtl">texte de droite à gauche </bdo>

7 Envoyer un Pour appeler un logiciel de messagerie depuis une page Web, créez un lien (<a href="...">) puis utilisez l'instruction mailto: Exemple : pour écrire à l'adresse : <a Envoyer un message </a> Attention : votre adresse apparaît dans la page HTML!

8 Envoyer un Vous pouvez : spécifier plusieurs destinataires, en les séparant par des virgules préciser l objet du message Exemple : <a du mail"> </a> définir les destinataires des copies Exemple : <a

9 D autres balises HTML <abbr> - abréviation Exemple : L'<abbr title="organisation des Nations Unies" >ONU</abbr> est une organisation internationale fondée en Résultat :

10 D autres balises HTML <address> - pour spécifier une adresse Exemple : <address> ICOM - Université Lumière Lyon2 <br /> 5 Avenue Pierre Mendès France <br /> BRON </address> Résultat :

11 D autres balises HTML <em>texte mis en valeur (emphasized)</em> <strong>texte en gras (strong)</strong> <dfn>définition</dfn> <code>code (programme)</code> <samp>exemple code (programme)</samp> <kbd>texte (Keyboard text)</kbd> <var>variable</var> <cite>citation</cite> <blockquote> Citation longue Citation longue Citation longue Citation longue Citation longue Citation longue </blockquote>

12 D autres balises HTML

13 D autres balises HTML <dl> - liste de définitions <dt>café</dt> - terme de définition <dd> Graines de caféier, ou poudre formée de ces grains torréfiés et moulus. </dd> - description de définition <dt>thé</dt> <dd> Plante qui produit des feuilles qui séchées, sont utilisées comme boisson </dd> </dl> Résultat :

14 Balisage sémantique Privilégiez le balisage sémantique notamment pour les listes (ol, ul, dl), les titres de hiérarchie (hx), les citations (q, blockquote), les tableaux de données (th, caption, attribut summary, scope, id/headers), les étiquettes de formulaires (label, attribut title) et les groupes de champs de formulaires ou d'options (fieldset, legend, optgroup)

15 Balise <video> - HTML 5 Pour spécifier une vidéo Attributs : audio="muted" la seule valeur possible actuellement autoplay="autoplay" controls="controls" height="nombre pixels" width=" nombre pixels " loop="loop" poster="url" (url d'une image qui représente la vidéo) preload="auto" ou "metadata" ou "none" src="url"

16 Balise <video> - HTML 5 Exemple : <video width="320" height="240" controls="controls"> <source src="film.mp4" type="video/mp4" /> <source src="film.ogg" type="video/ogg" /> Votre navigateur ne supporte pas la balise video. </video>

17 Formats vidéo Ogg = fichiers.ogg - Theora video codec et Vorbis audio codec MPEG4 = fichiers.mp4 - H.264 video codec et AAC audio codec WebM = fichiers WebM - VP8 video codec et Vorbis audio codec

18 Compatibilité des formats avec les navigateurs Navigateur MP4 WebM Ogg Internet Explorer Oui Non Non Firefox Oui Oui Oui Google Chrome Oui Oui Oui Apple Safari Oui Non Non Opera 25 Oui Oui Oui

19 D autres balises HTML La liste n est pas finie <span> </span> <style> </style> etc. Attention à la compatibilité avec les navigateurs!!!

20 Exercice Réalisez une page HTML sur les Jeux Olympiques (pour récupérer des informations sur les sports/epreuves voir Utilisez un maximum de balises HTML apprises Ajoutez une balise "title"et le nom de l auteur, ainsi qu'une description et des mots clés dans des balises "meta". Mettez en haut de la page le titre JEUX OLYMPIQUES, en style "h1" Créez un tableau de 2 colonnes qui contient: Sur la première ligne, fusionnez les 2 cellules et mettez EDITIONS Dans la première colonne : les jeux d été; Dans la deuxième colonne : les jeux d hiver. Les jeux de la même année doivent apparaître sur la même ligne (ex: Paris 1924 à gauche et Chamonix 1924 à droite sur la même ligne). Les cellules vides adjacentes doivent être fusionnées.

21 Exercice Page 2 : Récupérez des informations sur 2 sports. Mettez en "h1" les noms des sports que vous avez choisis. Pour chaque sport ajoutez : un texte qui le décrit une image une vidéo une liste non ordonnée contenant au moins 3 épreuves Ajoutez à la fin de la page : Auteur (en italique) : (votre) Nom et Prénom et lien hypertexte indiquant votre adresse de messagerie Date (en gras) : la date et l'heure En bas de page mettez un lien hypertexte «Haut de page» qui permet de se déplacer au début de la page.

22 Exercice Page 3 : Créez un formulaire qui contient : Athlète (champ de texte de maximum 60 caractères) Type de classement : individuel, par équipe (boutons radio) Médaille : Or, Argent, Bronze (cases à cocher) Sport : liste d options Epreuve : liste d options Commentaires : une zone de texte de 5 lignes et 25 colonnes Un bouton pour l'envoi de données Un bouton pour la réinitialisation du formulaire Ajouter des commentaires dans votre code Validez toutes les pages du site (https://validator.w3.org/ ) Vérifier si la liste des critères Accessiweb est respectée (http://www.accessiweb.org/index.php/accessiweb_2.1_liste_generale.html) Publiez votre site sur le serveur Infographie et essayez de re-valider le site

Mémento. Balises de premier niveau

Mémento. Balises de premier niveau Mémento s de premier niveau Les balises de premier niveau sont les principales balises qui structurent une page HTML. Elles sont indispensables pour réaliser le «code minimal» d'une page web. principale

Plus en détail

Chapitre 7. extended HyperText Markup Language (XHTML)

Chapitre 7. extended HyperText Markup Language (XHTML) Chapitre 7 extended HyperText Markup Language (XHTML) Objectifs Le Web statique : Du HTML au XHTML Apprendre à manipuler les éléments XHTML Attention : projet évalué plutôt sur la «qualité» du code XHTML

Plus en détail

Mémento des balises HTML 5

Mémento des balises HTML 5 Mémento des balises HTML 5 s de premier niveau Les balises de premier niveau sont les principales balises qui structurent une page HTML. Elles sont indispensables pour réaliser le «code minimal» d'une

Plus en détail

Principales balises HTML5

Principales balises HTML5 Principales balises HTML5 RAPPEL : Tout document HTML commence par le DOCTYPE suivi de la balise , et s achève avec la balise . DOCTYPE et HTML : Le DOCTYPE : La déclaration

Plus en détail

Mémento des balises HTML

Mémento des balises HTML Chapitre 21 Mémento des balises HTML Diculté : C ette page est une liste non exhaustive des balises HTML qui existent. Vous trouverez ici un grand nombre de balises HTML. Nous en avons déjà vu certaines

Plus en détail

LISTE DES BALISES EN HTML5

LISTE DES BALISES EN HTML5 LISTE DES BALISES EN HTML5 AIDE-MÉMOIRE HTML&CSS www.multiforme.eu BALISE DEFINITION DES BALISES DESCRIPTION Pour un commentaire L inclusion du DOCTYPE dans un document HTML assure

Plus en détail

Cours de XHTML. chaîne de caractères

Cours de XHTML. <balise attribut=valeur attribut2=valeur2 >chaîne de caractères</balise> Cours de XHTML Introduction XHTML n'est pas un langage de programmation proprement dit, il s'agit simplement d'un langage de balisage dont le rôle est de formaliser l'écriture d'un document web avec des

Plus en détail

MODULE HTML CSS.

MODULE HTML CSS. MODULE HTML CSS David Tourel david.tourel@iut-tlse3.fr HTML : HyperText Markup Language Langage de description Interprété par les navigateurs Associé au CSS et JavaScript Métiers: développeur front end,

Plus en détail

Conception de Sites Web dynamiques HTML HTML XHTML 23/09/2008. Conception de Site Webs Interactifs. Cours 3. Patrick Reuter

Conception de Sites Web dynamiques HTML HTML XHTML 23/09/2008. Conception de Site Webs Interactifs. Cours 3. Patrick Reuter Conception de Site Webs Interactifs Conception de Sites Web dynamiques Cours 3 Patrick Reuter Déroulement Pages web statiques (HTML/XHTML) Mise en forme avec feuilles de styles (CSS) Programmationcôté

Plus en détail

Les tableaux. La mise en forme des tableaux (bordures, alignement horizontal et vertical, marges, ) se fait à l aide des styles CSS.

Les tableaux. La mise en forme des tableaux (bordures, alignement horizontal et vertical, marges, ) se fait à l aide des styles CSS. Les tableaux Les balises de tableau sont les suivantes : balise explication attributs titre du tableau tableau ligne d un tableau (table row) cellule d un tableau (table data) colspan(="nb

Plus en détail

Programmation Web HTML5

Programmation Web HTML5 Programmation Web HTML5 Julien David A101 - david@lipn.univ-paris13.fr 2016 Julien David (A101 - david@lipn.univ-paris13.fr) 2016 1 / 1 Organisation Cours 5 séances pour 5 langages : HTML5, CSS3, PHP5,

Plus en détail

Introduction aux technologies WEB. Pr. Hajar IGUER

Introduction aux technologies WEB. Pr. Hajar IGUER Introduction aux technologies WEB Pr. Hajar IGUER hajar.iguer@uic.ac.ma LES BALISES Les attributs Les balises HTML peuvent avoir des attributs. Chaque balise accepte uniquement les attributs qui la concerne.

Plus en détail

Cours de I21 SOMMAIRE

Cours de I21 SOMMAIRE Cours de I21 Voir le chap 2 : cours de Javascript SOMMAIRE I. Introduction sur le langage HTML II. Balises primaires a. mise en forme b. hyperliens c. insérer une image III. Création de listes IV. Création

Plus en détail

Écriture textuelle de documents structurés Structure notée grâce à des balises
...
SGML : Standard Generalized Markup Language

Écriture textuelle de documents structurés Structure notée grâce à des balises <section>... </section> SGML : Standard Generalized Markup Language HTML Langages à balises Écriture textuelle de documents structurés Structure notée grâce à des balises ... SGML : Standard Generalized Markup Language méta-langage applications : documentation

Plus en détail

Mémento des balises HTML

Mémento des balises HTML Partie 5 : Annexes 230/246 Mémento des balises HTML Cette page est une liste non exhaustive des balises HTML qui existent. Vous trouverez ici un grand nombre de balises HTML. Nous en avons déjà vu certaines

Plus en détail

Introduction à HTML: HyperText Markup Language

Introduction à HTML: HyperText Markup Language CREATION WEB HTML ET CSS Introduction à HTML: Le HTML, HyperText Markup Language, est un langage de balisage qui définit la structure logique d un document WWW diffusé sur le Web. La mise en forme de la

Plus en détail

HTML5 et CSS3. Table des matières : CE qu'est l'html5 Déclaration De Page page 3 Ossature D'une Page Les Balises. Les Nouvelles Balises CSS3

HTML5 et CSS3. Table des matières : CE qu'est l'html5 Déclaration De Page page 3 Ossature D'une Page Les Balises. Les Nouvelles Balises CSS3 HTML5 et CSS3. Table des matières : CE qu'est l'html5 page 2 Déclaration De Page page 3 Ossature D'une Page page 3 Les Balises...page 4-6 Les Nouvelles Balises...page 4-6 CSS3 page 7-9 Page 1/9 HTML5 Le

Plus en détail

Web Statique Base de la création de sites web

Web Statique Base de la création de sites web Web Statique Base de la création de sites web Lilian BAZILLE Version 1.0 Février 2015 Table des matières WEB 01 Introduction... 2 1 - Outils du développeur... 2 1.1 - Environnement de travail... 2 1.2

Plus en détail

Programmation PHP Septembre 2010

Programmation PHP Septembre 2010 IFT1147 Programmation Serveur Web avec PHP Un bref survol de HTML et CSS HMTL HTML: Hypertext Markup Language HTML est essentiellement un langage de description de structure de document (par exemple titre,

Plus en détail

HTML. Damien Nouvel. Damien Nouvel (Inalco) HTML 1 / 23

HTML. Damien Nouvel. Damien Nouvel (Inalco) HTML 1 / 23 HTML Damien Nouvel Damien Nouvel (Inalco) HTML 1 / 23 Langage, calcul, télécommunications Plan 1. Langage, calcul, télécommunications 2. Web et documents HTML 3. Balises 4. Attributs Damien Nouvel (Inalco)

Plus en détail

Introduction aux technologies WEB. Pr. Hajar IGUER

Introduction aux technologies WEB. Pr. Hajar IGUER Introduction aux technologies WEB Pr. Hajar IGUER hajar.iguer@uic.ac.ma Fonctionnement du WEB 1. Le navigateur effectue une requête spécifiée à travers l URL 2. Le serveur retourne un flot de données 3.

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

IAE - Web Marketing. Créer un site internet «simple» Publier un site internet Référencer un site internet. Olivier Toscano Gérant WebCMS Sàrl

IAE - Web Marketing. Créer un site internet «simple» Publier un site internet Référencer un site internet. Olivier Toscano Gérant WebCMS Sàrl IAE - Web Marketing Créer un site internet «simple» Publier un site internet Référencer un site internet Olivier Toscano Gérant WebCMS Sàrl HTML HTML est un langage à balisage Les balises permettent de

Plus en détail

Le multimédia, Audio et Vidéo. Chapitre 09. Nathalie Vanassche

Le multimédia, Audio et Vidéo. Chapitre 09. Nathalie Vanassche Le multimédia, Audio et Vidéo Chapitre 09 179 Tout ce qui est contenu multimédia et interactif nécessite l ajout d un moteur d interprétation dans les navigateurs, pour qu ils puissent afficher ce qu ils

Plus en détail

Guide Utilisation HTML et Microsoft FrontPage

Guide Utilisation HTML et Microsoft FrontPage Guide Utilisation HTML et Microsoft FrontPage 4 4me Année Sciences Informatique Année scolaire : 2016-2017 I. Introduction au langage HTML HTML est un langage de description. Il permet d'enrichir un texte

Plus en détail

Les balises XHTML. Balises de structure. Balises de mise en forme. Balises de liens Balises de liste Balises d image Balises de tableau

Les balises XHTML. Balises de structure. Balises de mise en forme. Balises de liens Balises de liste Balises d image Balises de tableau Les balises XHTML Balises de structure Balises de liens Balises de liste Balises d image Balises de tableau Balises de cadre Balises de mise en forme Balises de formulaire 1 Balises de structure Un document

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

Développement d Applications Web

Développement d Applications Web Développement d Applications Web HTML : HyperText Markup Language Mehdi BENZINE benzinemehdi@gmailcom Département d Informatique Faculté des Sciences Université FERHAT ABBAS Sétif I 2015/2016 M BENZINE

Plus en détail

<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/tr/xhtml1/dtd/xhtml1- transitional.dtd> IUT Nice Côte d Azur Prog. Web Département informatique 2007-2008 TP1 HTML ET XHTML 1. Le document xhtml minimal Le langage xhtml est la dernière évolution du html. C est une version plus stricte du html,

Plus en détail

Le (X)HTML 5. LPCEL promotion 2016/2017 Vincent Peigné

Le (X)HTML 5. LPCEL promotion 2016/2017 Vincent Peigné Le (X)HTML 5 LPCEL promotion 2016/2017 Vincent Peigné Sommaire 1. HTML 5 2. L entête HTML 3. Le corps ou 4. L encodage et les accents 1. HTML 5 1. HTML 5 1.1. Définition et historique 1.2. Définition

Plus en détail

Création de sites Web ~ Module 1 Introduction HTML - CSS

Création de sites Web ~ Module 1 Introduction HTML - CSS Création de sites Web ~ Module 1 Introduction HTML - CSS 1 Introduction : HTML, pour HyperText Markup Language, est le langage conçu pour représenter les pages Internet. C est un langage de balises permettant

Plus en détail

Organisation d un site web

Organisation d un site web Organisation d un site web Un site web est un ensemble de pages web hébergées par un serveur et identifié par une adresse internet ( URL). Les pages web sont écrites en langage html, puis transférées sur

Plus en détail

I/ Une première très brève introduction au WEB :

I/ Une première très brève introduction au WEB : TP 10 : Vendredi 31 Janvier 2014 Langage de description HTML Langages de description Présentation du langage HTML et du principe de séparation du contenu et de la mise en forme. Créer et analyser une page

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

Prog. Web - TP4 Année universitaire COURS : PLUS BESOIN DE FLASH!

Prog. Web - TP4 Année universitaire COURS : PLUS BESOIN DE FLASH! Prog. Web - TP4 Année universitaire 2012 2013 1 COURS : PLUS BESOIN DE FLASH! Aucune balise HTML4 ne permettait jusqu'ici de gérer la vidéo ou le son. Il fallait à la place utiliser un 'plugin' comme flash

Plus en détail

En-tête d'un document HTML : l'élément Balises dans. Balise "meta" Balise "meta" Balise "meta" Balise "meta" Exemple :

En-tête d'un document HTML : l'élément <head> Balises dans. <head> Balise meta Balise meta Balise meta Balise meta Exemple : Balises dans En-tête d'un document HTML : l'élément L'en-tête, head, d'un document HTML peut contenir 5 balises : title - titre du document link - pour importer un fichier script - pour insérer

Plus en détail

HTML. HyperText Markup Language. Le HTML est un langage informatique qui permet de créer des pages WEB. Il utilise des balises qui permettent :

HTML. HyperText Markup Language. Le HTML est un langage informatique qui permet de créer des pages WEB. Il utilise des balises qui permettent : HTML HyperText Markup Language Objectifs : - s'initier au langage HTML - savoir lire un code source html simple Le HTML est un langage informatique qui permet de créer des pages WEB. Il utilise des balises

Plus en détail

MODE D EMPLOI DU LOGICIEL «MESBULLETINS.NET»

MODE D EMPLOI DU LOGICIEL «MESBULLETINS.NET» MODE D EMPLOI DU LOGICIEL «MESBULLETINS.NET» 2012-2013 Version provisoire du 11-10-2012 IMPORTANT : Les résultats des épreuves de septembre (travaux, tests,...) sont à inscrire dans les commentaires de

Plus en détail

- WEB / HTML - Annexe 1 : Définition des balises HTML

- WEB / HTML - Annexe 1 : Définition des balises HTML Balises d encadrement - WEB / HTML - Annexe 1 : Définition des balises HTML Encadre le code source. Encadre la zone d entête de la page Web dans laquelle

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

Eléments de contenu -Les différents formats d'images -Les formats audio -Les formats vidéo

Eléments de contenu -Les différents formats d'images -Les formats audio -Les formats vidéo Objectif Général N 3 : Acquérir les compétences nécessaires pour maitriser la manipulation des images et des vidéos. Pré-requis : Objectif Général N 2 Objectifs Spécifiques Objectif Etablir une distinction

Plus en détail

Cours N 6 Le langage HTML

Cours N 6 Le langage HTML Cours 6: Technologies web - le langage HTML Cours N 6 Le langage HTML Concepts de Base 1. Généralités HTML (pour HyperText Markup Language) est un langage de description de documents hypermédia. Un document

Plus en détail

Conception d'interfaces Web

Conception d'interfaces Web Conception d'interfaces Web Licence 1 2. Créer un site Web avec HTML5 et CSS3 Bruno Jobard I. Introduction Les langages HTML et CSS décrivent la structure et la présentation d'une page Web. HTML est un

Plus en détail

Dreamweaver CS6 pour PC/Mac

Dreamweaver CS6 pour PC/Mac ENVIRONNEMENT. Généralités 1 A- La page de démarrage 1 B- L écran principal 2 C- La barre d état 3 D- Utiliser les règles 4 E- Utiliser la grille 4 F- Utiliser les repères 5 G- Modifier le zoom 6 1.2 Les

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

Université Bordeaux, UF Mathématiques et Interactions Licence 2 MIASHS (2015/2016)

Université Bordeaux, UF Mathématiques et Interactions Licence 2 MIASHS (2015/2016) Université Bordeaux, UF Mathématiques et Interactions Licence 2 MIASHS (2015/2016) Conception de Sites Web Dynamiques : TD 1 HTML5 statique, balises, liens relatifs/absolus, images, validateur W3C http://www.labri.fr/perso/preuter/cswd2016

Plus en détail

Utilisation des étiquettes, optimisation des commentaires

Utilisation des étiquettes, optimisation des commentaires Utilisation des étiquettes, optimisation des commentaires Vous avez peut-être remarqué que juste au dessus du cadre pour les commentaires il y a le texte suivant : Vous pouvez utiliser ces étiquettes :

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

TP 10/03/2015. LIEN UTILE : 1. Que signifie XHTML?

TP 10/03/2015. LIEN UTILE :  1. Que signifie XHTML? TP 10/03/2015 LIEN UTILE : http://xhtml.le-developpeur-web.com/ne_plus_utiliser-xhtml.php 1. Que signifie XHTML? extensible HyperText Markup Language 2. XHTML 1.0 est devenu une recommandation officielle

Plus en détail

Initiation au développement web Jeudi 27 octobre 2016

Initiation au développement web Jeudi 27 octobre 2016 Initiation au développement web Jeudi 27 octobre 2016 Merci de vous installer par binôme de niveau différent Des volontaires pour les e-profs? Présentation Thibault Vinchent tvinchent@gmail.com Développeur

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

HTML 5 CSS 3 Responsive

HTML 5 CSS 3 Responsive HTML 5 CSS 3 Responsive Programme de formation Microsoft Partner France Belgique Suisse - Canada Formez vos salariés pour optimiser la productivité de votre entreprise Dernière mise à jour : Avril 2014

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

Les bases du HTML5/CSS3

Les bases du HTML5/CSS3 1 Les bases du HTML5/CSS3 Ce premier chapitre rappelle tout ce qu il est bon de connaître lorsqu on se lance dans le développement HTML5/CSS3, depuis la déclaration de type de document jusqu au regroupement

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

protocole utilisé (autre exemple ftp)! nom du serveur!

protocole utilisé (autre exemple ftp)!  nom du serveur! Le Langage HTML! Finalité:! Définir un langage permettant d élaborer des sites Web, c est à dire un ensemble de pages web (ou pages Html) organisées (de façon logique) sous forme de graphe.! La transition

Plus en détail

TP6 : Les formulaires. Technologies du web Elodie Bisson

TP6 : Les formulaires. Technologies du web Elodie Bisson TP6 : Les formulaires Technologies du web Elodie Bisson 1. L'utilité d'un formulaire Un formulaire permet de recueillir des informations saisies par un utilisateur et de les envoyer via une URL à une adresse

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

HTML & CSS. d e s i g n w e b. [ présentation ]

HTML & CSS. d e s i g n w e b. [ présentation ] d e s i g n w e b [ présentation ] Généralités Les feuilles de styles (CSS) existent depuis 1996. Elles ne sont vraiment correctement supportées par les navigateurs que depuis 2000-2001. C'est donc depuis

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

1/31 COURS N 2. La structuration des pages web avec HTML

1/31 COURS N 2. La structuration des pages web avec HTML 1/31 COURS N 2 La structuration des pages web avec HTML 2/31 Plan 1. Introduction à la programmation web 2. La structuration des pages web avec le langage HTML 3. Le style et le positionnement avec le

Plus en détail

Guide d utilisation -

Guide d utilisation - Accéder au tableau de bord Pour entrer dans l espace d administration, allez à l adresse suivante : www.physiomouvementplus.com//wp-admin Une fenêtre d identification s ouvre alors : entrez votre Identifiant

Plus en détail

Introduction au Web. Andrea G. B. Tettamanzi. Université de Nice Sophia Antipolis Département Informatique

Introduction au Web. Andrea G. B. Tettamanzi. Université de Nice Sophia Antipolis Département Informatique Introduction au Web Andrea G. B. Tettamanzi Université de Nice Sophia Antipolis Département Informatique andrea.tettamanzi@unice.fr Andrea G. B. Tettamanzi, 2013 1 CM - Séance 2 HTML Andrea G. B. Tettamanzi,

Plus en détail

LANGAGE HTML : STRUCTURE GENERALE, FORMATAGE DU TEXTE ET INSERTION D IMAGE

LANGAGE HTML : STRUCTURE GENERALE, FORMATAGE DU TEXTE ET INSERTION D IMAGE ICN ICN Informatique et Création Numérique LANGAGE HTML : STRUCTURE GENERALE, FORMATAGE DU TEXTE ET INSERTION D IMAGE 1 MISE EN SITUATION 1.1 Page Web «Une page Web est une ressource du World Wide Web

Plus en détail

Exercice 4 Manipulation des balises HTML

Exercice 4 Manipulation des balises HTML 1 Exercice 4 Manipulation des balises HTML Dans cet exercice vous allez simplement manipuler les différentes syntaxes qui constituent le langage html. Sources : Une fois l archive décompressée vous trouverez

Plus en détail

TP03 : navigation entre article 2 de partie

TP03 : navigation entre article 2 de partie TP03 : navigation entre article 2 de partie Le but de la séance est poursuivre le tp débuté la semaine passée. Une correction du tp02 est fournie à http://deptinfo.unice.fr/~renevier/progwebserveur/tps/03.

Plus en détail

HIVER 2017 COURS INF2005 : PROGRAMMATION WEB. Exercices de Programmation Web, Laboratoires et TP

HIVER 2017 COURS INF2005 : PROGRAMMATION WEB. Exercices de Programmation Web, Laboratoires et TP HIVER 2017 COURS INF2005 : PROGRAMMATION WEB Exercices de Programmation Web, Laboratoires et TP Professeur : Abdel OBAID Ateliers : Ruben Chambilla Février 2017 TABLEAU DES MATIÈRES 1. Introduction...1

Plus en détail

Plan du cours. Cours Web n o 1 Introduction au World Wide Web et à XHTML. Exemple. Pierre Senellart 14 et 17 septembre 2007

Plan du cours. Cours Web n o 1 Introduction au World Wide Web et à XHTML. Exemple. Pierre Senellart 14 et 17 septembre 2007 Cours Web n o 1 Introduction au World Wide Web et à XHTML Pierre Senellart (pierre@senellart.com) 1 2 5 14 et 17 septembre 2007 P. Senellart (IFIPS) Web et XHTML 14/09/2007 1 / 37 P. Senellart (IFIPS)

Plus en détail

Charte graphique pour la réalisation de sites thématiques sur Internet

Charte graphique pour la réalisation de sites thématiques sur Internet Charte graphique pour la réalisation de sites thématiques sur Internet Sommaire Conventions... < 3 > Navigation... < 4 > Pages... < 5 > La page d accueil La page des liens La page des contacts Les pages

Plus en détail

HEI3 : TD HTML. Objectif : construction d un document hypertexte sur Internet. Moyens :

HEI3 : TD HTML. Objectif : construction d un document hypertexte sur Internet. Moyens : 3 : TD HTML Objectif : Moyens : construction d un document hypertexte sur Internet - Internet : notions d échanges sur le réseau - Langage : présentation d HTML - Mise en œuvre d HTML : TD_3_HTML_CV.html

Plus en détail

Tutoriel : créer un formulaire en ligne avec Google Drive

Tutoriel : créer un formulaire en ligne avec Google Drive Tutoriel : créer un formulaire en ligne avec Google Drive Google propose à travers son service Google Drive (service de stockage et de partage de fichiers en ligne) un outil pratique permettant la création

Plus en détail

Guide pratique de Zotero

Guide pratique de Zotero Octobre 2017 Guide pratique de Zotero Présentation Zotero est un outil de gestion de références bibliographiques. Zotero est libre et gratuit. Il se présente sous la forme d une application à installer.

Plus en détail

Première exploration de Bluefish et. création d un formulaire simple

Première exploration de Bluefish et. création d un formulaire simple Première exploration de Bluefish et création d un formulaire simple Table des matières Première exploration de Bluefish avec les fichiers déjà créés au dernier cours...2 Création d un projet incorporant

Plus en détail

TD2 : XHTML/CSS. Université Bordeaux 1 Licence 3 Informatique

TD2 : XHTML/CSS. Université Bordeaux 1 Licence 3 Informatique Université Bordeaux 1 T.D. Licence 3 Informatique 2007 2008 TD2 : XHTML/CSS Le but de ce TP est d apprendre les bases du langage XHTML. Voici deux sites de référence pour le XHTML et le HTML : http://www.w3.org/tr/xhtml1

Plus en détail

OpenOffice. Editeur HTML. Table des matières

OpenOffice. Editeur HTML. Table des matières Editeur HTML OpenOffice Table des matières Editeur HTML...1 CREER UN NOUVEAU SITE WEB...2 INTERFACE DE TRAVAIL...3 CONFIGURATION DE LA PAGE...4 Ou sont les balises Meta?...4 Options de la page...5 ENREGISTREMENT...6

Plus en détail

Créer une page HTML avec l'éditeur Notepad++

Créer une page HTML avec l'éditeur Notepad++ Page Html Créer une page HTML avec l'éditeur Notepad++ Ouvrir Notepad++ Ecrivez un court texte. Enregistrer ce fichier dans un dossier que vous avez préalablement créé dans vos documents ou sur votre bureau

Plus en détail

CRÉE TA PAGE WEB POUR IPHONE!

CRÉE TA PAGE WEB POUR IPHONE! CRÉE TA PAGE WEB POUR IPHONE! Programme du matin QR Code Définition Création de votre T-Shirt avec QR Code Pause «Application» pour iphone Base du HTML Création de votre CV QR CODE? QR CODE? Le QR Code

Plus en détail

Technologies du Web Master COMASIC Le langage HTML

Technologies du Web Master COMASIC Le langage HTML Technologies du Web Master COMASIC Le langage HTML Antoine Amarilli 1 27 novembre 2014 1. Matériel de cours inspiré de notes par Pierre Senellart. Merci à Marc Jeanmougin, Antonin Delpeuch et Pierre Senellart

Plus en détail

Introduction au langage HTML

Introduction au langage HTML Introduction au langage HTML Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT marzais@llaic3.u-clermont1.fr mathieu.lacroix@isima.fr antoine.vacavant@liris.cnrs.fr 24 et 25 Avril 2006 /80 Thibault MARZAIS,

Plus en détail

Les balises meta (meta tags en anglais) peuvent avoir plusieurs rôles :

Les balises meta (meta tags en anglais) peuvent avoir plusieurs rôles : Les balises meta (meta tags en anglais) peuvent avoir plusieurs rôles : Indiquer le titre de la page et fournir un résumé de son contenu. Renseigner les navigateurs de vos visiteurs et/ou les moteurs de

Plus en détail

Ecrire des pages web = pages XHTML = le contenu et sa structure. feuilles de style = page CSS = la forme (couleur fonte cadre... ) (cours prochain)

Ecrire des pages web = pages XHTML = le contenu et sa structure. feuilles de style = page CSS = la forme (couleur fonte cadre... ) (cours prochain) introduction Ecrire des pages web = pages XHTML = le contenu et sa structure (ce cours) feuilles de style = page CSS = la forme (couleur fonte cadre... ) (cours prochain) Xhtml = Successeur de HTML compatible

Plus en détail

Module Javascript - Présentation du langage - Exercices d application

Module Javascript - Présentation du langage - Exercices d application Module Javascript - Présentation du langage - Exercices d application February 15, 2011 Module Javascript - Présentation du langage - Exercices d application ii Contents 1 Exercice 1 1.1 Les premiers programmes

Plus en détail

Inscription à Gmail. 1. Tapez votre Nom et votre prénom. 2. Mettre l adresse mail que vous souhaitez. 3. Vérifier la disponibilité de l adresse mail

Inscription à Gmail. 1. Tapez votre Nom et votre prénom. 2. Mettre l adresse mail que vous souhaitez. 3. Vérifier la disponibilité de l adresse mail Inscription à Gmail 1. Ouvrir votre navigateur de recherche : Google Chrome/ Firefox 2. Dans la barre de recherche taper «Gmail», puis cliquez sur le 1 er lien (Si vous utilisez Chrome, cliquez sur le

Plus en détail

MODULE HTML CSS. Elisabeth Pecatte elisabeth.pecatte@iut-tlse3.fr

MODULE HTML CSS. Elisabeth Pecatte elisabeth.pecatte@iut-tlse3.fr MODULE HTML CSS Elisabeth Pecatte elisabeth.pecatte@iut-tlse3.fr ORGANISATION DU MODULE 13 séances de 2 heures une partie cours une partie exercices sur machine. Modalités de contrôle : partiel en fin

Plus en détail

Séance 1. Bases et HTML

Séance 1. Bases et HTML Séance 1 Bases et HTML Nils Schaefer (nils.schaefer@sn-i.fr) Serveur Web Hébergement des sites Web Utilisation du port 80 Réception des requêtes HTTP des navigateurs Traitement des requêtes HTTP Exemples

Plus en détail

DAW Développement Applications Web. Ouadfel Salima Site du cours:

DAW Développement Applications Web. Ouadfel Salima Site du cours: DAW Développement Applications Web Ouadfel Salima Site du cours: http://salimaouadfel.e-monsite.com/ Développement d Applications Web L'objectif de ce module est: 1. S'initier à la programmation Web en

Plus en détail

Création de sites Web ~ Module 1 Introduction HTML - CSS

Création de sites Web ~ Module 1 Introduction HTML - CSS Création de sites Web ~ Module 1 Introduction HTML - CSS 1 Introduction : HTML, pour HyperText Markup Language, est le langage conçu pour représenter les pages Internet. C est un langage de balises permettant

Plus en détail

Bases de données et Internet

Bases de données et Internet Bases de données et Internet Faculté des Sciences et Techniques Fès Département de Génie Industriel Master Sciences et Techniques en Génie Industriel Professeur : F. Kaghat 2 Feuilles de style en cascade

Plus en détail

Test Test Test Test Test

Test Test Test Test Test Mise en forme d un document HTML Niveaux de titre Le langage HTML définit 6 niveaux de titre (en anglais heading), afin de définir une structuration hiérarchique des paragraphes dans un texte : Balise

Plus en détail

Comment faire avec WordPress

Comment faire avec WordPress Les fiches pratiques du petit aide-mémoire des documents numériques accessibles «Structurer, Donner des alternatives, Identifier» Comment faire avec WordPress Note : les copies d'écran ont été réalisées

Plus en détail

HTML - Initiation. Placer du contenu. II) Placer du contenu

HTML - Initiation. Placer du contenu. II) Placer du contenu II) II.1) Mettre en place du texte I.1.1) Le paragraphe La plupart du temps lorsqu'on écrit du texte dans une page web, on le fait à l'intérieur de paragraphes. Il nous suffit de taper notre texte

Plus en détail

Le Webmail version «IMP»

Le Webmail version «IMP» Le Webmail version «IMP» Université Rennes 2 Haute Bretagne Le Webmail version «IMP» Les fonctionnalités du Webmail Centre de Ressources Informatiques - 15/10/2008 2006-2007 2008-2009 Centre Copyright

Plus en détail

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

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

Gestion du site web www.college-st-paul.qc.ca. Manuel d instructions

Gestion du site web www.college-st-paul.qc.ca. Manuel d instructions Gestion du site web www.college-st-paul.qc.ca Table des matières Accéder au panneau d administration...3 Ajouter un administrateur...5 Structure du site...6 Ajouter une page...8 Éditer une page nouvellement

Plus en détail

DÉCOUVRIR INTERNET DOCUMENTS PÉDAGAGIQUE NET-C

DÉCOUVRIR INTERNET DOCUMENTS PÉDAGAGIQUE NET-C DÉCOUVRIR INTERNET DOCUMENTS PÉDAGAGIQUE NET-C Net-C est un service de messagerie Internet depuis 1998, permettant de communiquer entre adresses e-mail. Net-c est un service européen, respectueux de la

Plus en détail

LES LISTES. 2 types de listes :

LES LISTES. 2 types de listes : LES LISTES 2 types de listes : Liste non-ordonnée ou liste à puces ex : fraise framboise pomme intégration de la liste à puces : Délimiteur d un élément de la liste : fraise

Plus en détail

LES BASES DU HTML 5 SOMMAIRE

LES BASES DU HTML 5 SOMMAIRE LES BASES DU HTML 5 https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3 Open Class Room SOMMAIRE Les bases HTML5... 3 1 : comment fait-on pour créer un site web... 3 Deux

Plus en détail

HTML (1/4) : les bases

HTML (1/4) : les bases 1 HTML (1/4) : les bases introduction...1 les concepts de base...1 structure d un document HTML...1 divisions...3 balises de styles...5 les listes...8 Les liens hypertextes et les images...9 Introduction

Plus en détail

PROGRAMME DE FORMATION BUREAUTIQUE / WINDOWS WORD EXCEL

PROGRAMME DE FORMATION BUREAUTIQUE / WINDOWS WORD EXCEL Organisme de formation professionnelle Formations & prestations Informatiques FORMANOSQUE 130 ch. du clos supérieur 04100 Manosque Tél. 04 92 77 10 58 contact@formanosque.fr Google formanosque PROGRAMME

Plus en détail