14
Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d ’Informatique - Université de Tours, P. Santini Alderan S.A.

Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

Embed Size (px)

Citation preview

Page 1: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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.

Page 2: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

Plan de l’exposé

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

Page 3: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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

Page 4: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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

Page 5: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

Les algorithmes génétiques

Croisement et mutation

Croisement

Mutation

@@ ## WW && 55

GG << $$ kk µµ

@@ ## $$ kk 55

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

Page 6: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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. …

Page 7: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

Les algorithmes génétiques

A.G. non classique : implémentation

Sélection Mutation

Page 8: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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>

Page 9: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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é

Page 10: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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

Page 11: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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 (…)

Page 12: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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,

Page 13: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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)

Page 14: Génération de feuilles de style pour site Web par un Algorithme Génétique Interactif N. Monmarché, G. Nocent, M. Slimane, G. Venturini, Laboratoire d Informatique

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.