Différences
Ci-dessous, les différences entre deux révisions de la page.
Les deux révisions précédentes Révision précédente | |||
formations:devweb_1_exos [05/10/2020 16:55] – rgrondin | formations:devweb_1_exos [08/10/2020 17:56] (Version actuelle) – rgrondin | ||
---|---|---|---|
Ligne 1: | Ligne 1: | ||
+ | ====== Exercices Devweb 101 ====== | ||
+ | Page d' | ||
+ | ===== Exo 1.1 Une page d' | ||
+ | **Objectif :** faire une page web très simple avec les informations vues pendant la formation | ||
+ | |||
+ | **Description :** La page d' | ||
+ | * Votre nom | ||
+ | * Un petit texte pour souhaiter la bienvenue au visiteur sur votre site perso et lui indiquer ce qu'il peut y trouver | ||
+ | * Votre meilleure photo de vous (ou de loutre si vous êtes timides/ne voulez pas vous exposer à l' | ||
+ | * Les liens vers les futures rubriques de votre site (avec la mention "à venir" au besoin) | ||
+ | * CV | ||
+ | * Galerie d' | ||
+ | * Photo de loutre préférée ... ? | ||
+ | * Si vous le voulez, un lien vers le site du GInfo qui vous a aidé à faire ce site 😀 https:// | ||
+ | |||
+ | **Exemples :** | ||
+ | <note important> | ||
+ | * http:// | ||
+ | * http:// | ||
+ | * http:// | ||
+ | * https:// | ||
+ | * https:// | ||
+ | |||
+ | ** Requis :** | ||
+ | * Un titre de page (title) et un titre sur la page (h1 par ex) | ||
+ | * Un paragraphe de texte | ||
+ | * Une image hébergée sur votre propre site | ||
+ | * Des liens dont le style a été personnalisé pour ressembler un peu à des boutons | ||
+ | * Un style de page personnalisé (police d' | ||
+ | * La page doit être la page d' | ||
+ | * Le style doit être dans un fichier CSS séparé | ||
+ | |||
+ | ===== Exo 1.2 : Finissez votre CV ! ===== | ||
+ | **Objectif :** mettre en pratique la devweb 1 dans un cas un peu plus concret | ||
+ | |||
+ | **Description :** Après avoir réalisé avec brio le CV de Jean-Loutre pendant la formation, il est temps de rendre votre site perso un peu plus... perso 😎. | ||
+ | |||
+ | Le plus important dans cet exercice n'est pas forcément le contenu, mais plutôt la forme avec laquelle vous allez rendre ce contenu. De toute façon dans la scolarité vous aurez tôt ou tard à faire un CV donc autant commencer à y réfléchir. Vous pouvez mettre les informations suivantes : | ||
+ | * Votre nom, vos coordonnées (approximatives, | ||
+ | * Une photo portrait de vous | ||
+ | * Vos expériences scolaires (ECM, prépa, lycée) | ||
+ | * Vos expériences pro si vous en avez (job d' | ||
+ | * Vos loisirs | ||
+ | |||
+ | **Exemples :** | ||
+ | <note important> | ||
+ | * http:// | ||
+ | * https:// | ||
+ | * http:// | ||
+ | |||
+ | ** Requis :** | ||
+ | * Un minimum de contenu (pas forcément tout ce qui est indiqué) | ||
+ | * Des mises en page avec des listes pour les différentes expériences | ||
+ | * Des blocs avec des couleurs personnalisées | ||
+ | * Une image, voir plusieurs (petites icônes par exemple) | ||
+ | * La page doit être sur une page distincte de votre site (cv.html dans le dossier html/ ou index.html dans le dossier html/ | ||
+ | * Le style doit être dans un fichier CSS séparé |