Billeder på hjemmesiden

Af Per Rasmussen, IT-højskolen i København.

Dette er et tillæg til En kort introduktion til skrivning af HTML-dokumenter skrevet af Mads Tofte. Det beskriver, hvordan du får dit billede med på hjemmesiden.

Du kan bruge et farvebillede eller et sort/hvid billede, som du nu synes, det passer dig bedst. (Hvis du hellere vil bruge en tegning af dig selv, er dette også muligt). Det nemmeste er at få taget et foto med et digitalt fotoapparat, hvor billedet direkte kan overføres til en PC. Hvis du foretrækker at benytte et billede, du har liggende på papir, skal det først scannes ind i PC'en. På ITU's fællesdrev findes et bibliotek "Billeder" med en lang række fotos, som du evt. kan kopiere over til dit eget drev. De samme anvisninger er naturligvis gældende, hvis du ønsker at lægge et andet billede ind på hjemmesiden, f.eks. af barnebarnet eller eller af din ægtemage, da han sidst fangede en laks på 142,3 cm.

Når billedet lægges ind i PC'en, gemmes det i et særligt billedformat, som de fleste browsere kan læse (bedst er formaterne JPG og GIF).

I HTML koden på hjemmesiden laves en link til billedet, svarende til de links der bruges til at pege på andre hjemmesider. Linken skrives på formen <IMG SRC="filnavn">, hvor filnavnet er navnet på billedfilen, f.eks. <IMG SCR="mitbillede.jpg"> Læg mærke til benyttelsen af anførselstegn om alle parametre.

Hvis billedet ikke ligger i samme bibliotek som hjemmesiden, skal du tage hele stien til billedet med, f.eks.
<IMG SCR="http://www.itu.dk/peoble/rasmine/billeder/mitbillede.jpg">

Hvis du vil placere billedet et bestemt sted på siden, kan du angive dets størrelse og placering med flg. kommandoer:
HEIGHT="350", hvor tallet angiver højden i antal skærmpixels. 350 er passende for et portræt, men du kan prøve dig frem.
WIDTH="250", hvor tallet angiver bredden i pixels af billedet.
ALIGN="top", angiver at billedet skal placeres øverst, men det kan også placeres med
ALIGN="middle|bottom|keft|right", hvor der naturligvis kun kan angives én placering ad gangen.

Det er en god idé at angive størrelsen og placeringen. Det medfører at siden kommer hurtigere frem på skærmen. Hvis størrelsen ikke er angivet, kan PC'en nemlig først placere teksten endeligt, når hele billedet er hentet ned. Placeringen sker i forhold til omgivende tekst. Det er en god idé at eksperimentere med indstillingerne for at finde den bedste placering til billdet.

Mere behøves ikke for at få billeder på siden, men lad os alligevel tage et par finesser med:

Hvis du vil bruge et beskrivende billede på hjemmesiden som link til en anden side, kan dette også lade sig gøre. Som et eksempel vil klik med musen på dette farverige billede bringe os til en anden side med farvekoderne for de mange farver, der kan anvendes på hjemmesiden. Koden for denne link er HREF="http://www.itu.dk/people/pbras/farver.html"> og billedet er hentet ind på siden med koden<IMG SCR="Farver.jpg" WIDTH="23" HEIGHT="21" ALIGN="BOTTOM" BORDER="2" >

Vi har her fået en ny kode BORDER="2". Denne angiver tykkelsen af rammen om billedet. I dette tilfælde: En tynd ramme. Der er valgt en tynd tyk ramme, fordi billedet skal virke som en link til en anden side. Større tal betyder tykkere rammer. Normalt vil man vælge at sætte BORDER="0". Endelig er der ALT kommandoen, f.eks. ALT="Mit billede". Denne tekst vil blive vist, hvis billedet af en eller anden grund (f.eks. fordi brugeren i indstillingen til sin browser har valgt ikke at ville se billeder ) ikke kommer på skræmen. Der vil alene blive vist en ramme i billedets størrelse med den anførte tekst inden i.

Endelig kan man bruge kommandoerne HSPACE og VSPACE til at angive mængden af hvid kant udenom billedet.


Tilbage til min hjemmeside.

Sidst opdateret den 29-12-99 af pbras@itu.dk.