"Elektronisk publicering i World-Wide Web" :
HTML Del 1

Preben Hansen
(Swedish Institute of Computer Science ) och
Frans Lettenström
(BIBSAM)

Material publiserat för kursen "Elektronisk publicering i World-Wide Web".
17 Mars 1995. IDC-KTHB. Arrangerad av TLS.

Copyright ©1995 Preben Hansen och Frans Lettenström.

Senast Updaterad 1995-03-15

HTML Del I

Mitt första HTML-dokument

Grunden.

Dokumentet ska alltid börja med ett "huvud" och bör innehålla följande element:
<html>...</html> som omger dokumentet.
<head>...</head> som omger <title>...</title> elementet.
<title>...</title> omger den text som utgör dokumentets titel.
<body>...</body> elementet följer direkt efter huvudet och omger själva innehållet i dokumentet.

Så här kan ett typiskt dokument huvud se ut så här långt:

<html>
<head>
<title>TITEL</title>
</head>
<body>
.
.
.
</body>
</html>

Rubrik

Efter denna inledning ska dokumentet ha en rubrik. Det finns ett antal nivåer på denna rubrik, t.ex :

En riktigt stor rubrik

En stor rubrik

En mindre stor rubrik

En mindre rubrik

En minirubrik
En pytterubrik
Under denna rad kommer först ett streck
och sedan två
Här fortsätter vi att skriva, tills vi tycker att det är dags för ny rad.

Ibland är det kursiv text , ibland fetstil.

Tabell

Nu är det dags för en tabell: 


Datum     FÂgel     Huvudbonad

------------------------------

950317    Kakadua   Sombrero

950318    Pingvin   Basker

Listor

HTML definierar i huvudsak 3 typer av listor. Efter tabellen skapar vi en onumrerad lista:

Nu gör vi en numrerad lista:

  1. Den som kom först
  2. Den som kom tåa
  3. Den som kom sist
Vidare finns Definition Lists är till för att klara av de listor som behöver en förklarande text, och är mycket flexibla.
Hela listan omges av <dl>...</dl> och varje del anges med ett <dt>...</dt>.
Varje <dt>...</dt> kan sedan följas av en förklarande text som omges av <dd>...</dd>. 


<dt>Första rubriken</dt>
<dd>Därunder första förklaringen</dd>
<dt>Andra rubriken</dt>
<dd>Därunder andra förklaringen</dd>
<dt>Tredje rubriken</dt>
<dd>Därender tredje förklaringen</dd>
</dl>
Detta ser ut på följande sätt i html.

Första rubriken
Därunder första förklaringen
Andra rubriken
Därunder andra förklaringen
Tredje rubriken
Därender tredje förklaringen

Länkar.

För att göra en hypertext-länk använder man kommandot <a href="URL">TEXT</a>.
Den fil som anges inom paranteserna kallas för URL eller Universeal Resource Locator.

För att man ska kunna peka på ett annat dokument eller object använder man följande form

<a href="protokoll://maskin-namn(:port)/directory/under-directory/namn på filen">TEXT</a>

En sådan pekare till en annan fil kan vara här.

Protokollet kan vara antingen : 

- http - för World-Wide Web hypertext-filer.
- file - för icke-html filer (t.ex s.k. "plain-text"-filer)
- gopher - för Gopher
- news - för Usenet news
- telnet - för en telnet-session (login) på en annan dator.
- ftp - för filöverföring.
Maskin-adressen kan vara en vanlig adress till en dator enligt följande form:www.sics.se.
Directory och under-directory utgörs av den fullständiga specificationen för var den fil som man vill peka på är lokaliserad.

Nu är det dags fär en länk till ett dokument på samma dator.

Eller varför inte en länk till ett helt annat ställe?

Nu ska vi hoppa till en rad i samma dokument!

Bilder

Här klämmer vi in en bild: Bilder bör vara i GIF-format...

En lite större bild:

Vi kan också kobinera bild och text så här:

Bilder och text kan kombineras på följande sätt:
<img align="top" src="http://www.sics.se/~preben/home/linn.gif">Linn 5 month old.
<img align="middle" src="http://www.sics.se/~preben/home/linn.gif">Linn 5 month old.
<img align="bottom" src="http://www.sics.se/~preben/home/linn.gif">Linn 5 month old.
Och så här ser det ut i din web-klient.

Linn 5 månader gammal.
Linn 5 månader gammal.
Linn 5 månader gammal.

Det är här vi hamnar då vi hoppar inom samma dokument!

Så här skriver man ett & och ett ê .... Tyvärr inga grekiska tecken i listan.

Dokumentets avslutning

Varje dokument bör avslutas med uppgifter om vem som skapat och vem som underhåller dokumentet, samt en adress och i bästa fall en email adress. På detta sätt kan läsaren vid behov snabbt skicka en kommentar till författaren. Då man anger en namn, adress och email, används elementet : <adress> text </adress>. enligt följande: 
<adress>Kjell Jansson. KTHB-IDC
100 44 Stockholm.
<a href="mailto:kj@lib.kth.se">Kjell Jansson!s</a<
</adress<

Så här ser det ut i slutet av ett dokument :
Kjell Jansson. KTHB-IDC
100 44 Stockholm. Kjell Jansson

Kommentarer till kursen?

Vad tyckte du om kursen ?
Kommentarer kan du skicka till :
Preben Hansen
Kjell Jansson

This document is maintained by : Preben Hansen (SICS) and Frans Lettenström (BIBSAM)
preben@sics.se