En indexsida till din portfolio

Din portfoliosajt bör ha lite information om vad sajten innehåller på förstasidan. En besökare ska kunna se ganska direkt vad det är för sajt han/hon har landat på.

Arbetsgång

1. Formge din layout
   Se nedan vad din layout ska innehålla. Börja gärna skissa med penna och papper och gör sen en utförlig skiss i Photoshop. Visa skissen innan du börjar jobba i Dreamweaver.
2. Bygg upp indexsidan i Dreamweaver.
3. När du är nöjd, spara din indexsida som en mall i Dreamweaver och använd den sedan för alla sidorna i Portfoliosajten. (Beskrivning för hur man gör mallar finns på Webbdesignskolan.)

Din layout ska innehålla:

Innan du börjar med layouten, läs igenom layoutreglerna! När du sedan funderar över vilken layout du ska ha måste du ta hänsyn till följande:

• sajten ska ha en titelbild som ligger kvar på alla sidor (exakta mått bestämmer du själv utifrån din layoutskiss). En titelbild brukar förutom visuellt tilltalande bildmaterial också innehålla namnet för sajten, eller namnet på ägaren till sajten. Titelbilden ligger ju kvar på samtliga sidor och är en viktig identitetsskapare. Tänk på att bara använda eget bildmaterial. Massor av tips och instruktioner om Photoshop finns på Webdesignskolan.
• sajten måste ha en meny där det utan problem ryms 7 länkar, menyn ska vara likadan på alla sidor
• det område i webläsaren där dina uppgifter ska visas behöver vara minst 600 pixlar brett, samt ha plats att växa nedåt på sidan allteftersom innehållet varierar

Detta ska finnas i din CSS-kod

Förutom sidans layout i form av olika div:ar, ska du ha med följande i din kod:

• utseende för body, dvs bakgrundsfärg, ev. bakgrundsbild, marginaler på sidan
• utseende för all brödtext
• utseende för huvudrubrik
• utseende för mellanrubrik
• utseende för minst två sorters länkar; de som finns i menyn, samt länkar i brödtexten (du måste alltså göra en klass för åtminstone det ena utseendet av länkar)

Du får såklart lägga till annat du vill ha med i din design, men dessa saker ska finnas med. Givetvis ska färgerna på ovanstående ingå i ditt färgschema för sajten. Allt ska hänga ihop.

Html-koden

I det här arbetet ska du arbeta mer professionellt med koden för sidan. Din html-kod ska INTE innehålla någon ”utseendekod”, dvs angivelser om typsnitt, färger, marginaler, kantlinjer, osv. Html-koden är enligt webstandarden till för innehållet på en webbsida, inte för utseendet. All formgivning av utseendet ska finnas i CSS-koden.