onsdag 19 oktober 11
Webbtypografi                       och digital design              Harald Peter Ström           peter@konstochteknik.se  ...
November 16    — Introduktion    — Att designa för webben    — Webbtypografi;      historia och teknik    — Frågoronsdag 1...
November 23    — Fördjupning i webb-      typografi; webfonts etc    — En massa exempel i      browser (egna och      andr...
Länkar och referenser:                    http://linkli.st/1typoonsdag 19 oktober 11
Ställ gärna frågor!onsdag 19 oktober 11
Bakgrundonsdag 19 oktober 11
1995:                       16 åronsdag 19 oktober 11
Harald.net med                        Martin Strömonsdag 19 oktober 11
onsdag 19 oktober 11
(kom.och.pussa)                          peter.nuonsdag 19 oktober 11
onsdag 19 oktober 11
pi.seonsdag 19 oktober 11
Första egna typsnitten...                       ABCDEFGHIJKLM                       nopqrstuvwxyz                   The qu...
Speedway                       (Digital Army)onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
Mattias Jakobsson                           Barmenoonsdag 19 oktober 11
Abel & Baker Sthlm                                ↓                       Abel & Baker Gbg                                ...
onsdag 19 oktober 11
Gerrit Rietveld                         Academieonsdag 19 oktober 11
Hello De:Bug,                       Ich finde eure Magazin echt                       cool.                       Aber, die...
onsdag 19 oktober 11
Konst & Teknik                            –2006–                       Grafisk design etconsdag 19 oktober 11
50% web                       50% printonsdag 19 oktober 11
Printonsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
Web                       (K&T&M)onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
Print + Webonsdag 19 oktober 11
onsdag 19 oktober 11
BACDE           FGHIJKonsdag 19 oktober 11
Andperseand (publishing)                Show & Tell           CopyPasteCharacter.com                   linkli.stonsdag 19 ...
onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
Rutger Fuchsgatan 9                                   FREE KEVIN is an ongoing and roving screening series from a collecti...
Typsnitt & språkonsdag 19 oktober 11
Småländsk Antiqua                        ABCDEFGHIJKLM                       nopqrstuvwxyzåäö                         1234...
Sapmi Grotesk                        ABCDEFGHIJKLM                       nopqrstuvwxyzåäö                          1234567...
Dutopia                        ABCDEFGHIJKLM                       nopqrstuvwxyzåäö                         1234567890    ...
SITE Specific 123 hamburgare på dig                         ABCDEF                       GHIJKLMNOPQ                TEATRON...
wwwwwwwwww                        wwwwwwwwww                       wwWwwwwww.seonsdag 19 oktober 11
this-domain-name-uses-           the-maximum-amount-of-            characters-possible.comonsdag 19 oktober 11
The JAnte Law              1. Do think you’re special              2. Do think you’re of the same stature as us           ...
Del 1                       Slutonsdag 19 oktober 11
onsdag 19 oktober 11
Del 2                         (Typografisk)                       design på webbenonsdag 19 oktober 11
Idag    1. Att designa för webben       Webbsidors struktur    2. Webbtypografihistoria       Typsnitt på nätet       Att ...
Säg till om det blir                         för o/teknisktonsdag 19 oktober 11
HTML — HyperText                       Markup Language              ’är ett märkspråk och webb-               standard för...
En (modern)                       webbsidas struktur    — Bild    — Text / typografi    — ’Multimedia’    — Designelemento...
1                   3                           2 4onsdag 19 oktober 11
CSS                          =                Cascading Style Sheets             ’Styr’ typografi och form               a...
— Bild: position av CSS    — Typografi: CSS    — Formelement: CSS    — ’Multimedia’: Ofta flash,      i framtiden layout  ...
<!DOCTYPE html>    <html>                       index.html    <head>    ! ! <title>Sidans titel</title>    </head>    <bod...
onsdag 19 oktober 11
<!DOCTYPE html>    <html>                       index.html    <head>    ! ! <title>Sidans titel</title>    ! ! <link rel="...
stylesheets.css    body {    ! margin: 25px;    ! background-color: green;    ! color: white;    ! font-family: arial, hel...
onsdag 19 oktober 11
Standards:                       CSS, HTML mmonsdag 19 oktober 11
CSS Standards    — CSS 1: 1996    — CSS 2: 1998    — CSS 3: ‘Under develop-      ment since 15.12.05’onsdag 19 oktober 11
HTML-standards    — HTML 1: 1990    — HTML 2–4: 1995–1998    — HTML 5: in progress...onsdag 19 oktober 11
Hur skapar                       man webbsidor?onsdag 19 oktober 11
Kod                          Fördel:                       Total kontroll                         Nackdel:                ...
WYSIWYG                             Fördel:                       Inte programmera                           Nackdelar:   ...
onsdag 19 oktober 11
CMS                       Wordpress, Indexhibit,                       Drupal, Episerver etc             Fördelar: blir rä...
onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
Flash (1996–)       Program från Macromedia        (nu Adobe) för att skapa      ’Rich Internet Applications’         i (f...
onsdag 19 oktober 11
onsdag 19 oktober 11
Flash, fördelar:    — Ej programmera    — Vektorgrafik    — Multimedia    — Interaktivtonsdag 19 oktober 11
Flash, nackdelar:    — Stängt/ej öppen      standard    — Plugin/fungerar inte      överallt    — På väg bort?onsdag 19 ok...
Flash                       Framtiden?onsdag 19 oktober 11
Shockwave                       Silverlight                       Real Audio                           ...onsdag 19 oktobe...
HTML 5    — SVG    — Drag and drop    — Ljud    — Video    — (Webfonts)    — med meraonsdag 19 oktober 11
SVGonsdag 19 oktober 11
Webbdesign:                        Design av system,                       inte ’färdiga’ sidor                        (fö...
T ex:                       Olika språk                        Formuläronsdag 19 oktober 11
onsdag 19 oktober 11
Annat att tänka på...                          Olika browsers                       Olika operativsystem                  ...
Browsers    — Chrome    — Internet Explorer    — Firefox    — Opera    — Safari    — ...onsdag 19 oktober 11
Operativsystem    — Win: 95, 98, Vista, ...    — OSX: 10.1 [...] 10.6    — Linux    — iOS    — Android    — ...onsdag 19 o...
Andra faktorer              (inte så aktuella längre)    — Uppkopplingshastighet     (bredband, 4G, 3G, 2G,      brandvägg...
Vilka browsers stödjer                        vilken CSS-version?onsdag 19 oktober 11
Tänk på sammanhangetonsdag 19 oktober 11
Del 2                       Slutonsdag 19 oktober 11
onsdag 19 oktober 11
Del 3                       Typografisk design                          för webbenonsdag 19 oktober 11
Historiaonsdag 19 oktober 11
HyperText:                       November 12, 1990onsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
PC Windows 95          Arial, Courier, Modern, MS         Serif, MS Sans Serif, Smallfonts,           Symbol, Times New Ro...
Mac OS                            Baskerville                            Big Caslon                            Didot      ...
Arial                       1992onsdag 19 oktober 11
Courier New                       1955 (1992)onsdag 19 oktober 11
Times (New Roman)                          1931 (1992)onsdag 19 oktober 11
Arial                         Courier New                       Times New Romanonsdag 19 oktober 11
Core Fonts on the Web                         1996       Andale Mono, Arial, Comic      Sans, Courier New, Georgia,       ...
Core Fonts on the Web                         1996                1. Bra läsbarhet på                   skärm             ...
ClearType                       (Windows Vista)                            2007                         Calibri, Cambria, ...
Det har ’alltid’ gått att visa     typsnitt på webben, men    användaren har behövt ha     typsnittet installerat i sin   ...
stylesheets.css    body {    ! font-family: Calibri, ‘Trebuchet MS’, Futura,       Arial, Helvetica, Sans-serif;       ! }...
Alternativonsdag 19 oktober 11
Alternativ 1:                       Göra bilder av text                        (.png, .gif, .jpg)                        F...
Text som bild                        Nackdelar:    — Ej sökbart    — Svårt för t ex blinda    — Tidskrävande    — Dålig ty...
onsdag 19 oktober 11
Alternativ 2:                              SIFR                         Scalable Inman                       Flash Replace...
onsdag 19 oktober 11
SIFR                       Fördelar:    — Sökbart    — Typografisk kontroll    — Kopierbar text    — Skalbart    — Licenci...
SIFR                       Nackdelar:    — Kräver Flash    — Fungerar inte på iOS etc    — ’Svårjobbat/fult’onsdag 19 okto...
Alternativ 3:                          Cufon                        ca 2008–onsdag 19 oktober 11
onsdag 19 oktober 11
Cufon                       Fördelar:    — Typ markerbart    — CSS-kopplatonsdag 19 oktober 11
Cufon                       Nackdelar:    — Bara typ markerbart    — Inte alltid lagligt    — Kräver Javascript    — Börja...
Alternativ 4:                        Webfonts                       2009/2010              Mer om det nästa veckaonsdag 19...
onsdag 19 oktober 11
Del 3                       Slutonsdag 19 oktober 11
Del 4onsdag 19 oktober 11
’Vad kommer hända med        yrket webbdesigner när så           mycket nytt görs med          exempelvis Wordpress-      ...
37 Signalsonsdag 19 oktober 11
Behöver man som                       webbdesigner kunna                         programmera?onsdag 19 oktober 11
nJaonsdag 19 oktober 11
Nobileonsdag 19 oktober 11
onsdag 19 oktober 11
onsdag 19 oktober 11
typography.css    .courier {    ! ! font-family: courier new, courier;    ! ! letter-spacing: 0px;    ! ! line-height: 18p...
onsdag 19 oktober 11
Omvänd processonsdag 19 oktober 11
onsdag 19 oktober 11
www.linkli.st/1typo                       haraldpeterstrom.com                        www.konst-teknik.seonsdag 19 oktober...
onsdag 19 oktober 11
Upcoming SlideShare
Loading in …5
×

Webbtypografi SU Nov 2010 - del 1

637 views

Published on

Some typefaces fell short in the export

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
637
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Webbtypografi SU Nov 2010 - del 1

  1. 1. onsdag 19 oktober 11
  2. 2. Webbtypografi och digital design Harald Peter Ström peter@konstochteknik.se Grafisk designer Konst & Teknikonsdag 19 oktober 11
  3. 3. November 16 — Introduktion — Att designa för webben — Webbtypografi; historia och teknik — Frågoronsdag 19 oktober 11
  4. 4. November 23 — Fördjupning i webb- typografi; webfonts etc — En massa exempel i browser (egna och andras) — Framtiden...onsdag 19 oktober 11
  5. 5. Länkar och referenser: http://linkli.st/1typoonsdag 19 oktober 11
  6. 6. Ställ gärna frågor!onsdag 19 oktober 11
  7. 7. Bakgrundonsdag 19 oktober 11
  8. 8. 1995: 16 åronsdag 19 oktober 11
  9. 9. Harald.net med Martin Strömonsdag 19 oktober 11
  10. 10. onsdag 19 oktober 11
  11. 11. (kom.och.pussa) peter.nuonsdag 19 oktober 11
  12. 12. onsdag 19 oktober 11
  13. 13. pi.seonsdag 19 oktober 11
  14. 14. Första egna typsnitten... ABCDEFGHIJKLM nopqrstuvwxyz The quick bron foxonsdag 19 oktober 11
  15. 15. Speedway (Digital Army)onsdag 19 oktober 11
  16. 16. onsdag 19 oktober 11
  17. 17. onsdag 19 oktober 11
  18. 18. Mattias Jakobsson Barmenoonsdag 19 oktober 11
  19. 19. Abel & Baker Sthlm ↓ Abel & Baker Gbg ↓ ’Frilans’ Berlinonsdag 19 oktober 11
  20. 20. onsdag 19 oktober 11
  21. 21. Gerrit Rietveld Academieonsdag 19 oktober 11
  22. 22. Hello De:Bug, Ich finde eure Magazin echt cool. Aber, die boxen im hintergr- und von den Texts finde ich sehr komische. Ich wurde die nicht mehr nutzen, wenn ich euch wäre. Grüsse, Peter Ström, Amsterdamonsdag 19 oktober 11
  23. 23. onsdag 19 oktober 11
  24. 24. Konst & Teknik –2006– Grafisk design etconsdag 19 oktober 11
  25. 25. 50% web 50% printonsdag 19 oktober 11
  26. 26. Printonsdag 19 oktober 11
  27. 27. onsdag 19 oktober 11
  28. 28. onsdag 19 oktober 11
  29. 29. onsdag 19 oktober 11
  30. 30. onsdag 19 oktober 11
  31. 31. onsdag 19 oktober 11
  32. 32. Web (K&T&M)onsdag 19 oktober 11
  33. 33. onsdag 19 oktober 11
  34. 34. onsdag 19 oktober 11
  35. 35. onsdag 19 oktober 11
  36. 36. onsdag 19 oktober 11
  37. 37. Print + Webonsdag 19 oktober 11
  38. 38. onsdag 19 oktober 11
  39. 39. BACDE FGHIJKonsdag 19 oktober 11
  40. 40. Andperseand (publishing) Show & Tell CopyPasteCharacter.com linkli.stonsdag 19 oktober 11
  41. 41. onsdag 19 oktober 11
  42. 42. onsdag 19 oktober 11
  43. 43. onsdag 19 oktober 11
  44. 44. onsdag 19 oktober 11
  45. 45. Rutger Fuchsgatan 9 FREE KEVIN is an ongoing and roving screening series from a collection FREE KEVIN of 15.4 GB of downloaded lms and documentaries depicting hackers 28.11.2010 and related computer culture from the 1980s-2000s. A range of material including blockbuster lms, educational television programming, CURATED BY PIRATETURK and documentaries produced within the hacking community will be ORGANIZED BY LAUREL PTAK AND KONST & TEKNIK presented in various cities worldwide over the next year in order to HOSTED BY KONST & TEKNIK stimulate dialogue around issues of intellectual property and open culture. The title FREE KEVIN is an appropriated slogan that was originally used by the hacker community in the 1990s to protest the arrest of Kevin Mitnick, a legendary hacker who at the time was the most wanted computer criminal in United States history. Mitnick’s story is of interest (and depicted in several lms in the screening series) for its fascinating particularities concerning hacker culture, intellectual property, and media representation historically, but at the same time it also functions as a contemporary symbol. If anything, the struggle over intellectual property has only intensi ed in the last decade and FREE KEVIN can be read as the embodiment of resistance in an ongoing struggle for rights and freedoms from corporate and state control in an information age and economy. The project also serves as a re-imagining of the role of the curatorial inside network culture where information is often freely, widely and anonymously distributed. All the lms, videos, documentaries to be screened as part of FREE KEVIN were compiled and distributed via peer-to-peer torrent sharing technologies. They originate from one collection found online, assembled and distributed by an anonymous Pirate Bay user known only as “pirateturk”. This person is credited as the screening series’ curator, though they are not in any ALL FILMS ARE STREAMED TO PORTABLE COMPUTERS (LAPTOPS, way directly involved with the event. IPAD, IPHONE, ETC) — BRING YOUR OWN DEVICE AND HEADPHONES A set of publication will accompany the screening in order to AND HANG OUT IN A CORNER WITH YOUR FILM OF CHOICE! contextualize and complicate the ideas at stake concerning intellectual property and the hacker as cultural and criminal gure. A PDF of the catalogue, research notes, documentation, bibliography, and a DIY FREE KEVIN kit (to enable others to create their own screenings) will eventually be released as a torrent le on Pirate Bay and the entire project will continue to be updated at www.freekevin.info.onsdag 19 oktober 11
  46. 46. Typsnitt & språkonsdag 19 oktober 11
  47. 47. Småländsk Antiqua ABCDEFGHIJKLM nopqrstuvwxyzåäö 1234567890 The quick brown foxonsdag 19 oktober 11
  48. 48. Sapmi Grotesk ABCDEFGHIJKLM nopqrstuvwxyzåäö 123456790 The quick BROWN foxonsdag 19 oktober 11
  49. 49. Dutopia ABCDEFGHIJKLM nopqrstuvwxyzåäö 1234567890 The quick brown foxonsdag 19 oktober 11
  50. 50. SITE Specific 123 hamburgare på dig ABCDEF GHIJKLMNOPQ TEATRON Technoonsdag 19 oktober 11
  51. 51. wwwwwwwwww wwwwwwwwww wwWwwwwww.seonsdag 19 oktober 11
  52. 52. this-domain-name-uses- the-maximum-amount-of- characters-possible.comonsdag 19 oktober 11
  53. 53. The JAnte Law 1. Do think you’re special 2. Do think you’re of the same stature as us 3. Do think you’re wiser than us 4. Do imagine yourself better than us 5. Do think you have more knowledge than us 6. Do think you’re more valuable than us 7. Do think you’re good at everything 8. Do think you’re qualified to laugh at us 9. Do think everyone cares about you 10. Do think you can teach us everything by Konst & Teknik, 2010 Die Schrift unserer Zeit Konst & Teknik 2009onsdag 19 oktober 11
  54. 54. Del 1 Slutonsdag 19 oktober 11
  55. 55. onsdag 19 oktober 11
  56. 56. Del 2 (Typografisk) design på webbenonsdag 19 oktober 11
  57. 57. Idag 1. Att designa för webben Webbsidors struktur 2. Webbtypografihistoria Typsnitt på nätet Att tänka påonsdag 19 oktober 11
  58. 58. Säg till om det blir för o/teknisktonsdag 19 oktober 11
  59. 59. HTML — HyperText Markup Language ’är ett märkspråk och webb- standard för strukturering av text, hypertext, media och inbyggda objekt på exempelvis webbsidor och i epostmeddelanden.’onsdag 19 oktober 11
  60. 60. En (modern) webbsidas struktur — Bild — Text / typografi — ’Multimedia’ — Designelementonsdag 19 oktober 11
  61. 61. 1 3 2 4onsdag 19 oktober 11
  62. 62. CSS = Cascading Style Sheets ’Styr’ typografi och form av sidor från (oftast) samma fil(er)onsdag 19 oktober 11
  63. 63. — Bild: position av CSS — Typografi: CSS — Formelement: CSS — ’Multimedia’: Ofta flash, i framtiden layout via CSS?onsdag 19 oktober 11
  64. 64. <!DOCTYPE html> <html> index.html <head> ! ! <title>Sidans titel</title> </head> <body> ! <p> ! Welcome! ! </p> ! <img src=”bild.jpg”> </body> </html>onsdag 19 oktober 11
  65. 65. onsdag 19 oktober 11
  66. 66. <!DOCTYPE html> <html> index.html <head> ! ! <title>Sidans titel</title> ! ! <link rel="stylesheet" href="stylesheets.css"> </head> <body> ! <p> ! Welcome! ! </p> ! <img src=”bild.jpg”> </body> </html>onsdag 19 oktober 11
  67. 67. stylesheets.css body { ! margin: 25px; ! background-color: green; ! color: white; ! font-family: arial, helvetica, sans-serif; ! font-size: 30px; ! letter-spacing: 30px; } body img { ! border: 3px solid black; ! width: 100px; ! -webkit-transform: rotate(-32deg); ! }onsdag 19 oktober 11
  68. 68. onsdag 19 oktober 11
  69. 69. Standards: CSS, HTML mmonsdag 19 oktober 11
  70. 70. CSS Standards — CSS 1: 1996 — CSS 2: 1998 — CSS 3: ‘Under develop- ment since 15.12.05’onsdag 19 oktober 11
  71. 71. HTML-standards — HTML 1: 1990 — HTML 2–4: 1995–1998 — HTML 5: in progress...onsdag 19 oktober 11
  72. 72. Hur skapar man webbsidor?onsdag 19 oktober 11
  73. 73. Kod Fördel: Total kontroll Nackdel: Behöver kunna programmeraonsdag 19 oktober 11
  74. 74. WYSIWYG Fördel: Inte programmera Nackdelar: Dålig kod, svårt att påverkaonsdag 19 oktober 11
  75. 75. onsdag 19 oktober 11
  76. 76. CMS Wordpress, Indexhibit, Drupal, Episerver etc Fördelar: blir rätt, enkelt Nackdel: Utan hjälp blir det som allt annat...onsdag 19 oktober 11
  77. 77. onsdag 19 oktober 11
  78. 78. onsdag 19 oktober 11
  79. 79. onsdag 19 oktober 11
  80. 80. Flash (1996–) Program från Macromedia (nu Adobe) för att skapa ’Rich Internet Applications’ i (främst) vektorformatonsdag 19 oktober 11
  81. 81. onsdag 19 oktober 11
  82. 82. onsdag 19 oktober 11
  83. 83. Flash, fördelar: — Ej programmera — Vektorgrafik — Multimedia — Interaktivtonsdag 19 oktober 11
  84. 84. Flash, nackdelar: — Stängt/ej öppen standard — Plugin/fungerar inte överallt — På väg bort?onsdag 19 oktober 11
  85. 85. Flash Framtiden?onsdag 19 oktober 11
  86. 86. Shockwave Silverlight Real Audio ...onsdag 19 oktober 11
  87. 87. HTML 5 — SVG — Drag and drop — Ljud — Video — (Webfonts) — med meraonsdag 19 oktober 11
  88. 88. SVGonsdag 19 oktober 11
  89. 89. Webbdesign: Design av system, inte ’färdiga’ sidor (för det mesta)onsdag 19 oktober 11
  90. 90. T ex: Olika språk Formuläronsdag 19 oktober 11
  91. 91. onsdag 19 oktober 11
  92. 92. Annat att tänka på... Olika browsers Olika operativsystem Mobiltelefoner ...onsdag 19 oktober 11
  93. 93. Browsers — Chrome — Internet Explorer — Firefox — Opera — Safari — ...onsdag 19 oktober 11
  94. 94. Operativsystem — Win: 95, 98, Vista, ... — OSX: 10.1 [...] 10.6 — Linux — iOS — Android — ...onsdag 19 oktober 11
  95. 95. Andra faktorer (inte så aktuella längre) — Uppkopplingshastighet (bredband, 4G, 3G, 2G, brandväggar) — Skärmstorlek — Upplösning — Färgdjuponsdag 19 oktober 11
  96. 96. Vilka browsers stödjer vilken CSS-version?onsdag 19 oktober 11
  97. 97. Tänk på sammanhangetonsdag 19 oktober 11
  98. 98. Del 2 Slutonsdag 19 oktober 11
  99. 99. onsdag 19 oktober 11
  100. 100. Del 3 Typografisk design för webbenonsdag 19 oktober 11
  101. 101. Historiaonsdag 19 oktober 11
  102. 102. HyperText: November 12, 1990onsdag 19 oktober 11
  103. 103. onsdag 19 oktober 11
  104. 104. onsdag 19 oktober 11
  105. 105. PC Windows 95 Arial, Courier, Modern, MS Serif, MS Sans Serif, Smallfonts, Symbol, Times New Roman, onsdag 19 oktober 11
  106. 106. Mac OS Baskerville Big Caslon Didot Futura Optima ...onsdag 19 oktober 11
  107. 107. Arial 1992onsdag 19 oktober 11
  108. 108. Courier New 1955 (1992)onsdag 19 oktober 11
  109. 109. Times (New Roman) 1931 (1992)onsdag 19 oktober 11
  110. 110. Arial Courier New Times New Romanonsdag 19 oktober 11
  111. 111. Core Fonts on the Web 1996 Andale Mono, Arial, Comic Sans, Courier New, Georgia, Impact, Times New Roman, Trebuchet MS, Verdana, onsdag 19 oktober 11
  112. 112. Core Fonts on the Web 1996 1. Bra läsbarhet på skärm 2. Blandade ’stilar’ 3. Internationelltonsdag 19 oktober 11
  113. 113. ClearType (Windows Vista) 2007 Calibri, Cambria, Candara, Consolas, Constantia, Corbelonsdag 19 oktober 11
  114. 114. Det har ’alltid’ gått att visa typsnitt på webben, men användaren har behövt ha typsnittet installerat i sin datoronsdag 19 oktober 11
  115. 115. stylesheets.css body { ! font-family: Calibri, ‘Trebuchet MS’, Futura, Arial, Helvetica, Sans-serif; ! }onsdag 19 oktober 11
  116. 116. Alternativonsdag 19 oktober 11
  117. 117. Alternativ 1: Göra bilder av text (.png, .gif, .jpg) Fungerat sedan bilder på WWWonsdag 19 oktober 11
  118. 118. Text som bild Nackdelar: — Ej sökbart — Svårt för t ex blinda — Tidskrävande — Dålig typografisk koll — Går inte att kopieraonsdag 19 oktober 11
  119. 119. onsdag 19 oktober 11
  120. 120. Alternativ 2: SIFR Scalable Inman Flash Replacement ca 2003–onsdag 19 oktober 11
  121. 121. onsdag 19 oktober 11
  122. 122. SIFR Fördelar: — Sökbart — Typografisk kontroll — Kopierbar text — Skalbart — Licenciering av typsnittonsdag 19 oktober 11
  123. 123. SIFR Nackdelar: — Kräver Flash — Fungerar inte på iOS etc — ’Svårjobbat/fult’onsdag 19 oktober 11
  124. 124. Alternativ 3: Cufon ca 2008–onsdag 19 oktober 11
  125. 125. onsdag 19 oktober 11
  126. 126. Cufon Fördelar: — Typ markerbart — CSS-kopplatonsdag 19 oktober 11
  127. 127. Cufon Nackdelar: — Bara typ markerbart — Inte alltid lagligt — Kräver Javascript — Börjar avvecklas...onsdag 19 oktober 11
  128. 128. Alternativ 4: Webfonts 2009/2010 Mer om det nästa veckaonsdag 19 oktober 11
  129. 129. onsdag 19 oktober 11
  130. 130. Del 3 Slutonsdag 19 oktober 11
  131. 131. Del 4onsdag 19 oktober 11
  132. 132. ’Vad kommer hända med yrket webbdesigner när så mycket nytt görs med exempelvis Wordpress- templates? Kommer webbdesignern göra någonting från scratch längre?’onsdag 19 oktober 11
  133. 133. 37 Signalsonsdag 19 oktober 11
  134. 134. Behöver man som webbdesigner kunna programmera?onsdag 19 oktober 11
  135. 135. nJaonsdag 19 oktober 11
  136. 136. Nobileonsdag 19 oktober 11
  137. 137. onsdag 19 oktober 11
  138. 138. onsdag 19 oktober 11
  139. 139. typography.css .courier { ! ! font-family: courier new, courier; ! ! letter-spacing: 0px; ! ! line-height: 18px; ! ! font-size: 14px; ! ! text-align: left; ! ! text-indent: 0em; ! ! margin: 0; ! ! text-align: left; ! ! }onsdag 19 oktober 11
  140. 140. onsdag 19 oktober 11
  141. 141. Omvänd processonsdag 19 oktober 11
  142. 142. onsdag 19 oktober 11
  143. 143. www.linkli.st/1typo haraldpeterstrom.com www.konst-teknik.seonsdag 19 oktober 11
  144. 144. onsdag 19 oktober 11

×