! }! FORSIDE! <html>! <head>!



Relaterede dokumenter
Naja Schlüter Roskilde Tekniske Gymnasium 26/ Interessentanalyse

HHBR. Design. Kvalitets vurdering. Opgaven. Målgruppe og Budskab. De Grafiske valg

Grafisk Redegørelse Opgaven Programvalg Kvalitetsvurdering Målgruppe Arbejdsproces Kvalitet Komposition og layout Brugervenlighed

Dokumentation. Workflow. Grafisk produktion. Trine Alexandersen 1. hovedforløb

Dokumentation af hjemmeside/studieweb

Grafik Workflow...2 Opgave Kunden Min opgave Nuværende Design...4 Overvejelser Brainstorm...6 Målgruppe Signalværdi Sitemap Nuværende sitemap...

Afsluttende Projekt - Kom/IT

Et krav til portfolien var at det skulle udvikles fra bunden uden brug af CSS-frameworks, samt HTML og CSS skulle valideres uden fejl.

Dokumentation. Karen-Louise Fejerskov

Afsluttende opgave. Navn: Lykke Laura Hansen. Klasse: 1.2. Skole: Roskilde Tekniske Gymnasium. Fag: Kommunikation/IT

OPGAVE BESKRIVELSE ARBEJDSPROCES. Idéudvikling. Inspiration. Skelet. Uploade til server. Kodning. Teste sitet igennem. Rettelser og godkendelse

Stine Dorry Meulengracht Madsen Rapport Multimedie og kommunikation

Denne artikel er til dem der ønsker at vide mere om hvad CSS er og hvad CSS kan bruges til hvad angår WWW.

HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside

Tillykke Med Fødselsdagen

KODNING AF RESPONSIV DESIGN

Produkt. Index side GRAFISK DESIGN

Portfolie Redesign. Forord. Det tekniske. Tema ide. Css. opløsning.

Projekt-studieweb. Om kommunikationsteorierne. Morten, Jacob, Kristian og Cihat

Grafisk Workflow. Mediegrafiker - Svendeprøve. Mediegrafikeruddannelsen af Ramin Azizi

Oversigt HTML5 nye tags til sideopbygning

Webteknologi evalueringsopgave Vinter Niels Sundstrup

Grafisk workflow. bl.udbudsnet.dk

Vejledning. Indhold. Side 1

GRAFISK DESIGN. Min personlige e-portfolio

Grafisk. Workflow. Side 1

MÅLGRUPPE Alle typer af boligselskaber, ejer- og andelsforeninger samt div. institutioner (store som små) på Sjælland. Ikke private kunder.

1. Hovedforløb. Mediegrafiker

1. Semester afsluttende Projekt Charlotte Bruhn MUL A December Januar 2015

Cecilie Maria Nielsen, Mathias Fornitz Eriksen og Martin Arnetoft klasse

GRAFISK WORKFLOW. 1 Grafisk workflow

Indhold. Grafisk workflow 3 Procesbeskrivelse 4 Inspiration 5 Skitser 6 Flowchart 7 Typografi og farver 8 Skelet 9 Storyboard 12 Html, css og seo 16

Afsluttende opgave Webdesign Den 24. maj 2007 Klasse 1.2

Grafisk design. Ide. Designprocess. Målgruppe

Niks Frost & Line Søs Hold 32B

Grafisk Workflow. hovedforløb 2

GRAFISK DESIGN. Responsiv website - Mockup

Klasse 1.4 Michael Jokil

Marc Creutzberg aarhusportalen AARHUSTECH 19/

GRAFISK WORKFLOW H1 MARIA SCHELDE

OPGAVE: WELOVEORGANIC.COM WEBSHOP

GRAFISK WORKFLOW GRAFISK WORKFLOW DIGITAL KOMMUNIKATION OLEMOGELBY.COM

Multimediedesign på CPH-Business URL: Eksamensopgave. Redesign af Portefølje. Grace Grigoria Tsatsaris

1 // Grafisk design. Hjemmesiden før. Kunde. Produkt. Opgave. Målgruppe. Bogforlaget Frydenlund A/S.

GRAFISK WORKFLOW Hjemmesidedesign

Grundlæggende HTML. Hjemmesider, kommunikation og kode. mandag den 13. august 12

GRAFISK WORKFLOW WEBSITE - CHOCOADDICT

GRAFISK WORKFLOW REDESIGN AF HJEMMESIDE

web via Photoshop, så de fylder mindst muligt for at mindske indlæsningstiden for websitet.

Grafisk produktionsforståelse

Portfolio redesign. Kia Dahlen! 1. semester eksamen! MUL-A 2013! !!!

grafisk workflow Madmagasinet

Web sider. Introduktion: Har du nogensinde spekuleret over, hvordan det verdesomspændende internet virker og hvordan man snakker med det?

GRAFISK PRODUKTION WORK- FLOW DREAMWEAVER CS5 DESIGN & KODNING AF LANDING PAGE. a.link, a.hover, a.visited. Wrapper. paragraph CSS. h1 h2.

Introduktion til HTML5: Tekst, punktlister, billeder, links og undersider

Charlotte Plenge. Kom/IT Projekt HTX Roskilde. Joachim K. Bodholdt

GRAFISK WORKFLOW WEBSHOP TIL KLITMØLLER COLLECTIVE

3. PROJEKT, 2 SEMESTER

ELEMENTER Jeg vælger fonten Raleway, som er en af Googles mange gratis webfonte. Det er en grotesk skrift, som især bruges til websites, da de på

Grafisk workflow. Se siden her:

Implementeringsvejledning

GRAFISK PRODUKTIONSFORSTÅELSE

GRAFISK PRODUKTION & WORKFLOW RESPONSIV HJEMMESIDE

GRAFISK WORKFLOW OPGAVEBESKRIVELSE KVALITETSVURDERING HJÆLPEMIDLER BROWSER BRUGERVENLIGHED/USABILLITY

Grafisk Design. fra idé til visuelt udtryk Benett

GRAFISK PRODUKTION PORTFOLIO DAN KLESSEN BOOSTING BUSINESS MEDIEGRAFIKER SVENDEPRØVE

PORTFOLIO SEBASTIAN NYHOLM. Eksamensprojekt. 1. Semester

Computerens - Anatomi

Valgfrit tema. Kommunikation/IT Jannik Nordahl-Pedersen. HTX - Roskilde. Klasse 3.5

MONIQUE BOOTS-NIELSEN / GRAFIKER

Transkript:

<html> FORSIDE <head> <meta charset='utf-8' /> <title>opgaver</title> <style type='text/css'> body { background-color:#33adff; } header { background:#33adff; color:white; text-align:center; padding:5px; } nav { line-height:30px; background-color:#f0fff0; height:10px; float:top; display: block; //alternativ: inline//; padding:20px; } section { float:center; background-color:#e0ffff; padding:20px; } footer { background-color:#66cdaa; color:white; clear:both; text-align:center; padding:5px; } </style> </head> <body bgcolor="#afeeee"> <header> <h1 style=font-family:courier>opgaver</h1> </header> <nav> <h1 style=font-family:avenir </h1> <a href="studieweb.html">forside</a> <a href="omstudieweb-link.html">om Studieweb</ a> <a href="girafvideolink.html">opgaver</a> <a href="ommig-link.html">om mig</a> <a href "#">Links</a> </nav>

<section> <p1 style=font-family:avenir> På denne side kan du se alle mine fremtidige opgaver i kom/it, som kommer til at ligge på denne side. Lige nu er det kun giraf-videoen og hjemmesiden i sig selv som er lagt op </p1> <video width="320" height="240" controls> <source src="girafvideo.mp4" type="video/mp4"> </video> <h1 style=font-family:avenir>girafvideo</h1> <p1 style=font-family:avenir>denne video var det første projekt som vi lavede i kom/it. Formålet med denne video var at give en præsentation af os selv og at vi fik en introduktion til faget kom/it. Selve videoen omhandlede tre andre personer og mig, hvor vi skulle fortælle noget om de forskellige personer. Det hele blev stykket sammen til en video som vi lagde op til aflevering. Videoen kan ses ovenover</p> <h1 style=font-family:avenir>studieweb</h1> <p1 style=font-family:avenir>dette projekt gik ud på at fremstille vores egen hjemmeside, og give os et indblik i programering. Denne side som du er på er den færdige version som jeg har afleveret. Dette projekt har været med til at give mig et større indblik i hvordan man programerer en hjemmeside, og jeg har lært meget mere om f.eks. HTML og CSS. Dette projekt har været med til at give mig videre inspiration til evnt. Fremstille min egen hjemmeside.</p> <h2 style=font-family:avenir>programmer brugt til Studieweb</h2> <p1 style=font-family:avenir> Det program som jeg har brugt til fremstillelsen af denne hjemmeside er textredigeringsprogrammet Sublime Text 2, som jeg fik anbefalet af andre fordi det fungerede godt med HTML, da det viste forskellige farver og gjorde hele koderne mere overskuelig. Hvis man kiggger på min kode, kan man se at den er lettere rodet, men fungerer. Jeg lærte senere hen at det er en god ide at lave masser af afstand når man indskriver kode, det gør det hele mere overskueligt. Nedenunder kan du se et udsnit af min kode, som jeg har brugt til at opbygge denne hjemmeside.</p1> <h2 style=font-family:avenir>html</h2> <img src="sublime Text 2.jpg" alt="sublime Text 2" style="width:500px; height:350px"> <p style=font-family:avenir> Her vil jeg fortælle lidt om HTML og CSS. HTML er et slags kodesprog, som bruges til at kunne opbygge hjemmesider. Med HTML kan man opbygge alle mulige slags hjemmesider, og hver enkelt hjemmeside er opbygget af HTML koder. Måden at HTML koder er bygget op på kan ses ovenover. Som du kan se starter man med at angive en komando, som man skriver op. Her skal man huske at bruge start-og slut tags. Et eksempel kan være nederst på billedet, hvor vi starter med en section tag. Inden i dette tag kan vi så lave paragrafer, og angive forskellige skrifttyper. Man skal dog også huske at slutte sine tags, så derfor ender dette tag med en section tag. </p> <h2 style=font-family:avenir>css</h2> <p style=font-family:avenir> CSS er et andet slags kodeprogram, som koder for den grafiske opbygning. Her kan man for eksempel bestemme hvilken slags grafisk indhold som skal vises på siden, som for eksempel sektioner og fodnoter. I CSS kan man også bestemme hvilken slags farver at siden skal have de forskellige steder. Jeg har på denn side valgt at bruge forskellige nuancer af blå, da jeg dels synes at det er nogle flotte farver, og som er med til at udsende et roligt budskab, uden at springe for meget i øjnene. Hvordan mit CSS er opbygget kan ses i nedenstående dokument nederst på siden. </p>

<h2 style=font-family:avenir>informationsdesign</h2> <p style=font-family:avenir> Inden at jeg gik igang med denne side, var det vigtigt for mig at denne hjemmeside skulle være nem og overskuelig for andre besøgende. Den skulle have en let opbygning, som til dels ville gøre det lettere for mig med mit første hjemmeside projekt, men som også vil være overskueligt og ikke springe for meget i øjnene på mine besøgende. Jeg havde også planlagt at der skulle være forskellige sektioner af min side, som skulle have nogenlunde samme opbygning, men forskelligt indhold. Dermed gjorde det det mere overskueligt at bevæge sig rundt på siden, istedet for at lade det hele være på én side. Jeg synes at de ideer som jeg startede med er kommet godt til live på denne hjemmeside, og jeg har lært meget af denne proces. </p> </section> <footer style="clear:both;"> <h3 style=font-family:courier">denne side er lavet af Kasper F. Nielsen, Delta 1.4 i medielab</h3> </font> </footer> </body> </html>

Om studieweb <html> <head> <meta charset='utf-8' /> <title>opgaver</title> <style type='text/css'> body { background-color:#afeeee; } header { background:#33adff; color:white; text-align:center; padding:5px; } nav { line-height:30px; background-color:#f0fff0; height:10px; float:top; display: block; //alternativ: inline//; padding:20px; } section { float:center; background-color:#e0ffff; padding:20px; } footer { background-color:#66cdaa; color:white; clear:both; text-align:center; padding:5px; } </style> </head> <body bgcolor="#afeeee"> <header> <h1 style=font-family:courier>om studieweb</h1> </header> <nav> <h1 style=font-family:avenir </h1> <a href="studieweb.html">forside</a> <a href="omstudieweb-link.html">om Studieweb</ a> <a href="girafvideolink.html">opgaver</a> <a href="ommig-link.html">om mig</a> <a href "#">Links</a> </nav>

<section> <h1 style=font-family:avenir>om studieweb</h1> <p1 style=font-family:avenir> Studieweb er en hjemmeside som bruges til mit arbejde i studieweb. Denne hjemmeside fungerer som en aflevering i et kom/it projekt, og fremtidige opgaver kommer til at ligge under sektionen opgaver, hvilket er hovedformålet for denne side. Bemærk at denne side er under konstant ombygning, men tag også et kig på de andre faner </p1> <h1 style=font-family:avenir>kom/it</h1> <p1 style=font-family:avenir>formålet med faget kom/it er at give elever specefikke ITkompetencer, og lære dem mere omkring arbejdet med IT og kommunikation. Faget ligger på første år, og er med til at give eleverne en forsmag på hvordan faget kom/it er, for at give dem muligheden for at vælge en studieretning hvor kom/it er med. Samtidig er det også et fag som der står at man skal have på C niveau ifølge HTX bekendtgørelsen</p> </section> <footer> <h3 style=font-family:courier">denne side er lavet af Kasper F. Nielsen, Delta 1.4 i medielab</h3> </font> </footer> </body> </html>

Opgaver <html> <head> <meta charset='utf-8' /> <title>opgaver</title> <style type='text/css'> body { background-color:#33adff; } header { background:#33adff; color:white; text-align:center; padding:5px; } nav { line-height:30px; background-color:#f0fff0; height:10px; float:top; display: block; //alternativ: inline//; padding:20px; } section { float:center; background-color:#e0ffff; padding:20px; } footer { background-color:#66cdaa; color:white; clear:both; text-align:center; padding:5px; } </style> </head> <body bgcolor="#afeeee"> <header> <h1 style=font-family:courier>opgaver</h1> </header> <nav> <h1 style=font-family:avenir </h1> <a href="studieweb.html">forside</a> <a href="omstudieweb-link.html">om Studieweb</ a> <a href="girafvideolink.html">opgaver</a> <a href="ommig-link.html">om mig</a> <a href "#">Links</a>

</nav> <section> <p1 style=font-family:avenir> På denne side kan du se alle mine fremtidige opgaver i kom/it, som kommer til at ligge på denne side. Lige nu er det kun giraf-videoen og hjemmesiden i sig selv som er lagt op </p1> <video width="320" height="240" controls> <source src="girafvideo.mp4" type="video/mp4"> </video> <h1 style=font-family:avenir>girafvideo</h1> <p1 style=font-family:avenir>denne video var det første projekt som vi lavede i kom/it. Formålet med denne video var at give en præsentation af os selv og at vi fik en introduktion til faget kom/it. Selve videoen omhandlede tre andre personer og mig, hvor vi skulle fortælle noget om de forskellige personer. Det hele blev stykket sammen til en video som vi lagde op til aflevering. Videoen kan ses ovenover</p> <h1 style=font-family:avenir>studieweb</h1> <p1 style=font-family:avenir>dette projekt gik ud på at fremstille vores egen hjemmeside, og give os et indblik i programering. Denne side som du er på er den færdige version som jeg har afleveret. Dette projekt har været med til at give mig et større indblik i hvordan man programerer en hjemmeside, og jeg har lært meget mere om f.eks. HTML og CSS. Dette projekt har været med til at give mig videre inspiration til evnt. Fremstille min egen hjemmeside.</p> <h2 style=font-family:avenir>programmer brugt til Studieweb</h2> <p1 style=font-family:avenir> Det program som jeg har brugt til fremstillelsen af denne hjemmeside er textredigeringsprogrammet Sublime Text 2, som jeg fik anbefalet af andre fordi det fungerede godt med HTML, da det viste forskellige farver og gjorde hele koderne mere overskuelig. Hvis man kiggger på min kode, kan man se at den er lettere rodet, men fungerer. Jeg lærte senere hen at det er en god ide at lave masser af afstand når man indskriver kode, det gør det hele mere overskueligt. Nedenunder kan du se et udsnit af min kode, som jeg har brugt til at opbygge denne hjemmeside.</p1> <img src="sublime Text 2.jpg" alt="sublime Text 2" style="width:500px; height:350px"> <h2 style=font-family:avenir>html</h2> <p style=font-family:avenir> Her vil jeg fortælle lidt om HTML og CSS. HTML er et slags kodesprog, som bruges til at kunne opbygge hjemmesider. Med HTML kan man opbygge alle mulige slags hjemmesider, og hver enkelt hjemmeside er opbygget af HTML koder. Måden at HTML koder er bygget op på kan ses ovenover. Som du kan se starter man med at angive en komando, som man skriver op. Her skal man huske at bruge start-og slut tags. Et eksempel kan være nederst på billedet, hvor vi starter med en section tag. Inden i dette tag kan vi så lave paragrafer, og angive forskellige skrifttyper. Man skal dog også huske at slutte sine tags, så derfor ender dette tag med en section tag. </p> <h2 style=font-family:avenir>css</h2> <p style=font-family:avenir> CSS er et andet slags kodeprogram, som koder for den grafiske opbygning. Her kan man for eksempel bestemme hvilken slags grafisk indhold som skal vises på siden, som for eksempel sektioner og fodnoter. I CSS kan man også bestemme hvilken slags farver at siden skal have de forskellige steder. Jeg har på denn side valgt at bruge forskellige nuancer af blå, da jeg dels synes at det er nogle flotte farver, og som er med til at udsende et roligt

budskab, uden at springe for meget i øjnene. Hvordan mit CSS er opbygget kan ses i nedenstående dokument nederst på siden. </p> <h2 style=font-family:avenir>informationsdesign</h2> <p style=font-family:avenir> Inden at jeg gik igang med denne side, var det vigtigt for mig at denne hjemmeside skulle være nem og overskuelig for andre besøgende. Den skulle have en let opbygning, som til dels ville gøre det lettere for mig med mit første hjemmeside projekt, men som også vil være overskueligt og ikke springe for meget i øjnene på mine besøgende. Jeg havde også planlagt at der skulle være forskellige sektioner af min side, som skulle have nogenlunde samme opbygning, men forskelligt indhold. Dermed gjorde det det mere overskueligt at bevæge sig rundt på siden, istedet for at lade det hele være på én side. Jeg synes at de ideer som jeg startede med er kommet godt til live på denne hjemmeside, og jeg har lært meget af denne proces. </p> </section> <footer style="clear:both;"> <h3 style=font-family:courier">denne side er lavet af Kasper F. Nielsen, Delta 1.4 i medielab</h3> </font> </footer> </body> </html>

Om mig <html> <head> <meta charset='utf-8' /> <title>opgaver</title> <style type='text/css'> body { background-color:#afeeee; } header { background:#33adff; color:white; text-align:center; padding:5px; } nav { line-height:30px; background-color:#f0fff0; height:10px; float:top; display: block; //alternativ: inline//; padding:20px; } section { float:center; background-color:#e0ffff; padding:20px; } footer { background-color:#66cdaa; color:white; clear:both; text-align:center; padding:5px; } </style> </head> <body bgcolor="#afeeee"> <header> <h1 style=font-family:courier>om studieweb</h1> </header> <nav> <h1 style=font-family:avenir </h1> <a href="studieweb.html">forside</a> <a href="omstudieweb-link.html">om Studieweb</ a> <a href="girafvideolink.html">opgaver</a> <a href="ommig-link.html">om mig</a> <a href "#">Links</a>

</nav> <section> <p1 style=font-family:avenir> Mit navn er Kasper F. Nielsen, og jeg er på nuværende tidspunkt 17 år gammel. Jeg går på HTX i Roskilde, og før gik jeg på Køge Bugt Privatskole. Jeg bor på en gård med fem heste og en hund i Tune, lidt uden for Roskilde. I min fritid kan jeg godt lide at være sammen med mine venner, læse, planlægge rejser, være på computeren, fotografere og redigere billeder, høre musik og meget mere. Jeg arbejder lige nu hos DSV i hedehusene, og har jeg har skal højst sandsynligt på universitetet som arkitekt eller ingenør. </p1> </section> <footer> <h3 style=font-family:courier">denne side er lavet af Kasper F. Nielsen, Delta 1.4 i medielab</h3> </font> </footer> </body> </html>