Le langage du Web CSS et HTML

Slides:



Advertisements
Présentations similaires
Didacticiel Mon EBSCOhost
Advertisements

Bien visible sur internet 
Projet LOT Mini-site web « Looking For You 1 »
W3Line | 10 Ter, Rue Pasteur – BOURG LES VALENCE | Tél. : – Fax : | – Web :
16/01/2006 : 18h30-21h30 Aurélien Barbier-Accary 1 Coordonnées Aurélien Barbier-Accary Aurélien Barbier-Accary Supports du cours accessibles sur :
Conception de Site Webs dynamiques Cours 6
Conception de Site Webs dynamiques Cours 5
Conception de Site Webs Interactifs Cours 3
Conception de Sites Web dynamiques
Conception de Site Webs Interactifs Cours 4
TOUQUET Arnaud ▪ GI05 BLONDEEL Igor ▪ GM05
Internet : serveurs Web
Le developpement web  Préparé par : ASSAL Lamiae JAMALI Zakarya
Internet.
XHTML EXtensible HyperText Markup Language. HTML et XML HTML (HyperText Markup Language) et XML (eXtensible Markup Language) sont deux spécifications.
DOSSIER TICE 2006 MASSON Wendy 1 ère année sciences du langage
Concevoir un site Web de A à Z Ce cours permet à létudiant de réaliser de façon professionnelle un site internet de A à Z.
Web traditionnel
Le Référencement en Savoie Historique
HTML.
Recherche avancée multi-champs EBSCOhost
Documentation pour webmestre site sud-aerien.org
Introduction à la structuration des documents: les techniques M2: Gestion des connaissances.
Présentation de NAVIGATEURS INTERNET
Notions sur le XML Réfs : manuel p 149. Introduction Le XML (eXtensible Markup Language) est un standard d'échange de données. Il fait partie comme le.
1. 2 PLAN DE LA PRÉSENTATION - SECTION 1 : Code HTML - SECTION 2.1. : CSS (Méthode 1) - SECTION 2.2. : CSS (Méthode 2) - SECTION 3 : JavaScript - SECTION.
HTML / CSS Gestion des systèmes d’information Classe terminale
Qelios – Formation Initiation au langage CSS
Netscape Présentation par : Aleksandra Krul et Aurélia Marcus Jeudi 31/
Jonathan Montois Cyrille Kriegel
Création d’un Formulaire 1- Pour avoir accès à la gestion des formulaires, il faut accéder au module « Mon Site » à partir du menu principal 2 – Après.
P AGES PERSONNELLES PROFESSIONNELLES SOLUTION BLOG L E LOGICIEL DE PUBLICATION LIBRE DOTCLEAR ATELIER DE CREATION Jeudi 11 décembre 2008 – Isabelle THUAL.
31 octobre 2012 Grégory Petit
TracenPoche Insérer une figure TepWeb >.  Contenu de l'archive tepweb.zip Contenu de l'archive tepweb.zip  Quelques notions de html Quelques notions.
Le langage XHTML 420-S4W-GG Programmation Web Client
Les feuilles de style en HTML. CSS CSS: feuilles de style en cascade Permettent d’appliquer une mise en page à l’ensemble d’un site très simplement Permettent.
Création d’un site internet en XHTML + L’hébergement By Reyne & Archinard.
Internet WEB.
Regroupement du 20 janvier 2014 Syntaxe Wiki
Un site sous SPIP Un nouveau système de publication sur le net Collège Charles Rieu A.T.I. Pélofi Stéphane.
LANGAGE HTML Le HTML (Hyper Text Markup Langage) est un langage universel utilisé sur le World Wide Web. Le HTML permet de : * Publier des documents sur.
LE HTML ISN Terminale S Un peu d’histoire …
SSPT – CHOPIN module 2 Système de gestion de contenu de sites web Par Liette Pothier, Chargée de projet Nancy Dodier, technicienne en informatique.
CRÉER ET ALIMENTER UN BLOG A PARTIR DE LA PLATE FORME OVER BLOG
L’ ACCESSIBILITE « C’est mettre le Web et ses services à la disposition de tous les individus, quels que soient leur matériel ou logiciel, leur infrastructure.
Internet : serveurs Web  Clients et serveurs : le navigateur  Sites Web et urls  Fichier source d’une page  Langage HTML 1.
Technologies web et web sémantique TP3 - XML. XML eXtensible Markup Language (langage extensible de balisage) – Caractéristiques: méta-langage = un langage.
S'initier au HTML et aux feuilles de style CSS Cours 5.
Campus-Booster ID : **XXXXX Copyright © SUPINFO. All rights reserved Le développement Web.
SI 28 - Écriture interactive & multimédia Dreamweaver Séance 1 Petit Clara & Palfart Julien Printemps2008 Printemps 2008.
INTERNET Le langage HTML
Soutenance du mémoire de synthèse
Cours : HTML 1 avril 2013.
eXtensible Markup Language. Généralités sur le XML.
Cours de HTML suite applications
Concevoir un site web de A a Z Cours 4. Aujourd’hui Retour sur les feuilles de style L’archivage L’importance de valider vos sites web.
Accessibilité web Gérer l’accessibilité lors de la création d’un site ORT Lyon - 10/02/2014.
HTML Rappels des fondamentaux
Language html Hyper Text Markup Language
Scénario Les scénarios permettent de modifier la position, taille … des calques au cours du temps. Son fonctionnement est très proche de celui de Macromedia.
Dreamweaver Séance 1.
SI28 Dreamweaver- Séance 1
1 Présentation de DREAMWEAVER (1) Gaël TREMEAU GI05 Printemps 2006.
Les formulaires Les calques Les comportements Les scénarios Les modèles Les feuilles de styles (CSS) La mise en ligne Les formulaires permettent à l’utilisateur.
DREAMWEAVER SEANCE 1 Axel JACQUET GM05 – Julien VAN MOORLEGHEM GM05 A2008 Écriture interactive & multimédia Présentation Dreamweaver 8.
On va découvrir la magie de ....
Formation.
Dreamweaver 2éme séance Murat Keles. Présentation I.CSS et Dreamweaver II.Les calques III.Les scénarios IV.Les comportements V.Les cadres VI.Mise en ligne.
Introduction au HTML Qu’est ce que le HTML ?
TP ISN-Terminale S Notion de code HTML. I) Visualisation du code source d’une page web Se mettre sur une page web quelconque : clic droit, Afficher la.
Transcription de la présentation:

Le langage du Web CSS et HTML GESTION DE PROJET WEB Partie 4 Le langage du Web CSS et HTML

Le langage du Web HTML et Css : les 2 langages de balisage hypertexte employés pour la publication de pages sur le Web. Aujourd'hui, toutes les pages Web sont constituées d’une page html et d’un CSS ; ainsi la plus grosse partie des optimisations qui vont être faites sur votre site vont se passer dans le code source de ces fichiers. Ces 2 langages sont donc incontournables et sont définis par des normes soumises au W3C (World Wide Web Consortium) qui valide un Web propre. Séparation du contenu de la forme : Le CSS est là pour séparer le contenu (HTML) d'un document de son apparence de présentation (CSS).

CSS et HTML: Séparation du contenu de la forme Exemple : notre page HTML est la même (le contenu est le même) mais si on change la mise en forme du contenu dans le CSS; on obtient en une fois une page HTML ayant une mise en forme différente.

La structure d'une page web Toutes les pages sont composées de code, vous pouvez d’ailleurs voir le code des pages Internet en affichant leur code source : Avec Internet Explorer, faire affichage puis source dans la barre de menu, avec Firefox, faire affichage puis code source de la page. La page web contient: 1ère zone: c'est la Partie déclaration du type de document : 2ème zone: L'en-tête du document: Partie représentant la page entière : <html></html> Dont : Partie entête de la page : <head></head> Dont : Partie texte ou corps de la page: <body></body>

La structure du page web

Les métadonnées Le code des pages Web contient: des métadonnées, (balises meta) prises en compte par les moteurs de recherche. C’est quoi une balise META? Les balises META sont des balises HTML situées dans l'en-tête des pages de votre site, c'est-à-dire dans la section "HEAD" et /HEAD" de la page. Qui produit les métadonnées ? C'est le créateur du site, qui ajoute sur chaque document mis en ligne sur le Web les informations constituant les métadonnées.  Elles permettent aux moteurs de : Récolter de l'information, traiter et comparer ces informations et formater leurs réponses.

Les métadonnées Ils y récupèrent le titre (la plus importante des balises) et la description. Ces informations sont capitales: ces sont des facteurs de clics! Très important : Chaque page de votre site doit comporter une balise TITLE différente. <title>Titre de ma page</title> <meta name="Description" content="Description du contenu de la page">

Le W3C Votre site doit être conforme aux standards du w3c Le W3C, World Wide Web Consortium, est un organisme international dont la mission va être de "surveiller" l'évolution du web et qui développe des standards pour le Web afin que les gens puissent communiquer efficacement à travers Internet. Pourquoi des normes WEB: Le W3C est un ensemble de normes qui assure le bon usage du code dans un site Web. Si le robot d’un moteur de recherche visite votre site et tombe sur une page qui bloque, il va arrêter la lecture de la page et le plus souvent, va passer à un autre site. Ainsi, vos pages ne seront peut être pas indexées et, par conséquent, n’apparaîtront dans les résultats de recherche. Ces standards concernent les 'langages' comme HTML et CSS qui forment la base de toute les pages sur le web. Les normes du w3c intègre par exemple: Le support de synthétiseurs vocaux ou de plages Braille pour des personnes atteintes d'un handicap (aveugles, malvoyants, handicapés moteurs...)

Les avantages du w3c Le fait d’avoir des documents web codés de manière conformes aux standards du W3C, garantit de meilleurs résultats de classement, d'où une visibilité accrue dans les moteurs de recherche. L'utilisation des standards du W3C (particulièrement les normes XHTML et CSS) permet une réduction du poids des documents Web (de 25% à 50%). La séparation du contenu structuré et de sa présentation conformément aux normes W3C  permet de créer un site au code propre et plus léger. Votre site sera compatible avec tous les navigateurs respectant cette norme. Aujourd’hui, les internautes sont plus mobiles. Fini l’ordinateur comme seul moyen de surfer ! Place aux téléphones portables, tablettes et assistants numériques . Les normes du W3C permettent d’être certain que son site sera affiché par tous les navigateurs conçus selon les normes de manière égale. Comment puis-je savoir si mon site est conforme aux standards ? : Il suffit de copier l’url de la page concernée dans le validateur du W3C :http://validator.w3.org/