de it fr

101 Réaliser et publier un site Web

Module
Réaliser et publier un site Web
Compétence
Réaliser et publier un site Web avec l´aide d´un langage d´édition de page selon directives.
Objectifs opérationnels
1 Analyser les données du travail prescrit (Mise en page, contenu, fonctionnalités), choisir des éléments de texte, respectivement graphiques.
  Connaissances opérationnelles nécessaires:
1 Connaître la démarche d´analyse de situation et la manière dont elle contribue à la définition d´un mandat précis.
 
2 Elaborer un projet de solution de la présentation Web (structure du site, navigation, présentation, etc.).
  Connaissances opérationnelles nécessaires:
1 Connaître les principales différences des divers clients en regard de la fonctionnalité, la représentation, la résolution et la largeur de bande de la liaison réseau.
2 Connaître les critères de structuration des informations utilisées sur un site Web.
3 Connaître les principales conditions légales cadres (droit d´auteur, téléchargements illégaux, conditions de licences) à respecter lorsqu´on utilise des contenus provenant de sources tierces.
4 Connaître les principales formes médiatiques du Web et leur intégration dans un site.
5 Connaître les principes généraux qui doivent être respectés en ce qui concerne les couleurs et les polices lors de la réalisation d´un site Web.
 
3 Mettre en œuvre le projet de solution en présentation Web et d´un langage de description de pages.
  Connaissances opérationnelles nécessaires:
1 Connaître les éléments de base HTML et des feuilles de style (CSS) et pouvoir les mettre en œuvre dans le cadre de la réalisation d´un site Web.
2 Connaître les principes généraux (police, couleur, résolution) à respecter lors de la réalisation d´un site Web.
3 Connaître les possibilités du format PDF et pouvoir préparer des documents compatibles avec le site.
 
4 Vérifier la présentation Web sur la conformité des prescriptions et du mandat.
  Connaissances opérationnelles nécessaires:
1 Connaître une méthode de contrôle des résultats (par ex. tests, validation) et pouvoir en expliquer l´utilisation pour la vérification de la réalisation des objectifs.
2 Connaître les critères de tests afin de permettre la mise en œuvre correcte des fonctionnalités dans divers navigateurs et terminaux.
 
5 Publier le site sur un serveur Web.
  Connaissances opérationnelles nécessaires:
1 Connaître sur quoi il faut veiller lors du transfert d´un site Web de l´environnement de travail local sur un serveur Web.
2 Connaître des outils (FTP, partage de fichiers, etc.) de transfert entre l´environnement local et l´environnement serveur.
 
Domaine de compétence
Ingénierie WEB
Objet
Présentation statique Web avec texte, graphique, animation et liens sur maximum 3 niveaux de hiérarchies. Par exemple un site d’une petite association.
Niveau
1
Pré-requis
Aucun
Nombre de leçons
40
Reconnaissance
Certificat fédéral de capacité
Publié: 07.06.2014 17:15:31
Titre DEP Module 101-2 - 3 Eléments - Présentation, examen écrit individuel, travail pratique de mise en oeuvre
Institution Lehrbetriebsverbund Siemens Schweiz AG
Aperçu Elaboration autonome de matière d'apprentissage, interrogation sur le savoir théorique, petit projet orienté compétence opérationnelle
Complément Le complément ne doit pas être indiqué

Partie 1
Pondération 20%
Durée indicative (recommandation) 2
Description de l'élément La direction de module détermine si le devoir est individuel ou doit être résolu en groupe.

Lors d'un travail de groupe, la direction de module défini la grandeur du groupe.

Il faut élaborer un thème issu de la théorie, créer un rapport et présenter le résulat en plenum.
La durée de la présentation selon les directives de la direction de module
Choix des thèmes selon objectifs opérationnels
Moyens d'aide Durant la phase préparatoire: Internet, moyens d'apprentissage, notes issues de l'enseignement Présentation: moyens usuels de présentation tels que beamer, flipchart, tableau blanc, etc.
Evaluation Lors d'un travail de groupe, c'est la prestation du groupe qui est évaluée.

50% pour la présentation
50% pour le rapport
On évalue le contenu technique et la mise en oeuvre.

L'évaluation se fait par la direction de module ou en plenum selon des cirtères d'évaluations prescrits (les apprenants évaluent les apprenants). La pondération de l'évaluation de la direction de module comporte au moins 50% de l'évaluation globale.
Relation à la pratique Les participants approfondissent un thème et transmettent leur savoir.
Les participants montrent leur capacité de collecter et de transmettre les informations.

Partie 2
Pondération 20%
Durée indicative (recommandation) 1
Description de l'élément Examen écrit qui vérifie en pratique chaque partie des objectifs opérationnels, qui ne sont pas vérifiés dans la 3e partie.

L'épreuve peut se dérouler à l'ordinateur ou sur papier.

Thèmes possibles:
- différences des divers périphériques
- condition cadres juridiques
- les formats usuels des médias
- les règles principales de la création
- mise en oeuvre de textes, couleurs et langues de l'image
- possibiltés de msie en oeuvre des PDF
- critères de tests et fonctionalités du site web
- transfert d'environnement de tests sur des servuers web et les outils y relatifs
Moyens d'aide Ordinateur sans Internet avec traitement de texte installé ou sur document papier, ainsi que notes personnelles issues de l'enseignement du module selon les directives de la direction de module
Evaluation Echelle linéaire des notes ou grilles de corrections reproductibles
Relation à la pratique Elaboration de devoirs proches de la pratique.

Partie 3
Pondération 60%
Durée indicative (recommandation) 4
Description de l'élément Modèle HTML et au moins cinq pages selon directives.

Les exigences suivantes doivent au moins être mises en oeuvre:
- Design uniquement avec CSS
- Navigation fonctionnelle
- Formulaire de contact sans action fonctionnelle
- HTML et CSS bien formulés et valides

Elaboration d'une cheklist pour la vérification du résultat final.
Moyens d'aide Ordinateur sans Internet avec traitement de texte installé
Documentation sur HTML et CSS
Documents et notes personnelles issues de l'enseignement du module selon les directives de la direction de module
Evaluation Mise en oeuvre des directives: 40%
Structure et code valide: 40%
Checklist pour les tests: 20%
Relation à la pratique Mise en oeuvre d'un site web selon directives et contenus texte
Design du site web selon les fonctions Styleguide
Tests avec validation et bon formatage
Publié: 04.06.2015 08:40:45
Date de péremption: Pas de date de péremption
Titre DEP Module 101-3 - 2 Eléments - Mise en oeuvre d'un travail pratique, Mise en oeuvre d'un travail pratique
Institution ICT Berufsbildungscenter AG
Aperçu Développer, élaborer et publier des pages web ergonomiques à l'aide d'HTML et de CSS selon les besoins du client, suivre un développement existant ou un exemple existant de "best pratices".
Complément

Partie 1
Pondération 30%
Durée indicative (recommandation) 1
Description de l'élément Mise en oeuvre à l'ordinateur, dans le cadre d'un travail inidividuel, d'un site web contenant deux pages, selon un modèle en HTML et CSS. Une page correspond à la page d'accueil et une deuxième page doit être élaborée et contenir un formulaire avec les éléments usuels (une action fonctionnelle n'est pas requise).
Moyens d'aide Ouvrage actuel sur HTML et CSS
Evaluation Environ 40% des points pour un code HTML correct pour la page d'accueil.
Eléments possibles:
html, head, body
link rel="stylesheet" href="..." (in head)
title
h1, h2, h3
p class="..."
div class="..."
div id="..."
span class="..."
a href="...." target="..."
Environ 40 % des points pour un CSS correct sur la page d'accueil.
Eléments possibles:
body { font-family: ...; }
#container { width: ...; margin: ...; } ou margin-top: ...; margin-bottom: ...; margin-right: ...; margin-left: ...;
#header { background-image: ...; background-repeat: ...; }
#menu { border-bottom: ...; } ou border-bottom-width: ...; border-bottom-style: ...; border-bottom-color: ...;
#content { padding: ...; } ou padding-top: ...; padding-right: ...; padding-bottom: ...; padding-left: ...;
#footer { text-align: ...; font-size: ...; height: ...; background-color: ...; }
#footer a { text-decoration: ...; }
#footer a:hover { text-decoration: ...; }
Environ 20 % des points pour un formulaire HTML correct.
Eléments possibles:
chaque input / textarea dans le propre div
input ou textarea avec "name" et "placeholder" Attribute (pour textarea en plus avec cols et rows), Bouton avec type="submit"
Relation à la pratique Elaboration de pages web avec HTML et CSS.

Partie 2
Pondération 70%
Durée indicative (recommandation) 2
Description de l'élément 1. Un ensemble de pages données doit être complété selon des directives écrites.
2. La personne en formation doit inclure un logo dans une page existante d'une firme et ajouter une simple galerie d'images. Si possible tous les graphiques sont mis à disposition sous forme vectorielle et pixels. A cet effet il faudra choisir quel format sera le plus approprié à utiliser.
3. Une esquisse d'un menu doit être mis en oeuvre à l'ade d^HTML et de CSS.
Moyens d'aide Ouvrage actuel sur HTML et CSS
Evaluation Environ 40% des point pour la position 1
(Exemple: compléter une page existante avec un sous-menu)

Environ 25% des points pour la position 2. Eléments possibles:
CSS: {background-image: ...(SVG); padding-left: largeur du logo}
HTML: img src="..." Tag dans CSS floaten.

Environ 35% des points pour la position 3.
(Exemple: ajouter une galerie photos)
Relation à la pratique Elaboration de pages web avec HTML et CSS.
Publié: 11.06.2015 11:00:17
Date de péremption: Pas de date de péremption
Titre DEP Module 101-4 - 2 Eléments - Examen écrit individuel, Travail pratique de mise en oeuvre
Institution CPNV Centre professionel du Nord vaudois
Aperçu 1 : analyser les données 2 : élaborer une présentation web 3 : implémentation 4 : vérification 5 : déploiement
Complément Epreuve théorique avec des questions d'analyse, de création d'une page simple, de correction/modification de code et de publication. Epreuve avec la création d'un site web statique HTML/CSS. Le même style sera appliqué à tout le site. Moyens d'aide: - partie théorique: feuille A4 recto-verso - partie pratique; feuille A4 recto-verso et supports, exercices vus pendant le module

Partie 1
Pondération 41%
Durée indicative (recommandation) 40
Description de l'élément Définir des liens entre fichiers d'un même site mais dans des répertoires différents
Dessiner un tableau en fonction d'un code fourni
Trouver des erreurs dans un code fourni afin que le code s'affiche comme la capture d'écran de l'énoncé
Ecrire les modifications dans le code fourni afin que le résultat s'affiche comme sur la capture d'écran
Moyens d'aide Feuille A4 recto-verso
Evaluation Liens écrits correctement
Dessin du tableau correspondant au code
Erreurs dans le code trouvées
Modifications demandées dans le code réalisées
Relation à la pratique Savoir faire des liens entre pages
Être capable d'analyser un code fourni
Corriger et modifier un code

Partie 2
Pondération 59%
Durée indicative (recommandation) 40
Description de l'élément Modification d'une mise en page réalisée sous forme de tableau en CSS
Création d'un site avec une mise en page CSS:
- création d'une page d'accueil responsive avec listes et rollovers
- création d'une page de formulaire
Moyens d'aide Feuille A4 recto-verso manuscrite et personnelle
Supports fournis pendant le module
Exercices réalisés pendant le module.
Evaluation Utilisation de liens CSS
Positionnement
Couleurs et alignements
Liens boutons survolés
Boutons avec ancre
Liste
Police
Mise en page formulaire
Formulaire correctement réalisé (éléments et structure)
Relation à la pratique Créaion de site responsive en HTML5. avec mise en page CSS
Publié: 04.09.2015 09:56:41
Date de péremption: Pas de date de péremption
Titre DEP Module 101-6 - 2 Eléments - Examen écrit individuel, Travail pratique de mise en oeuvre
Institution Zürcher Lehrbetriebsverband ICT (ZLI)
Aperçu Résoudre, sous forme d'un travail écrit individuel, des devoirs et question orientés actions, afin de réaliser et publier un site web. Ensuite, entreprendre des modifications et développements HTML et CSS sur les pages d'un site web existant, selon directives dans le cadre d'un travail pratique individuel.
Complément

Partie 1
Pondération 25%
Durée indicative (recommandation) 1
Description de l'élément Examen écrit individuel de 30 minutes avec des devoirs orientés actions (par ex. des questions binaires, QCM, questions ouvertes) sur les thèmes suivants:
- Code valide ( par ex. mise en oeuvre correcte du chemin pour les liens et images)
- Structure correcte du site web, désignation judicieuse des fichiers et dossiers
- Conditions cadres juridiques
- Mise en oeuvre correcte des formats des médias
- Code proprement structuré

L'examen se déroule sur papier.
Il n'y a pas de questions de théorie.
Les devoirs doivent toujours être résolus sur la base d'un exemple concret.
Moyens d'aide Tous les moyens mis à disposition lors des cours.
Evaluation - Réponses correctes aux questions sur les thèmes (code valide, conditions cadres juridiques, mise en oeuvre correcte des formats des médias): 65% des points
- Structure correcte du site web, noms judicieux des fichiers et dossiers: 20% des points
- Code proprement structuré: 15% des points
Relation à la pratique Les devoirs de cet élément se réfèrent à des aspects qui ne sont pas évalués dans le deuxième élément.

Partie 2
Pondération 75%
Durée indicative (recommandation) 1
Description de l'élément Entreprendre des modifications et des extensions sur des pages web en HTML et CSS d'un site existant, selon directives dans un travail individuel (45 minutes).
La donnée du travail est sur papier.
Les fichiers de l'examen sont sur l'ordinateur.
L'examen est résolu à l'ordinateur.
Moyens d'aide Tous les moyens mis à disposition lors des cours.
Evaluation Adjonction de nouveaux éléments (contenu/formatage) 40%
Modification d'éléments existants 30%
Découverte et correction des erreurs introduites 20%
Effacement d'éléments existants 10%
Relation à la pratique Application des bases du HTML
Fixation du titre de la fenêtre
Réglage correct du formatage des signes
Mise en oeuvre d'intitulés
Réaliser et formater des tables
Adapter des textes
Utiliser des images
Mise en oeuvre d'image d'arrière-plan
Placer et formater des liens (liens actifs)
Régler les couleurs
Adapter les grandeurs
Fixer les espaces
Publié: 19.10.2015 11:36:43
Date de péremption: Pas de date de péremption
Titre DEP Module 101-7 - 1 Elément - Travail pratique de mise en oeuvre
Institution ICT-Berufsbildung Schweiz
Aperçu La DEP définit un élément dans lequel un site web est élaboré en tant que travail individuel et selon les directives fournies. Tous les objectifs opérationnels sont testés hormis OO5 (« Publier le site sur un serveur web. »). L’évaluation porte aussi bien sur les travaux conceptuels comme aussi le choix des contenus, la structure et la navigation, ainsi que les aspects techniques. La durée indicative recommandée pour l’EP complète comprend 4 PE.
Complément

Partie 1
Pondération 100%
Durée indicative (recommandation) 4
Description de l'élément Les candidats reçoivent les directives pour un site web (objectif, contenus, fonctionnalités) et en déduisent une proposition de solution en tenant compte des conditions cadres techniques, juridiques et des contenus.
Cette proposition de solution est pratiquement mise en œuvre et le produit testé.
Moyens d'aide Un éditeur ou un environnement de développement pour le langage de description des pages web.
Les documents issus des cours ainsi que toutes les aides intégrées et manuels des outils mis en œuvre sont autorisés.

Au choix avec ou sans Internet.
Evaluation [1] Choix des contenus [15% à 25%]
- Choix correspondant aux directives avec des graphiques et images appropriées.
- Choix approprié d’éléments de texte et correspondant aux directives.
- Choix approprié des médias.
[2] Traitement de la proposition de solution [15% à 25%]
- Choix approprié d’une structure du site.
- Choix approprié de la navigation.
- Prise en compte des directives techniques, juridiques et des contenus.
- Choix approprié des formats des médias.
[3] Implémentation de la proposition de solution [20% à 50%]
- Respect d’une structure clair des fichiers du programme.
- Conversion et/ou conditionnement des médias selon les directives et proposition de solution.
- Mise en œuvre pratique des fonctionnalités imposées.
[4] Test du site web [15% à 25%]
- Garantie de la conformité standard du code source (Validation).
- Elaboration des cas de tests.
- Vérification des cas de tests.
Relation à la pratique La compétence vérifiée est importante dans les situations professionnelles suivantes, où l’indication entre crochets précise l’objectif évaluateur figurant dans le plan de formation y relatif:
- Traiter des variantes de solutions [DA A2.1]
- Prise en compte des standards [DA A2.4]
- Résoudre les prescriptions d’entreprise avec les directives techniques [DA B2.1]
- Réaliser un codage GUI convivial et d’une bonne maintenance [DA B4.4, IE E3.4]
- Tester l’application [DA B4.6]
- Elaboration d’un concept [IE C4.2]
- Programmation en tenant compte des possibilités futures de modifications, utilisation et efficience [IE E2.3]
Publié:
Date de péremption: Pas de date de péremption
Retour