1. 2010-10-28
DESIGN FÖR ALLA
FRUKOSTSEMINARIUM
MALMÖ ARENA
2010-10-28
PÄR LANNERÖ
MARTIN RYTTLER
Illustration: jelene@flickr

2. DESIGN FÖR ALLA
DEFINITION
”designfilosofi som syftar
till att en produkt eller en
tjänst kan användas av
så många som möjligt
utan behov av speciella
anpassningar”
Wikipedia 2010-10-24

3. Design för vem
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

4. Design för
Åtkomlighet
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

5. DESIGN FÖR ALLA
- ÅTKOMLIGHET
Service
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

6. DESIGN FÖR ALLA
- ÅTKOMLIGHET
www.dinwebbplats.se
www.dinwebbplats.se
www.dinwebbplats.se
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

7. DESIGN FÖR ALLA
- ÅTKOMLIGHET
Sökbarhet
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

8. DESIGN FÖR ALLA
- ÅTKOMLIGHET
Din webbplats
Din webbplats
Din webbplats
Din webbplats - Sök
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

9. DESIGN FÖR ALLA
- ÅTKOMLIGHET
Snabbhet
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

10. DESIGN FÖR ALLA
- ÅTKOMLIGHET
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

11. Design för
Människor
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

12. DESIGN FÖR ALLA
- FÖR MÄNNISKOR
• Normalstörda
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster
cc by-nc-sa /*dave*/@flickr

13. DESIGN FÖR ALLA
- FÖR MÄNNISKOR
• Normalstörda
• Funktionshindrade
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster
cc by-sa wikipedia
cc by-nc-sa /*dave*/@flickr

14. DESIGN FÖR ALLA
- FÖR MÄNNISKOR
• Normalstörda
• Funktionshindrade
• Utvecklare
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

15. DESIGN FÖR ALLA
- FÖR MÄNNISKOR
• Normalstörda
• Funktionshindrade
• Utvecklare
• Esteter
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

16. DESIGN FÖR ALLA
- FÖR MÄNNISKOR
• Normalstörda
• Funktionshindrade
• Utvecklare
• Esteter
• M.fl.
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster
cc by-nc-sa bernard@flickr

17. Design för
Maskiner
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

18. DESIGN FÖR ALLA
- FÖR MASKINER
MottagareAvsändare
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

19. DESIGN FÖR ALLA
- FÖR MASKINER
MottagareAvsändare
Hjälpmedel
Fotopsd@flickr
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

20. DESIGN FÖR ALLA
- FÖR MASKINER
MottagareAvsändare
Klient
Hjälpmedel
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

21. DESIGN FÖR ALLA
- FÖR MASKINER
MottagareAvsändare
Utmatningsenhet
Klient
Hjälpmedel
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster
FotoKaiHendry

22. DESIGN FÖR ALLA
- FÖR MASKINER
MottagareAvsändare
Utmatningsenhet
Klient
Hjälpmedel
Upp-
koppling
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

23. DESIGN FÖR ALLA
- FÖR MASKINER
Inmatningsenhet Min webb
Sökmotorer
MottagareAvsändare
Utmatningsenhet
Klient
Hjälpmedel
Upp-
koppling
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

24. DESIGN FÖR ALLA
- FÖR MASKINER
Inmatningsenhet Min webb
Sökmotorer
MottagareAvsändare
Aggregatorer
(RSS, pricerunner…)
Utmatningsenhet
Klient
Hjälpmedel
Upp-
koppling
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

25. DESIGN FÖR ALLA
- FÖR MASKINER
Inmatningsenhet Min webb
Sökmotorer
MottagareAvsändare
Aggregatorer
(RSS, pricerunner…)
Arkiv
Utmatningsenhet
Klient
Hjälpmedel
Upp-
koppling
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

26. DESIGN FÖR ALLA
- FÖR MASKINER
Inmatningsenhet Min webb
Andras webbar
Sökmotorer
MottagareAvsändare
Aggregatorer
(RSS, pricerunner…)
Arkiv
Utmatningsenhet
Klient
Hjälpmedel
Upp-
koppling
Nätverkssajter
Sociala webben
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

27. Riktlinjer
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

28. DESIGN FÖR ALLA
RIKTLINJER
• Samma för alla?
• Målkonflikter
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

29. DESIGN FÖR ALLA
RIKTLINJER
• WAI: WCAG
• 24-timmarswebben
• Egen anpassning
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

30. Verktyg & metoder
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

31. DESIGN FÖR ALLA
VERKTYG
• Validatorer
– HTML - http://validator.w3.org/
– CSS - http://jigsaw.w3.org/css-validator/
– RSS - http://validator.w3.org/feed/
• Utvecklarverktyg
– Firebug
– Web developer toolbar
– ColorChecker
– Fangs
• Yslow
• SenSeo
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster
cc by-nc-sa dunechaser@flickr

32. Vinster
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

33. DESIGN FÖR ALLA
VINSTER
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

34. DESIGN FÖR ALLA
VINSTER
ÅTERANVÄNDNING – INTE EXTRA ARBETE
MER STANDARDISERING – FRAMTIDSSÄKERT
NÅ FLER – RÄTTVISA
NÅ FLER – STÖRRE VINST
BRA FÖR EN – OFTA BRA FÖR ALLA
HÖGRE KVALITET – SPAR TID OCH MINSKAR FEL
1. Design för vem - 2. Riktlinjer - 3. Verktyg & metoder - 4. Vinster

35. metamatrix.se