SlideShare una empresa de Scribd logo
1 de 46
Descargar para leer sin conexión
Web
     Design



Monday 28 December 2009
Web 2.0 is so 2005




Monday 28 December 2009
And yet people still say ...

                          “I want that design
                            to be more 2.0”




Monday 28 December 2009
2009 - 2005 = 4 years




Monday 28 December 2009
Who’s fault is that?




Monday 28 December 2009
It’s everyone’s fault
                          Everyone’s fault?




                                            Picture by flickr.com/photos/isayx3

Monday 28 December 2009
It’s the ones to blame!
                          We are   everyone’s fault




Monday 28 December 2009
“We” everyone’s fault
                             It’s as in: designers,
                          developers, accounts, ...




Monday 28 December 2009
Why?everyone’sto hide
                            It’s We love fault
                           behind technology




Monday 28 December 2009
Web 2.0 & web 3.0 has brought us
                          a lot of “new” (sometimes useful) stuff...




Monday 28 December 2009
... but how has web design
                               changed ever since?




Monday 28 December 2009
Web Design should
                          become more mature




Monday 28 December 2009
This is what people think when you say
  you’re a web designer...




Monday 28 December 2009
My definition of web design:

                   It’s a pixel perfect craft that communicates
                           a clear & structured message.




Monday 28 December 2009
2 things to keep in mind




Monday 28 December 2009
The internet is all about content
                                          &
                          People get frustrated in no time




Monday 28 December 2009
5 skills each web designer should practice




                                                 Picture by flickr.com/photos/anjin

Monday 28 December 2009
... or at least should have an interest in!




Monday 28 December 2009
1   Information Design
                          2   Usability
                          3   Typography
                          4   Visual Language
                          5   Change - ?




Monday 28 December 2009
Skill 1: Get addicted to Information Design




                                                        Picture by konigi.com

Monday 28 December 2009
“Information design makes complex
                          information easier to understand and use”




Monday 28 December 2009
‣     Human-centered design

   ‣     Measure information
         density

   ‣     What’s the knowledge
         base of my audience?

   ‣     Whitespace is sexy

   ‣     Prioritize

   ‣     Respect Standards




Monday 28 December 2009
Monday 28 December 2009
Skill 2: Usability, to ease everyone’s mind




                                                 Picture by flickr.com/photos/jepoirrier

Monday 28 December 2009
“Don’t make me think - please”




Monday 28 December 2009
‣     “What we design for” VS
         “How people really use it”

   ‣     Sense of Location

   ‣     What elements are
         clickable?

   ‣     Visual Hierarchy

   ‣     Less noise more signal

   ‣     Be consistent: it gives
         people the grip they need




Monday 28 December 2009
Monday 28 December 2009
Who doesn’t recognize these shapes?




Monday 28 December 2009
Skill 3: Typography, yes we Kern




Monday 28 December 2009
“typography is the art and
                          technique of arranging type”




Monday 28 December 2009
‣     Drop the tiny font-size

   ‣     Use different font-faces

   ‣     People Love color

   ‣     What should be
         emphasized?




Monday 28 December 2009
Monday 28 December 2009
Skill 4: Visual Language




                                      Picture by flickr.com/photos/41894180030@N01

Monday 28 December 2009
Matching content and design.
                          “Are they telling the same story?”




Monday 28 December 2009
‣     Your design should
            communicate something

      ‣     There’s no such thing as;
            “One template to rule
            them all”

      ‣     Design your content, not
            only the surrounding
            elements

      ‣     Your header & footer
            shouldn’t be the only
            Climax

      ‣     Your copy should be
            part of the lay-out




Monday 28 December 2009
Monday 28 December 2009
Monday 28 December 2009
Skill 5
                          change
Monday 28 December 2009
“Find a piece of the status-quo
                           and try to change it”




                                                 Seth Godin
Monday 28 December 2009
“You can tell who the pioneers are
                   from the arrows sticking out of
                            their backs”




                                           Hugh MacLeod
Monday 28 December 2009
Web design is Craftsmanship

                          Craftsmanship gets noticed twice as hard




                                                 Picture by flickr.com/photos/jepoirrier
Monday 28 December 2009
Web design is functional, it goes further
                     then creating a good looking website




Monday 28 December 2009
Every website has a goal

              How do we support the visitor in completing that goal?




Monday 28 December 2009
Good Web design equals higher ROI
                            and a bunch of happy visitors




Monday 28 December 2009
... Everyone is happy!




Monday 28 December 2009
That’s it!



 Erlend Debast
 Web designer @ proximity BBDO

 twitter.com/erlend
 erlend@artueel.be


Monday 28 December 2009

Más contenido relacionado

Similar a Web Design in 2009

Ibuildings Cms Talk
Ibuildings Cms TalkIbuildings Cms Talk
Ibuildings Cms Talk
dean1985
 
Batista Filipe A00725354 Lab 2
Batista Filipe A00725354 Lab 2Batista Filipe A00725354 Lab 2
Batista Filipe A00725354 Lab 2
guest5e035f5
 
The Social Desktop - Keynote Akademy 2008
The Social Desktop - Keynote Akademy 2008The Social Desktop - Keynote Akademy 2008
The Social Desktop - Keynote Akademy 2008
Frank Karlitschek
 
Object Oriented Css For High Performance Websites And Applications
Object Oriented Css For High Performance Websites And ApplicationsObject Oriented Css For High Performance Websites And Applications
Object Oriented Css For High Performance Websites And Applications
PerconaPerformance
 
Mark Rolston Presentation at Emerging Communication Conference & Awards 2009 ...
Mark Rolston Presentation at Emerging Communication Conference & Awards 2009 ...Mark Rolston Presentation at Emerging Communication Conference & Awards 2009 ...
Mark Rolston Presentation at Emerging Communication Conference & Awards 2009 ...
eCommConf
 

Similar a Web Design in 2009 (20)

Realtime 3D on the web - a toy or a useful tool?
Realtime 3D on the web - a toy or a useful tool?Realtime 3D on the web - a toy or a useful tool?
Realtime 3D on the web - a toy or a useful tool?
 
Cloudera Desktop
Cloudera DesktopCloudera Desktop
Cloudera Desktop
 
Streetmarc Presentation
Streetmarc PresentationStreetmarc Presentation
Streetmarc Presentation
 
Content Management Selection and Strategy
Content Management Selection and StrategyContent Management Selection and Strategy
Content Management Selection and Strategy
 
Ibuildings Cms Talk
Ibuildings Cms TalkIbuildings Cms Talk
Ibuildings Cms Talk
 
Batista Filipe A00725354 Lab 2
Batista Filipe A00725354 Lab 2Batista Filipe A00725354 Lab 2
Batista Filipe A00725354 Lab 2
 
The Social Desktop - Keynote Akademy 2008
The Social Desktop - Keynote Akademy 2008The Social Desktop - Keynote Akademy 2008
The Social Desktop - Keynote Akademy 2008
 
It's a beautiful day in your (online) neighborhood
It's a beautiful day in your (online) neighborhoodIt's a beautiful day in your (online) neighborhood
It's a beautiful day in your (online) neighborhood
 
Object Oriented Css For High Performance Websites And Applications
Object Oriented Css For High Performance Websites And ApplicationsObject Oriented Css For High Performance Websites And Applications
Object Oriented Css For High Performance Websites And Applications
 
Reef - ESUG2011
Reef  - ESUG2011Reef  - ESUG2011
Reef - ESUG2011
 
Measuring Online Influence: The Art of Making Noise Without Being Noisy
Measuring Online Influence: The Art of Making Noise Without Being NoisyMeasuring Online Influence: The Art of Making Noise Without Being Noisy
Measuring Online Influence: The Art of Making Noise Without Being Noisy
 
RefreshPhilly Presentation February 09
RefreshPhilly Presentation February 09RefreshPhilly Presentation February 09
RefreshPhilly Presentation February 09
 
SEO Basics
SEO   BasicsSEO   Basics
SEO Basics
 
The Design of Everyday Things
The Design of Everyday ThingsThe Design of Everyday Things
The Design of Everyday Things
 
DDD Part3 Retrospective
DDD Part3 RetrospectiveDDD Part3 Retrospective
DDD Part3 Retrospective
 
The Web Designers Toolkit
The Web Designers ToolkitThe Web Designers Toolkit
The Web Designers Toolkit
 
Well-designed Good(s)
Well-designed Good(s)Well-designed Good(s)
Well-designed Good(s)
 
How OpenNTF Open Source Solutions Can Save You Time, Money And Your Hair
How OpenNTF Open Source Solutions Can Save You Time, Money And Your HairHow OpenNTF Open Source Solutions Can Save You Time, Money And Your Hair
How OpenNTF Open Source Solutions Can Save You Time, Money And Your Hair
 
Code Quality in Ruby and Java
Code Quality in Ruby and JavaCode Quality in Ruby and Java
Code Quality in Ruby and Java
 
Mark Rolston Presentation at Emerging Communication Conference & Awards 2009 ...
Mark Rolston Presentation at Emerging Communication Conference & Awards 2009 ...Mark Rolston Presentation at Emerging Communication Conference & Awards 2009 ...
Mark Rolston Presentation at Emerging Communication Conference & Awards 2009 ...
 

Último

How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Website
mark11275
 
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
nirzagarg
 
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
gajnagarg
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
CristineGraceAcuyan
 
Design-System - FinTech - Isadora Agency
Design-System - FinTech - Isadora AgencyDesign-System - FinTech - Isadora Agency
Design-System - FinTech - Isadora Agency
Isadora Agency
 
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
instagramfab782445
 
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
wpkuukw
 
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman MuscatAbortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion pills in Kuwait Cytotec pills in Kuwait
 
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
gajnagarg
 
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
gajnagarg
 
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
yhavx
 

Último (20)

Hackathon evaluation template_latest_uploadpdf
Hackathon evaluation template_latest_uploadpdfHackathon evaluation template_latest_uploadpdf
Hackathon evaluation template_latest_uploadpdf
 
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdfJordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
 
How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Website
 
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
 
Independent Escorts Goregaon WhatsApp +91-9930687706, Best Service
Independent Escorts Goregaon WhatsApp +91-9930687706, Best ServiceIndependent Escorts Goregaon WhatsApp +91-9930687706, Best Service
Independent Escorts Goregaon WhatsApp +91-9930687706, Best Service
 
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
 
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
 
Essential UI/UX Design Principles: A Comprehensive Guide
Essential UI/UX Design Principles: A Comprehensive GuideEssential UI/UX Design Principles: A Comprehensive Guide
Essential UI/UX Design Principles: A Comprehensive Guide
 
Design-System - FinTech - Isadora Agency
Design-System - FinTech - Isadora AgencyDesign-System - FinTech - Isadora Agency
Design-System - FinTech - Isadora Agency
 
Eye-Catching Web Design Crafting User Interfaces .docx
Eye-Catching Web Design Crafting User Interfaces .docxEye-Catching Web Design Crafting User Interfaces .docx
Eye-Catching Web Design Crafting User Interfaces .docx
 
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
 
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime PondicherryPondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
 
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
 
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
 
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman MuscatAbortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
 
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
 
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
 
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
 
Call Girls Jalaun Just Call 8617370543 Top Class Call Girl Service Available
Call Girls Jalaun Just Call 8617370543 Top Class Call Girl Service AvailableCall Girls Jalaun Just Call 8617370543 Top Class Call Girl Service Available
Call Girls Jalaun Just Call 8617370543 Top Class Call Girl Service Available
 

Web Design in 2009

  • 1. Web Design Monday 28 December 2009
  • 2. Web 2.0 is so 2005 Monday 28 December 2009
  • 3. And yet people still say ... “I want that design to be more 2.0” Monday 28 December 2009
  • 4. 2009 - 2005 = 4 years Monday 28 December 2009
  • 5. Who’s fault is that? Monday 28 December 2009
  • 6. It’s everyone’s fault Everyone’s fault? Picture by flickr.com/photos/isayx3 Monday 28 December 2009
  • 7. It’s the ones to blame! We are everyone’s fault Monday 28 December 2009
  • 8. “We” everyone’s fault It’s as in: designers, developers, accounts, ... Monday 28 December 2009
  • 9. Why?everyone’sto hide It’s We love fault behind technology Monday 28 December 2009
  • 10. Web 2.0 & web 3.0 has brought us a lot of “new” (sometimes useful) stuff... Monday 28 December 2009
  • 11. ... but how has web design changed ever since? Monday 28 December 2009
  • 12. Web Design should become more mature Monday 28 December 2009
  • 13. This is what people think when you say you’re a web designer... Monday 28 December 2009
  • 14. My definition of web design: It’s a pixel perfect craft that communicates a clear & structured message. Monday 28 December 2009
  • 15. 2 things to keep in mind Monday 28 December 2009
  • 16. The internet is all about content & People get frustrated in no time Monday 28 December 2009
  • 17. 5 skills each web designer should practice Picture by flickr.com/photos/anjin Monday 28 December 2009
  • 18. ... or at least should have an interest in! Monday 28 December 2009
  • 19. 1 Information Design 2 Usability 3 Typography 4 Visual Language 5 Change - ? Monday 28 December 2009
  • 20. Skill 1: Get addicted to Information Design Picture by konigi.com Monday 28 December 2009
  • 21. “Information design makes complex information easier to understand and use” Monday 28 December 2009
  • 22. Human-centered design ‣ Measure information density ‣ What’s the knowledge base of my audience? ‣ Whitespace is sexy ‣ Prioritize ‣ Respect Standards Monday 28 December 2009
  • 24. Skill 2: Usability, to ease everyone’s mind Picture by flickr.com/photos/jepoirrier Monday 28 December 2009
  • 25. “Don’t make me think - please” Monday 28 December 2009
  • 26. “What we design for” VS “How people really use it” ‣ Sense of Location ‣ What elements are clickable? ‣ Visual Hierarchy ‣ Less noise more signal ‣ Be consistent: it gives people the grip they need Monday 28 December 2009
  • 28. Who doesn’t recognize these shapes? Monday 28 December 2009
  • 29. Skill 3: Typography, yes we Kern Monday 28 December 2009
  • 30. “typography is the art and technique of arranging type” Monday 28 December 2009
  • 31. Drop the tiny font-size ‣ Use different font-faces ‣ People Love color ‣ What should be emphasized? Monday 28 December 2009
  • 33. Skill 4: Visual Language Picture by flickr.com/photos/41894180030@N01 Monday 28 December 2009
  • 34. Matching content and design. “Are they telling the same story?” Monday 28 December 2009
  • 35. Your design should communicate something ‣ There’s no such thing as; “One template to rule them all” ‣ Design your content, not only the surrounding elements ‣ Your header & footer shouldn’t be the only Climax ‣ Your copy should be part of the lay-out Monday 28 December 2009
  • 38. Skill 5 change Monday 28 December 2009
  • 39. “Find a piece of the status-quo and try to change it” Seth Godin Monday 28 December 2009
  • 40. “You can tell who the pioneers are from the arrows sticking out of their backs” Hugh MacLeod Monday 28 December 2009
  • 41. Web design is Craftsmanship Craftsmanship gets noticed twice as hard Picture by flickr.com/photos/jepoirrier Monday 28 December 2009
  • 42. Web design is functional, it goes further then creating a good looking website Monday 28 December 2009
  • 43. Every website has a goal How do we support the visitor in completing that goal? Monday 28 December 2009
  • 44. Good Web design equals higher ROI and a bunch of happy visitors Monday 28 December 2009
  • 45. ... Everyone is happy! Monday 28 December 2009
  • 46. That’s it! Erlend Debast Web designer @ proximity BBDO twitter.com/erlend erlend@artueel.be Monday 28 December 2009