Introduction à la programmation web

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

Download "Introduction à la programmation web"

Transcription

1 Introduction à la programmation web Nouvelles Technologies Dr. Thé Van LUONG HEIG-VD Switzerland 8 octobre /34 8 octobre / 34

2 Plan 1 État de l art des langages orientés web 2 Le langage HTML 2/34 8 octobre / 34

3 Plan 1 État de l art des langages orientés web 2 Le langage HTML 2/34 8 octobre / 34

4 Plan 1 État de l art des langages orientés web 2 Le langage HTML 3/34 État de l art des langages orientés web 8 octobre / 34

5 État de l art des langages orientés web Technologies web Voici les différentes techniques de programmation web : Le langage HTML Les feuilles de style CSS Le langage Javascript Le langage PHP Macromedia Flash Les applets Java Ajax XHTML, XML et Java 4/34 État de l art des langages orientés web 8 octobre / 34

6 État de l art des langages orientés web Le langage HTML Qu est-ce que c est le HTML? HTML (Hypertex Markup Language) est le langage universel utilisé pour communiquer sur le Web. Il s agit d un langage constitué de balises conçu pour écrire des pages webs. Le HTML omniprésent sur le web. La majorité des pages web sont au format HTML. Le navigateur internet interprète le code HTML de chaque page web, pour le transmettre sous forme d informations visuelles. 5/34 État de l art des langages orientés web 8 octobre / 34

7 État de l art des langages orientés web Le langage HTML Qu est-ce que c est le HTML? HTML (Hypertex Markup Language) est le langage universel utilisé pour communiquer sur le Web. Il s agit d un langage constitué de balises conçu pour écrire des pages webs. Le HTML omniprésent sur le web. La majorité des pages web sont au format HTML. Le navigateur internet interprète le code HTML de chaque page web, pour le transmettre sous forme d informations visuelles. 5/34 État de l art des langages orientés web 8 octobre / 34

8 État de l art des langages orientés web A quoi ressemble du code HTML? On appelle balise tout ce qui est de la forme <blabla>... </blabla>. 6/34 État de l art des langages orientés web 8 octobre / 34

9 État de l art des langages orientés web A quoi ressemble du code HTML? Et le résultat de ce code interprété : 6/34 État de l art des langages orientés web 8 octobre / 34

10 État de l art des langages orientés web Le langage CSS HTML = fond Dans le langage HTML, on va se concentrer sur le texte et le fond. CSS = forme Dans le langage CSS (Cascading Style Sheets), on se concentra sur la forme, c est à dire tout ce qui correspond à la mise en page et au style. 7/34 État de l art des langages orientés web 8 octobre / 34

11 État de l art des langages orientés web Le langage CSS 7/34 État de l art des langages orientés web 8 octobre / 34

12 État de l art des langages orientés web Le langage Javascript A quoi cela sert? Javascript est un langage de scripts qui permet d ajouter des programmes simples à une page HTML. Les programmes sont exécutés du «côté client». Interactivité côté client Contrairement au langage HTML, on peut parler de programmation dynamique. L action de l utilisateur entraine l affichage à l écran de nouveaux menus. 8/34 État de l art des langages orientés web 8 octobre / 34

13 État de l art des langages orientés web Le langage PHP Qu est-ce que c est? PHP est aussi un langage de scripts, mais cette fois cela se passe du «côté serveur». Il y a souvent une interaction avec une base données. Interactivité côté serveur Par exemple imaginez un site amateur de sondages qui stocke dans une base de données tous les avis des utilisateurs. 9/34 État de l art des langages orientés web 8 octobre / 34

14 État de l art des langages orientés web Le langage PHP 9/34 État de l art des langages orientés web 8 octobre / 34

15 État de l art des langages orientés web Le langage Flash Qu est-ce que c est? En bref, Flash est une technologie web permettant de créer des sites interactifs très soignés. Par exemple, on peut trouver Flash dans toutes les vidéos en Streaming. Mais aussi dans des sites très soignés comme les sites de cinéma. 10/34 État de l art des langages orientés web 8 octobre / 34

16 État de l art des langages orientés web Le langage Flash 10/34 État de l art des langages orientés web 8 octobre / 34

17 État de l art des langages orientés web Les applets java Qu est-ce que c est? Java est un langage de programmation, permettant de concevoir des vrais programmes informatiques. Le principe des applets Java est de mettre ces programmes Java directement sur le web. 11/34 État de l art des langages orientés web 8 octobre / 34

18 État de l art des langages orientés web Le langage Ajax Qu est-ce que c est? Ajax est une nouvelle technologie web, qui se base sur du Java et du Javascript. Elle permet de gérer une plus forte dynamicité des pages web côté client. Exemples Gmail et Facebook sont des sites fortement conçus en Ajax : Le fait de cliquer sur des onglets fait apparaitre des menus déroulants. 12/34 État de l art des langages orientés web 8 octobre / 34

19 État de l art des langages orientés web Le langage XML Qu est-ce que c est? Le XML est un langage pour informaticiens experts. Ce langage associé à du Java, permet de générer dynamiquement des pages web. Exemple : Moteur de recherche Lorsqu on tape une recherche sur Google, une page HTML est générée automatiquement et nous renvoye les résultats de la recherche. 13/34 État de l art des langages orientés web 8 octobre / 34

20 Plan 1 État de l art des langages orientés web 2 Le langage HTML 14/34 Le langage HTML 8 octobre / 34

21 Fonctionnement La majorité des pages web sont au format HTML. Le navigateur internet interprète le code HTML de chaque page web, pour le transmettre sous forme d informations visuelles. Votre travail Il ne s agit plus d utiliser le navigateur internet pour naviguer, mais d écrire du code HTML. 15/34 Le langage HTML 8 octobre / 34

22 Fonctionnement La majorité des pages web sont au format HTML. Le navigateur internet interprète le code HTML de chaque page web, pour le transmettre sous forme d informations visuelles. Votre travail Il ne s agit plus d utiliser le navigateur internet pour naviguer, mais d écrire du code HTML. 15/34 Le langage HTML 8 octobre / 34

23 Langage interprété Un outil de traitement de texte comme Word, restitue exactement votre document au moment où vous le tapez avec telle police de caractères. HTML : langage interprété En HTML au moment où vous écrivez le code, vous ne saurez jamais exactement ce que le navigateur affichera à l écran. Conséquences logiques Vous n avez pas la maîtrise totale du document. La mise en page et le style d un document en HTML sont des opérations fastidieuses. 16/34 Le langage HTML 8 octobre / 34

24 Langage interprété Un outil de traitement de texte comme Word, restitue exactement votre document au moment où vous le tapez avec telle police de caractères. HTML : langage interprété En HTML au moment où vous écrivez le code, vous ne saurez jamais exactement ce que le navigateur affichera à l écran. Conséquences logiques Vous n avez pas la maîtrise totale du document. La mise en page et le style d un document en HTML sont des opérations fastidieuses. 16/34 Le langage HTML 8 octobre / 34

25 Langage interprété Un outil de traitement de texte comme Word, restitue exactement votre document au moment où vous le tapez avec telle police de caractères. HTML : langage interprété En HTML au moment où vous écrivez le code, vous ne saurez jamais exactement ce que le navigateur affichera à l écran. Conséquences logiques Vous n avez pas la maîtrise totale du document. La mise en page et le style d un document en HTML sont des opérations fastidieuses. 16/34 Le langage HTML 8 octobre / 34

26 Définition de code On appelle balise tout ce qui est de la forme <blabla>... </blabla>. 17/34 Le langage HTML 8 octobre / 34

27 Définition de code Et le résultat de ce code interprété : 17/34 Le langage HTML 8 octobre / 34

28 Editeur web? Le langage html semble fastidieux et réservé à première vue pour des informaticiens. Pourquoi ne pas utiliser plutôt un éditeur web? On peut ainsi discuter longtemps sur plusieurs points : Intérêts pédagogiques d apprendre à se servir d un éditeur web en Master 2? Logiciel gratuit aussi performant que DreamWeaver/FrontPage? Code généré compatible entre les navigateurs? (Internet Explorer, Mozilla Firefox, Chrome, Opera, Safari... ) Si je veux intégrer du code javascript, php et flash pour mon site web, comment je fais çà facilement? 18/34 Le langage HTML 8 octobre / 34

29 Editeur web? Le langage html semble fastidieux et réservé à première vue pour des informaticiens. Pourquoi ne pas utiliser plutôt un éditeur web? On peut ainsi discuter longtemps sur plusieurs points : Intérêts pédagogiques d apprendre à se servir d un éditeur web en Master 2? Logiciel gratuit aussi performant que DreamWeaver/FrontPage? Code généré compatible entre les navigateurs? (Internet Explorer, Mozilla Firefox, Chrome, Opera, Safari... ) Si je veux intégrer du code javascript, php et flash pour mon site web, comment je fais çà facilement? 18/34 Le langage HTML 8 octobre / 34

30 Editeur web? Le langage html semble fastidieux et réservé à première vue pour des informaticiens. Pourquoi ne pas utiliser plutôt un éditeur web? On peut ainsi discuter longtemps sur plusieurs points : Intérêts pédagogiques d apprendre à se servir d un éditeur web en Master 2? Logiciel gratuit aussi performant que DreamWeaver/FrontPage? Code généré compatible entre les navigateurs? (Internet Explorer, Mozilla Firefox, Chrome, Opera, Safari... ) Si je veux intégrer du code javascript, php et flash pour mon site web, comment je fais çà facilement? 18/34 Le langage HTML 8 octobre / 34

31 Editeur web? Le langage html semble fastidieux et réservé à première vue pour des informaticiens. Pourquoi ne pas utiliser plutôt un éditeur web? On peut ainsi discuter longtemps sur plusieurs points : Intérêts pédagogiques d apprendre à se servir d un éditeur web en Master 2? Logiciel gratuit aussi performant que DreamWeaver/FrontPage? Code généré compatible entre les navigateurs? (Internet Explorer, Mozilla Firefox, Chrome, Opera, Safari... ) Si je veux intégrer du code javascript, php et flash pour mon site web, comment je fais çà facilement? 18/34 Le langage HTML 8 octobre / 34

32 Editeur web? Le langage html semble fastidieux et réservé à première vue pour des informaticiens. Pourquoi ne pas utiliser plutôt un éditeur web? On peut ainsi discuter longtemps sur plusieurs points : Intérêts pédagogiques d apprendre à se servir d un éditeur web en Master 2? Logiciel gratuit aussi performant que DreamWeaver/FrontPage? Code généré compatible entre les navigateurs? (Internet Explorer, Mozilla Firefox, Chrome, Opera, Safari... ) Si je veux intégrer du code javascript, php et flash pour mon site web, comment je fais çà facilement? 18/34 Le langage HTML 8 octobre / 34

33 Editeur web? Quel est vraiment l avantage de faire du code HTML? On peut là aussi discuter longtemps : Difficile d apprentissage seul mais une compétence recherchée dans le monde industriel. Si respects standards W3C, code compatible sur tous les navigateurs. Un simple éditeur texte comme notepad suffit et code compatible tout système d exploitation (Mac, Windows, Linux). Conception du document de A à Z (chirurgie) => Compréhension totale du document web. Intégration de code dans des sites web populaires (myspace, ebay,... ). 19/34 Le langage HTML 8 octobre / 34

34 Editeur web? Quel est vraiment l avantage de faire du code HTML? On peut là aussi discuter longtemps : Difficile d apprentissage seul mais une compétence recherchée dans le monde industriel. Si respects standards W3C, code compatible sur tous les navigateurs. Un simple éditeur texte comme notepad suffit et code compatible tout système d exploitation (Mac, Windows, Linux). Conception du document de A à Z (chirurgie) => Compréhension totale du document web. Intégration de code dans des sites web populaires (myspace, ebay,... ). 19/34 Le langage HTML 8 octobre / 34

35 Editeur web? Quel est vraiment l avantage de faire du code HTML? On peut là aussi discuter longtemps : Difficile d apprentissage seul mais une compétence recherchée dans le monde industriel. Si respects standards W3C, code compatible sur tous les navigateurs. Un simple éditeur texte comme notepad suffit et code compatible tout système d exploitation (Mac, Windows, Linux). Conception du document de A à Z (chirurgie) => Compréhension totale du document web. Intégration de code dans des sites web populaires (myspace, ebay,... ). 19/34 Le langage HTML 8 octobre / 34

36 Editeur web? Quel est vraiment l avantage de faire du code HTML? On peut là aussi discuter longtemps : Difficile d apprentissage seul mais une compétence recherchée dans le monde industriel. Si respects standards W3C, code compatible sur tous les navigateurs. Un simple éditeur texte comme notepad suffit et code compatible tout système d exploitation (Mac, Windows, Linux). Conception du document de A à Z (chirurgie) => Compréhension totale du document web. Intégration de code dans des sites web populaires (myspace, ebay,... ). 19/34 Le langage HTML 8 octobre / 34

37 Editeur web? Quel est vraiment l avantage de faire du code HTML? On peut là aussi discuter longtemps : Difficile d apprentissage seul mais une compétence recherchée dans le monde industriel. Si respects standards W3C, code compatible sur tous les navigateurs. Un simple éditeur texte comme notepad suffit et code compatible tout système d exploitation (Mac, Windows, Linux). Conception du document de A à Z (chirurgie) => Compréhension totale du document web. Intégration de code dans des sites web populaires (myspace, ebay,... ). 19/34 Le langage HTML 8 octobre / 34

38 Editeur web? Quel est vraiment l avantage de faire du code HTML? On peut là aussi discuter longtemps : Difficile d apprentissage seul mais une compétence recherchée dans le monde industriel. Si respects standards W3C, code compatible sur tous les navigateurs. Un simple éditeur texte comme notepad suffit et code compatible tout système d exploitation (Mac, Windows, Linux). Conception du document de A à Z (chirurgie) => Compréhension totale du document web. Intégration de code dans des sites web populaires (myspace, ebay,... ). 19/34 Le langage HTML 8 octobre / 34

39 Editeur web? En ce qui concerne le projet final de création de site web? Tolérance quant à la création d un site web à l aide d un éditeur web. Intolérance quant à la qualité du code généré et compatibilité navigateurs. Est-ce que l utilisation d un éditeur web produit de meilleurs sites internet? 20/34 Le langage HTML 8 octobre / 34

40 Editeur web? En ce qui concerne le projet final de création de site web? Tolérance quant à la création d un site web à l aide d un éditeur web. Intolérance quant à la qualité du code généré et compatibilité navigateurs. Est-ce que l utilisation d un éditeur web produit de meilleurs sites internet? 20/34 Le langage HTML 8 octobre / 34

41 Editeur web? En ce qui concerne le projet final de création de site web? Tolérance quant à la création d un site web à l aide d un éditeur web. Intolérance quant à la qualité du code généré et compatibilité navigateurs. Est-ce que l utilisation d un éditeur web produit de meilleurs sites internet? 20/34 Le langage HTML 8 octobre / 34

42 Si les discussions sont terminées, on peut maintenant passer à la partie dure... 21/34 Le langage HTML 8 octobre / 34

43 Balises Une balise est une instruction qui marque une action à interpréter pour le navigateur. <html> <head> < t i t l e > T i t r e de l a page < / t i t l e > < / head> <body> <h2> Un document HTML < / h2> V o i c i un <b> exemple simple < / b> de < i > ce que l on peut f a i r e < / i > avec l e langage HTML. < / body> < / html> 22/34 Le langage HTML 8 octobre / 34

44 Balises propriétés Une balise s ouvre et se ferme toujours. ex : <html>... </html>. Une balise peut être écrite en minuscules ou en majuscules. ex : <B>... </b> Les espaces et sauts de lignes sont ignorés. Dans le HTML, il n y a pas de mise en page. 23/34 Le langage HTML 8 octobre / 34

45 Balises propriétés Une balise s ouvre et se ferme toujours. ex : <html>... </html>. Une balise peut être écrite en minuscules ou en majuscules. ex : <B>... </b> Les espaces et sauts de lignes sont ignorés. Dans le HTML, il n y a pas de mise en page. 23/34 Le langage HTML 8 octobre / 34

46 Balises propriétés Une balise s ouvre et se ferme toujours. ex : <html>... </html>. Une balise peut être écrite en minuscules ou en majuscules. ex : <B>... </b> Les espaces et sauts de lignes sont ignorés. Dans le HTML, il n y a pas de mise en page. 23/34 Le langage HTML 8 octobre / 34

47 Balises de structure de document Voila les trois balises obligatoires qui définissent le document HTML : 1 La balise <html>. Tout page HTML doit débuter par <html> et se finir par </html>. Cette balise définit le type du document. 2 La balise <head>. Il s agit de l entête du document HTML. On peut y ajouter des informations diverses (exemple CSS ou Javascript). 3 La balise <body>. Il s agit du corps du document. C est ici que l on va mettre tout le contenu du document. 24/34 Le langage HTML 8 octobre / 34

48 Balises de structure de document Voila les trois balises obligatoires qui définissent le document HTML : 1 La balise <html>. Tout page HTML doit débuter par <html> et se finir par </html>. Cette balise définit le type du document. 2 La balise <head>. Il s agit de l entête du document HTML. On peut y ajouter des informations diverses (exemple CSS ou Javascript). 3 La balise <body>. Il s agit du corps du document. C est ici que l on va mettre tout le contenu du document. 24/34 Le langage HTML 8 octobre / 34

49 Balises de structure de document Voila les trois balises obligatoires qui définissent le document HTML : 1 La balise <html>. Tout page HTML doit débuter par <html> et se finir par </html>. Cette balise définit le type du document. 2 La balise <head>. Il s agit de l entête du document HTML. On peut y ajouter des informations diverses (exemple CSS ou Javascript). 3 La balise <body>. Il s agit du corps du document. C est ici que l on va mettre tout le contenu du document. 24/34 Le langage HTML 8 octobre / 34

50 Balises de structure de document <html> <head> i c i du code css / j a v a s c r i p t... < / head> <body> Tout l e contenu de notre page web va ê t r e i c i. < / body> < / html> 25/34 Le langage HTML 8 octobre / 34

51 création d un document HTML Document HTML La création se fait avec un éditeur de texte (exemple : Notepad) Étape de création 1 Ouvrir Bloc-notes. (Démarrer -> Exécuter -> Notepad) 2 Fichier -> Enregistrer sous 3 Nom du fichier : nomdocument.html ; Type : Tous les fichiers 26/34 Le langage HTML 8 octobre / 34

52 création d un document HTML Exercice Créer sa page HTML avec les balises de structure <html>, <head>, <body> Ecrire du texte dans la balise <body> </body> 26/34 Le langage HTML 8 octobre / 34

53 La balise <head> Dans l entête du document, on peut placer diverses informations comme du code CSS, ou du code Javascript. (entre <head>... </head>) Titre au document La balise <title> qui se met exclusivement entre <head>... </head> permet de mettre à l extérieur de la fenêtre du document web. Exercice Mettre un titre. Le voyez-vous? 27/34 Le langage HTML 8 octobre / 34

54 La balise <head> Dans l entête du document, on peut placer diverses informations comme du code CSS, ou du code Javascript. (entre <head>... </head>) Titre au document La balise <title> qui se met exclusivement entre <head>... </head> permet de mettre à l extérieur de la fenêtre du document web. Exercice Mettre un titre. Le voyez-vous? 27/34 Le langage HTML 8 octobre / 34

55 La balise <head> Dans l entête du document, on peut placer diverses informations comme du code CSS, ou du code Javascript. (entre <head>... </head>) Titre au document La balise <title> qui se met exclusivement entre <head>... </head> permet de mettre à l extérieur de la fenêtre du document web. Exercice Mettre un titre. Le voyez-vous? 27/34 Le langage HTML 8 octobre / 34

56 Les balises de style Contenu de <body> Dans la balise <body>, on va mettre tout le contenu de notre document. Balises de styles La balise <b> permet de mettre du texte en gras. La balise <i> permet de mettre du texte en italique. 28/34 Le langage HTML 8 octobre / 34

57 Gras et italique Exercice Reproduire la phrase ci-dessous. Voici un exemple simple de ce que l on peut faire avec le langage HTML. 29/34 Le langage HTML 8 octobre / 34

58 Gras et italique Exercice bold : <b>...</b> italic : <i>...</i> underline :?? 29/34 Le langage HTML 8 octobre / 34

59 Titres dans un document Balises de titres Les balises <h1>, <h2>, <h3>, <h4> permettent de mettre des titres dans le document. Exercice Pouvez-créer une nouvelle page html depuis le début avec une utilisation des balises de titres? 30/34 Le langage HTML 8 octobre / 34

60 Titres dans un document Balises de titres Les balises <h1>, <h2>, <h3>, <h4> permettent de mettre des titres dans le document. Exercice Pouvez-créer une nouvelle page html depuis le début avec une utilisation des balises de titres? 30/34 Le langage HTML 8 octobre / 34

61 Mise en page Les espaces en HTML n étant pas comptabilisés, on a des balises de saut de ligne : Balises de saut de lignes <p></p> permet de sauter une ligne. <br></br> permet d aller à la ligne. 31/34 Le langage HTML 8 octobre / 34

62 Mise en page Remarque Comme logiquement il n y a rien à mettre entre ces balises, la syntaxe appropriée devrait être : <p /> <br /> 31/34 Le langage HTML 8 octobre / 34

63 Attributs Notion d attributs Certaines balises possèdent des attributs. Il y a des balises qui ont des attributs obligatoires et d autres qui ont des attributs facultatifs. <balise attribut1="valeur1" attribut2="valeur2" etc.>... </balise>. Exemple d attribut facultatif <body bgcolor="red">... </body> Exemple d attributs facultatifs <body bgcolor="red" text="yellow">... </body> Exemple d attribut obligatoire <img src="mesimages/lettre.jpg" /> 32/34 Le langage HTML 8 octobre / 34

64 Attributs Notion d attributs Certaines balises possèdent des attributs. Il y a des balises qui ont des attributs obligatoires et d autres qui ont des attributs facultatifs. <balise attribut1="valeur1" attribut2="valeur2" etc.>... </balise>. Exemple d attribut facultatif <body bgcolor="red">... </body> Exemple d attributs facultatifs <body bgcolor="red" text="yellow">... </body> Exemple d attribut obligatoire <img src="mesimages/lettre.jpg" /> 32/34 Le langage HTML 8 octobre / 34

65 Attributs Notion d attributs Certaines balises possèdent des attributs. Il y a des balises qui ont des attributs obligatoires et d autres qui ont des attributs facultatifs. <balise attribut1="valeur1" attribut2="valeur2" etc.>... </balise>. Exemple d attribut facultatif <body bgcolor="red">... </body> Exemple d attributs facultatifs <body bgcolor="red" text="yellow">... </body> Exemple d attribut obligatoire <img src="mesimages/lettre.jpg" /> 32/34 Le langage HTML 8 octobre / 34

66 Attributs Notion d attributs Certaines balises possèdent des attributs. Il y a des balises qui ont des attributs obligatoires et d autres qui ont des attributs facultatifs. <balise attribut1="valeur1" attribut2="valeur2" etc.>... </balise>. Exemple d attribut facultatif <body bgcolor="red">... </body> Exemple d attributs facultatifs <body bgcolor="red" text="yellow">... </body> Exemple d attribut obligatoire <img src="mesimages/lettre.jpg" /> 32/34 Le langage HTML 8 octobre / 34

67 Balises de texte Balise <font> <font>... </font> spécifie une balise de texte. Elle doit avoir un attribut : color="... " pour spécifier une couleur. size="... " pour spécifier une taille. 33/34 Le langage HTML 8 octobre / 34

68 Balises de séparation Trait de séparation <hr /> pour tracer une ligne horizontale. Attributs facultatifs size="nbpixels". Épaisseur du trait où nbpixels décrit un nombre de pixels. width="nombre". Longueur du trait où nombre peut être un nombre de pixels ou un pourcentage. color="couleurs". 34/34 Le langage HTML 8 octobre / 34

HTML. Notions générales

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

Plus en détail

Écriture de pages Web

Écriture de pages Web Écriture de pages Web Le langage HTML / XHTML Laurent Tichit Janvier 2011 Laurent Tichit 2005-2010 1 Comment fonctionne le Web? C'est un mécanisme client-serveur. Logiciel serveur : programme qui a pour

Plus en détail

Web HTML. Arnaud Sallaberry arnaud.sallaberry@univ- montp3.fr

Web HTML. Arnaud Sallaberry arnaud.sallaberry@univ- montp3.fr Web HTML Arnaud Sallaberry arnaud.sallaberry@univ- montp3.fr 1 Plan Fonc-onnement du web Le langage HTML 2 Web : Introduc;on Réseau : mise en commun de ressources (données, imprimantes, ) Internet : Interconnexion

Plus en détail

Initiation au Web et à l HTML

Initiation au Web et à l HTML Initiation au Web et à l 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 /39 Thibault

Plus en détail

Initiation au Web et à l HTML

Initiation au Web et à l HTML Initiation au Web et à l HTML Mathieu LACROIX, François RÉVERET, Antoine VACAVANT mathieu.lacroix@isima.fr françois.reveret@univ-bpclermont.fr antoine.vacavant@liris.cnrs.fr 2 et 3 Avril 2007 /40 Mathieu

Plus en détail

INTRODUCTION CHAPITRE 1

INTRODUCTION CHAPITRE 1 CHAPITRE 1 INTRODUCTION Query, qu est-ce que c est?... 11 HTML, CSS, JavaScript, PHP : qui fait quoi?... 16 Un environnement de développement simple et gratuit... 19 Ce que vous allez apprendre... 20 9

Plus en détail

//////////////////////////////////////////////////////////////////// Développement Web

//////////////////////////////////////////////////////////////////// Développement Web ////////////////////// Développement Web / INTRODUCTION Développement Web Le développement, également appelé programmation, désigne l'action de composer des programmes sous forme d'algorithme (codage).

Plus en détail

TP 8 : Créer son site web de D à Z...

TP 8 : Créer son site web de D à Z... TP 8 : Créer son site web de D à Z... Présentation Nous allons tenter de créer en 2 ou trois séances un site WEB de toute pièce. Vous devrez choisir un thème (ce que vous voulez, ou presque...). Vous établirez

Plus en détail

Comment faire pour créer un site web? (mon site, pas à pas)

Comment faire pour créer un site web? (mon site, pas à pas) Comment faire pour créer un site web? (mon site, pas à pas) Author : soufiane Bonjour, Bienvenue dans cette nouvelle série de tutoriels destinée aux débutants cherchant comment créer un site web de A à

Plus en détail

Bac Professionnel Systèmes Electroniques Numériques

Bac Professionnel Systèmes Electroniques Numériques DR - Création d un site WEB TP Le HTML Pour créer un site web, on doit indiquer des informations à l'ordinateur. Il ne suffit pas de taper simplement le texte qu'il y aura dans son site, il faut aussi

Plus en détail

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 jquery Mobile La bibliothèque JavaScript pour le Web mobile É r i c S a r r i o n Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 1 Installation de jquery Mobile

Plus en détail

Petite histoire d Internet

Petite histoire d Internet À la base, Internet est défini par des ordinateurs qui sont reliés entre eux grâce à des câbles, du WiFi ou encore des satellites, créant ainsi un réseau à échelle mondiale. Les ordinateurs communiquent

Plus en détail

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

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

Plus en détail

Il faudra absolument séparer le contenu de la page web (le fichier HTML) de son apparence (le fichier CSS).

Il faudra absolument séparer le contenu de la page web (le fichier HTML) de son apparence (le fichier CSS). ISN- semaine 10 HTML 1. Introduction HTML et CSS : deux langages pour créer un site web Pour créer un site web, on doit donner des instructions à l'ordinateur. Il ne suffit pas simplement de taper le texte

Plus en détail

SITE WEB. Définition. Ensemble de fichiers reliés entre eux et déposés sur un serveur internet. Ordinateur connecté au réseau

SITE WEB. Définition. Ensemble de fichiers reliés entre eux et déposés sur un serveur internet. Ordinateur connecté au réseau SITE WEB Définition Ensemble de fichiers reliés entre eux et déposés sur un serveur internet. Ordinateur connecté au réseau Comment mon site est sur internet Je crée mon site sur mon ordinateur, en local.

Plus en détail

Programme de Formation

Programme de Formation Windows / PC - initiation Etre à l aise avec Windows, savoir se situer, organiser son environnement et classer ses documents Tout utilisateur désireux d être rapidement autonome dans l utilisation de l

Plus en détail

Le langage PHP permet donc de construire des sites web dynamiques, contrairement au langage HTML, qui donnera toujours la même page web.

Le langage PHP permet donc de construire des sites web dynamiques, contrairement au langage HTML, qui donnera toujours la même page web. Document 1 : client et serveur Les ordinateurs sur lesquels sont stockés les sites web sont appelés des serveurs. Ce sont des machines qui sont dédiées à cet effet : elles sont souvent sans écran et sans

Plus en détail

Langage (X)HTML Damien Nouvel

Langage (X)HTML Damien Nouvel Langage (X)HTML Plan Quelques statistiques du web Architecture client / serveur Langage XML Mise en forme HTML Structure d'un document HTML 2 / 36 Plan Quelques statistiques du web Architecture client

Plus en détail

Une (petite) initiation au langage HTML

Une (petite) initiation au langage HTML Une (petite) initiation au langage HTML Julien Coulié Partie 1 : Les bases Le langage HTML (HyperText Markup Language) est un langage de description de documents qui est le standard utilisé pour les pages

Plus en détail

Création de sites web. INF0326 Outils bureautiques, logiciels et Internet

Création de sites web. INF0326 Outils bureautiques, logiciels et Internet Création de sites web INF0326 Outils bureautiques, logiciels et Internet Plan Création de pages web HTML et CSS Création de sites web avec WordPress Créer des pages web Partie 1 Système hypertexte Un système

Plus en détail

Bernard Lecomte. Débuter avec HTML

Bernard Lecomte. Débuter avec HTML Bernard Lecomte Débuter avec HTML Débuter avec HTML Ces quelques pages ont pour unique but de vous donner les premiers rudiments de HTML. Quand vous les aurez lues, vous saurez réaliser un site simple.

Plus en détail

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

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

Plus en détail

Langages du Web. Que savez vous???

Langages du Web. Que savez vous??? Langages du Web Que savez vous??? Le WEB World Wide Web ouwww ouweb Toile d'araignée mondiale ou la toile Le Web utilise le réseau Internet pour relier des serveurs qui, grâce aux protocoles HTTP, HTTPS,

Plus en détail

bookmark), sachant qu'à chaque favori est associée une adresse web ; o suivre un hyperlien, sachant qu'à chaque hyperlien est associée une

bookmark), sachant qu'à chaque favori est associée une adresse web ; o suivre un hyperlien, sachant qu'à chaque hyperlien est associée une Introduction : On appelle «Web», contraction de «World Wide Web» (d'où l'acronyme www), une des possibilités offertes par le réseau Internet de naviguer entre des documents reliés par des liens hypertextes.

Plus en détail

IFT1148 Introduction

IFT1148 Introduction IFT1148 Introduction Michael Blondin Direction de l enseignement de service en informatique Université de Montréal Hiver 2011 1 / 17 HTML Le HTML (ou XHTML) est un langage de balisage permettant de décrire

Plus en détail

Mohammed REZGUI m.rezgui06@gmail.com. Basé sur le cours de Guillaume Perez

Mohammed REZGUI m.rezgui06@gmail.com. Basé sur le cours de Guillaume Perez Mohammed REZGUI m.rezgui06@gmail.com Basé sur le cours de Guillaume Perez Contenu, Organisation Objectif principal: Base pour la création d un site Notions de client-serveur Notions de programmations Option

Plus en détail

L utilisation d outils intelligents pour écrire du code valide

L utilisation d outils intelligents pour écrire du code valide B L utilisation d outils intelligents pour écrire du code valide Toutes les méthodes de développement, sans exception, incluent au moins une étape de test du code. C est parce que le code écrit par la

Plus en détail

Introduction à Expression Web 2

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

Plus en détail

Programmation Avancée pour le Web

Programmation Avancée pour le Web L3 Informatique Option : ISIL Programmation Avancée pour le Web RAMDANI Med U Bouira 1 Contenu du module Introduction aux applications Web Rappels sur les sites Web Conception d une application Web Notion

Plus en détail

Introduction à la conception de sites web

Introduction à la conception de sites web Introduction à la conception de sites web Yannick Prié UFR Informatique Université Claude Bernard Lyon 1 9-16 janvier 2006 1- Les grands principes du web (1) Client / serveur réseau programmes communicants

Plus en détail

1. Introduction. 2. Objectifs de la réalisation. 3. Analyse de besoins

1. Introduction. 2. Objectifs de la réalisation. 3. Analyse de besoins 1. Introduction Le travail consiste à concevoir et à élaborer un dispositif de formation à distance, qui va au-delà de simples pages web statiques. On a choisi de faire appel à tout un module d apprentissage

Plus en détail

Programmation Web. Madalina Croitoru IUT Montpellier

Programmation Web. Madalina Croitoru IUT Montpellier Programmation Web Madalina Croitoru IUT Montpellier Organisation du cours 4 semaines 4 ½ h / semaine: 2heures cours 3 ½ heures TP Notation: continue interrogation cours + rendu à la fin de chaque séance

Plus en détail

TP 1 : HTML 4. EXERCICE 1 : UN PREMIER DOCUMENT HTML Pour cet exercice, vous utiliserez l éditeur de texte standard de Windows

TP 1 : HTML 4. EXERCICE 1 : UN PREMIER DOCUMENT HTML Pour cet exercice, vous utiliserez l éditeur de texte standard de Windows TP 1 : HTML 4 EXERCICE 1 : UN PREMIER DOCUMENT HTML Pour cet exercice, vous utiliserez l éditeur de texte standard de Windows : Bloc-notes ou bien EDIT en mode MS-DOS suivant votre ordinateur. Les utilisateurs

Plus en détail

Produire du code HTML

Produire du code HTML 3 Produire du code HTML Même si l on ne sait pas encore écrire du code HTML, il est important de savoir comment on pourra produire celui-ci. Nous allons voir trois méthodes pour taper du code HTML. Avec

Plus en détail

Les sites Internet dynamiques. contact : Patrick VINCENT pvincent@erasme.org

Les sites Internet dynamiques. contact : Patrick VINCENT pvincent@erasme.org Les sites Internet dynamiques contact : Patrick VINCENT pvincent@erasme.org Qu est-ce qu un site Web? ensemble de pages multimédia (texte, images, son, vidéo, ) organisées autour d une page d accueil et

Plus en détail

PROFIL. Intégrateur Web. Missions

PROFIL. Intégrateur Web. Missions L intégrateur HTML est chargé de développer la partie front office des sites internet ou encore de coder les newsletters en HTML. À partir des éléments graphiques fournis au format Photoshop, il réalise

Plus en détail

La mise en page web, feuille de style, cadre.

La mise en page web, feuille de style, cadre. La mise en page web, feuille de style, cadre. L importance du navigateur, son rôle est de lire le code HTML et CSS afin d afficher un résultat visuel à l écran, le problème est que les navigateurs n affichent

Plus en détail

Cours de programmation web

Cours de programmation web Cours de programmation web ENSAE 2006-2007 Cours 1 - Introduction 1. Introduction 2. Le principe d Internet 3. Les langages du web 4. Le web 2.0 Introduction : Historique 1967 : Arpanet : réseau militaire

Plus en détail

Réaliser une page du site http://la-ba.lyceegutenberg.net

Réaliser une page du site http://la-ba.lyceegutenberg.net Réaliser une page du site http://la-ba.lyceegutenberg.net Réaliser une page du site http://la-ba.lyceegutenberg.net Récupérer les éléments récupérer sur le bureau de votre ordinateur à partir du serveur

Plus en détail

Formation HTML / CSS. ar dionoea

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

Plus en détail

Ce code peut s insérer à plusieurs endroits entre les balises head (le plus souvent) ou directement à l intérieur des balises body.

Ce code peut s insérer à plusieurs endroits entre les balises head (le plus souvent) ou directement à l intérieur des balises body. A/ Utilisation de Javascript UE Libre : Internet et composition de pages Web TP n 3 Le Javascript est un langage de script incorporé dans un document HTML. Historiquement il s'agit même du premier langage

Plus en détail

Arbres Mathématiques Informatique et Navigateurs Internet

Arbres Mathématiques Informatique et Navigateurs Internet Arbres Mathématiques Informatique et Navigateurs Internet Jacques Duma http://math.et.info.free.fr/ http://ateliermathematique.free.fr/ Arbres Expressions Mathématiques Structure arborescente de l expression

Plus en détail

TIC. Réseau informatique. Historique - 1. Historique - 2. TC - IUT Montpellier Internet et le Web

TIC. Réseau informatique. Historique - 1. Historique - 2. TC - IUT Montpellier Internet et le Web Réseau informatique TIC TC - IUT Montpellier Internet et le Web Ensemble d'ordinateurs reliés entre eux et échangeant des informations sous forme de données numériques But : Rendre disponible l information

Plus en détail

de survie du chef de projet

de survie du chef de projet KIT de survie du chef de projet 01 1 2 3 4 5 6 04 03 07 07 03 03 LE SERVEUR LE CLIENT TECHNOLOGIE WEB CLIENT LE SERVEUR WEB TECHNIQUES & CADRE DE TRAVAIL APPLICATIONS 101 LE SERVEUR Un serveur informatique

Plus en détail

Initiation au Web et à l'html

Initiation au Web et à l'html Initiation au Web et à l'html Mathieu LACROIX, François RÉVERET, Antoine VACAVANT mathieu.lacroix@isima.fr françois.reveret@univ-bpclermont.fr antoine.vacavant@liris.cnrs.fr 2 et 3 Avril 2007 /1 Mathieu

Plus en détail

Développement Web Introduction générale

Développement Web Introduction générale 1 / 58 Développement Web Introduction générale Jean-Michel Richer jean-michel.richer@univ-angers.fr http://www.info.univ-angers.fr/pub/richer Juillet 2008 2 / 58 Plan Plan 1 Introduction 2 Historique et

Plus en détail

pour apprendre le langage html

pour apprendre le langage html pour apprendre le langage html introduction : Voici ce que vous devez savoir avant de continuer : Tout d' abord, il faut préciser que le langage HTML est relativement simple mais que celui ci impose au

Plus en détail

INTEGRATEUR DEVELOPPEUR

INTEGRATEUR DEVELOPPEUR www.emweb.fr INTEGRATEUR DEVELOPPEUR FORMATION ELIGIBLE AU DIF/CIF DURÉE : 700 h de formation PRE REQUIS Avoir un esprit logique Etre motivé(e)! OBJECTIF A l issue de cette formation, vous serez capable

Plus en détail

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

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

Plus en détail

SOUTENANCE ORALE RAPPORT DE PROJET D INFORMATIQUE

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

Plus en détail

NFA016 : Introduction. Pour naviguer sur le Web, il faut : Naviguer: dialoguer avec un serveur web

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

Plus en détail

Initiation à Dreamweaver

Initiation à Dreamweaver Benjamin Godefroy Redouane Zarghoune Initiation à Dreamweaver SI28 Ecriture interactive et multimédia Automne 2004 Organisation du TD Préambule : Introduction au HTML Présentation de Dreamweaver Exercices

Plus en détail

Les outils du Web* : comment ça marche et à quoi ça sert?

Les outils du Web* : comment ça marche et à quoi ça sert? Sites Web Les outils du Web* : comment ça marche et à quoi ça sert? Sites marchands, e-commerce Forums Blogs Réseaux sociaux grand public : Facebook, Twitter Réseaux sociaux professionnels : Linkedin,

Plus en détail

Initiation à l informatique. Module 6 : La navigation Internet basique

Initiation à l informatique. Module 6 : La navigation Internet basique Initiation à l informatique. Module 6 : La navigation Internet basique Système d exploitation utilisé : Windows XP Service Pack 2 Créé par Xavier CABANAT Version 1.0 Document créé par Xavier CABANAT Page

Plus en détail

NVU, Notepad++ (ou le bloc-note), MySQL, PhpMyAdmin. HTML, PHP, cas d utilisation, maquettage, programmation connaissances en HTML, PHP et SQL

NVU, Notepad++ (ou le bloc-note), MySQL, PhpMyAdmin. HTML, PHP, cas d utilisation, maquettage, programmation connaissances en HTML, PHP et SQL Prise en main de NVU et Notepad++ (conception d application web avec PHP et MySql) Propriétés Intitulé long Formation concernée Matière Présentation Description Conception de pages web dynamiques à l aide

Plus en détail

Jeudi 13 Janvier Jean-Marie Favreau Thomas Petazzoni

Jeudi 13 Janvier Jean-Marie Favreau Thomas Petazzoni XHTML / CSS Un duo gagnant pour un Web moderne Jeudi 13 Janvier Jean-Marie Favreau Thomas Petazzoni XML : extensible Markup Language Meta-language : permet de définir des languages Normalisé par le W3C

Plus en détail

Introduction http:// www.mediaforma.com/formation-html5-et-css3

Introduction http:// www.mediaforma.com/formation-html5-et-css3 Introduction Ce livre est un concentré de code HTML5 et CSS3 prêt à l emploi 1. Il se divise en seize chapitres thématiques. Vous êtes un dévelop peur de niveau intermédiaire ou avancé? Vous y trouverez

Plus en détail

Introduction http://www.mediaforma.com/

Introduction http://www.mediaforma.com/ Ce livre est un concentré de code HTML5 et CSS3 prêt à l emploi 1. Il se divise en seize chapitres thématiques. Vous êtes un développeur de niveau intermédiaire ou avancé? Vous y trouverez de nombreux

Plus en détail

Les outils de création de sites web

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

Plus en détail

Interfaces Homme/Machine et ergonomie d un site web

Interfaces Homme/Machine et ergonomie d un site web Interfaces Homme/Machine et ergonomie d un site web Apprendre à réaliser une interface Homme/Machine web en HTML 5 et CSS 3.0, à la structurer et à optimiser son ergonomie Retrouvez ce cours sur http://iut.e-concept-applications.fr

Plus en détail

Méthodologie et exercices d'internet et du multimédia

Méthodologie et exercices d'internet et du multimédia Méthodologie et exercices d'internet et du multimédia acohen@ulb.ac.be 1 Introduction Statut du cours Projet Organisation du cours Environnement du travail Mode d'évaluation 2 Statut du cours Année(s)

Plus en détail

Rapport du project Editeur web

Rapport du project Editeur web Rapport du project Editeur web 13 février 2009 Table des matières 1 Cahier des Charges 1 1.1 Introduction.............................. 1 1.2 Analyse de quelques éditeurs web existants............ 1 1.3

Plus en détail

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

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

Plus en détail

Création d un site web pour la Communauté des communes du pays vernois et du terroir de la truffe

Création d un site web pour la Communauté des communes du pays vernois et du terroir de la truffe Simon Benjamin BTS SIO Rapport de stage : Création d un site web pour la Communauté des communes du pays vernois et du terroir de la truffe Entreprises : 2014/2015-1 - - 2 - Remerciements Je tiens tout

Plus en détail

Le langage JAVASCRIPT

Le langage JAVASCRIPT Le langage JAVASCRIPT I Introduction Vous vous dites encore un langage alors qu il y en a déjà un nombre non négligeable. En effet un de plus, mais à chaque langage son utilisation et sa particularité.

Plus en détail

Programmation Avancée pour le Web

Programmation Avancée pour le Web L3 Informatique Option : ISIL Programmation Avancée pour le Web RAMDANI Med U Bouira 1 Contenu du module Introduction aux applications Web Rappels sur les sites Web Conception d une application Web Notion

Plus en détail

WinTask : Automatisation de sites Web

WinTask : Automatisation de sites Web WinTask : Automatisation de sites Web Introduction Ce document a pour but de vous faire découvrir WinTask, le logiciel d'automatisation de tâches pour Windows et sites Web. WinTask vous permet d'automatiser

Plus en détail

APP-TSWD Apprentissage Par Problèmes Techniques des Sites Web Dynamiques Licence Professionnelle FNEPI

APP-TSWD Apprentissage Par Problèmes Techniques des Sites Web Dynamiques Licence Professionnelle FNEPI APP-TSWD Apprentissage Par Problèmes Techniques des Sites Web Dynamiques Licence Professionnelle FNEPI Cours en Réponse à questions, n 1 Valérie Bellynck, Benjamin Brichet-Billet, Mazen Mahrous Grenoble

Plus en détail

Applications orientées données (NSY135)

Applications orientées données (NSY135) Applications orientées données (NSY135) 2 Applications Web Dynamiques Auteurs: Raphaël Fournier-S niehotta et Philippe Rigaux (philippe.rigaux@cnam.fr,fournier@cnam.fr) Département d informatique Conservatoire

Plus en détail

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

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

Plus en détail

Chapitre 1 HTML et le Web... 15. Chapitre 2 Les navigateurs du marché... 31. Chapitre 3 Les bases du langage HTML... 49

Chapitre 1 HTML et le Web... 15. Chapitre 2 Les navigateurs du marché... 31. Chapitre 3 Les bases du langage HTML... 49 Chapitre 1 HTML et le Web... 15 1.1 Pourquoi apprendre le langage HTML?... 17 1.2 Trois concepts étroitement liés : WWW, HTML et HTTP... 18 1.3 Principes généraux et versions de HTML... 20 Utilisation

Plus en détail

Créer des pages WEB à l aide de KompoZer.

Créer des pages WEB à l aide de KompoZer. Document élève 1/14 Créer des pages WEB à l aide de KompoZer. Document élève 2/14 INTERNET : CREATION D UN SITE PRESENTATION Un site web (aussi appelé site internet par abus de langage) est un ensemble

Plus en détail

Nous allons détailler dans cette documentation les fonctionnalités pour créer un objet colonne.

Nous allons détailler dans cette documentation les fonctionnalités pour créer un objet colonne. Généralités Dans le générateur d états des logiciels Ciel pour Macintosh vous avez la possibilité de créer différents types d éléments (texte, rubrique, liste, graphiques, tableau, etc). Nous allons détailler

Plus en détail

ReadMe_fr Le but La boîte contient La mise en place Les règles

ReadMe_fr Le but La boîte contient La mise en place Les règles ReadMe_fr Le but Le but du jeu est simple: créer avec les autres joueurs LA page HTML... mais surtout la page HTML qui soit le plus proche des standards du Web: respectant la sémantique HTML et sans erreur

Plus en détail

Développement de l interface Web du projet Hôpital

Développement de l interface Web du projet Hôpital Pôle informatique 2013/2014 École Nationale Supérieure des Mines de Saint-Étienne Développement de l interface Web du projet Hôpital Antoine Zimmermann antoine.zimmermann@emse.fr Le cahier des charges

Plus en détail

Carrefour de l information. Université de Sherbrooke. Création de sites Web à l aide de. Dreamweaver CS3. Par :

Carrefour de l information. Université de Sherbrooke. Création de sites Web à l aide de. Dreamweaver CS3. Par : Carrefour de l information Université de Sherbrooke Création de sites Web à l aide de Dreamweaver CS3 Par : Josée Martin Édition revue et augmentée par Marc-André Dulude Édition revue et augmentée par

Plus en détail

Tutoriel n 4. Les outils Google. 1. Goo quoi?

Tutoriel n 4. Les outils Google. 1. Goo quoi? Tutoriel n 4 Les outils Google 1. Goo quoi? * Google Chrome : le navigateur! Définition : Logiciel permettant d afficher des pages et de consulter des sites Internet (ex. : Mozilla Firefox, Safari, Google

Plus en détail

Introduction à HTML. A. HTML et le web

Introduction à HTML. A. HTML et le web Introduction à HTML Isabelle Debled Renesson Marie-Dominique Devignes LORIA 1 2 1 Fonctionnement en mode client/serveur 1. Construction d une requête ex web : http://www.loria.fr/news CLIENT 5. Mise en

Plus en détail

Introduction à HTML et CSS

Introduction à HTML et CSS ENS de Cachan Introduction à HTML et CSS Françoise Tort Chargement d'une page Web h"p://site.chemin./page.html navigateur requête.html.css.jpg.mp3 serveur web fichiers Le navigateur web traduit les pages,

Plus en détail

Réalisation d'un site web. Première partie : Création des pages HTML. thierry.vaira@orange.fr

Réalisation d'un site web. Première partie : Création des pages HTML. <tv>thierry.vaira@orange.fr</tv> Réalisation d'un site web Première partie : Création des pages HTML 1 Objectifs Se familiariser avec le codage HTML Acquérir une pratique minimale Être capable de mener à bien la construction d'un site

Plus en détail

CATALOGUE DES FORMATIONS

CATALOGUE DES FORMATIONS CATALOGUE DES FORMATIONS WEB / GRAPHISME ADOBE ACROBAT PRO... 1 ADOBE PHOTOSHOP... 2 ADOBE INDESIGN... 3 ADOBE DREAMWEAVER... 4 ARTISTEER... 5 PREZI... 6 LE LANGAGE HTML... 7 LES FEUILLES DE STYLE CSS...

Plus en détail

Item B53 : Réaliser des documents hypermédias intégrant textes, sons, images fixes et animées et liens internes et externes.

Item B53 : Réaliser des documents hypermédias intégrant textes, sons, images fixes et animées et liens internes et externes. Licence Creative Commons Jean-Philippe Verdu Réaliser la présentation de ses travaux en présentiel et en ligne Item B53 : Réaliser des documents hypermédias intégrant textes, sons, images fixes et animées

Plus en détail

Présentation du Framework BootstrapTwitter

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...

Plus en détail

Documentation utilisateur de la plate-forme administrateur

Documentation utilisateur de la plate-forme administrateur Documentation utilisateur de la plate-forme administrateur Introduction... 2 1. Accès à la plate-forme... 2 2. Création d une barre de navigation... 3 3. Créer un nouveau menu... 4 Créer le nom d un nouveau

Plus en détail

Programmation orientée objet et événementielle en JavaScript. Département SRC Pôle Universitaire de Vichy Bruno Bachelet

Programmation orientée objet et événementielle en JavaScript. Département SRC Pôle Universitaire de Vichy Bruno Bachelet Programmation orientée objet et événementielle en JavaScript Département SRC Pôle Universitaire de Vichy Bruno Bachelet PARTIE I JavaScript: script côté client Programmation objet et événementielle en

Plus en détail

TP Initiation au langage HTML

TP Initiation au langage HTML TP Initiation au langage HTML (1) Rappels de quelques généralités Un fichier HTML n'est pas compilé (ce n'est pas un programme) Un fichier HTML est un fichier texte simple, parfaitement lisible, respectant

Plus en détail

Bootstrap 3 pour l'intégrateur web CSS et Responsive Web Design

Bootstrap 3 pour l'intégrateur web CSS et Responsive Web Design Chapitre 1 : Introduction A. Le développement des sites Web 14 B. Les fonctionnalités de Bootstrap 14 C. La compatibilité avec les navigateurs 15 D. Télécharger les exemples 15 Chapitre 2 : Installer Bootstrap

Plus en détail

Introduction à la conception de sites web. Yannick Prié UFR Informatique Université Claude Bernard Lyon 1

Introduction à la conception de sites web. Yannick Prié UFR Informatique Université Claude Bernard Lyon 1 Introduction à la conception de sites web Yannick Prié UFR Informatique Université Claude Bernard Lyon 1 Objectifs Introduction aux langages à balises Introduction à (X)HTML / CSS Introduction à la gestion

Plus en détail

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

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

Plus en détail

Développement Web pour mobiles

Développement Web pour mobiles Développement Web pour mobiles Les bases du HTML par Eric Sarrion Date de publication : 11/08/2010 Dernière mise à jour : Le langage HTML est le langage de base permettant de construire des pages web,

Plus en détail

Utilisation Des Widgets ITEA

Utilisation Des Widgets ITEA Utilisation Des Widgets ITEA Sommaire 1 Introduction... 3 2 Intégration sur votre site web... 5 2.1 Intégration du widget en JavaScript... 5 2.2 Exemples... 6 2.3 Paramètres iframe et aveccss... 6 2.4

Plus en détail

EDITEUR DE PAGE HTML NETSCAPE COMPOSER

EDITEUR DE PAGE HTML NETSCAPE COMPOSER EDITEUR DE PAGE HTML NETSCAPE COMPOSER Utilisation Netscape Composer est un éditeur de pages HTML : il vous permet de modifier et créer des pages au format HTML pour les diffuser sur le Web. Il est intégré

Plus en détail

Manuel de modifications des modèles

Manuel de modifications des modèles Manuel de modifications des modèles Contenu Avant propos...2 Introduction...2 Les 4 niveaux...2 Préparation...2 Quoi et pourquoi...2 Comment...2 Nommer les modèles modifiés...4 Niveau 1 Images...4 Quoi...4

Plus en détail

Comment installer wordpress. www.bxart.be wp niveau 1

Comment installer wordpress. www.bxart.be wp niveau 1 www.bxart.be wp niveau 1 Installation Introduction Wordpress est un CMS ce qui signifie : système de gestion de contenu (Content Management System). Il y a d autres CMS mais c est de loin le plus populaire.

Plus en détail

1969 : Arpanet voit le jour en pleine guerre froide. Projet du Département de la

1969 : Arpanet voit le jour en pleine guerre froide. Projet du Département de la historique internet Arpanet Advanced Research Projects Agency Network 1969 : Arpanet voit le jour en pleine guerre froide. Projet du Département de la Défense des Etats-Unis pour assurer la transmission

Plus en détail

Technologies du Web. Phases de travail Objectifs Activités

Technologies du Web. Phases de travail Objectifs Activités Technologies du Web Tutoriel 1 : «Structurer une page Web» PROBLEMATIQUE Créer la structure d une page Web avec un éditeur de texte. CONDITIONS DE DEROULEMENT DE L ACTIVITE Phases de travail Objectifs

Plus en détail

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 Mozilla Firefox 3.5 Google Chrome 3.0 LES NAVIGATEURS WEB (pour Windows) Opéra 10 Internet Explorer 8 Safari 4.0 1 Sommaire Qu est ce qu un navigateur Web? Fonctionnement Caractéristiques communes Caractéristiques

Plus en détail

Comment écrire un article pour le site HCE?

Comment écrire un article pour le site HCE? Comment écrire un article pour le site HCE? Explication courte Les explications courtes sont les meilleures. Naviguez sur http://www.hce.asso.fr/ecrire/ et laissez-vous guider par les écrans. Explication

Plus en détail

CATALOGUE DES OFFRES O2i INGÉNIERIE POUR LES PLATEFORMES ÉDITORIALES

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

Plus en détail