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