Exercice 1 - Construction d'une identité digitale
Liens
Objectifs
De manière générale, j'ai pour objectif de séparer mon identité digitale en deux parties: une pour le monde professionnel (page TECFA, LinkedIn) et l'autre davantage privée (profil Edutech Wiki, page travaux). Ainsi, j'ai choisi de m'appeler Rachel E sur mon profil Edutech Wiki et d'y inclure une photo concernant mes hobbies. Au contraire, mon profil LinkedIn et ma page personnelle contiennent une photo passeport et un texte plus formel. De plus, je ne propose pas de lien entre ces deux parties de mon identité digitale dans le but de les garder séparées.
Page personnelle TECFA
Ma page personnelle a pour objectif de me présenter à un public inconnu. Le but est de montrer l'étendue de mes compétences actuelles tout en nommant mes objectifs professionnels ainsi qu'en décrivant mes intérets et mes valeurs. Le lien vers ma page LinkedIn a pour but de fournir des informations plus détaillées sur mon cursus professionnel et associatif.
Profil EduTech Wiki
Je souhaite utiliser EduTech Wiki pour un public plus restreint. Mon profil a donc pour objectif de me présenter auprès de mes collègues étudiants et des enseignants.
Page travaux
Cette page sert à réunir les travaux effectués dans le cadre du master MALTT.
Nouvellement inscrite sur LinkedIn, je souhaite utiliser cette page pour trouver des stages et me faire des contacts dans le monde de la technologie.
Design
Pour ce premier exercice, je me suis concentrée sur la structure du contenu ainsi que l'adaptabilité des pages à différentes tailles d'écran, raison pour laquelle je n'ai qu'une seule page par sous-exercice. Le navigateur de ma page personnelle TECFA a été longuement travaillé pour que son design reste agréable et utilisable sur différents appareils. J'ai également cherché à faire correspondre la page travaux et le rapport dans leur présentation. Pour ma page LinkedIn, j'ai cherché à mettre en avant une image démontrant aussi bien mon parcours (tableau noir) que mes obejctifs (innovation, création).
Production
Page personnelle TECFA
J'ai commencé par créer ma barre de navigation en utilisant HTML5 et CSS. Ensuite, j'ai fait des recherches sur internet pour m'aider à stylser son contenu. J'ai utilisé l'outil de développement de Firefox "vue adaptative" afin de vérifier que mon site s'adapte à d'autres taille d'écran. Pour finir, j'ai vérifié la validité de mes pages.
Profil EduTech WIki
La production de cet exercice a commencé lors de la semaine MINIT. J'ai ensuite adapté le contenu en modifiant le code. La dernière étape a été d'inclure une image SVG et de changer mon image de profil afin qu'elle corresponde davantage à mon objectif.
Page travaux
Avant tout, j'ai commencé par aller regarder les pages des étudiants des volées précédentes en examinant les codes source. Ensuite, j'ai ouvert le document "travauxdoc.txt" afin de saisir la structure et de pouvoir construire mon document welcome.xml. Afin de faire des modifications du contenu, j'ai quelque peu changé le document xsl. A ce moment de la production, j'ai cherché à modifier la mise en page dans ce même document. Constatant mon erreur, j'ai ensuite travaillé sur le CSS.
Avant de publier, j'ai vérifié la validité de mes pages.
Pour ce sous-exercice, je me suis rendue sur la page internet de LinkedIn et j'ai suivi les étapes proposées pour créer mon profil.
Autoévaluation
Pour une première entrée dans le monde HTML5, CSS et XML, je suis contente du rendu des activités. Je me rends compte que ma manière d'explorer HTML et CSS m'a mené à fonctionner en agissant sur chaque erreur avec une solution unique, ce qui peut expliquer un code CSS quelque peu compliqué. De plus, je pense avoir de la difficulté à utiliser correctement les balises "div" ainsi que les marges et les "padding".
Concernant ma page LinkedIn, je ne suis que moyennement satisfaite du rendu de la photo qui n'est selon moi pas adaptée au format proposé.
Si c'était à refaire, je me plongerais tout d'abord sur le contenu et non directement dans la mise en page afin d'éviter des aller-retours improductifs.
Pour finir, j'imagine des modifications à ma page travaux nécessitant éventuellement, de part sa future longueur, un navigateur.
Bibliographie
Le site w3schools pour différents éléments de mise en page.
La vidéo Responsive Navbar with Media Queries, également citée dans le code source de ma page TECFA, pour le navigateur.
Le site W3 Unicorn pour valider mes pages.
De multiples recherches google dont je ne me souviens plus les liens mais que je référencerai pour mes prochains travaux.
Ressources
Images libres de droit sur The Noun Project.
Photographies par Dominique's Photography avec son accord pour publication.