RAPPORT EXERCICE 1

Homepage

Point de départ
- Création d’une homepage dans le cadre de la formation MALLT
- Utilisation de XHTML et CSS

Démarche personnelle
Je ne cache pas ma réserve quant à avoir une homepage personnelle.
La grande question n’était pas le "comment" mais le "quoi". Que mettre sur une homepage, lorsque l’on estime ses photos de vacances peu réussies, ses hobbies peu extravagants et son CV, sans palmarès et titres particuliers, peu impressionnant ? On peut le deviner, je ne me sentais ni l’envie ni le besoin d’étaler mes banales intimités sur le web, un endroit où il existe déjà assez de choses grotesques et grossières…

Concept
Le concept de mon site est donc fortement empreint de ce scepticisme envers la création d’une propre homepage. Le contenu reste très succinct, le design plutôt minimaliste : un titre, une image, un texte, un choix personnel de mes meilleurs films pour les indications personnelles et info et index pour le côté pratique.
L’idée du "placeholder" et du "blindtext", utilisé dans les prototypes, contourne des attentes et se refuse à une lecture à l’instant. La désignation des liens (“mon titre“, “mon image“, “mon texte“) est poussée à une banalité extrème et ne peut être interprétée qu’au deuxième degré.
Le choix du prototype est voulu. Son but est de montrer un site dans son état "pur" où l’accent est mis sur le "comment" et pas sur le "quoi" donc sur la mise en œuvre du site et son apparition: le design et le lay-out, l’emplacement, l’ergonomie et l’interactivité.
Ce dispositif pourrait amener à une réflexion au-delà de la question sur quel bouton faut-il cliquer ? ou quelle est la couleur de mes cheveux ?
Dans son refus, cette homepage est une sorte de anti-homepage, un petit bac à sable qui invite à creuser un peu - ni plus, ni moins.

Objectifs
- Créer un site simple, mais pas simpliste
- Favoriser un site plutôt conceptuel qu’informel
- Utiliser un design sobre et fonctionnel qui ouvre la lisibilité et favorise l’utilisation
- Exprimer une attitude (critique)
- Intégrer des aspects ludiques et ironiques sous la forme interactive
- Poser un certain défi technique et créatif dans l’utilisation du XHTML et du CSS (avec l’aide de JavaScript)

Démarche technique
Plus tellement néophyte dans la création de sites web, j’ai cherché un petit défi technique pour rendre cet exercice plus ardu. Le but était de créer quelques gadgets interactifs dans le cadre de la tâche demandée (utilisation de XHTML et de CSS) en utilisant du JavaScript, un langage que j’apprécie pour sa simplicité et son pouvoir de rendre un site dynamique.
La réalisation de ces petits gadgets m’a pris beaucoup de temps et dressé des obstacles imprévus. Il m’a fallu quelques "workarounds" et adaptations au concept initial pour arriver à un résultat acceptable.
Après les problèmes de lecture dans IE, j’ai changé préventivement l’éditeur puisque je soupçonnais d’avoir produit un code nuisible à celui-ci.
Je regrette d’avoir manqué de temps pour résoudre plus proprement quelques problèmes. D’un point de vue technique, il reste encore des champs à exploiter.

Design
Compte tenu du temps d’investissement limité et des objectifs ciblés, j’ai choisi un design sobre, discret et fonctionel, axé sur la feuille de style, donc sans aucun élément graphique externe et une utilisation des images minimum.
Le choix de la palette de couleurs et de la typographie a été fait librement sans contrainte.
Ce qui m’a de nouveau très frappée, c’est la différence de luminosité entre les écrans (et les systèmes d’exploitation).
Convaincue de l’importance de l’impact du design sur la perception (émotionnelle) d’un site ou d’un environnement, j’offre une petite approche de reflexion simple à ce sujet: la possibilité de choisir un arrière fond de différentes couleurs, différentes typos ainsi que leurs tailles.
Le but était de créer une sorte de CI/CD (Corporate Identity/Corporate Design) qui sera applicable plus tard sur d’autres pages pour garantir une identité homogène et vite reconnaissable à travers tous les exercices.

Page travaux

Point de départ
- Création d’une page en XML qui indexe les travaux
- Adaptation du fichier XSLT et mise au forme

Concept
Sous des contraintes très rigides, la tâche était claire: créer une page où les travaux des cours seraient listés. J’ai visé une bonne organisation et une application de mon design et lay-out.

Objectifs
- Maîtriser les bases de XSLT, en comprendre son principe
- Soigner le design et la feuille de style de ma homepage
- Fournir une bonne présentation et une organistaiton claire
- Veiller à l’absence d’erreur
- Créer un affichage propre

Démarche téchnique
Le premier grand obstacle a été l’intégration de la feuille de style CSS. Où fallait-il mettre le lien ?
L’étude des exemples et l’analyse du code m’ont beaucoup aidée et j’ai vite progressé dans la réalisation et l’adaptation de ma page. Le principe m’a semblé logique et son application peu difficile.
Le succès qui s’est montré sous la forme d’un contenu proprement affiché m’a encouragée à enchaîner tout de suite avec l’exercice 2C.

Design
Mon but a été d’appliquer proprement le design et le lay-out de ma homepage pour que la page travaux aie le même "look".

Personnage et bureau MOO

Point de départ
- Création d’une identité sur TecfaMOO

Démarche personnelle
En principe, j’aime bien l’idée d’un environnement virtuel où l’on peut se créer une nouvelle identité, se cacher derrière un pseudonyme, transposer ses envies, ses idées et ses émotions en quelques caractères et chiffres.
Dans sa simplicité et sa pureté, l’environnement de MOO a, d’un point de vue philosophique, quelque chose de fascinant. L’utilisation ne demande pas seulement une grande capacité d’abstraction, mais aussi le contraire : beaucoup d’imagination et d’empathie pour créer un monde "plastique" et "émotionnel" à partir des abstractions et réductions.
Ce qui m’a terriblement manqué au début de cet exercice était un scénario, une histoire, un but concret. C’est seulement après la création de ma maison appellée "LeCorbusier", que j’ai senti enfin un point de repère, le début d’une histoire, l’idée d’un concept. C’est à ce moment-là que mon identité virtuelle a pris forme.

Objectifs
- Apprendre quelques règles basiques pour participer au jeu
- Se créer une identité
- Prendre plaisir dans un environnement virtuel

Démarche téchnique
J’ai réagi assez intuitivement par rapport à la situation trouvée, au début sans concept, sans but. Souvent j’avais des problèmes à m’orienter, car il me manquait des repères. Soit je suivais les instructions qui m’étaient ordonnées par le programme, soit j’essayais quelques commandes du script.
Mais l’enthousiasme restait modéré. Je me sentais entourée de fantômes. Il me manquait l’aspect communautaire, interactif, ludique. Et surtout il me manquait de vrais participants qui auraient pu faire vivre un peu plus cet environnement.

Design
Bon exercice mental pour tester son imagination et son empathie.

Page RSS

Point de départ
- Création d'une page RSS avec la DTD RSS-2.0
- Adaptation d'une feuille de style CSS pour le RSS

Concept
Le premier pas a été de trouver des informations sur ce format, des réponses sur le "quoi", le "comment" et le "pourquoi", connaître les champs d’application et leur fonctionnement.
Ensuite j’ai voulu lancer une recherche pour trouver un RSS-feed qui collait thématiquement avec le reste de mes travaux.

Objectifs
- Comprendre le principe des RSS-feeds
- Connaître les champs d’application et son fonctionnement
- Veiller à la bonne application de la feuille de style de ma homepage

Démarche téchnique
J’ai d’abord cherché sur le web des infos générales. Il y avait beaucoup de sites qui offraient des RSS-feeds. Ainsi, je me suis limitée à des feeds qui allaient avec le concept de mon site web et mes interêts.
L’adaptation de la page RSS au design de ma homepage avec l’aide d’une feuille de style ne m’a pas posé de grands problèmes. Mais après l’expérience positive de XSLT, l’application de la feuille de style m’a semblé une méthode assez incomplète et j’ai dû me contenter d’un résultat un peu moins satisfaisant.
Ce qui me préoccupait plus que la mise en page avec du CSS était de savoir comment intégrer la page RSS dans un site et comment fonctionne sa mise à jour.
J’ai trouvé quelques pistes sur différentes RSS-Readers. J’espère que l’intégration dans une page sera bientôt la tâche dans un prochain exercice.

Design
J’ai essayé d’attribuer le CD/CI de ma homepage avec les moyens de la feuille de style CSS. Le résultat n’a pas été parfait mais acceptable.

Page FOAF

Point de départ
- Création de sa propre page FOAF avec un éditeur en ligne

Démarche personnelle
FOAF ? - Jamais entendu. Friend Of A Friend – sympa.
Allons voir si cet(te) ami(e) est aussi un(e) ami(e) à moi...

Objectifs
- Créer une page FOAF avec ou sans éditeur
- Connaître le principe FOAF et savoir l’utiliser

Démarche téchnique
J’ai commencé par faire des recherches sur le web relatives aux termes FOAF et RDF. Je ne les connaissais pas et je ne savais pas ce qui m’attendait. Les explications trouvées m’ont semblé soit trop simples soit trop complexes comme celles du site W3C où déjà le tableau de matière m’avait donné le vertige. Pour éviter la lecture sur écran (que je déteste), j’ai cherché une autre voie pour de connaissance: L’étude des exemples. Les bribes de code que j’ai retrouvées ne me satisfaisaient pas. Je voulais des exemples plus complexes qui montreraient clairement les différents formats FOAF/RDF, XML, RSS, DTD, CSS, leur relation et application dans la pratique.
J’ai attaqué cet exercice avec l’envie de tout comprendre dans toute sa complexité tout de suite. Après une lecture hasardeuse et peu structurée jusqu’à tôt le matin (avec une concentration sûrement limitée) j’ai dû réfréner mes impulsions et mon impatience.
Le lendemain, face à l’échec et la tête vide, j’ai commencé à travailer plus systématiquement et avec moins d’ambitions. A la fin, je ne comprenais pas tout dans toute sa complexitié mais au moins j’avais ce qui était demandé :
Une page FOAF créée avec un éditeur.