Le DOCTYPE La balise DOCTYPE autrefois compliqué sans raison, a été largement simplifiée.
|
|
|
- François Brunelle
- il y a 8 ans
- Total affichages :
Transcription
1 Introduction à HTML5 Etat des lieux sur HTML5 Les technologies autour d HTML5 sont le futur du Web mais rien n est encore finalisé : certaines balises sont utilisables, d autres sont expérimentales, d autres encore sont propriétaires (spécifique à un seul navigateur). Les différentes phases des spécifications au W3C : First Public Working Draft Working Draft (Phase en cours) Candidate Recommendation Proposed Recommendation Recommendation Actuellement les spécifications du W3C sur HTML5 sont à l état d étude (Working Draft) et la première version des standards (Candidate Recommendation) est prévue en Ce type de spécifications est long à mettre en place ; la dernière phase (Recommendation) étant prévue pour 2022 Néanmoins, certains balises sont déjà définies comme standard est peuvent déjà être utilisées. Liste des nouveautés avec HTML5 HTML5 est juste un markup, il faut donc plutôt parler d HTML5 et ses technologies associées : HTML5 : Le markup de la future génération d application Web CSS3 (Cascade Style Sheet) : Permet d appliquer des styles au document SVG 1.1 (Scalable Vector Graphics) : Moteur de dessin vectoriel WOFF Géolocalisation WebForms Etc. Le Markup HTML5 Le DOCTYPE La balise DOCTYPE autrefois compliqué sans raison, a été largement simplifiée. Avant : <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd> Après : <!DOCTYPE html> Page 1 sur 9
2 Les balises structurelles Plusieurs balises ont été ajoutées pour simplifier la structure des sites. Les balises du type <div class=header> ou <div class=footer> peuvent désormais être remplacées par <header>, <nav>, <footer>, <section>, <article> et <aside>. Voici un découpage possible pour un site web avec ces nouvelles balises : La balise <audio> Permet de lire un fichier audio sans nécessiter un plug-in (Flash, Quicktime, Silverlight, ). Le lecteur est fourni par défaut par le navigateur. Voici les paramètres : Autoplay : lecture automatique Loop : lecture en boucle Controls : affichage des touches de lecture, pause, volume Src : permet de spécifier la source du media Preload : permet au navigateur de pré-charger le média : none, auto, metadata (seulement l entête Le paramètre «preload» est inutile si «autoplay» est activé. Compatibilité Le W3C a laissé libre choix au navigateur pour le format de lecture. C est pourquoi les 3 principaux navigateurs ne supportent pas les mêmes formats d encodage. Le format WAV n étant pas un format compressé, il est généralement à éviter. Navigateur \ Format WAV MP3 OGG AAC M4A Internet Explorer 9 X X X X Firefox 3.6 X X Google Chrome X X X X La balise <source> permet de pallier à ces incompatibilités en spécifiant plusieurs sources pour un seul media. La lecture des sources est séquentielle : si le navigateur n arrive pas à lire la première source, il lira la suivante, etc. Page 2 sur 9
3 Voici un exemple : <audio controls> <source src="audio.mp3" /> <source src="audio.ogg" /> </audio> Voici un lien permettant de tester les différents formats sur votre navigateur : La balise <video> Permet de lire un fichier vidéo sans nécessiter un plug-in (Flash, Quicktime, Silverlight, ). Le lecteur est fourni par défaut par le navigateur. A savoir, il n y a actuellement aucun support DRM et le streaming adaptatif n est pas supporté. Compatibilité Comme pour la balise audio, tous les formats ne sont pas supportés par tous les navigateurs : Navigateur \ Format H264 WebM Theora Internet Explorer 9 X X* Firefox 4 X X Google Chrome X X Safari 5 X Opera 11 X X * Nécessite d installer le plugin. La balise <source> fonctionne également avec la balise <video>. Voici un exemple : <video controls> <source src="mavidéo.ogg" type="video/ogg"/> <source src="mavidéo.mp4" type="video/mp4"/> <object src="mavidéo.swf" type="application/x-shockwave-flash" width="800" height="500" allowscriptaccess="always" allowfullscreen="true"/> </video> Dans cet exemple, si le navigateur ne support pas OGG et MP4, il lancera le plugin flash SWF. Voici un lien permettant de tester les différents formats sur votre navigateur : Page 3 sur 9
4 Utilisation des Canvas La balise <canvas> permet de dessiner dans une Bitmap des formes et primitives simples au travers d APIs JavaScript. Cette fonctionnalité notamment des créer des animations simples et des applications pouvant interagir avec l utilisateur (par exemple, dessiner avec la souris). Une présentation est disponible sur le «testdrive» de Microsoft : Voici un exemple d utilisation <canvas id="mondessin" width="200" height="200"> <p>votre navigateur ne supporte pas Canvas.</p> </canvas> <script language="javascript"> // Récupération de l'élément Canvas var canvas = document.getelementbyid('mondessin'); // Pour être sûr que le navigateur supporte Canvas if (canvas.getcontext) // Utilisation de getcontext pour dessiner sur le Canvas var ctx = canvas.getcontext('2d'); // Dessin de la bouche ctx.beginpath(); ctx.arc(75,75,45,0,math.pi,false); ctx.linewidth = 10; ctx.strokestyle = "rgb(255,215,0)"; ctx.stroke(); ctx.closepath(); // Dessin des yeux ctx.beginpath(); ctx.arc(35,40,10,0,math.pi*2,true); ctx.moveto(125,40); ctx.arc(115,40,10,0,math.pi*2,true); ctx.fillstyle = "rgb(255,215,0)"; ctx.fill(); ctx.closepath(); else alert('votre navigateur ne supporte pas Canvas.'); </script> Le rendu : Page 4 sur 9
5 Quelques nouveautés de CSS3 CSS3 Media Queries Permet de s adapter aux différentes résolutions/périphériques par style : Résolution limité pour les Smartphones Résolution normale pour les netbooks Large et haute résolution sur PC/Mac Exemple, pour changer de fond suivant la taille de l écran : /* Fond par défaut */.box Background-image : url( image1.jpg ) ; /* Fond pour les mobiles (max-width:480px).box Background-image : url( image1.jpg ) ; /* Fond pour les netbooks (min-width:481px) and (max-width:1024px).box Background-image : url( image2.jpg ) ; /* Fond pour les postes de travail (min-width:1025px).box Background-image : url( image3.jpg ) ; CSS3 Border-radius La propriété «border-radius» permet de créer des coins arrondis. Elle est définie en pixel et peut avoir 1 paramètre (si tous les arrondis sont identiques) ou 4 paramètres (haut-gauche, haut-droit, bas-droit, bat-gauche). Cette propriété peut être remplacée par : border-top-left-radius border-top-right-radius border-bottom-right-radius border-bottom-left-radius Page 5 sur 9
6 CSS3 Box-shadow La propriété «box-shadow» permet de créer des ombres portées. Voici la liste des paramètres : Le premier paramètre est le décalage horizontal de l'ombre. Le second paramètre est le décalage vertical. La troisième valeur, toujours positive, est la longueur du dégradé. La quatrième valeur étend l'ombre dans la direction opposée. Un code de couleur donne la coloration de cette ombre. Le paramètre «inset» peut être ajouté pour créer l ombre à l'intérieur de la boite et non à l'extérieur. CSS3 Gradient Background Maker Dans la propriété «background-image», on peut définir un dégradé linéaire par le paramètre «linear-gradient». Néanmoins, cette fonctionnalité est encore au stade expérimental, tous les navigateurs n ont pas encore adopté la même syntaxe. Pour plus d informations : CSS3 Multi-column Layout Avec CSS3, il est désormais possible de définir des colonnes, à la manière des contenus éditoriaux de journaux. Il était auparavant très délicat de reproduire une telle structure de page. La propriété de base «column-count» permet de spécifier le nombre de colonnes..texte Column-count :auto ; Column-width :250px ; L exemple le code ci-dessus va créer des colonnes de 250 pixels, le nombre de colonnes changera automatiquement en fonction de la taille de l écran. Cette propriété peut donc être très utile pour rendre compatible un site sur les mobiles. Fonts WOFF Les fonts Web Open Font Format permet de spécifier dans une feuille de style une police d écriture sans se soucier de savoir si elle existe sur le poste client. Le navigateur sait où trouver les fonts WOFF sur le Web et les télécharge automatiquement sur le poste client. La plupart des navigateurs sont déjà compatibles, les autres sont en cours d implémentation. Page 6 sur 9
7 Scalable Vector Graphics (SVG) Permet de créer et dessiner des éléments graphiques vectoriels en 2D avec du XML. Les éléments SVG sont accessibles depuis le DOM et peuvent être manipulés comme des balises normales (mettre du CSS, du JavaScript, etc.). Exemple 1 Le code source : <svg width="400" height="200" xmlns=" <rect fill="red" x="20" y="20" width="100" height="75" /> <rect fill="blue" x="50" y="50" width="100" height="75" /> </svg> Le rendu : Exemple 2 Le code source : <svg width="500" height="500" xmlns=" <rect width="100" height="100" fill="#9f9" x="1" y="42" /> <polygon points="1,42 42,1 142,1 101,42 1,42" fill="#99f" /> <polygon points="101,42 142,1 142, , ,42" fill="#f99" /> </svg> Le rendu : Page 7 sur 9
8 Les technologies expérimentales Certaines technologies proposées pour l HTML5 sont encore au stade expérimental. Il est donc recommandé de ne pas les utilisées pour des applications professionnelles car elles peuvent évoluer très rapidement. Elles sont généralement préfixées : o (Opéra), -ms (Internet Explorer), -webkit (Safari et Chrome), -moz (Firefox). Voici un exemple de CSS markup expérimentale avec le paramètre linear-gradient vu précédemment : /* IE10 */ background-image: -ms-linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%); /* Mozilla Firefox */ background-image: -moz-linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%); /* Opera */ background-image: -o-linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%); /* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #FFFFFF), color-stop(1, #00A3EF)); /* Webkit (Chrome 11+) */ background-image: -webkit-linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%); /* Proposed W3C Markup */ background-image: linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%); Les principales technologies expérimentales : WebSockets WebGL WebWorkers Certaines de ces technologies ont été implémenté par certains navigateurs, mais ce n est pas forcement un plus pour ces navigateurs. Pour preuve, WebSockets a été implémenté par Mozilla en début d année et a donné lieu à une importante faille de sécurité. Depuis, les navigateurs ont tous désactivés par défaut cette fonctionnalité (mais l utilisateur peut toujours la réactiver dans les options du navigateur). Actuellement il n est pas possible de dire si un navigateur supporte mieux HTML5 qu un autre car une grande partie des technologies associées ne sont pas encore stables et définies précisément par W3C. Page 8 sur 9
9 Comment savoir si son navigateur support bien HTML 5 Le test donne un score sur 400. Le score n'est qu'une indication de la façon dont le navigateur prend en charge les spécifications du standard HTML5 et des technologies liées à venir. Sachant que plusieurs technologies sont encore expérimentales et non standardisées, ce score est à prendre à la légère. De plus que nous ne savons pas sur quelle base sont ventilés les points. Le test créé par Ian Hickson (Google), permet de lancer 100 tests unitaires de base. A savoir que le W3C prévoit plus de tests unitaires dans les standards à venir. L outillage Majoritairement du Notepad (voir Notepad++) Les outils modernes ne proposent pour l instant que de l aide via auto-complétion : Helper HTML5 pour Visual Studio 2008 & 2010 : Adobe Dreamweaver CS5 va un peu plus loin avec de la prévisualisation multi-écrans : Certains commencent à le proposer dans les templates comme WebMatrix : Canvas Adobe Illustrator propose le plugin Ai->Canvas qui permet d exporter les vecteurs et illustrations bitmap directement en code pour la balise <canvas> : Page 9 sur 9
Formation : WEbMaster
Formation : WEbMaster Objectif et Description : Centre Eclipse vous propose une formation complète WebMaster, vous permettant de : Utiliser dès maintenant les nouveautés du web2, ainsi alléger les besoins
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
RESPONSIVE WEB DESIGN
RESPONSIVE WEB DESIGN Une approche pour concevoir des sites Web adaptatifs et une occasion d'inciter les étudiants à consulter des cours responsives Ivan MADJAROV Arnaud FÉVRIER Comment consulte-t-on le
1. La notion de cascade
HTML 5 et CSS 3 (partie 2) Objectifs Connaître quelques notions avancées de CSS 3, Appréhender l affichage, Introduction au Responsive Web Design. 1. La notion de cascade On constate que l on peut avoir
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
Tutoriel n 3. Comment préparer votre support de présentation (vidéo)? Plugin «rich media» pour Moodle 2
Plugin «rich media» pour Moodle 2 Tutoriel n 3 Comment préparer votre support de présentation (vidéo)? 1 Choisissez votre solution d enregistrement Webcam Caméscope Matériel professionnel En fonction de
Media queries : gérer différentes zones de visualisation
2 Media queries : gérer différentes zones de visualisation Comme nous l avons vu au chapitre précédent, les CSS3 sont constituées de modules. Media queries est simplement l un d eux. Ce module permet d
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
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
La balise object incorporer du contenu en HTML valide strict
Qu'est ce que la balise object La balise object incorporer du contenu en HTML valide strict Beaucoup de monde insère des médias dans leur page web avec la balise non standard . Pourtant il existe
HTML5 et CSS3 pour des sites Responsive Web Design
Chapitre 1 : Introduction A. Le design Web aujourd'hui 11 B. Le Responsive Web Design 11 C. Les approches dans la conception 12 D. Le lâcher-prise 12 E. Les objectifs du livre 13 F. Les outils de l intégrateur
Mozilla Firefox 3.5. Google Chrome 3.0 LES NAVIGATEURS WEB. (pour Windows) Opéra 10. Internet Explorer 8. Safari 4.0
Mozilla Firefox 3.5 Google Chrome 3.0 LES NAVIGATEURS WEB (pour Windows) Opéra 10 Internet Explorer 8 Safari 4.0 1 1 Sommaire Qu est ce qu un navigateur Web? Fonctionnement Caractéristiques communes Caractéristiques
.. 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
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
Canvas 3D et WebGL. Louis Giraud et Laetitia Montagny. 9 Avril 2013. Université Lyon 1
Canvas 3D et WebGL Louis Giraud et Laetitia Montagny Université Lyon 1 9 Avril 2013 1 Présentation du sujet Introduction Présentation du sujet Problématique : Représenter de la 3D dans le navigateur sans
Présentation du Framework BootstrapTwitter
COUARD Kévin HELVIG-LARBRET Blandine Présentation du Framework BootstrapTwitter IUT Nice-Sophia LP-SIL IDSE Octobre 2012 Sommaire I. INTRODUCTION... 3 Définition d'un framework... 3 A propos de BootstrapTwitter...
Langage HTML (2 partie) <HyperText Markup Language> <tv>lt La Salle Avignon BTS IRIS</tv>
Langage HTML (2 partie) «Je n'ai fait que prendre le principe d - hypertexte et le relier au principe du TCP et du DNS et alors boum! ce fut le World Wide Web!» Tim Berners-Lee
Devenez un véritable développeur web en 3 mois!
Devenez un véritable développeur web en 3 mois! L objectif de la 3W Academy est de former des petits groupes d élèves au développement de sites web dynamiques ainsi qu à la création d applications web
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
{less} Guide de démarrage
{less Guide de démarrage Pré requis L'utilisation d'un pré processeur css nécessite son installation préalable. Vous pouvez choisir de tout installer du coté du serveur ou du coté du client. Votre site
Formation HTML / CSS. ar dionoea
Formation HTML / CSS ar dionoea le HTML Hyper Text Markup Language langage descriptif composé de balises interprété par le navigateur page HTML = simple fichier texte (bloc notes, vim,...) les déclarations
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
Pour en expliquer le principe, on se limitera à deux exemples :
Les Media Queries permettent donc de cibler : Le type de média La taille de l'écran La taille de la fenêtre La résolution Le nombre de couleurs L'orientation Pour en expliquer le principe, on se limitera
RESUME DE CARRIERE. Alice JULIENNE. 23 ans Nationalité Française Développeur Web Front-End. Compétences
RESUME DE CARRIERE Alice JULIENNE 23 ans Nationalité Française Développeur Web Front-End Compétences Systèmes Langages Windows (XP, 98) Macintosh OS X HTML, XHTML, CSS, XML, PHP, SQL, Javascript, J-Querry
IPHONE BANNIÈRE CLASSIQUE DIMENSIONS. Standard : 320 x 53 (portrait) 20Ko Jpeg/Gif/Png. HD : 640 x 106 (portrait) 20Ko Jpeg/Gif/Png DESCRIPTION
IPHONE BANNIÈRE CLASSIQUE DIMENSIONS Standard : 320 x 53 (portrait) 20Ko Jpeg/Gif/Png HD : 640 x 106 (portrait) 20Ko Jpeg/Gif/Png DESCRIPTION Format publicitaire très répandu et simple Permet une présence
Préconisations Portail clients SIGMA
Préconisations Portail clients SIGMA Client Web Version Minimum : Pentium 4 et 512 Mo de Ram Version Préconisée : Core 2 Duo 2 GHz et 1 Go de Ram Internet Explorer (7, 8 ou 9), Firefox Résolution minimum
Gestion Électronique de Documents et XML. Master 2 TSM
Gestion Électronique de Documents et XML Master 2 TSM I n t r o d u c t i o n Les formats de données F o r m a t s d e d o n n é e Format de donnée : manière de représenter des informations dans un document
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
CONFÉRENCE WEB 2.0. UPDATE ASBL Michaël Barchy 23 janvier 2013
CONFÉRENCE WEB 2.0 UPDATE ASBL Michaël Barchy 23 janvier 2013 POINTS ABORDÉS Qu est-ce que le Web 2.0? Introduction Différents aspects du Web 2.0 Aspects techniques Syndication et agrégation de contenu
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
Optimiser les performances d un site web. Nicolas Chevallier Camille Roux
Optimiser les performances d un site web Nicolas Chevallier Camille Roux Intellicore Tech Talks Des conférences pour partager son savoir Le mardi au CICA Sophia Antipolis http://techtalks.intellicore.net
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
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
Avanquest Software présente la nouvelle gamme WebEasy 8
La Garenne Colombes, le 22 Juin 2009 Avanquest Software présente la nouvelle gamme WebEasy 8 Des logiciels pour créer simplement des sites internet de qualité professionnelle sans aucune connaissance en
Dans nos locaux au 98 Route de Sauve 30900 NÎMES. Un ordinateur PC par stagiaire, scanner, imprimante/copieur laser couleur
FORMATION FORFAIT WEB DEVELOPPEUR Qualification ISQ OPQF Formacode 46 125 Certification de titre professionnel Web Designer + modules optionnels : Développement PHP/MySQL avancé, Web App, CMS e-boutique
RAPPORT AUDIT SEO. Élaboré à l'attention de : Monsieur Greber Élaboré par : Cédric Peinado
- RAPPORT AUDIT SEO Élaboré à l'attention de : Monsieur Greber Élaboré par : Cédric Peinado 17 septembre 2013 Table des matières Optimisation structurelle 2 Optimisation des standards, performances et
E-MAILING & NEWSLETTER NEWSLETTER RESPONSIVE
E-MAILING & NEWSLETTER NEWSLETTER RESPONSIVE mcbenveniste@gmail.com 09/2013 E-MAILING & NEWSLETTER L e-mailing consiste à envoyer des emails simultanément à un nombre important de destinataires dont le
Spétechs Mobile. D e r n i è r e m i s e à j o u r : a o û t 2014
Spétechs Mobile D e r n i è r e m i s e à j o u r : a o û t 2014 Généralités Envoi des créas à Amandine Canu, responsable traffic mobile : acanu@hi-media.com Mettre en copie de votre e-mail votre contact
Modalités pratiques. Objectifs de la Formation
WEBDESIGN Code CPF : 25097 Formation à distance sur le réseau Pyramide Du 28 septembre 2015 au 28 mai 2016* Date limite de dépôt des candidatures : 1 semaine avant le début de la formation Toutefois, certaines
Initiation aux techniques du Web. Cours L2 sciences cognitives séance 2 Charif HAYDAR: alchiekc@loria.fr
Initiation aux techniques du Web Cours L2 sciences cognitives séance 2 Charif HAYDAR: alchiekc@loria.fr La balise Intégrer un élément ou un fichier externe (video, audio, flash, pdf ). Le support
HTML. Notions générales
1 HTML Le langage HTML est le langage de base permettant de construire des pages web, que celles-ci soient destinées à être affichées sur un iphone/android ou non. Dans notre cas, HTML sera associé à CSS
WEB design. Pierre Chassany Comstone.ch vocables.com
WEB design Pierre Chassany Comstone.ch vocables.com graphisme Méthodologie(s) «Nomadisme» Responsive web design Techno tendances design 2 graphisme La direction artistique pour le web n est pas une démarche
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
les techniques d'extraction, les formulaires et intégration dans un site WEB
les techniques d'extraction, les formulaires et intégration dans un site WEB Edyta Bellouni MSHS-T, UMS838 Plan L extraction des données pour un site en ligne Architecture et techniques Les différents
Firefox pour Android. Guide de l utilisateur. press-fr@mozilla.com
Firefox pour Guide de l utilisateur press-fr@mozilla.com Table des matières À propos de Mozilla Firefox pour... 3 Prise en main... 4 Mise à niveau de la navigation mobile... 5 Déplacez-vous à la Vitesse
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.
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
RESPONSIVE DESIGN : Comment offrir à vos sites une adaptabilité parfaite?
RESPONSIVE DESIGN : Comment offrir à vos sites une adaptabilité parfaite? Medialibs, votre partenaire digital Quoi? Un partenaire pour une gestion globale du digital (un laboratoire R&D, éditeur de logiciels
Syfadis. > Configuration du poste client. Nous vous aidons à réussir. REFERENCE : Syfadis LMS - 20/06/2007. AUTEUR : Equipe technique Syfadis
Syfadis Nous vous aidons à réussir > Configuration du poste client REFERENCE : Syfadis LMS - 20/06/2007 AUTEUR : Equipe technique Syfadis Ce document est la propriété de Syfadis. Il ne peut être communiqué
TP JAVASCRIPT OMI4 TP5 SRC1 2011-2012
TP JAVASCRIPT OMI4 TP5 SRC1 2011-2012 FORMULAIRE DE CONTACT POUR PORTFOLIO PRINCIPE GENERAL Nous souhaitons réaliser un formulaire de contact comprenant les champs suivants : NOM PRENOM ADRESSE MAIL MESSAGE
Spétechs Mobile. Octobre 2013
Spétechs Mobile Octobre 2013 Appli ios Appli Android Site Mobile Les clicks URL Appli ios Créa en dur HTML5 Créa en dur Banner Interstitiel Interstitiel Vidéo Bouncing / traveling Image Bouncing / traveling
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
NFA016 : Introduction. Pour naviguer sur le Web, il faut : Naviguer: dialoguer avec un serveur web
NFA016 : Introduction O. Pons, S. Rosmorduc Conservatoire National des Arts & Métiers Pour naviguer sur le Web, il faut : 1. Une connexion au réseau Réseau Connexion physique (câbles,sans fils, ) à des
S7 Le top 10 des raisons d utiliser PHP pour moderniser votre existant IBM i
Modernisation IBM i Nouveautés 2014-2015 IBM Power Systems - IBM i 19 et 20 mai 2015 IBM Client Center, Bois-Colombes S7 Le top 10 des raisons d utiliser PHP pour moderniser votre existant IBM i Mardi
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
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
Du livre enrichi et de l EPUB 3
Assises Professionnelles du Livre A l heure du numérique 8 novembre 2011-14h00-18h00 Institut océanographique de Paris Du livre enrichi et de l EPUB 3 Les termes suivis d un astérisque sont définis dans
Toute personne souhaitant maîtriser les techniques liées à la conception de produits multimédia et à la création de sites Web.
Web Designer Durée 90 jours (630 h) Public Toute personne souhaitant maîtriser les techniques liées à la conception de produits multimédia et à la création de sites Web. Objectifs La formation Web designer
Développer des Applications Internet Riches (RIA) avec les API d ArcGIS Server. Sébastien Boutard Thomas David
Développer des Applications Internet Riches (RIA) avec les API d ArcGIS Server Sébastien Boutard Thomas David Le plan de la présentation Petit retour sur les environnements de développement ArcGIS Server
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
I. QU'EST-CE QU'UN ORDINATEUR? Un ordinateur est relié à plein de périphériques
I. QU'EST-CE QU'UN ORDINATEUR? Un ordinateur est relié à plein de périphériques I. QU'EST-CE QU'UN ORDINATEUR? Branchements sur l'unité Centrale + Connexions SANS FILS : WIFI (vers la Box Internet) Bluetooth
3W Academy Programme de Formation Développeur Intégrateur web Total : 400 heures
3W Academy Programme de Formation Développeur Intégrateur web Total : 400 heures Objectif global : A l issue de la formation, les stagiaires doivent être opérationnels dans la création d un site internet
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...
PEPSITE EST COMPATIBLE UNIQUEMENT SUR IE10+
1 Avertissements Ce document a pour but de fournir à tous les moyens pour bien débuter avec PEPSITE. Nous utiliserons donc volontairement un vocabulaire et une méthode de travail accessibles à un public
Les types de fichiers
Les types de fichiers Tristan Crolard, Sovanna Tan Septembre 2007, m.a.j. septembre 2014 1/41 Tristan Crolard, Sovanna Tan Les types de fichiers disponible sur http://lacl.fr/tan/l1/types_fichiers.pdf
Service d Audio et Visioconférence
Système de salle RNIS Système de salle IP PC/MAC Téléphone Poste passif (streaming) Appeler le Communiquer Portail Web * Appeler le Portail Web * 0141991161 votre adresse IP à Participer à la 0141991161
CATALOGUE DES OFFRES O2i INGÉNIERIE POUR LES PLATEFORMES ÉDITORIALES
CATALOGUE DES OFFRES O2i INGÉNIERIE POUR LES PLATEFORMES ÉDITORIALES SYGESP Solution éditoriale Cross-Média Fiche produit O2i + L' EXPERTISE O2I POUR LA SOLUTION Nous sommes distributeur exclusif de la
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
ANICOTTE Guillaume GUFFROY Matthieu LIMA Juliette SALLOUH Chamsseddine CAHIER DES CHARGES SI 28
ANICOTTE Guillaume GUFFROY Matthieu LIMA Juliette SALLOUH Chamsseddine CAHIER DES CHARGES SI 28 AUTOMNE 2013 SOMMAIRE Synopsis de projet 3 Concept 3 Public cible 3 Objectifs 3 Ressources médias Structuration
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
Responsive Web Design. Responsive Design avec HTML 5.0 et CSS3
Ivan MADJAROV Responsive Design avec HTML 5.0 et CSS3 HTML5 CSS3 IvMad - 2013 2 La spécification CSS3 Media Queries (requêtes de media) définit les techniques pour adapter de feuilles de styles en fonction
Syfadis. > Configuration du poste client. Nous vous aidons à réussir. REFERENCE : Syfadis LMS - 12/09/2008. AUTEUR : Equipe technique Syfadis
Syfadis Nous vous aidons à réussir > Configuration du poste client REFERENCE : Syfadis LMS - 12/09/2008 AUTEUR : Equipe technique Syfadis Ce document est la propriété de Syfadis. Il ne peut être communiqué
Spétechs Mobile. D e r n i è r e m i s e à j o u r : s e p t e m b r e 2 0 1 4
Spétechs Mobile D e r n i è r e m i s e à j o u r : s e p t e m b r e 2 0 1 4 Généralités Envoi des créas à Amandine Canu, responsable traffic mobile : acanu@hi-media.com Mettre en copie de votre e-mail
Les grandes facettes du développement Web Nicolas Thouvenin - Stéphane Gully
Les grandes facettes du développement Web Qui sommes nous? Nicolas Thouvenin Stéphane Gully Projets Web depuis 2000 LAMP, NodeJS HTML, CSS, jquery
Spécifications techniques
Infos pratiques Bon de commande: indication de réservation publicité Tablette + confirmation de livraison du matériel: envoyer à booking@trustmedia.be Matériel Papier: artwork@mediafin.be 2 jours ouvrables
+33 (0)4 92 21 33 79 contact@social-box.fr www.social-box.fr. Sarl ISB Altipolis2 av. Du Général Barbot 05100 Briancon - France
Sarl ISB Altipolis2 av. Du Général Barbot 05100 Briancon - France SCHÉMA FONCTIONNEL * Projection vers smartphones et tablettes de votre interface en Appli par Wifi (10 à 100 mètres autour de la borne)
SARL DDLX Multimédia Place du général de Gaule 34160 Boisseron Tèl :09 7219 85 01 Email : support@ddlx.org. Agence Web. Design Prestashop personnalisé
SARL DDLX Multimédia Place du général de Gaule 34160 Boisseron Tèl :09 7219 85 01 Email : support@ddlx.org Agence Web Design Prestashop personnalisé création de boutique en ligne site de présentation site
Echosgraphik. Ce document sert uniquement à vous donner une vision sur ma manière de travailler et d appréhender un projet
Echosgraphik Ce document sert uniquement à vous donner une vision sur ma manière de travailler et d appréhender un projet Présentation I. Echosgraphik Protocoles de travail I. Développement du site II.
Standards de l EPUB 3
Groupe Normes & Standards Atelier du Commission numérique Programme Introduction Exploration au cœur de l EPUB Les contenus Les ajouts aux contenus Les ajouts de structure Les enrichissements L EPUB 3
Les logiciels indispensables à installer sur votre ordinateur
Vous avez réinstallé Windows, vous venez d acquérir un nouvelle ordinateur, vous voilà donc avec un beau Windows tout propre, tout neuf et surtout tout vide. Il faut reconnaître que Windows fraîchement
Nouveau Web Client marquant, Cumulus Video Cloud, optimisations de la base de données, et plus..
INFORMATION PRODUIT : Quoi de Neuf dans Cumulus 9.0? Nouveau Web Client marquant, Cumulus Video Cloud, optimisations de la base de données, et plus.. Les nouveautés marquantes et les améliorations disponibles
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,
Design adaptatif. Guide de l utilisateur VIENNA LONDON MUNICH BERLIN PARIS HONG KONG MOSCOW ISTANBUL BEIJING ZURICH
Design adaptatif Guide de l utilisateur VIENNA LONDON MUNICH BERLIN PARIS HONG KONG MOSCOW ISTANBUL BEIJING ZURICH Contenu Définition... 3 Avantages... 3 Fonctionnalités... 5 Modèle de Design mobile...
Navigateurs Firefox / Chrome / IE / Safari et les autres
Qu est-ce qu un navigateur? Un navigateur web est un logiciel conçu pour consulter le World Wide Web ; c est-àdire surfer sur le web. Il existe de nombreux navigateurs web, pour toute sorte de matériels
Construction d un Site Internet Dynamique avec Joomla René-Yves Hervé, Ph.D.
Construction d un Site Internet Dynamique avec Joomla René-Yves Hervé, Ph.D. TABLE DES MATIÈRES I. Présentation de Joomla II. III. IV. Documents disponibles Installation de Joomla 3.1) Installation sur
indesign User Group Paris Creative Cloud (version 2014) Nouveautés Design
indesign User Group Paris Creative Cloud (version 2014) Nouveautés Design Franck Payen Jeudi 3 juillet 2014 19h00-21h00 indesign User Group Paris http://www.indesignusergroup.com/chapters/paris/ Sondage
FLEX 3. Applications Internet riches avec Flash ActionScript 3, MXML et Flex Builder. Aurélien Vannieuwenhuyze
Programmation FLEX 3 Applications Internet riches avec Flash ActionScript 3, MXML et Flex Builder Aurélien Vannieuwenhuyze Avec la contribution de Romain Pouclet Groupe Eyrolles, 2009, ISBN : 978-2-212-12387-6
Prise en main rapide
Prise en main rapide 4 Dans cette leçon, vous découvrirez les fonctionnalités de création de page web de Dreamweaver et apprendrez à les utiliser dans l espace de travail. Vous apprendrez à : définir un
Diffuser un contenu sur Internet : notions de base... 13
Diffuser un contenu sur Internet : notions de base... 13 1.1 Coup d œil sur l organisation de cet ouvrage.............. 15 Préambule : qu est-ce qu une page web?................ 16 À propos du HTML...........................
www.geomaticien.com Par Daniel FAIVRE WebMapper ... Publication de cartes pour Internet avec ArcGis
www.geomaticien.com. Par Daniel FAIVRE WebMapper......... Publication de cartes pour Internet avec ArcGis WebMapper Publication de cartes pour le web Fonctionnalités de l'application WebMapper exporte
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?
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
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
Exemple de charte d intégration web
Exemple de charte d intégration web Ce document est un exemple de charte d'intégration. Il est à adapter en fonction des contraintes, des choix, des objectifs de l'équipe, la société qui l'utilise. Il