G.ELGHOUMARI Université ParisII Panthéon-Assas

Slides:



Advertisements
Présentations similaires
Internet : serveurs Web
Advertisements

Le Téléphone Russe Le Téléphone Russe. Le Téléphone Russe Le Téléphone Russe.
LE HTML ISN Terminale S Un peu d’histoire …
1 F o r m a t i o n A R S World Wide Web (WWW). 2 F o r m a t i o n A R S Contributions m Création: Claude Gross (UREC) m Modifications: Bernard Tuy,
Les réseaux - Internet Historique Réseau local Internet Les protocoles
Internet : serveurs Web  Clients et serveurs : le navigateur  Sites Web et urls  Fichier source d’une page  Langage HTML 1.
SI 28 - Écriture interactive & multimédia Dreamweaver Séance 1 Petit Clara & Palfart Julien Printemps2008 Printemps 2008.
Deug 11 Systèmes d ’Information, cours 3a Michel de Rougemont Université Paris II Edition et Styles.
Deug 11 Systèmes d ’Information : cours 1b Michel de Rougemont Université Paris II Codage, Edition, Réseau.
Deug 11 Systèmes d ’Information : cours 2b Michel de Rougemont Université Paris II Editeurs et HTML.
D é veloppement de sites web statiques Par DRISS AIT EL HADJ Par DRISS AIT EL HADJ Avril 2012.
Dreamweaver Séance 1.
1 Présentation de DREAMWEAVER (1) Gaël TREMEAU GI05 Printemps 2006.
Plan de la présentation Le langage HTML Dreamweaver MX Les premiers outils pour créer une page web :  Propriétés d’une page  Création de cadres  Création.
SI28 Malépart Céline Jérémy Palmier
DREAMWEAVER SEANCE 1 Axel JACQUET GM05 – Julien VAN MOORLEGHEM GM05 A2008 Écriture interactive & multimédia Présentation Dreamweaver 8.
Introduction au HTML Qu’est ce que le HTML ?
1 er séance SI28 A2004 YIN Lei Emmanuel Eugene. Plan de l’exposé  Introduction au HTML  Le HTML dans le bloc-notes (notepad)  Présentation de Dreamweaver.
QuickPlace de LOTUS Logiciel générateur de SITE WEB : Installé sur un serveur (grenet), Permet de créer / gérer / utiliser un site privé, De donner des.
Guide de l'enseignant SolidWorks, leçon 1 Nom de l'établissement Nom de l'enseignant Date.
Initiation à QuickPlace, janvier Initiation à QuickPlace n Nature de l'outil n Fonctions de base (lecture, création) n Fonctions de gestionnaire.
Internet Principes de recherche. Serveur web Adresse IP.
NOTIONS INFORMATIQUES : RAPPEL
Exposé - étude de cas - Le HTML.
Micro Informatique au Cellier
Création de site web Langage & programmation.
TIC (Techniques de l’Information et de la Communication)
soit à l’aide d’un logiciel de transfert FTP
Mener une activité.
1.2 Programmes et données Les programmes comme les données sont stockés dans les mémoires (centrales et périphériques) des ordinateurs Informatique.
Eléments de présentation
Messagerie (Orange - Gmail)
Comment créer et réaliser pratiquement un site web
I- ANALYSE DU BESOIN / Plan
Comprendre l’environnement Web
Publication site AROEVEN
Organisation bureautique
Editeur de texte Si vous copiez/collez du texte en provenance d’un autre logiciel (Word, par exemple), prenez soin de le « nettoyer » pour respecter la.
Formation Portail IDE 2014.
HTML.
TIC (Techniques de l’Information et de la Communication)
Internet Un réseau virtuel qui assure l'interconnexion des différents réseaux physiques par l'intermédiaire de passerelles. Une pile de protocoles unique.
Principes de recherche
Module 1 : Réaliser un site internet
D3 – Produire, traiter, exploiter et diffuser des documents numériques
Création Et Modification De La Structure De La Base De Données
HTTP DNS NTP FTP R231 RJ45 definition HTTP DNS NTP FTP R231 RJ45.
Présentation initiale
Introduction à la conception de site web
Package R Markdown: Un outil pour générer des pages html avec R Studio
Informatique de base Pr. Namar Ydriss Cours 3: Introduction
G.ELGHOUMARI Université ParisII Panthéon-Assas
L1 Technique informatique
Les protocoles de la couche application Chapitre 7.
USER GUIDE : BASE DE DOCUMENTATION
Informatique de base Pr. Michel de Rougemont Ghizlane Elghoumari
Informatique de base Pr. Namar Ydriss Cours 1: Introduction
G.ELGHOUMARI Université ParisII Panthéon-Assas
G.ELGHOUMARI Université ParisII Panthéon-Assas
Comment utiliser l’application ?
Informatique de base Pr. Namar Ydriss Cours 4: Formulaires
Niveau Intermédiaire 01/12/2018.
Système de gestion de contenu de sites web
Conseils techniques pour votre PPT
Présenté par Viviane Lévesque
Catherine Cyrot - bibliothèques numériques - cours 3
Balises HTML.
Definition de html sommaire. Présentation de html, css et javascript Module 1.
Qu’est ce qu’une page web? Comment fonctionne un site web?
Site web, Ce qu’il faut savoir ?
Transcription de la présentation:

G.ELGHOUMARI Université ParisII Panthéon-Assas 21/09/2018 Pr. Namar Ydriss Université Paris I Panthéon - Assas Informatique de base Cours 1: Introduction 21/09/2018

Édition sous HTML Partie II Logiciels Éditeurs Bloc-Notes (accessoire de Windows) Textpad ( .txt) Word (.doc) Dreamweaver (.htm) Navigateurs Netscape (.htm) Explorer 21/09/2018

Éditeurs Code HTML ( 1er exemple) Wysiwyg What you see is what you get A balisage HTML (HyperText Markup Language) TEX, LATEX Code HTML ( 1er exemple) <HTML><TITLE> Ma page </TITLE> <H1>Chapitre 1 </H1> La taille des caractères est déterminée par des balises. <H2>Section 1 </H2> <A HREF="http://www.berkeley.edu" > L ’Université de berkeley </A> </HTML> 21/09/2018

Interprétation du code HTML (1er exemple) 21/09/2018

Détails du code HTML (1er exemple) 1°/ Accès aux fichiers <A HREF="http://www.berkeley.edu" > http (ftp) Serveur www.berkeley.edu ou adresse IP 2°/ Taille des caractères H1, H2, H3 Balise ouvrante <Hi> Balise fermante </Hi> (i=1,2,3) 21/09/2018

mise en forme de paragraphe, images, liens hypertextes, tableaux... Balises Permettent d'ajouter de l'information qui n'est pas du texte pur : mise en forme de paragraphe, images, liens hypertextes, tableaux... Peuvent être écrites en majuscules ou en minuscules Les syntaxes possibles: <balise> texte </balise> <balise attribut=valeur> texte </balise> <balise attribut1=valeur1 attribut2=valeur2 ...> text</balise> <balise> <balise attribut=valeur ...> 21/09/2018

Document HTML commence par la balise <HTML> et se termine par </HTML> 2 parties : Entête Commence par <HEAD> et se termine par </HEAD> Contient des informations générales sur le document Titre est défini entre les balises <TITLE> et </TITLE> Corps commence par <BODY> et se termine par </BODY> 21/09/2018

Structure d’un document HTML  <HEAD>   <TITLE> titre du document </TITLE>  </HEAD>  <BODY> texte du document avec balises de mise en page, de mise en forme, de liens hypertextes, d'images, ...  </BODY> </HTML> Application Choisissez un document WWW relativement simple avec votre navigateur et visualisez son fichier source. Netscape, dans le menu déroulant Edit, choisissez View Source 21/09/2018

Caractères Code E codé en ASCII Mais é codé par è ou  ou  Normal, Gras Balise ouvrante <B> Balise fermante </B> 21/09/2018

<BR> : saut de ligne Paragraphes Unité élémentaire <BR> : saut de ligne 21/09/2018

Liste ordonnée Liste non ordonnée Listes <UL> <LI> Cas 1 <OL> <LI> Cas 3 <LI> Cas 4 </OL> 21/09/2018

Interprétation Ma page Cas 1 Cas 2 1. Cas 3 2. Cas 4 21/09/2018

<A HREF="http://www.berkeley.edu" > Hyper-lien <A HREF="http://www.berkeley.edu" > L ’Université de berkeley </A> Visualisation Ma page L’Université de Berkeley 21/09/2018

Exple: www.berkeley.edu Notion d’URL Unified Resource Locator Exple: www.berkeley.edu Suite de caractères (sans espace) Définit l'endroit (locator) où se trouve un document (resource) Champ Location du navigateur Appelée aussi adresse d'une page WWW 21/09/2018

Sur la machine www.upmf-grenoble.fr Syntaxe d’une URL http://www.upmf-grenoble.fr:9999/ctec/NT/HTML/liens.html Accès au document Avec le protocole http Sur la machine www.upmf-grenoble.fr Sur le port 9999 (s'utilise assez rarement) Le document est le fichier /ctec/NT/HTML/liens.html 21/09/2018

Pour les documents HTML protocole est presque toujours http Exemples de domaines Suffixes .com wanadoo.com aol.com Suffixes .edu berkeley.edu, stanford.edu Suffixes .fr u-paris2.fr, lri.fr 21/09/2018

URL absolues, URL relatives URL relative à la machine: /ctec/NT/coursHTML.html URL relatives au répertoire du document ./balises.html :  "." signifie le répertoire courant (le même que le fichier d'où part le lien) ../EUDORA/index.html ".." signifie le répertoire en amont (qui contient le répertoire du fichier d'où part le lien) 21/09/2018 Les noms de répertoires sont séparés par des "/". ".." signifie le répertoire en amont (celui qui contient le répertoire du fichier d'où part le lien).

URL absolues, URL relatives URL absolue utilisée lors de la création d’ un lien vers un autre site WWW URL relative au répertoire d'un document lors de la création d’un lien vers un document du même site 21/09/2018 Les noms de répertoires sont séparés par des "/". ".." signifie le répertoire en amont (celui qui contient le répertoire du fichier d'où part le lien).

Vérification des hyper-lien Dreamweaver permet de vérifier si tous les liens d'une page pointent sur des documents existants Vérification: File puis Check links... Les liens sont alors vérifiés un à un 21/09/2018 Les noms de répertoires sont séparés par des "/". ".." signifie le répertoire en amont (celui qui contient le répertoire du fichier d'où part le lien).

Microsoft www.w3c.org Nature des fichiers Images …../cs/fichier.gif …../cs/fichier.jpg Texte f1.txt f2.doc f3.ppt f4.html Microsoft www.w3c.org 21/09/2018

Applications TD 1 /II Édition d’un fichier (AliceMac.txt), code des caractères : ASCII et Unicode Édition HTML manuelle et sous Dreamweaver, Caractères, paragraphes, Images, Ancres, Listes 21/09/2018