Exercice 1 : se familiariser avec draw.io
#########################################

Contexte
********

Pour ce premier exercice, nous allons prendre pour prétexte le site `agencehotelparticulier.com <https://agencehotelparticulier.com/>`_

Voici une représentation de son arborescence réalisée avec le logiciel Graphviz :

.. figure:: images/agencehotelparticulier.com--edit.svg
   :alt: arborescence fictive du site agencehotelparticulier.com
   :align: center

   Représentation de l'arborescence du site agencehotelparticulier.com réalisée avec Graphviz

Observez en particulier :

* la présentation mettant en avant la profondeur des éléments
* la présence de différents modes de présentation selon les éléments
* la présence d'une légende détaillant les différents éléments
* la présence d'une forme graphique particulière pour un élément en contenant d'autres (ici un répertoire d'artistes)
* la présence d'une forme graphique particulière pour un modèle (ici la page artiste est déclinée pour plusieurs artistes : on indique cela plutôt que la liste au moment de l'analyse)

Exercice
********

Pour commencer, rendez-vous sur `draw.io <https://draw.io>`_.

Familiarisez-vous avec l'interface :

* placez plusieurs nœuds sur l'espace de travail
* nommez-les
* reliez-les entre eux
* nommez les liens
* sauvegardez votre fichier
* exportez-le en PDF

Une fois que vous êtes familier avec le logiciel, parcourez le site `agencehotelparticulier.com <https://agencehotelparticulier.com/>`_ et, en vous aidant du schéma précédent, reproduisez-en l'arborescence en utilisant draw.io

Rendu
*****

Rendez-vous `ici <https://volafile.org/r/10xrgkuww>`_ afin de déposer votre rendu.

.. note::
   Vous n'êtes pas obligés de mettre votre nom sur le rendu, il s'agit de regarder ensemble le travail de tous.