Webdesign 101 – en webdesign notesblok

Forsiden » Generelt/Servicesider » Information og hjælp

Brugsanvisning til Webdesign 101

Webstedet er efterhånden så omfattende, at nogle førstegangsbrugere kan føles sig lidt fortabte. Jeg har lavet denne webside for at råde lidt bod på det.

Hvorfor?

Mine motiver for at lave dette websted er beskrevet på websiden Introduktion.

Hvorfor PHP?

Filtypen på de allerfleste websider er .php og ikke .htm, .html eller .asp, som er den slags filtyper, du antagelig ser flest af.

Det skal du ikke lade dig narre af. Siderne er ganske almindelige HTML-sider, der blot har en anden "endelse". Det er en nødvendighed for mig at bruge PHP-endelsen for at jeg kan benytte en ganske bestemt facilitet på mit nethotel. Og jeg bruger ikke for nærværende PHP til noget som helst andet. Så du skal ikke regne med, at jeg kan besvare nogen spørgsmål om PHP, som jeg faktisk ikke ved ret meget om (endnu?).

Jeg er begynder – hvilke artikler skal jeg læse først?

De allerfleste artikler på dette websted forudsætter et vist forhåndskendskab til HTML og stylesheets, f.eks. svarende til de første 10 kapitler i min bog, Webdesign – illustreret håndbog. En vis forudgående berøring med JavaScript vil også være en hjælp.

For dem, der gerne vil have lidt online begynderhjælp på dansk, kan jeg anbefale webstederne html.dk og Hjemmesideskolen.

Udskrift af siderne?

Nogle sider har en lille printer-ikon, som du kan bruge til at se, hvordan siden nogenlunde vil se ud i udskrift og derefter udskrive siden.

Alle sider er imidlertid tilrettelagt med et særligt stylesheet til udskrift, således at din udskrift af en given artikel kun omfatter artikelteksten, og ikke menuer, nyheds- og informationskasser og hvad ved jeg. Dette træder i funktion, når du beder om en udskrift af siden ved hjælp af browserens Udskrivningsfunktion.

Hvordan du selv laver det således kan du læse om på websiden Stylesheets til udskrift.

Hvordan finder jeg en side om et bestemt emne?

Du har en række muligheder:

  1. Navigationssystemet. Dette er ikke det samme på alle sider, men på alle sider skulle du gerne være i stand til at identificere en hovedmenu, der giver adgang til webstedets forskellige sektioner. Disse er:
    1. Generelt eller Generelt/Servicesider: Det er webstedets husholdningsafdeling og indeholder ikke så mange artikler om konstruktion, men mere servicesider som denne side.
    2. Design: Omfatter artikler om generelle designspørgsmål og konstruktionsteknikker, der har betydning for et websted som helhed, snarere end for den enkelte webside. I sagens natur kan der være en vis overlapning mellem denne sektion og de øvrige sektioner.
    3. Stylesheets (CSS): Artikler om brugen af CSS-teknolologien til formatering af websider, såvel i det små – hvordan laver du tekst i spalter – som i det store – hvordan layouter du en webside ved hjælp af CSS.
    4. JavaScript: Nogle få almindeligt anvendte scripts, samt et par større undersektioner om henholdsvis grafiske rollovers og billedvisning (Slide Shows). Mere avancerede scripts finder du i sektionen om dynamisk HTML.
    5. Navigation: Sektionen afspejler min interesse for menuer og navigationssystemer, som er en vigtigt del af ethvert websted.
    6. Dynamisk HTML (DHTML): Jeg synes dette område er dybt fascinerende og byder på muligheder, som kan erstatte den overhåndtagende brug af Flash Movies.
  2. Et klik på et af hovedmenuens punkter indlæser en forside til den pågældende sektion. Disse sektionsforsider er alle oversigter over, hvilke artikler, der findes i den pågældende sektion.
  3. Site Map: Et Site Map er en fortegnelse over alle sider på webstedet, opbygget med den samme hiearkiske (logiske) struktur som navigationssystemet.
  4. Logisk sti: På så godt som alle sider vil du se en serie af links lige over overskriften. Dette er, hvad jeg kalder en logisk sti, en liste over de websider, du har været igennem for at komme til den aktuelle side, hvis du slavisk har fulgt vejen fra forside til sektion til undersektion til webside. Omvendt kan du bruge de logiske sti til at navigere tilbage igennem hierarkiet.
  5. Søgemaskine: Nævnt til sidst, men måske det mest betydningsfulde navigationsværktøj – hvis det bruges rigtigt. På et websted som dette med mange hundrede sider får du en stor mængde hits, hvis du søger på enkle ord som "css", "HTML" eller "menu". Det er bedre at søge ved hjælp af den avancerede søgning, hvor du kan indtaste en hel række ord og bestemme, hvilken form for søgning, der skal foregå.

Hvorfor er der så mange forskellige slags sidelayout?

Artiklerne er blevet til over en årrække. I løbet af denne tid har jeg eksperimenteret med mange forskellige former for layouts, og over en given periode er alle nye sider så blevet til med det layout, jeg i den periode har ment var det bedste.

Når ældre sider ikke er opdateret til det nye layout skyldes det først og fremmest, at det er en noget tidkrævende affære, men også, at jeg egentlig ikke synes, at det gør noget, at mine "kunder" kan få forskellige layouts at se på. Mange bruger jo mit websted som en inspirationskilde til deres egne layouts, og så er det vel godt nok at kunne se mange forskellige typer som virkelige websider, og ikke blot som øveeksempler.

Hvorfor så mange forskellige menuer?

Tjah, forklaringen er den samme som de, jeg lige har givet omkring sidelayout.

Hvad med browserkompatibilitet?

Med browserkompatibilitet mener jeg, at jeg prøver at lave websider, der ser ens ud og ikke mindst er funktionelle i alle moderne browsere. Som "moderne browsere" regner jeg Internet Explorer 5, 5.5 og 6, Netscape 6 og 7, Mozilla 1+, Opera 7 og Firebird 0.7, som alle er browsere, jeg har installeret og er i stand til at teste mine sider i.

Derfor kan der sagtens gå ged i det alligevel, og i tilfælde, hvor du observerer problemer med at læse mine websider, vil jeg sætte umådelig pris på en e-mail om sagen.

Jeg har et problem med Internet Explorer til Mac og med andre browsere til denne platform, ikke mindst Safari browseren. Jeg har ikke adgang til at teste mine sider på denne platform, og er derfor ekstra glad for henvendelser fra folk, der har sådanne.

Send en mail til Jørgen Farum Jensen med url'en til den side, du synes er problematisk, og med en beskrivelse af, hvilket problemder er tale om. Et skærmdump vil ofte kunne hjælpe bedre end mange ord. På forhånd tak.

Hvorfor bruger/bruger du ikke valideringsmærker?

Valideringsmærker er de mærker, jeg af og til anbringer i bunden af siden, som f.eks.:

Validering af HTML-kode Validering af CSS-kode

Det er mærker, du kan hente på W3C's hjemmeside. Du får dem tilbudt som grafikfiler, når du har valideret din webside eller dit stylesheet på hhv. W3C's HTML-validator eller CSS-validatoren og siden får prædikatet fejlfri, det vil sige, at websiden i alle måder overholder den HTML-standard, du har angivet i din dokumenttypeerklæring, og at dit stylesheet tillige overholder alle regler i CSS-standarden.

Der er ingen, der siger du skal bruge dem. Der er heller ikke noget webpoliti der kommer efter dig, hvis du bruger dem, selvom websiden ikke er fejlfri. Dem, der måske kan komme efter dig, er dine kolleger på nettet, der nok vil sende dig en e-mail hvis du bruger mærkerne på en webside, der ikke overholder standarderne.

Jeg må om disse mærker sige, at den almindelige Internet surfer nok ikke ved, hav disse mærker betyder, og måske på et almindeligt website vil forvirre mere end de vil informere.

Jeg bruger dem nu kun på websider, hvor jeg har tjekket den aktuelle side og dens stylesheet imod W3C's validator og er overbevist om, at siden er fejlfri i henhold til den standard, der er angivet i dokumenttypeerklæringen. Når jeg overhovedet bruger dem er det fordi min målgruppe med dette websted er folk, jeg forventer interesserer sig for websidekonstruktion, samtidg med at mit credo omkring dette fag er, at en ordentlig webside i alt væsentlig skal være konstrueret i overenstemmelse med webstandarderne.

Mine argumenter for dette kan du læse i min bog "Webdesign med XHTML".

Genvejstaster

En overgang forsynede jeg min hovedmenu med tydelige genvejstaster. Hvordan det gøres, har jeg forklaret en hel del om på websiden Sådan kan du bruge accesskey-attributten. I den artikel er der også nogle pro et contra argumenter.

Jeg har siden den artikel blev skrevet tænkt lidt videre omkring dette, og er kommet til den overbevisning, at et website, der henvender sig et bredt publikum, bør være forsynet med denne navigationsmulighed.

Imidlertid gør jeg ikke som jeg prædiker. Dels henvender jeg mig ikke til et bredt publikum – og jeg har i øvrigt meget vanskeligt ved at forestille mig en motorisk eller synshandicappet person som websidekonstruktør – og dels er der ikke nogen til at betale mig for arbejdet med at gøre det på en gennemført og ikke mindst gennemtænkt måde på dette websted.

Skriftstørrelser

På alle websider, der er konstrueret siden midten af 2003 vil du kunne se, at du frit kan anvende browserens tekststørrelsesværktøj – også i Internet Explorer – til at gøre websidens skrift større eller mindre.

Hvorfor jeg har indrettet det på den måde og hvordan jeg har gjort det finder du beskrevet i en lille serie artikler om emnet Valg af skriftstørrelse.

På enkelte sider vil du også kunne finde funktionsknapper, der også gør tekstens større eller mindre. Det er jo en redundant funktionalitet, men jeg har brugt den for at illustrere en anden pointe.

Og det er den, at dersom du på trods af mine råd ønsker at sætte dine skriftstørrelser med pixelværdier, er det afgørende nødvendigt at du indbygger dene funktionalitet i dine websider. Pixelstørrelser på skrift sætter nemlig tekststørrelsesværktøjet ud af funktion i Internet Explorer, der jo er langt den mest anvendte browser.

Hvordan du bygger en sådan funktionalitet ind i dine websider har jeg forklaret på websiden Brugervalgte stylesheets.

25. februar 2004

Links til alle afsnit

Nu med weblog!

Weblogging – eller "blogging", som det også kaldes – griber mere og mere om sig.

Sådan én – eller 2 – må jeg selvfølgelig også have. Min første weblog finder du på websiden Webdesign 101 weblog. Min beskrivelse af weblog fænomenet finder du på websiden Hvad er en weblog?.

Webdesign med XHTML

– er endnu en bog om webdesign, jeg har begået, og som i løbet af marts måned publiceres af forlaget Globe. Du kan læse om mine ideer med denne bog på websiden "Webdesign med XHTML".

Skriftstørrelser

Den definitive gennemgang af de metoder, du har til at sætte størrelsen af skriften på dine websider - og hvordan du gi'r brugeren kontrol over størrelsen.
Valg af skriftstørrelser

Du kan tegne et gratis abonnement på mit nyhedsbrev eller anbefale denne side til en ven ved at benytte de to indtastningsfelter herunder.

E-mail adresse for nyhedsbrev
Din vens e-mail adresse
Valid XHTML 1.0! Klik på mærket for at få information om min bog om websidekonstruktion Klik på mærket for at få information om min nethotel-sponsor [Valid RSS] Højreklik for at kopiere adressen på min nyhedskanal