Un essai Titre section-1 bla bla bla bla Titre section-2 bli bli bli bli bli Titre
Previous PDF | Next PDF |
[PDF] Introduction - LIPN
Université Paris 13 IUT de Villetaneuse Savoir modifier les attributs de présentation d'une page Web Savoir adapter un Un serveur est un ordinateur ( et/ou un programme informatique) offrant un service ou Recherche de nouveaux nombres premiers de Mersenne (GIMPS, Great Internet Chemin local ▻
[PDF] Introduction Web - Moodle - IUT de Villetaneuse
Un essai Titre section-1 bla bla bla bla Titre section-2 bli bli bli bli bli Titre
[PDF] Introduction à linformatique - Cours complet - Cours, examens et
IUT de Villetaneuse S1 2016 G Santini, J -C Dubacq la fin de l'exécution du programme avant de pouvoir taper une nouvelle commande (connecté) L' adresse du web-mail de l'IUT est : /bin:/usr/bin:/usr/local/bin:/home/chez_moi/ bin
[PDF] Initiation au développement Web Partie 2
IUT de Villetaneuse DUT R&T S1 Cours M1106 Initiation au développement Web Partie 2 HTML Étienne André Etienne Andre (à) univ-paris13
[PDF] Module M1101 IUT de Villetaneuse Département R&T - Luca Saiu
Attention Vous êtes censés contrôler réguli`erement le site web du module et lire Introduction `a l'administration des syst`emes Plan ET, OU et NON utilisés pour certains calculs sur les adresses IP (voir cours Elle utilise alors l' adresse de diffusion locale pour envoyer un paquet `a découvrir de nouvelles routes
[PDF] Rapport dévaluation de luniversité Paris 13
13 nov 2018 · Présentation 5 Elle est localisée sur cinq campus (Villetaneuse, Bobigny, CNRS qui n'étaient pas présents à la réunion programmée au cours de la visite dans la création de licences professionnelles avec les IUT de Paris 13 et a recherche dans de nouveaux locaux sur le site d'Aubervilliers
[PDF] Diplôme Universitaire de Technologie RESEAUX ET
permettre à l'étudiant d'apprendre à maîtriser les Nouvelles Technologies de l' Information et de la La formation DUT R&T permet à l'étudiant une insertion professionnelle concertation avec les professionnels et en tenant compte du contexte local et universitaire Modifier les attributs de présentation d'une page Web
[PDF] INTRODUCTION À LA SOCIOLOGIE SUPPORT DE COURS
Université Paris 13 – Villetaneuse Licence AES 1 Le cours est organisé en trois parties : une partie d'introduction générale à la En résultera une nouvelle grille d'observation plus restreinte, mais à faire de toute métropole urbaine le centre local d'une économie mondiale et d'une civilisation dans laquelle les cultures
[PDF] Introduction XAMPP
[PDF] Introduction XML XML comparé à SGML XML comparé à HTML XML - Javascript
[PDF] Introduction `a Freefem++
[PDF] Introduction `a HTTP - Javascript
[PDF] Introduction `a la géométrie algébrique Olivier Debarre
[PDF] Introduction `a la théorie du contrˆole
[PDF] Introduction `a la Topologie - Ajouter.
[PDF] Introduction `a l`algorithmique avec Python - La Pollution
[PDF] Introduction `a l`analyse Devoir surveillé n 3 Vendredi 16 janvier 2015
[PDF] Introduction `a l`apprentissage automatique Exemples de probl
[PDF] Introduction `a l`optimisation : aspects théoriques, numériques et
[PDF] Introduction `a Mathematica
[PDF] Introduction `a Matlab - Anciens Et Réunions
[PDF] introduction `a R - La terre vue d`ailleurs
Marcel BoscIntroduction Web
Université Paris-13Département informatiqueIUT de Villetaneuse2010-20111ère année, cours - 2/5
table des matières rappels et précisions programmation coté clientCSS - sélecteurs
Affichage HTML
interactions client serveur1ère partie rappel : page html simple clientmachine site.org navigateur internetserveur web (logiciel) protocole http protocole http très simplifié...bonjour site.org, je voudrais la page page.html ok, voici la page, au format html1 2 requêtes - autres fichiersUn titre!
bla bla
6http://site.org/page.html
1 2 photo.jpg nécessaire pour afficher!3 54même chose pour fichiers:
CSS, javascript, flash, ...
requêtes - autres fichiersexemple : yahoo.com : 49 requêtes firebug : net firebug : net firebug : net firebug : net html : 40 Ko html : 40 Ko image : 4 Ko image : 4 Ko image : 11 Ko image : 11 Ko nombre de requêtes performance : vitesse de chargement de la page + requêtes = + long concaténation CSS concaténation JS concaténation Images (sprites) exemple : sprites CSS: background-position4 images1 image
développement : fichier local clientmachine site.org navigateur internetserveur web (logiciel) très simplifié...page.htmlfile:///home/toto/page.html clientsite.org navigateurinternet très simplifié...hébergement web classique serveur web4affichage
htmlpage.html2apache 1 3 serveur ftpdéveloppeur 0 clientvotre poste de TPmachine aquanux navigateurintranet très simplifié...développement à l'IUT serveur web5affichage
html serveur de fichierspage.htmlpage.html2apache 1 4 3 0 développement à l'IUT url :file:///home/usager/123/exemple/page.html fichier :~/public_html/page.htmlfichier :~/exemple/page.html url : http://aquanux/~123/page.html!ne pas confondre local et serveur! répertoire spécialrépertoire spécial droits d'accès (groupe www): chmod g+r page.htmllocal serveurDivers3ème partie
Visiteurs d'un site web
site.org page.html moteur de recherchenavigateur mal voyant autres " robots »images, couleurs, taille de texte, images, couleurs, taille de texte,Bonjour
HTML h1 font-size : 200%; }CSS " Ce texte ("Bonjour") est un titre important »" Les titres importants sont affichés en grand »Séparation du fond et de la forme fondforme moteur de recherchemal voyant autres " robots »(contenu, sens, structure)(présentation, apparence) contenu et structure logiquemise en formehtmlcss html simple et facile à maintenir séparation de métiers (graphiste / dev. web) html compréhensible par - malvoyants - moteurs de recherche - autres logiciels présentation facile à changerPingouins
Les pingouins sont des oiseaux...
Pingouins
Les pingouins sont des oiseaux...
titre???titre???Séparation du fond et de la formeMoteurs de recherche
google.com toto.orgtiti.com xyz.net123 " cinéma paris »crawlindexationrecherche résultatsRecherche, référencement
Arriver dans les premiers résultats !
PageRank
" importance » de chaque page plus de liens vers une page meilleur PageRankCSS - sélecteurs3ème partie
Rappels
Ceci est un titre
Un paragraphe de texte avec un
lien vers une autre page. Les mots suivants sont importants h1 font-size: 200%; strong color: red; }Feuille de style: sélecteur: quels éléments ont veut affecter "h1" tous les éléments de type h1HTML ".toto" tous les éléments ayant class="toto"Rappels : sélecteurs
p {color: red;}Un essai
Titre section-1
bla bla bla bla
Titre section-2
bli bli bli bli bli
Titre section-3
Qu'est qu'on s'amuse!
Titre section-4
abc def ghi jkl mno
Titre section-5
.actu {color: blue;}#para1 {color: green;}#unID nombalise .uneClasse définition sélecteur proprieté1: valeur1; proprieté2: valeur2; }table #principal table.actu table a, .urgent a background-color width margindéfinitionexemples green 10em30px 20px
sélecteurs : descendants p a a img strong imgid="intro" p imgsel1 sel2 espace sélectionne les sel2 qui sont des descendants de sel1 exemples:les "img" descendants d'un "p" #intro imgles "img" descendants de l'élément ayant id="intro" sélecteurs : d'une classe sel.maclasse point, pas d'espace sélectionne les sel dont l'attribut classe est maclasse class="maclasse"Titre section-1
bla bla bla bla
Titre section-2
bla bla bla bla
Titre section-4
abc def ghi jkl mno
Titre section-5
h2.actu sélecteurs multiples sel1, sel2, sel3 virgule les propriétés/valeurs s'appliquent à la foisà sel1, sel2 et sel3
titre
petit titre
sous titre
abc
xyz
.important,h3,h2 color: red; autres sélecteursE > F : p > .important E:first-child : p:first-child E:hover: tr:hoverexemples
Attention: problèmes compatibilité navigateurssyntaxe http://www.w3.org/TR/CSS21/selector.html prioritésxyz
les sélecteurs plus spécifiques sont prioritaires strong {color: red; } p strong {color: green; } .c1 {color: yellow;} strong.c1 {color: blue; } p strong.c1 {color: black; } #id1 {color: white; } p #id1 {color: orange;}firebug: color: black; color: white;Boites / HTML3ème partie
Type de boite : display
inline: a, img, strong, span ... block: p, h1, div ...inline: dans le flux du texte block: occupe toute la ligne Titre exemple lien important, h2 p astronginline block.lienMenu display: block; }Changer:HTML : élément " div »
div: élément block pour regrouper plusieurs éléments inline ou block exemples:bla bla
bla bla bla
bla bla
bla bla bla
HTML : élément " span »
div: élément inline pour regrouper plusieurs éléments inline exemples:01.49.40.12.34
1/1/2010
regrouper du texte:(souvent : id ou class) formulaire : exemple simple 2112form.htmlsimplifié...
formulaire : exemple 2 21 534 12 34
5form.html
L'avenir : CSS 3
nouveaux sélecteurs coins arrondis : border-radius dégradés : gradient ombres plusieurs images de fond transparences ...
Problèmes de compatibilité: ie5,6,7,8
http://www.quirksmode.orgL'avenir : HTML 5
Positionnement4ème partie
Positionnement
flux normal (inline, block) float absolute3 algorithmes : .exemple2 float: left; .exemple3 position: absolute; }p, a, h1 ... positions ordinaires Float img{float: right; }bla bla bla bla bla...