Précédent Index Suivant

2  Visualisateur de site webview

Il est intéressant de pouvoir disposer d'une représentation graphique d'un site Web (ou d'une partie d'un site Web), pour y identifier visuellement les possibilités de navigation à l'intérieur du site ; on peut aussi afficher quantité d'informations concernant les pages et les liens.

2.1  L'outil graphlet

Pour cela, nous allons utiliser un visualisateur de graphes ; pour nous faciliter la tâche, nous pouvons aussi laisser ce visualisateur réaliser automatiquement le placement des noeuds du graphe suivant divers algorithmes. L'outil graphlet implante ces fonctionnalités ; il est disponible sur le site http://www.fmi.uni-passau.de/Graphlet.

2.2  Exemple de résultat de webview

Par exemple, la figure 1 représente le site de test proposé http://www.lifl.fr/~levaire/C/webtools/testweb.html après avoir appliqué l'algorithme de placement automatique Extended DAG [Cet algorithme semble être le plus approprié pour afficher des graphes représentant des sites Web.] de graphlet.

Figure 1 : La représentation graphique du site d'essai http://www.lifl.fr/~levaire/C/webtools/testweb.html
En vert, les liens ok, en bleu les liens que l'on ne vérifie pas récursivement, en noir les liens que l'on ne vérifie pas du tout, et en rouge les liens inexistants.
Le fichier GML utilisé pour produire cette représentation graphique est disponible : http://www.lifl.fr/~marquet/ens/cu/webtools/webtools.g. Ce fichier est un exemple de ce que peut être le résultat de votre commande webview.

2.3  Format des fichiers GML

Pour afficher un tel graphe, il faut générer, à partir du parcours du site, un fichier au format GML (Graph Modelling Language). Ce format est un format textuel, où l'on déclare les noeuds en leur donnant un identifiant (id), et les arêtes en spécifiant les identifiants du noeud source et du noeud destination. Par exemple : 
graph [
    directed 1
    id 42
    node [
        id 1
        label "testweb.html"
        graphics [
          type "rectangle"
          fill "green"
        ]
    ]
    node [
        id 2
        label "http://www.lifl.fr/~levaire/C/webtools/test/localabsolu.html"
        graphics [
          type "rectangle"
          fill "green"
        ]
    ]
    edge [
    source 1
    target 2
    ]
]
déclare un graphe dirigé contenant 2 noeuds d'identifiant respectif 1 et 2, et une arête du noeud 1 vers le noeud 2. L'étiquette d'un noeud (ou d'une arête) est précisé dans le champ label et ses attributs graphiques dans le champ graphics. On ne précise aucun attribut graphique de position, simplement un type et une couleur. C'est l'algorithme de placement automatique qui modifiera en fait les attributs graphiques de position. Vous trouverez de plus amples précisions sur ce langage dans la documentation http://www.fmi.uni-passau.de/Graphlet/download/misc/GML.ps.gz.

2.4  La commande webview


Exercice 3   Proposez une structure de données pour conserver (après sa vérification) l'ensemble des liens à l'intérieur d'un site, ainsi que leur état (au sens de webcheck). On utilisera le même algorithme que précédemment pour vérifier un site.

Exercice 4   Proposez un algorithme qui parcourt la structure de données que vous avez proposée et génère un fichier au format GML représentant le site. Vous êtes libre de choisir la représentation que vous voulez, si vous la décrivez bien dans votre rapport. Vous pouvez utiliser la représentation suggérée à la figure 1.

Précédent Index Suivant