Spbl Fö7 Format, Text Och Html

335 views
302 views

Published on

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

  • Be the first to like this

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

No notes for slide

Spbl Fö7 Format, Text Och Html

  1. 1. SP:BL fö 9 Format, text, HTML Gunnar Wettergren [email_address]
  2. 2. Agenda <ul><li>Text </li></ul><ul><ul><li>Representation </li></ul></ul><ul><li>Text och layout </li></ul><ul><li>HTML </li></ul><ul><li>Nätverk </li></ul>
  3. 3. Text <ul><li>Visuell representation av språket och en grafisk entitet i sig själv </li></ul><ul><li>Grundläggande entiteten är tecken </li></ul>
  4. 4. Vart ligger meningen? <ul><li>I texten, eller hos tolkaren? </li></ul><ul><ul><li>Hermeneutik </li></ul></ul><ul><ul><li>Gadamer </li></ul></ul>
  5. 5. Teckenset <ul><li>Måste hålla isär lexikalt innehåll och utseendet </li></ul><ul><li>Men innehåll menas ord, formler, punkter etc. </li></ul><ul><li>Texts utseende </li></ul><ul><ul><li>Visuella attribut </li></ul></ul><ul><ul><li>Storlek </li></ul></ul><ul><ul><li>Layout </li></ul></ul>
  6. 6. Standarder <ul><li>Ascii (American Standard Code for Information Interchange) ISO 646 </li></ul><ul><ul><li>Dominerat sedan 1970 talet </li></ul></ul><ul><ul><li>7 bitar för att lagra bokstavskoder, totalt 128 koder </li></ul></ul><ul><ul><li>é har kod </li></ul></ul><ul><ul><ul><li>142 Macintosh Standard Roman </li></ul></ul></ul><ul><ul><ul><li>233 Windows character set </li></ul></ul></ul>
  7. 7. Unicode & ISO 10646 <ul><li>Unicode är till för att alla former av skrivspråk skall kunna representeras och manipuleras på en dator </li></ul><ul><li>Två metoder för att mappa tecken </li></ul><ul><ul><li>UTF ~ASCII </li></ul></ul><ul><ul><li>UCS </li></ul></ul>
  8. 8. ASCII
  9. 9. Fonter <ul><li>Visuell representation av ett tecken, kallas för ”Glyph” </li></ul><ul><li>Font – Kollektion av ”glyphs” </li></ul><ul><li>Monostyled text – one font </li></ul>
  10. 10. Klassificering <ul><li>Monospaced (fixed width) vs. Proportional fonts (beror på tecknet) </li></ul><ul><ul><li>Mest använda är Courier (monospaced) </li></ul></ul><ul><ul><li>Times , Garamond (Proportioneliga) </li></ul></ul><ul><li>Serif vs. Sans serif </li></ul><ul><ul><li>Sans serif </li></ul></ul><ul><ul><li>Serif </li></ul></ul>
  11. 11. Klassificering II <ul><li>Form </li></ul><ul><ul><li>Stående vs. Italic </li></ul></ul><ul><ul><ul><li>Stående </li></ul></ul></ul><ul><ul><ul><li>Italic </li></ul></ul></ul><ul><ul><ul><li>Bold </li></ul></ul></ul><ul><li>Det finns tusentals fonter </li></ul><ul><li>Digital teknik har möjliggjort skapandet av nya innovativa fonter </li></ul><ul><ul><li>Gunnar Wettergren </li></ul></ul>
  12. 12. Font terminologi <ul><li>Avstånd, storlek, längd anges i points = 1/72 tum, lite mindre än 0,3528 mm </li></ul><ul><li>Ascender </li></ul><ul><li>Descender </li></ul><ul><li>Body size </li></ul>
  13. 13. Digital font teknik <ul><li>Bitmap fonter </li></ul><ul><ul><li>Lider av samma problem som bitmappade bilder </li></ul></ul><ul><li>Outlined glyphs (vektor baserade) </li></ul><ul><ul><li>Adobe Type 1, Truetype </li></ul></ul><ul><ul><li>Kan skalas nästa hur stort som helst </li></ul></ul>
  14. 14. Exempel <ul><li>Bitmapped vs. Outlined (vector) </li></ul>G
  15. 15. Vad har detta med spel att göra? <ul><li>När vi använder text måste vi tänka på: </li></ul><ul><ul><li>Hur det positioneras på skärmen </li></ul></ul><ul><ul><li>Hur paragraferna delas upp </li></ul></ul><ul><ul><li>Vilka headings, listor etc som används </li></ul></ul><ul><ul><li>Vilka fonter skall användas </li></ul></ul><ul><ul><li>… . </li></ul></ul>
  16. 16. Text i grafik <ul><li>Integration av text i grafik är en naturlig del utav multimedia </li></ul><ul><li>Centralt i det vi gör </li></ul><ul><li>Reklam, grafisk formgivning etc. </li></ul><ul><li>Webb grafik </li></ul>
  17. 17. Layout <ul><li>Olika typer av formateringsoperationer </li></ul><ul><ul><li>Teckenformatering </li></ul></ul><ul><ul><ul><li>Storlek </li></ul></ul></ul><ul><ul><ul><li>Form </li></ul></ul></ul><ul><ul><ul><li>Font </li></ul></ul></ul><ul><ul><li>Paragrafformatering </li></ul></ul><ul><ul><ul><li>Vänster- högerställd </li></ul></ul></ul><ul><ul><ul><li>Centrerad </li></ul></ul></ul><ul><ul><ul><li>Justified </li></ul></ul></ul>
  18. 18. Markup <ul><li>WYSIWYG formating systems (tag based systems) </li></ul><ul><li>HTML (Tag based text formatting) </li></ul><ul><li>Visual markup </li></ul><ul><ul><li>Tags eller kommandon specificerar texts utseende, font, storlek osv. </li></ul></ul><ul><li>Structural markup </li></ul><ul><ul><li>Tags identifierar logiska element i ett dokument så som listor, tabeller, överskrifter etc. </li></ul></ul>
  19. 19. HTML <ul><li>Visual markup </li></ul><ul><ul><li><font size =&quot;2&quot;>text</font> </li></ul></ul><ul><ul><li><font face =&quot;Arial&quot;>Your text here.</font> </li></ul></ul><ul><ul><li><font color =&quot;#ff0000&quot;>text</font> </li></ul></ul><ul><li>Structural markup </li></ul><ul><ul><li><table border=&quot;1&quot;> <tr> <td>cell 1</td><td>cell 2</td> </tr> <tr> <td>cell 3</td><td>cell 4</td> </tr> </table> </li></ul></ul>Cell1 Cell2 Cell3 Cell4
  20. 20. Hur levereras vårt alster? <ul><li>Ofta via nätverk </li></ul><ul><ul><li>Webb </li></ul></ul><ul><ul><li>Streaming media </li></ul></ul><ul><ul><li>Multicasting </li></ul></ul><ul><li>Vi kommer koncentrera oss på TCP/IP </li></ul><ul><ul><li>Andra är IPX, Token Ring, Appletalk </li></ul></ul>
  21. 21. Protokoll <ul><li>Protokoll är regler för utbytandet av data över nätverk </li></ul>
  22. 22. TCP/IP <ul><li>Packet/Switched nätverk </li></ul><ul><ul><li>Varje meddelande delas upp i ett antal paket som numreras </li></ul></ul>
  23. 23. Casting Anycast Broadcast Multicast Unicast Routing schemes
  24. 24. Nätverk och transportprotokoll <ul><li>IP – Internet protocol </li></ul><ul><ul><li>Datagram och fungerar som en mekanism för att få paket från A till B </li></ul></ul>
  25. 25. HTTP <ul><li>Hypertext transport protocol </li></ul><ul><ul><li>Connection (DNS) </li></ul></ul><ul><ul><ul><li>Namn -> IP adress </li></ul></ul></ul><ul><ul><li>Port 80 </li></ul></ul><ul><ul><li>Request/Response </li></ul></ul><ul><ul><li>Sessionslöst </li></ul></ul>
  26. 26. RTSP <ul><li>Real time streaming protocol </li></ul><ul><li>Kallas internets fjärrkontroll </li></ul>

×