HTML & css.

Slides:



Advertisements
Présentations similaires
Html et css.
Advertisements

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.
Sommaire Sauvegarder un image ou un texte Télécharger un fichier FIN Utilisation de l’animation : Lorsque tu te déplaces sur les pages de l’animation,
GCstar Gestionnaire de collections personnelles Christian Jodar (Tian)
1 Mes premiers pas avec la Numériclé Sommaire.
A la fin de ton année de 4 ème, tu dois être capable d’utiliser parfaitement un Mais d’abord qu’est-ce qu’un TABLEUR ? ???? TABLEUR- GRAPHEUR Page suivante.
SPIP Un logiciel libre pour la gestion d'un site web d'informations SPIP.
Toulibre : présentation de... par Rémy Sanchez +.
Jesús MUÑOZ ( Créer son site internet avec Joomla!
Comprendre les sites web MODULE 1 | CHRISTIAN BLÉSER (2015)
Créer un site Web avec Eva Spip Première approche B. Gugger – Mars 2006 – Département RTC.
Introduction aux technologies du Web Mercredi 12 décembre 2007 Patrice Pillot
Toulibre : présentation de... xhtml + css par Rémy Sanchez.
Master ESEEC Rédaction de documents (longs) structurés Patrice Séébold Bureau 109, Bât B.
Octobre 2013 Smartweb Refonte des sites Internet AIDE – K-Sup v6.
Présenté par : ANDRIAMANALINA Favennec Costant CREATION D’UN SITE POUR L’APPRENTISSAGE DU CODE DE LA ROUTE CAS DU CLIENT DE LA SOCIETE ASA.
Cahier des charges.
Le bureau Windows (XP) Bureau Windows Icônes Menu démarrer
INTERNET #1 Qu’est-ce qu’internet ? Qu’est-ce qu’un site internet ?
Téléchargement de fichiers
Exploitation de logiciels :
Mise en place d’un système de partage de fichiers
Les boites texte et dossier
Ensemble de services.
Comprendre l’environnement Web
Informatique et Création Numérique
Tutoriel ‘Création de contenus’
Utiliser le dossier Mon EBSCOhost
3 devient.
Micro Informatique au Cellier
Les chats.
HTML.
Par Georges Lucotte & Jean-Pierre Vasseur 03 Mars 2017
Module 6 la boîte .
TIC (Techniques de l’Information et de la Communication)
Présentation de JQUERY
Les technologies AJAX.
Création d’une sous rubrique
Produire, collaborer, partager avec un blog d’école
D3 – Produire, traiter, exploiter et diffuser des documents numériques
Le CSS Principe de séparation du contenu et de la mise en forme
Wireshark Capture et analyse de trames IP
Module 1 : Réaliser un site internet
Présentation de PowerPoint 2007
Journée pédagogique 16 septembre 2014
Excel XP - Lab #4 MET1421 HTML / Frontpage Daniel Gelinas.
INTERNET.
Documentation technique (Linux)
HTTP DNS NTP FTP R231 RJ45 definition HTTP DNS NTP FTP R231 RJ45.
Présentation initiale
SPIP Pour faire un site sous Spip, voici une sélection d'outils.
Internet C'est quoi ? Comment ça marche ? Fenêtre sur le monde
Package R Markdown: Un outil pour générer des pages html avec R Studio
CSS et DREAMWEAVER (Suite et fin)  Les liens
</Présentation de solutions documentaires>
WORD EN LIGNE Ariane / Tous les mots en rouge sont expliqués dans les pages vocabulaire (les dernières du diaporama) en cliquant.
G.ELGHOUMARI Université ParisII Panthéon-Assas
Outils et principes de base. Exemple d’application  Gestion de données d’enquête : Interface de saisie en ligne  insère directement les données dans.
Comment personnaliser Microsoft SharePoint Site web
Programmation Android Les listes
G.ELGHOUMARI Université ParisII Panthéon-Assas
TD Multimédia : cours 1 Année Groupe C TD multimédia.
Capture d’écrans pour les pages Web
Système de gestion de contenu de sites web
ORGANISER DES MANIFESTATIONS SCIENTIFIQUES A LA SFA
Formation « Utiliser un site Internet école »
Présentation du site Martine Cochet.
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:

HTML & css

sommaire Introduction Leurs rôles Les Différentes versions HTML CSS Les Différentes versions Travaille en local vs en production L’intérêt du travail en local Du local à la production Les différents éditeurs de texte Sous Microsoft Sous mac Sous linux multiplateforme

introduction langages informatiques qui permettent de créer des sites web. Tous les sites web sont basés sur ces langages, ils sont incontournables et universels aujourd'hui. Ils sont à la base même du Web. Le langage HTML a été inventé par un certain Tim Berners-Lee en 1991… Tim Berners-Lee suit encore aujourd'hui avec attention l'évolution du Web. Il a créé le World Wide Web Consortium (W3C) qui définit les nouvelles versions des langages liés au Web. Il a par ailleurs créé plus récemment la World Wide Web Foundation qui analyse et suit l'évolution du Web

Leurs rôles

Le rôle du HTML HTML (HyperText Markup Language) : il a fait son apparition dès 1991 lors du lancement du Web. Son rôle est de gérer et organiser le contenu. C'est donc en HTML que vous écrirez ce qui doit être affiché sur la page : du texte, des liens, des images… Vous direz par exemple : « Ceci est mon titre, ceci est mon menu, voici le texte principal de la page, voici une image à afficher, etc. ».

LE Rôle du css CSS (Cascading Style Sheets, aussi appelées Feuilles de style) : le rôle du CSS est de gérer l'apparence de la page web (agencement, positionnement, décoration, couleurs, taille du texte…). Ce langage est venu compléter le HTML en 1996.

Les différentes versions

Versions html HTML 1 : c'est la toute première version créée par Tim Berners-Lee en 1991. HTML 2 : la deuxième version du HTML apparaît en 1994 . C'est cette version qui posera en fait les bases des versions suivantes du HTML. Les règles et le fonctionnement de cette version sont donnés par le W3C (tandis que la première version avait été créée par un seul homme). HTML 3 : apparue en 1996, cette nouvelle version du HTML rajoute de nombreuses possibilités au langage comme les tableaux, les scripts, le positionnement du texte autour des images, etc. HTML 4 : cette version aura été utilisée un long moment durant les années 2000. Elle apparaît pour la première fois en 1998 et propose l'utilisation de frames (qui découpent une page web en plusieurs parties), des tableaux plus complexes, des améliorations sur les formulaires, etc. Mais surtout, cette version permet pour la première fois d'exploiter des feuilles de style, notre fameux CSS ! HTML 5 : c'est LA dernière version. De plus en plus répandue, elle fait beaucoup parler d'elle car elle apporte de nombreuses améliorations comme la possibilité d'inclure facilement des vidéos, un meilleur agencement du contenu, de nouvelles fonctionnalités pour les formulaires, etc. C'est cette version que nous allons découvrir ensemble.

Versions css CSS 1 : dès 1996, on dispose de la première version du CSS. Elle pose les bases de ce langage qui permet de présenter sa page web, comme les couleurs, les marges, les polices de caractères, etc. CSS 2 : apparue en 1999 puis complétée par CSS 2.1, cette nouvelle version de CSS rajoute de nombreuses options. On peut désormais utiliser des techniques de positionnement très précises, qui nous permettent d'afficher des éléments où on le souhaite sur la page. CSS 3 : c'est la dernière version, qui apporte des fonctionnalités particulièrement attendues comme les bordures arrondies, les dégradés, les ombres, etc.

TRAVAIL EN LOCAL VS EN PRODUCTION

L’intérêt du travail en local Travailler en local comporte de nombreux avantages. Le plus important est certainement le fait de pouvoir créer ou tester de nouvelles fonctionnalités sans impacter le fonctionnement d’un site "live" qui serait déjà visité par des internautes.

Du local vers la production commencer toujours son projet en local, c’est-à-dire avec ses fichiers stockés sur sa propre machine. Une fois le travail terminé, il faudra alors louer un hébergement web chez un hébergeur et acheter et choisir une URL, c’est-à-dire une adresse web pour notre site. Ensuite, nous allons transférer tous nos fichiers sur l'espace serveur que nous avons loué chez notre hébergeur. L’hébergeur se charge alors de veiller à ce que le serveur fonctionne toujours afin que notre site soit toujours accessible via Internet. Si nous désirons par la suite modifier quelque chose d’important sur notre site, nous créerons une copie de notre site live en local en récupérant tous les fichiers, et nous implémenterons d’abord les modifications en local afin de minimiser le risque de bugs finaux et ainsi le temps de maintenance sur le site.

Les différents éditeurs de texte

Sous microsoft Sublime Text Notepad++ Brackets jEdit PSpad ConTEXT …

Sous mac Sublime Text Brackets jEdit Smultron TextWrangler

Sous linux Sublime Text Brackets gEdit Kate vim Emacs jEdit

Multiplateforme Komodo Edit (il fonctionne aussi bien sous Windows que Mac ou encore Linux).

Merci pour votre attention Source : * Openclassroom * Pierre-giraud Merci pour votre attention The end