En par små detaljer:
ad. 1)
Hvis koden til at vise billeder skal validere korrekt? Så
skal IMG markøren have angivet en alt=".." parameter. Dette gør at der vises en tekst i en gul 'box' ved mouseover på billederne. Dette gør ydermere, at svagtseende vha. af en tekstbrowser kan få læst op, hvad der er på billedet (..hvis ellers man har valgt en fornuftig beskrivelse i alt=".." parameteren).
Eks. i XHTML på et billede af en hund:
Kode
<img src="/images/jpg/hund_01.jpg" width="120" height="92" alt="Foxterrier" /> |
Hvis du ønsker en beskrivende tekst over flere linjer? Så skal teksen formateres
direkte i kildekoden.
Eks.
Kode
<img src="/images/jpg/hund_01.jpg" width="120" height="92"
alt="Foxterrier
Race: Kerry Blue Terrier; Kordes Kordinal Cuvee (Joya)
Navn: Trisse
Køn: hun
Født: 24-02-08
" /> |
Hvis ikke man ønsker en tekst vist ved mouseover? Så lader man bare alt-parameteren være tom:
Kode
<img src="/images/jpg/hund_01.jpg" width="120" height="92" alt="" /> |
ad.2 )
Når man iøvrigt angiver billeders placering er det 'smart', at man angiver en rodrelativ sti. Roden er biblioteket
/. Hvis underbiblioteket med billeder hedder
images, så hedder den rodrelative sti f.eks.:
/images/joya%204-4.jpg i stedet for
images/joya%204-4.jpg
Rodrelative billeder kan flyttes til en hvilkensom helst side på dit site UDEN man er nødsaget, at ændre i stien til billedet (..billedets placering er jo så netop altid relativt angivet i forhold til sitets rod).
ad. 3)
Undgå iøvrigt mellemrum i filnavne. Mellemrum vises i koden som værdien;
%20, men bør undgås!
ad. 4.)
I stedet for at angive parameteren border="0" for dine billeder, så benyt CSS. Skriv hellere style="border:none;" eller lav et decideret stylesheet i starten af dokumentet i <head> .. </head> sektionen:
Kode
<style type="text/css">
<!--
img {border:none;}
//-->
</style> |
Skal nogen billeder have en ramme, men andre ikke? Så lav specifikke styles som klasser:
<style type="text/css">
<!--
img .noborder{border:none;}
img .sort{border:solid;color:#000;}
//-->
</style>
[/CODE]
..som i (X-)HTML koden så angives:
Kode
<img src="/images/jpg/hund_01.jpg" width="120" height="92" alt="Foxterrier" class="noborder" />
<br />
<img src="/images/jpg/kat_01.jpg" width="120" height="92" alt="Siameser" class="sort" /> |
Læs mere om stylesheetformatering:
http://hjemmesideskolen.dk/html/css2.asp?id=css8
Happy coding...
</MOLOKYLE>