This shows you the differences between two versions of the page.
Next revision | Previous revision Last revision Both sides next revision | ||
2013_2014:s1:docweb:web:environnement [2013/07/19 11:14] blay créée |
2013_2014:s1:docweb:web:environnement [2013/08/30 12:25] blay |
||
---|---|---|---|
Line 1: | Line 1: | ||
====== Votre environnement de travail ====== | ====== Votre environnement de travail ====== | ||
+ | |||
+ | |||
+ | |||
+ | ATTENTION EN COURS LA VERSION ACTUELLE EST OBSOLETE | ||
+ | |||
+ | **Ce cours s'appuie sur le cours de M. Erol Acundeger dans les années passées.** | ||
+ | |||
+ | Choisir ouvrir avec Microsoft Visual Studio 2012 | ||
+ | Choisir environnement web | ||
+ | Ensuite la configuration de l'environnement prend du temps. | ||
+ | |||
+ | Nous pouvons commencer à travailler. | ||
+ | |||
+ | clique droit afficher dans un navigateur | ||
+ | ou bien fractionner la fenêtre | ||
+ | |||
+ | |||
+ | |||
+ | Ou VS 2005 ? | ||
+ | |||
+ | Vous pouvez utiliser la validation d'accessibilité | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | Visual STudio | ||
+ | Affichage -> autres fenêtres -> Navigateur Web puis l'adresse C:\Users\...\Documents\exo0.html | ||
+ | Ceci vous permet de ne pas avoir besoin de basculer de fenêtre en fenêtre pour visualiser le résultat. | ||
+ | |||
+ | |||
+ | |||
+ | Pour voir les applications | ||
+ | Accueil, click droit, toutes les applications | ||
+ | |||
+ | |||
+ | Pour écouter votre page web : | ||
+ | Ouvrir l'application Narrateur sous Options d'ergogomie | ||
+ | |||
+ | |||
===== 1.1 Création de votre espace web ===== | ===== 1.1 Création de votre espace web ===== | ||
Line 5: | Line 44: | ||
Tout étudiant doit créer sur le serveur linserv1 son espace de travail web. Pour cela la | Tout étudiant doit créer sur le serveur linserv1 son espace de travail web. Pour cela la | ||
démarche à suivre est la suivante : | démarche à suivre est la suivante : | ||
- | · Se connecter sous linserv1 grâce à « Putty » | + | * Se connecter sous linserv1 grâce à « Putty » |
· Créer sous la racine de votre compte sur linserv1 le répertoire « web » | · Créer sous la racine de votre compte sur linserv1 le répertoire « web » | ||
· Donner à ce répertoire les droits nécessaires c’est à dire –rwxr-xr-x (0755), alors que | · Donner à ce répertoire les droits nécessaires c’est à dire –rwxr-xr-x (0755), alors que | ||
Line 19: | Line 58: | ||
NB4 : Pour rafraîchir votre navigateur utilisez [Ctrl]+F5. | NB4 : Pour rafraîchir votre navigateur utilisez [Ctrl]+F5. | ||
+ | ===== 1.2 Organisation de votre espace web ===== | ||
+ | |||
+ | Vous serez amenés à faire tous vos développements web sous votre espace de travail, il faut | ||
+ | par conséquent qu’il soit bien organisé dès le départ. Lorsque vous déclarez un répertoire de | ||
+ | travail il faut : | ||
+ | · Créer un répertoire « images » où seront stockées les images | ||
+ | · Créer un répertoire « style » où seront stockées les feuilles de style | ||
+ | · Les fichiers html seront stockés au même niveau que les répertoires « images » et | ||
+ | « style ». | ||
+ | Vous veillerez par la suite à créer un répertoire par TP (exemple tp1, tp2 etc…). Afin de | ||
+ | conserver un modèle : | ||
+ | · Créer un répertoire tp0 qui contiendra deux répertoires « images » et « style ». | ||
+ | · Pour chaque nouveau tp tpN il suffira de commencer à faire la copie de tp0 dans | ||
+ | tpN. | ||
+ | · Vous ne créez pas de fichier index.html sous la racine de votre site dans le répertoire | ||
+ | web. | ||
+ | |||
+ | ===== 1.3 Votre éditeur (x)html ===== | ||
+ | |||
+ | Vous utiliserez Sc1 comme éditeur de fichier, il vous aidera lors de la création de votre code | ||
+ | (x)html. | ||
+ | Différents outils d'éditions HTML existent sur le marché. Il est même possible, mais | ||
+ | fortement déconseillé d'éditer des pages avec le traitement de texte Word. On peut classer | ||
+ | les outils en deux types: | ||
+ | · Les éditeurs purement graphiques comme Frontpage. Dans ce type d'éditeurs, la | ||
+ | construction de la page s'effectue en mode 'wysiwyg' (what you see is what you get. | ||
+ | En français, tu auras ce que tu vois). Malheureusement, il faut modérer cet | ||
+ | enthousiasme wysiwyg car, si le procédé fonctionne bien avec l'éditeur, les résultats | ||
+ | sont parfois surprenants avec Internet Explorer ou Netscape Navigator. De plus, ce | ||
+ | type d'outil tend à faire perdre le contact avec le code html produit. On réservera | ||
+ | donc les éditeurs graphiques au grand public. | ||
+ | · Les éditeurs orientés code HTML comme WebExpert. Ce type d'outil est préféré par | ||
+ | les professionnels car l'on maîtrise dans le détail le code produit. Il est donc possible | ||
+ | d'agir avec précision sur le contenu des pages et d'obtenir un résultat précis avec des | ||
+ | clients comme Internet Explorer ou Firefox. | ||
+ | Vous suivrez les Instructions suivantes pour configurer votre outil de travail Sc1 : | ||
+ | · Les fichiers doivent être enregistrés avec l'extension html ou xhtml. | ||
+ | · Sc1 est dans le lecteur réseau R: (dossier Applications sur info-dc-03), créez un | ||
+ | raccourci sur leur bureau depuis R:\Applications\Sc1Linux\Sc1.exe. | ||
+ | |||
+ | ATTENTION | ||
+ | IE10 et parfois Mozilla Firefox 17.0.5 (x86 fr) (Firefox ESR) | ||
+ | |||
+ | ==== AUtre ==== | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | Remarque : Vous pouvez noter que l’appel du lien http://linserv1/~votrelogin/tp0/ le fichier | ||
+ | index.html est automatiquement visualisé, si vous aviez appelé ce même fichier | ||
+ | premier.html il aurait fallu faire l’appel http://linserv1/~votrelogin/tp0/premier.html, le | ||
+ | fichier index.html est donc le fichier pris par défaut. |