DreamWeaver – wireframe – id attributter
I denne oppgaven skulle vi ta nettsiden med enkel HTML som vi hadde laget i et teksteditorprogram tidligere, og lage en wireframe som viser hvordan nettsiden skal se ut.
Deretter skulle vi strukturere byggeklossene i DreamWeaver. Jeg satte inn div-tagger på de forskjellige delene av innholdet og merket dem med id attributtene #header, #ingress, #sidebar, #maincontent, #footer.
Vi skulle deretter teste ut siden i forskjellige nettlesere og presentere resultatet her på bloggen. (Selve plasseringen av byggeklossene skulle vi ikke gjøre i denne omgang).
Testet i Chrome:
Testet i Firefox:
Testet i Internet Explorer:
Testet i Opera:
Testet i Safari:
Byggeklosser – wireframe
I denne aktiviteten skulle vi ta for oss tre av nettstedene som vi fant i forrige oppgave, og se på byggeklosser og elementer. Vi skulle lage en wireframe illustrasjon av byggeklossene på hovedsiden av de tre nettstedene og navngi byggeklossene.
En wireframe er en tegning av et nettsteds skjelett eller storyboard, som viser alle elementenes plassering i forhold til hverandre, uten å ta hensyn til design. Wireframe’n viser plassering av de viktigste elementene på nettsiden, som navigasjon, bilder, tekst, meldingsfelter, media osv.
Her har jeg tegnet opp wireframe for legoland.com, timburton.com og kolonihagen.no. La først etterpå merke til at jeg automatisk har laget engelsk wireframe på de to engelske sidene, men jeg har skrevet norsk på den norske nettsiden. 🙂
Gry Monica's hjørne 
Kommentarene