La création graphique au service de la publicité online (Digital Days 2011) - by med&com

1. La création graphique au
service de la publicité online

2. About me !
Khaled DJEBLOUN
Responsable artistique med&com
khaled@medncom.com

3. Au menu !
• Petit voyage dans le temps
• Les formats de publicité en ligne
• Les bonnes pratiques
• Best of des campagnes digitales
• Questions / réponses

4. Petit voyage dans le
temps

5. La création graphique au service de la publicité online
Petit voyage dans le temps
Création de la première bannière sur Internet
pour la campagne AT&T. Réalisée par l’agence
Modem Media, elle a été publiée sur le site
HotWired.com.
27 octobre 1994
By med&com

6. La création graphique au service de la publicité online
Petit voyage dans le temps
Sun lance le langage de programmation Java.
Premières publicités sur Yahoo!
1995
By med&com

7. La création graphique au service de la publicité online
Petit voyage dans le temps
• Diffusion de la première bannière publicitaire
en France
• Première publicité interactive : le jeu Pong pour
Hewlett Packard
• Lancement de la première version de Flash par
Macromedia.
• Invention du terme "marketing viral" par
Jeffrey F. Rayport (Harvard)
1996
By med&com

8. La création graphique au service de la publicité online
Petit voyage dans le temps
• Apparition des premiers interstitiels
1997
By med&com

9. La création graphique au service de la publicité online
Petit voyage dans le temps
• Lancement de Google !
1998
By med&com

10. La création graphique au service de la publicité online
Petit voyage dans le temps
• Essor du pop up et des rectangles en Flash
2000
By med&com

11. La création graphique au service de la publicité online
Petit voyage dans le temps
• Début de la publicité Rich Media : lancement
de la célèbre campagne IBM « Web site blues »
http://www.journaldunet.com/rubrique/banner/banner041027/ibm.shtml
• L’IAB Américain définit des formats standards
comme le rectangle ou le skyscraper
2001
By med&com

12. La création graphique au service de la publicité online
Petit voyage dans le temps
La publicité textuelle signée Google
2004
By med&com

13. La création graphique au service de la publicité online
Petit voyage dans le temps
Sortie de Flash 8
2005
By med&com

14. La création graphique au service de la publicité online
Petit voyage dans le temps
Google rachète DoubleClick pour 3,1 milliards
de dollars.
2007
By med&com

15. La création graphique au service de la publicité online
Petit voyage dans le temps
Première régie online en Algérie.
2007
By med&com

16. Les formats de
publicité en ligne

17. Bannières
simples

18. 728x90
300x600

19. Les formats de publicité en ligne
Bannières simples
468x60
300x250
160x600
250x250
728x90
300x600
By med&com

20. Format innovant
Flash transparent

21. Flash transparent
• Lancement de produit
• Format relativement intrusif, il
est susceptible de provoquer des
clics d’erreur
• Grande possibilité de création

25. Format innovant
Habillage de site

26. Habillage de site
• Support de notoriété
• Opération promotionnelle
• Offre spéciale

28. Format innovant
Interstitiel

29. Interstitiel
• Forte visibilité
• Fort impacte en terme de
mémorisation et de notoriété
• Offre spéciale
• Faire patienter l’internaute avant le
chargement de la page

31. Les inclassables

32. Les inclassables
Partenariat
E-reportage
bouton
Flux de contenu
Sponsoring
Api
By med&com

33. Les bonnes
pratiques

34. Mission créa !
• Réalité du média
• Compréhension des enjeux technologiques
• Perception de l'internaute

35. Les bonnes pratiques
Comment s’y prendre ?!
• Comprendre le message
• Imaginer le concept
• Elaborer son storyboard
• Animer !
• Décliner
By med&com

36. Les bonnes pratiques
Techniquement parlant !
By med&com

37. Techniquement parlant !
Bannière simple

38. Les bonnes pratiques
Techniquement parlant !
Dimension : Fixe (ex : 728x90 px)
Poids : < 50 ko
Calque d’arrière plan
Bordure 1px
Version du Flash player
By med&com

39. Techniquement parlant !
Flash transparent

40. Les bonnes pratiques
Techniquement parlant !
Dimension : variable
Poids : variable
Pas de calque d’arrière plan
Bouton fermer
Code javascript
By med&com

41. Les bonnes pratiques
Techniquement parlant ! Le détail
By med&com

42. Les bonnes pratiques
Techniquement parlant ! Le détail
Code
javascript
Code
HTML
By med&com

43. Techniquement parlant !
Habillage de site

45. Les bonnes pratiques
Techniquement parlant ! Le détail
[1280x1024]
[1440]
[1280x800]
[1366]
[1024]
By med&com

46. Techniquement parlant !
Interstitiel

47. Lien de
Logo redirection
Publicité

48. Best of des campagnes digitales

50. Merci pour votre attention
<questions>
</réponses>