Typographie, du papier au Web

1. Du Papier au Web
Robin , Vladimir , Jérémy, Kenzo

2. PLAN:
 INTRO
I. Mise En Page, CSS 3 caractères UNICODE
II. Règles: quelles évolutions avec le Web,
Contraintes du numérique.
III. Polices de caractères : différence entre les caractères
d'impression et les caractères numériques

3. INTRO
 Le sens du mot typographie a largement évolué depuis
sa première utilisation au XVIè siècle.
 Les multiples dimensions de la typographie
 Les codes typographiques
 De l'écrit vers le net, première approche.

4. Invention de l’imprimerie par
Gutenberg

5. Poinçons et Planche de Fonte

6. Les Différentes machines à Imprimer

7. Texte Déponctualisé
 Rien ne devrait m'assombrir plus que ce que tu me dis
des hommes de leur sottise de leur instinct de saccage
mais tu me rappelles un peu ma belle-sœur qui au
moment de la chute du franc s'étonnait à neuf et en
détail de la hausse de chaque marchandise ce matin la
botte de radis est à quinze sous il faut en prendre son
parti l'humanité telle qu'elle est encore est une triste
chose.

8. Texte Ponctualisé
 Rien ne devrait m'assombrir plus que ce que tu me dis
des hommes, de leur sottise, de leur instinct de saccage
; mais tu me rappelles un peu ma belle-sœur qui, au
moment de la chute du franc, s'étonnait à neuf et en
détail de la hausse de chaque marchandise : "Ce matin,
la botte de radis est à quinze sous !" Il faut en prendre
son parti : l'humanité, telle qu'elle est encore, est une
triste chose.

9. Comparaison des 2 textes
Déponctualisé Ponctualisé
 Rien ne devrait m'assombrir plus  Rien ne devrait m'assombrir plus
que ce que tu me dis des que ce que tu me dis des
hommes de leur sottise de leur hommes, de leur sottise, de leur
instinct de saccage mais tu me instinct de saccage ; mais tu me
rappelles un peu ma belle-sœur rappelles un peu ma belle-sœur
qui au moment de la chute du qui, au moment de la chute du
franc s'étonnait à neuf et en franc, s'étonnait à neuf et en
détail de la hausse de chaque détail de la hausse de chaque
marchandise ce matin la botte marchandise : "Ce matin, la
de radis est à quinze sous il faut botte de radis est à quinze sous !"
en prendre son parti l'humanité Il faut en prendre son parti :
telle qu'elle est encore est une l'humanité, telle qu'elle est
triste chose encore, est une triste chose

10. I. Mise En Page, CSS 3 caractères
UNICODE
 gris typographique>feuilles de style
 CSS 3 (coupe, polices, etc.)
 caractères UNICODE, (responsive design?)

11. •La mise en page est un élément essentiel de la
présentation de l'information, mais aussi du
texte et des différents éléments qui
l'accom-pagnent.
•À la fin du XVIIIe et au début du XIXe siècle,
la mise en page est marquée à la fois par les
contraintes techniques et par l'influence de
l'imprimerie de labeur.
•Le Constitutionnel utilise 35 ouvriers dédiés à
la composition pour 16 000 exemplaires au
début des années 1820.
•Avec l'arrivée combinée de machines plus
performantes, de la presse populaire, de la
concurrence et de la publicité, les journaux
s'étirent sur plusieurs colonnes et laissent de la
place aux gravures et aux premières
photographies

12. •Le numérique bouleverse les habitudes de
publication.
•La publication assistée par ordinateur = une très
grande souplesse
•La liberté apportée par la PAO a entrainé la mise
en place d'un véritable carcan.
•La construction d'une page en HTML (hyper text
markup language) impose :
- une construction en blocs
- le positionnement de ces blocs grâce aux feuilles
de style CSS
modification du code pour chaque changement
dans la mise en page du site.
•La colonne et La relance se sont volatilisée.
•L'encadré connaît des jours difficiles.
•Les lettrines => en voie de disparition!

13. • Jusque-là, deux possibilités
s'offraient au concepteur d'un site :
obliger ses visiteurs à agrandir la page
s'ils venaient à partir d'un petit
dispositif et leur infliger une co-lonne
étrangement étroite s'ils venaient avec
un grand écran, ou concevoir une
version diffé-rente du site pour
chaque taille d'appareils.
• Cependant, dans un cas comme dans
l'autre, plus la mise en page sera
complexe au départ, plus il sera
difficile de l'adapter. Le concepteur de
sites est donc fortement tenté de
rester sur des designs simples,

14. Histoire des polices
5 polices au
départ
La révolution
CSS3
Plus 100 000
polices
aujourd'hui

15. Mise en page différente
 http://www.youtube.com/watch?v=UVwgA
Des sites oW6w7U
similaires
Nouvelles
formes
d'organisations
Meilleure
visibilité

16. Des évolutions techniques
Une liberté accrue
Des choix de polices décisives :
Exemple CERN, Obama
Tâches simplifiées

17. Les trois grands types de Caractère
A
AVEC
EMPATTEMENT
S
SANS EMPATTEMENT
F
FANTAISIE, SCRIPTE

18. Caractère numérique: la Vectorisation
 Permet de modifier la
taille de la police et qui
permet de changer le
corps du caratère

19. Caractère numérique: bitmap

20. Différence entre Bitmap et Vectoriel