Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N....

Preview:

Citation preview

Génération de feuilles de style pour site Web par un

Algorithme Génétique InteractifN. Monmarché, G. Nocent, M. Slimane, G. Venturini,

Laboratoire d ’Informatique - Université de Tours,

P. SantiniAlderan S.A.

Plan de l’exposé

•Présentation du problème•Les Algorithmes Génétiques (A.G.)•HTML et Feuilles de style•Imagine

Présentation du problème

•La présentation de pages WEB•Les limites des logiciels actuels•Nécessité de proposer des « looks »•Impératifs : respect de l’avis de l’utilisateur

Les algorithmes génétiques

Présentation des A.G.

•Inspirés de la théorie de l’évolution•Une solution = un individu•Une caractéristique = un gène•Créer des descendances issues des meilleurs individus par croisement et mutation

Les algorithmes génétiques

Croisement et mutation

Croisement

Mutation

@@ ## WW && 55

GG << $$ kk µµ

@@ ## $$ kk 55

@@ ## $$ kk 55@@ ## %% kk 55

Les algorithmes génétiquesAG non classique (basé sur la fréquence des gènes)

@@ ## WW && µµ

GG ## $$ kk µµ

GG ## ** « «  55

@@ ## WW 8 8  µµ

Gène n°1

Valeur Fréquence

@ 50 %

G 50 %

Gène n°2

Valeur Fréquence

# 100 %Etc. …

Les algorithmes génétiques

A.G. non classique : implémentation

Sélection Mutation

HTML et Feuilles de style

Présentation d’HTML•Langage à balises•Orienté structuration de texte, désormais doté de possibilités graphiques évoluées•Exemples :

<BODY BGCOLOR=#FF0000> Le fond de la page est rouge.<H1> Gros titre </H1> <H6> Petit titre </H6><FONT FACE=«Times»> Un texte personnalisé </FONT></BODY>

HTML et Feuilles de style

Les feuilles de style (CSS)

•Un but : faciliter la cohérence graphique d’un site en définissant des styles

•Orienté HTML : n’importe quelle balise peut voir son rendu graphique modifié

ImaginePrincipe de fonctionnement

But = personnaliser une ou plusieurs pages en optimisant la feuille de style avec un algorithme génétique interactif

Principe de l’algorithme :1) Générer initialement une population de feuilles de style

(1 feuille = 1 individu),2) Afficher les feuilles (en les appliquant aux pages HTML de l’utilisateur),3) Laisser l’utilisateur sélectionner les versions de ses pages qui lui plaisent le plus,4) Mettre à jour les fréquences des gènes en fonction des individus sélectionnés,5) Générer la population suivante,6) Aller en 2) ou Stop si l’utilisateur est satisfait

ImagineReprésentation génétique

Gènes (26 en tout) Valeurs possiblesFond (couleur ou image) 64 fichiers gif/jpeg ou 128 couleursCouleur liens 128 couleursRègles/barres 25 fichiers gif/jpegPuces ‘  ’  ’ ‘  ‘  ’  ’ Titres niveau 1 (2 et 3)

couleur 128alignement gauche, droite, centré, justifié, police 35 policesstyle normal, italique, obliquepoids léger, normal, gras,

…Paragraphe (police, style, …)Texte d’introduction (…)Commentaires (…)

ImagineAutres possibilités d ’interaction

•Modification directe du style d’une page (avec prise en compte des gènes modifiés dans l’algorithme génétique)

•Gestion d ’une base de données des couleurs, imagettes, …, pour restreindre/augmenter les valeurs possible des gènes, ou pour les adapter à un domaine particulier,

Le logiciel Imagine

Organisation interne

Gestion de Gestion de l’algorithme l’algorithme génétiquegénétique

Gestion de Gestion de l’interface l’interface utilisateurutilisateur

Gestion du Gestion du rendu HTMLrendu HTML

Gestion des Gestion des opérations opérations graphiquesgraphiques

Gestion de Gestion de la base de la base de donnéesdonnées

APIs Win32

GASim.dll(Visual C++)

Navigateur IE4 / 5

Visual Basic

Moteur JET

(Access)

Conclusion et perspectives

•Imagine = outil complètement intuitif et interactif optimisant des feuilles de style HTML en fonction des préférences de l’utilisateur

•l’A.G. interactif peut optimiser le style d’autres types de documents (Word, …)

•Application réelle en cours de réalisation/commercialisation par Alderan S.A.

Recommended