Aucun titre de diapositive

1
Imagine a tool for generating HTML style
sheets with an interactive genetic
algorithm based on genes frequencies N.
Monmarché, G. Nocent, M. Slimane, G. Venturini,
Laboratoire d Informatique - University of
Tours, France P. Santini Alderan S.A., France
2
Overview

• The problem
• Genetic algorithm gene frequencies
• HTML and style sheets
• Imagine

3
The problem

• Designing the look of web pages
• Limitations of actual software
• user must define everything
• Proposed improvements
• to suggest several different look
• that will satisfy the user

4
Genetic algorithms (1/4)
Short overview

• inspired from natural selection
• one solution one individual
• part of solution a gene
• select the fittest individuals, create offspring
  with crossover and mutation

5
GAs (2/4)
Standard crossover and mutation operators
Crossover
Mutation
6
GAs (3/4)
Non standard GA based on gene frequencies
Gene n1
Value
Frequency
x
50
b
50
Gene n2
Value
Frequency
t
100
Etc.
7
GAs (4/4)
Non standard operators
Selection
Mutation
8
HTML style sheets

• HTML General language for text description
• Text is structured
• Example

ltBODY BGCOLORFF0000gt background color is
red. ltH1gt Large title lt/H1gt ltH6gt Small
title lt/H6gt ltFONT FACETimesgt A typical text
lt/FONTgt lt/BODYgt
9
HTML style sheets (CSS)

• Aim more homogeneous look of web with a
  precisely defined style

• HTML characteristics can be modified by the CSS

10
Imagine
Aim to personalize one or several web pages by
optimizing the style sheet with an interactive GA
Algorithm main principles 1) Generate initially
a population of style sheets (one sheet one
individual, one gene one entry in the style
sheet), 2) Display the style sheets (apply them
to the user HTML pages and show the result
different versions of the user s pages) 3) Let
the user select the versions of his pages that he
favors 4) Update the gene frequencies according
to the selected individuals, 5) Generate the next
population, 6) Go to 2) or Stop if the user is
satisfied.
11
Imagine
Genetic representation
Genes (26) Possibles Values Background (color
or image) 128 colors or 64 gif/jpeg
files Rules/bars 25 gif/jpeg files Bullets
          Titles level 1 (2 and 3)
color 128 alignment left, right, centered,
justified font 35 fonts style normal,
italic, oblique weight light, normal,
bold, Paragraph (font, style, ) Text of
introduction () Comments ()
12
Imagine
More interactions

• user can directly modify the style of a page
  (and modifications are taken into account in the
  GA)

• Imagine manages a databases of colors, images
  (Gif/Jpeg files) in order to let the user
  add/remove possible gene values (and may adapt
  them to his domain)

13
Imagine software
Internal organisation
Color and image database
JET engine (Access)
APIs Win32
Graphics
Visual Basic
GASim.dll (Visual C)
Browser IE4 / 5
User interface
GA
Appearance of style sheets
14
Conclusion and future work

• Imagine intuitive tool that optimizes HTML
  style sheets in interaction with the user
• GA could optimize other kind of document styles
  (Word, )
• Real world implementation in progress at Alderan
  S.A.