Webbteknik för ingenjörer

Storlek: px
Starta visningen från sidan:

Download "Webbteknik för ingenjörer"

Transkript

1 Institutionen för Tillämpad fysik och elektronik Karin Fahlquist Webbteknik för ingenjörer HTML5 & CSS laboration

2 Målsättning Att skapa en webbplats utifrån en Lo-fi prototyp och implementera webbplatsen med grundläggande HTML. Att separera innehåller och utseendet på webbplatser genom att använda stilmallar. Teori och förberedelse Välj ämne för din webbplats. Ta fram en Lo-fi prototyp på din tänkta webbplats. Du ska skapa en responsiv webbplats så visa hur den lo-fi ser ut i de olika storlekarna. (se föreläsningsanteckningarna för teori omkring Lo-fi-prototyp.) Webplatsen ska minst innehålla 5 sidor. Beskriv webbplatsens struktur med hjälp av ett flödesschema. (Ett flödeschemat beskriver hur sidorna på din webplats är länkade till varandra.) Filmer, föreläsningsanteckningar, kurslitteratur och internetlänkar (se kurshemsidan). Material Dator med ett HTML-editeringsverktyg, exempelvis Dreamweaver. Webserver (konto och lösenord fås av kursansvarig). Utförande Denna laboration utför ni individuellt, men ni hjälps givetvis åt så mycket som möjligt. Utför moment 1, 2 och 3 för godkändnivå på labben. För plusnivå gäller att grunduppgifterna är läst på ett bra och tillfredställande sätt, dessutom ska plusuppgifterna vara löst på ett bra och tillfredställande sätt. Vi kommer att bedöma om er plusuppgift ger ett högre betyg och vad det betyget blir. De högre betygen är VG och MVG. Läs igenom hela laborationen innan ni börjar. Ni kommer att använda den senaste standarden för html och CSS: HTML5 och CSS3. Redovisning Ladda upp din Lo-fi prototyp (se till att få den godkänd innan du fortsätter med uppgiften). Redovisa ditt arbete genom att lägga upp webbplatsen på den tilldelade webbservern samt fyll i labbprotokollet. Protokollet laddas upp på Moodle. För godkänt på laborationen redovisas del 1, 2 och 3. För Plusnivå skall även plusuppgiften (uppgift 4) redovisas. Det skall tydligt framgå om det redovisade sidor avser grundnivå eller plusnivå.

3 Del 1 - HTML 1a Med denna uppgift ska du få testa på olika html-taggar, hur de ser ut och hur de fungerar samt få förståelse för hur ett html-dokument är uppbyggt. Bry dig inte så mycket om utseendet det kommer i del 2. Starta programmet Dreamweaver eller något annat verktyg med liknande egenskaper och öppna ett tomt HTML5-dokument. Ett html-dokument är indelat i en head-del och en body-del. Beskriv kort vad det är som ingår i de olika delarna: head och body. Vilken kod är det som beskriver att html-dokumentet skrivs i HTML5 och var skrivs denna kod? Undersök metataggar som finns på välgjorda webbsidor, exempelvis Vägverket ( eller någon annan myndighet. Sätt in några relevanta meta-taggar på din sida. Var ska dessa placeras? Hur används metataggar? Sätt en titel (title) på ditt dokument. Hur och var visas titel? Det du nu gjort hittills kan du se som en mall för dina andra sidor fortsättningsvis. Spara sidan förslagsvis som mall.html innan du fortätter. Försätt nu med att sätta in text och bild som ska visas på din websida. Tips: På w3schools, finns en lista med alla taggar. Se till att du använder taggar som är tillåtna i HTML5. Använd motsvarande html-taggarna för rubrik (minst två nivåer), paragraf/stycke (minst två stycken), bilder, en lista (Det finns olika typer av listor. Vilka? ), en tabell med innehåll, länkar till utomstående websidor (minst två sidor) Spara denna sida. Kontrollera att länkarna fungerar. 1b Nu är det dags att börja skapa innehållet i din webbplats. Webbplatsen ska innehålla minst 5 olika sidor. (Själva utseendet och layouten av sidan ska du få göra i uppgift 2.) Utgå från din Lo-fi prototyp och din skiss på websidans struktur. Använd din mall.html att utgå ifrån. Ändra titel och meta-taggar om så behövs för respektive sida. Ändra sedan innehållet på sidorna så att de stämmer överens med din Lo-fi skiss. Spara din första sida som index.html. Fortsätt sedan att döpa de andra sidorna till namn som har med innehållet på sidorna att göra. Sidorna ska tillsammans innehålla följande (anpassa efter din Lo-fi skiss): text länkar

4 bilder listor tabeller video och ljud (använd <video> och <audio> taggar. Båda klippen ska ha kontroller som play, pause, osv.) Lägg till en meny som du placerar på alla sidor och som länkar ihop din webbplats enligt din webbplats struktur som du beskrivit i flödesschemat. Del 2 - CSS Här ska du prova på att använda stilmallar eller formatmallar (CSS) som det också heter för att styra utseendet på din webbplats. 2a Skapa ett CSS-dokument och spara den förslagsvis som stilmall.css. Länka nu ihop ditt CSS-dokument med dina html sidor. Hur och var görs denna länkning? Dags att börja förändra utseendet på dina webbsidor: Använd nu stilmallen och bestäm hur dina rubriker, paragrafer, länkar, listor och tabeller ska se ut när det gäller färg och font genom att använda element-selektorer, id-selektorer, och klassselektorer. Vad är skillnaden på dessa selektorer och när används respektive selektor? Utgå från din Lo-fi prototyp och skapa de block som du kommer att behöva i dina html-dokument för att kunna styra layouten på dina sidor med din CSS-fil. För att skapa dessa block sätt in div:ar och de färdiga block-taggarna som ex.vis nav, article, header, footer, section, and aside i dina html-dokument. I CSS-filen använder du dig nu av margin, float, padding, clear, position, osv i dina selektorer för placera ut blocken enligt din Lo-fi prototyp. Tips: Se external styles på W3schols. Ta reda på typiska CSS3 kommandon och använd dem på dina webbsidor. 2b Här ska du få testa på och visa hur samma html sida kan få helt olika utseende genom att ändra på stilmallen. Gör din webbplats responsiv så att den fungerar på olika plattformat (stationär dator, läsplatta och mobil, med hjälp av stilmallen. Utgå från någon av sidorna från 2a. Visa exempel på hur du kan få samma HTML-fil att få helt nytt utseenden både med tanke på textens utseende och med tanke på layouten med hjälp av stilmall. Spara sidan med ett nytt namn.

5 Del 3 validering För att testa att html koden följer HTML5 standarden så ska du nu få validera din webplats. Använd dig av följande valideringstjänster för att validera dina 5 sidor från uppgift 2a: Försök att åtgärda de eventuella fel som uppstår. Testa även din webplats i olika webbläsare samt på olika plattformar (dator, läsplatta, mobil, ). Redovisa resultatetet. Del 4 - Plusuppgift Fördjupa dig inom ett ämne och genomför uppgiften. Applicera det på din webbplats. Var noga med att ange dina källor för din fördjupning. Responsive design: Använd något CSS-ramverk för att göra din webbplats resonsiv. Beskriv och förklara hur detta används. Undersök och förklara begrepp som mobile first och desktop first. Du kan också välja någon annan webbteknik som du är nyfiken på att undersöka eller implementera på din webbplats. Diskutera dina ideer med läraren för att ta reda på din idé räcker.

Webbutveckling Laboration 1: HTML5 och CSS3.

Webbutveckling Laboration 1: HTML5 och CSS3. Institutionen för 2015-11-30 Tillämpad fysik och elektronik Karin Fahlquist Webbutveckling Laboration 1: HTML5 och CSS3. Målsättning Att skapa en webbplats genom att först skapa en Lo-fi prototyp och sedan

Läs mer

07/12/2015. Stilmallar. - styra utseendet av webbplatsen DEL 1. Karin Fahlquist. index.html. iecept.html frukt.html grönsaker.html

07/12/2015. Stilmallar. - styra utseendet av webbplatsen DEL 1. Karin Fahlquist. index.html. iecept.html frukt.html grönsaker.html Stilmallar - styra utseendet av webbplatsen DEL 1 Karin Fahlquist index.html iecept.html frukt.html grönsaker.html 1 Samma kod olika utseende Olika exempel om layout: http://www.csszengarden.com/ Utseende

Läs mer

Xhtml och CSS.Tillämpad fysik och elektronik Per Kvarnbrink (redigering Ulf Holmgren 2011)

Xhtml och CSS.Tillämpad fysik och elektronik Per Kvarnbrink (redigering Ulf Holmgren 2011) Laboration 1: Xhtml och CSS.Tillämpad fysik och elektronik Per Kvarnbrink (redigering Ulf Holmgren 2011) Målsättning Att prova på grundläggande html samt att separera innehåll och utseende. Slutresultatet

Läs mer

Labbrapport: HTML och CSS

Labbrapport: HTML och CSS Labbrapport: HTML och CSS Utförd av: Natalie Olmosse Mailadress: natalie.olmosse@gmail.com Datum: 2015 12 18 Kursansvarig: Karin Fahlquist Övriga lärare: Ulrik Söderström Första inlämningen Resultat (Godkänd/Retur):

Läs mer

Laboration 2: Xhtml och CSS.

Laboration 2: Xhtml och CSS. Laboration 2: Xhtml och CSS. Målsättning Att prova på grundläggande html samt att separera innehåll och utseende. Slutresultatet kommer att bli en webbplats med layout, bakgrundsbilder, minst en meny och

Läs mer

Tillämpad fysik och elektronik Per Kvarnbrink m.fl. Laboration 2: HTML och CSS.

Tillämpad fysik och elektronik Per Kvarnbrink m.fl. Laboration 2: HTML och CSS. Laboration 2: HTML och CSS. Målsättning Att prova på grundläggande html samt att separera innehåll och utseende. Slutresultatet kommer att bli en enkel webbplats med layout, bakgrundsbilder, minst en meny

Läs mer

Laborationsanvisning. HTML5 Laboration 6. Författare: Johan Leitet Version: 1 Datum: 2011-10-03

Laborationsanvisning. HTML5 Laboration 6. Författare: Johan Leitet Version: 1 Datum: 2011-10-03 Laborationsanvisning HTML5 Laboration 6 Författare: Johan Leitet Version: 1 Datum: 2011-10-03 Inledning I denna avslutande laboration ska du testa att märka upp en sida med de nya taggarna i HTML5. Mikroformat

Läs mer

Inlämningsuppgift 2. DA156A - Introduktion till webbutveckling Teknik och samhälle, Malmö högskola Oktober 2012

Inlämningsuppgift 2. DA156A - Introduktion till webbutveckling Teknik och samhälle, Malmö högskola Oktober 2012 Oktober 2012 Uppgiften går ut på att redovisa dina kunskaper kring JavaScript, liksom din förmåga att skapa en CSS-baserad layout. Detta gör du genom att lämna in ett resultat som följer specifikationerna

Läs mer

WEBBUTVECKLING CSS. Formatmallar - CSS

WEBBUTVECKLING CSS. Formatmallar - CSS betyder Cascading Style Sheets, vilket i svensk översättning blir ungefär formatmallar (inte riktigt, men nästan...). Anledningen till att man använder är att det är ett lätt sätt att skilja utseende och

Läs mer

Del 1 och 2 HTML/CSS. Webbutveckling Laboration 1 Nicklas Bostedt 850906-8550

Del 1 och 2 HTML/CSS. Webbutveckling Laboration 1 Nicklas Bostedt 850906-8550 Del 1 och 2 HTML/CSS Vi har fått i uppgift att göra en hemsida av eget val! Jag har bestämt mig för att skapa en hemsida åt en påhittad restaurang här i Umeå som inriktar sig på exklusiv nyttig mat och

Läs mer

Sidan kommer inte läggas upp någonstans utan du redovisar den för mig på något handledningstillfälle.

Sidan kommer inte läggas upp någonstans utan du redovisar den för mig på något handledningstillfälle. Lab1 - CV-sidan Du ska bygga en variant av en CV-sida i HTML och CSS. Sidan ska åtminstone innehålla en bild på dig, en klassisk tabell med utbildningar/erfarenheter, ditt favoritcitat, en eller flera

Läs mer

Laboration 1. Webbprodution Struktur & innehåll HT2015

Laboration 1. Webbprodution Struktur & innehåll HT2015 Laboration 1 Webbprodution Inledning Denna inledande laboration syftar i mångt och mycket till att du ska känna dig bekväm med den laborationsmiljö ni blivit introducerat inför. De inledande uppgifterna

Läs mer

21/01/2016. Stilmallar. styra utseendet av webbplatsen DEL 1. Karin Fahlquist. index.html. recept.html frukt.html grönsaker.html

21/01/2016. Stilmallar. styra utseendet av webbplatsen DEL 1. Karin Fahlquist. index.html. recept.html frukt.html grönsaker.html Stilmallar styra utseendet av webbplatsen DEL 1 Karin Fahlquist index.html recept.html frukt.html grönsaker.html 1 Samma kod olika utseende Olika exempel om layout: http://www.csszengarden.com/ Stilmallar

Läs mer

Föreläsning 4. CSS Stilmallar för webben

Föreläsning 4. CSS Stilmallar för webben Föreläsning 4 CSS Stilmallar för webben Innehåll 1. CSS, vad är det? 2. Repetition av HTML-element 3. CSS, hur, var, när? 4. CSS & arv? CSS Cascading Style Sheet Same, same, but different Samma innehåll

Läs mer

Laboration 3 i kursen Produktion för tryckta medier och webb: Webbplatsproduktion med ett publiceringssystem

Laboration 3 i kursen Produktion för tryckta medier och webb: Webbplatsproduktion med ett publiceringssystem Laboration 3 i kursen Produktion för tryckta medier och webb: Webbplatsproduktion med ett publiceringssystem Målsättning Att bygg upp en komplett webbplats i ett publiceringssystem. Platsen ska vara snygg,

Läs mer

Projektanvisning. Webbsideprojekt. Författare: Johan Leitet Version: 2 Datum: 2012-10-09

Projektanvisning. Webbsideprojekt. Författare: Johan Leitet Version: 2 Datum: 2012-10-09 Projektanvisning Webbsideprojekt Författare: Johan Leitet Version: 2 Datum: 2012-10-09 Inledning Du har nu under ett antal laborationer i webbteknik fått relativt styrda uppgifter där du ensam fått lösa

Läs mer

Laboration 2. Webbproduktion En stiligare webbsida HT2015

Laboration 2. Webbproduktion En stiligare webbsida HT2015 Laboration 2 Webbproduktion Inledning Vi har hittills koncentrerat oss på att strukturera upp vår information på ett så semantiskt sätt som möjligt. Nu är det dags att ge ögat något vackert att vila på.

Läs mer

HTML och CSS. Eric Elfving Institutionen för datavetenskap. 18 augusti 2015

HTML och CSS. Eric Elfving Institutionen för datavetenskap. 18 augusti 2015 . HTML och CSS Eric Elfving Institutionen för datavetenskap 18 augusti 2015 Översikt 2/17 Introduktion HTML Syntax Vanliga element CSS Syntax Selektorer Kombinera HTML och CSS Webserver Introduktion 3/17

Läs mer

En stiligare portal Laboration 3

En stiligare portal Laboration 3 Laborationsanvisning En stiligare portal Laboration 3 Författare: Johan Leitet Version: 1 Datum: 2011-09-09 Inledning Vi har hittills koncentrerat oss på att strukturera upp vår information på ett så semantiskt

Läs mer

Laboration 3 HTML och struktur samt frågorna A - C övningar/uppgifter

Laboration 3 HTML och struktur samt frågorna A - C övningar/uppgifter Laboration 3 HTML och struktur samt frågorna A - C övningar/uppgifter 1M321 Webbteknik 1, 7,5hp Medieteknik 2018 Rune Körnefors rune.kornefors@lnu.se 1. Skapa ett nytt HTML-dokument I denna laboration

Läs mer

Vad roligt att ni har valt att bjuda varandra på den här timmen.

Vad roligt att ni har valt att bjuda varandra på den här timmen. Hej! Vad roligt att ni har valt att bjuda varandra på den här timmen. Att prata med en ny person kan kännas nervöst även om man som ni redan har en hel del gemensamt. Därför finns den här guiden som ska

Läs mer

Övning 1 Vi börjar med en vanlig html-fil där html används för både innehåll och utseende:

Övning 1 Vi börjar med en vanlig html-fil där html används för både innehåll och utseende: Uppsala universitet Institutionen för utbildning, kultur och medier IKT A HT 2009 Monica Langerth Zetterman 2009-09-23 Testa stilmallar Övning 1 Vi börjar med en vanlig html-fil där html används för både

Läs mer

Ett ämnesövergripande arbetsområde som innehåller biologi, fysik och teknik.

Ett ämnesövergripande arbetsområde som innehåller biologi, fysik och teknik. Namn: Målsmans underskrift: VAD ÄR DET SOM LÅTER? Ett ämnesövergripande arbetsområde som innehåller biologi, fysik och teknik. MÅL När du är klar med det här arbetsområdet ska du för att nå godkänt: Kunna

Läs mer

Studiehandledning Pedagogisk dokumentation med IT-stöd, 15 hp, 2012.

Studiehandledning Pedagogisk dokumentation med IT-stöd, 15 hp, 2012. Studiehandledning Pedagogisk dokumentation med IT-stöd, 15 hp, 2012. En kurs i samarbete med Umeå Universitet. Designad för pedagoger i Mölndals stad. Välkommen till kursen Pedagogisk dokumentation med

Läs mer

Webbdesign Process till produkt

Webbdesign Process till produkt Webbdesign Process till produkt Umeå Universitet Mediaproduktion för www II 7,5hp Isak Madoun Introduktion; VÅR-KOKBOK Är en kokbok som i sin första upplgaga kom ut på 50-talet. Boken innehåller mer av

Läs mer

Struktur och innehåll Laboration 2

Struktur och innehåll Laboration 2 Laborationsanvisning Struktur och innehåll Laboration 2 Författare: Johan Leitet Version: 2 Datum: 2011-08-08 Inledning Till skillnad från laboration 1 som mest handlade om att komma igång med arbetsmiljön

Läs mer

Prototyper används för att

Prototyper används för att Skapa en prototyp Prototyper används för att Demonstrera ett koncept i ett tidigt stadium Testa detaljer i ett senare stadium Som en specifikation för den färdiga produkten Lo-fi Prototyp: pappers prototyp

Läs mer

HTML och CSS. Eric Elfving Institutionen för Datavetenskap (IDA)

HTML och CSS. Eric Elfving Institutionen för Datavetenskap (IDA) HTML och CSS Eric Elfving Institutionen för Datavetenskap (IDA) Upplägg Introduktion Grundläggande HTML Ändra utseende med CSS 2 Introduktion HyperText Markup Language används för att strukturera text

Läs mer

Kom igång manual. För att starta behöver du registrera dig och din förening: https://www.procup.se/adm/procup_newclub.php

Kom igång manual. För att starta behöver du registrera dig och din förening: https://www.procup.se/adm/procup_newclub.php Kom igång manual För att starta behöver du registrera dig och din förening: https://www.procup.se/adm/procup_newclub.php Logga därefter in med de uppgifter du fått i din mail: https://www.procup.se/adm/login.php

Läs mer

NATURVETENSKAP FÖR LIVET?

NATURVETENSKAP FÖR LIVET? NATURVETENSKAP FÖR LIVET? Under terminen kommer din klass att medverka i ett forskningsprojekt. Ni kommer att arbeta med uppgifter som handlar om i samhället. Enkäten innehåller frågor om dig och dina

Läs mer

Labora&on 5 CSS och layout samt fråga E övningar/uppgi>er

Labora&on 5 CSS och layout samt fråga E övningar/uppgi>er Labora&on 5 CSS och layout samt fråga E övningar/uppgi>er 1M321 Webbteknik 1, 7,5hp Medieteknik 2017 Rune Körnefors rune.kornefors@lnu.se 1. Dokument i övningarna I denna labora&on finns inga filer ar

Läs mer

Microsoft Publisher. Laborationskompendium för digital behandling av publikationer. Detta exemplar tillhör:

Microsoft Publisher. Laborationskompendium för digital behandling av publikationer. Detta exemplar tillhör: Mittuniversitetet ITM Telefon 0771-97 50 00 Microsoft Publisher Laborationskompendium för digital behandling av publikationer Detta exemplar tillhör: HT 2006 Innehållsförteckning Objekt 1 Textblock 2 Tabeller

Läs mer

PRESENTATION AV DESIGN OCH OFFERT

PRESENTATION AV DESIGN OCH OFFERT PRESENTATION AV DESIGN OCH OFFERT LICHRON BAKGRUND Via kravspec har Lichron klargjort att man önskar en ny webbplats som presenterar Lichronbolagen - Lichron AB som arbetar med försäljning av maskiner

Läs mer

Förkunskaper: Tim Berners Lees vision webbläsarkriget W3C strukturtagg <h1> layout-tagg <font size="6">

Förkunskaper: Tim Berners Lees vision webbläsarkriget W3C strukturtagg <h1> layout-tagg <font size=6> CSS { } Anne Diedrichs Medieteknik Södertörns Högskola Förkunskaper: Tim Berners Lees vision webbläsarkriget W3C strukturtagg layout-tagg Kurslitteratur: Niederst Robbins, Learning

Läs mer

Personlig assistans som den ska vara

Personlig assistans som den ska vara Personlig assistans som den ska vara Inledning om personlig assistans Varje sida som ska driva trafik till personlig assistans behöver vara utformad på rätt sätt. Det finns en hel del villkor som är viktiga

Läs mer

En grundkurs i hemsidor och hur de är uppbyggda

En grundkurs i hemsidor och hur de är uppbyggda En grundkurs i hemsidor och hur de är uppbyggda Den här artikeln tänkte väldigt grundligt gå igenom koncepten kring en hemsida och hur den är uppbyggt, för att ge dig grundkunskap att bygga vidare på och

Läs mer

Teknikprogrammet, inriktning informations- och medieteknik

Teknikprogrammet, inriktning informations- och medieteknik Teknikprogrammet, inriktning informations- och medieteknik Varför välja oss? Kursplan Presentation av våra datatekniska kurser Eftersom företag mycket sällan anställer gymnasieelever (de vill att ni ska

Läs mer

Det handlar om att ta fram och utveckla elevers inneboende nyfikenhet, initiativförmåga och självförtroende redan från tidiga åldrar.

Det handlar om att ta fram och utveckla elevers inneboende nyfikenhet, initiativförmåga och självförtroende redan från tidiga åldrar. Ung Företagsamhet Fyrbodal jobbar med att få fler företagsamma barn och ungdomar. I drygt 30 år har vi jobbat med UF-företag på gymnasienivå. Nu gör vi en nysatsning där elever och ni lärare på grundskolan

Läs mer

I den här labben ska vi använda oss av en trevlig nyhet i HTML5: Local Storage, för att implementera en sorts lokal gästbok.

I den här labben ska vi använda oss av en trevlig nyhet i HTML5: Local Storage, för att implementera en sorts lokal gästbok. Lokal Gästbok I den här labben ska vi använda oss av en trevlig nyhet i HTML5: Local Storage, för att implementera en sorts lokal gästbok. Gästboken ska fungera som så att man har ett fält där man kan

Läs mer

Labora&on 4 CSS och validering övningar/uppgi9er

Labora&on 4 CSS och validering övningar/uppgi9er Labora&on 4 CSS och validering övningar/uppgi9er 1M321 Webbteknik 1, 7,5hp Medieteknik 2016 Rune Körnefors rune.kornefors@lnu.se 1. Ladda ner arbetsdokument och skapa en mapp för U2 Till övningarna i denna

Läs mer

Förslag på lektionsupplägg: Dag 1- en lektionstimme

Förslag på lektionsupplägg: Dag 1- en lektionstimme MiniKonsulter Fångar upp elevernas naturliga kreativitet och nyfikenhet genom problemlösning i arbetslivet samt ökar elevernas naturliga intresse för problemlösning och innovationer. Skapar och bibehåller

Läs mer

CMS. - Content management system

CMS. - Content management system CMS - Content management system Agenda CMS Server, webbhotell och FTP Wordpress, ställ mycket frågor Om vi hinner - Snabb genomgång av CMS - uppgiften Nu & Då Sidor med bara HTML och CSS kräver manuell

Läs mer

On-line produktion TDDC61

On-line produktion TDDC61 On-line produktion TDDC61 Förra veckan Kursupplägg HTML FTP Validering Laboration 1. Deadlines Laborationer: 12/10, kl 08 Lämna in efterhand ni blir färdiga Vi rättar inom 4 arbetsdagar Portfolio, tillfälle

Läs mer

För att skriva CSS-kod använder man sig av olika kommandon. Ett exempel på hur man kan skriva kod för att ändra textfärg kan vara:

För att skriva CSS-kod använder man sig av olika kommandon. Ett exempel på hur man kan skriva kod för att ändra textfärg kan vara: Hemsida CSS Introduktion till Cascading Style Sheets (CSS) Detta är en mycket kort genomgång av CSS med exempel på hur sådan kod ska läsas och hur den kan användas på IdrottOnline-sidor. Är man ute efter

Läs mer

Prova på-laboration i PHP Johan Sjöholm johsj@ida.liu.se Institutionen för datavetenskap, Linköpings universitet 2009-08-09

Prova på-laboration i PHP Johan Sjöholm johsj@ida.liu.se Institutionen för datavetenskap, Linköpings universitet 2009-08-09 Prova på-laboration i PHP Johan Sjöholm johsj@ida.liu.se Institutionen för datavetenskap, Linköpings universitet 2009-08-09 1. Introduktion till webbprogrammering Webbprogrammering består av ett antal

Läs mer

Föreningarnas nya sidmall. Version 4, 12.4.2016

Föreningarnas nya sidmall. Version 4, 12.4.2016 Föreningarnas nya sidmall Version 4, 12.4.2016 Innehållsförteckning Föreningarnas nya sidmall... 1 Introduktion... 3 Sammanfattning... 3 Sidmallar och sidornas uppbyggnad... 4 Gamla sidmallen... 4 Nya

Läs mer

NY LATHUND 2015-04-22. Nyregistrering som ny medlem eller loggar in gör du via: www.gotland.se/pmc (Länk nere till höger på sidan)

NY LATHUND 2015-04-22. Nyregistrering som ny medlem eller loggar in gör du via: www.gotland.se/pmc (Länk nere till höger på sidan) NY LATHUND 2015-04-22 Nyregistrering som ny medlem eller loggar in gör du via: www.gotland.se/pmc (Länk nere till höger på sidan) 1 Registrera konto För att logga in eller skapa ett konto (bli medlem)

Läs mer

Matematik åk 9. Lärarinstruktion Digital diagnos Matematik Åk 9

Matematik åk 9. Lärarinstruktion Digital diagnos Matematik Åk 9 träning Insikt Lärarinstruktion Digital diagnos Matematik Åk 9 1 Till läraren Diagnosen Pejlo Insikt för åk 9 är framtagen för att ge dig som lärare överblick över dina elevers kunskaper i matematik. Diagnosen

Läs mer

Adobe. Dreamweaver CS3. Grundkurs. www.databok.se

Adobe. Dreamweaver CS3. Grundkurs. www.databok.se Adobe Dreamweaver CS3 Grundkurs www.databok.se Innehållsförteckning 1 Arbetsmiljön... 1 Användningsområde... 1 Starta Dreamweaver... 2 Arbeta i Dreamweaver... 2 Fönster... 3 Statusfältet... 4 Menyer...

Läs mer

Kommunikation. Dator med webbläsare Förfrågan: Webserver. Returnerar HTML-kod

Kommunikation. Dator med webbläsare Förfrågan:  Webserver. Returnerar HTML-kod html och css Kommunikation Dator med webbläsare Förfrågan: http://www.umu.se Webserver Returnerar HTML-kod Webbläsare Chrome Firefox Internet Explorer Safari Opera Källa : http://www.w3schools.com/browsers/

Läs mer

ÖrebroCupen. Institutionen för Ekonomi, Statistik och Informatik, ESI Informatik, Klientprogrammering för webbsystem, 5 poäng

ÖrebroCupen. Institutionen för Ekonomi, Statistik och Informatik, ESI Informatik, Klientprogrammering för webbsystem, 5 poäng Institutionen för Ekonomi, Statistik och Informatik, ESI Informatik, Klientprogrammering för webbsystem, 5 poäng Examinationsuppgift VT 2005 Ver 1.2 ÖrebroCupen Mathias Borg, mathias.borg@esi.oru.se Benny

Läs mer

2007-03-28. Manual för Typo3 version 4.04

2007-03-28. Manual för Typo3 version 4.04 2007-03-28 Manual för Typo3 version 4.04 1 2 Innehåll: 1. Allmänt 4 2. Grunderna i Typo3 5 2.1 Knappar 5 2.2 Inloggning 5 2.3 Den inledande vyn 6 2.4 Sidträdet 7 3. Sidor 8 3.1 Skapa en ny sida 8 3.2 Redigera

Läs mer

Vill du läsa mer om kurserna kan du hitta fullständiga kursplaner på Skolverkets hemsida.

Vill du läsa mer om kurserna kan du hitta fullständiga kursplaner på Skolverkets hemsida. Kursbeskrivningar Vill du läsa mer om kurserna kan du hitta fullständiga kursplaner på Skolverkets hemsida. http://www.skolverket.se/laroplaner-amnen-och-kurser/gymnasieutbildning/gymnasieskola/sok-amnen-kurser-och-program

Läs mer

Labora&on 4 CSS och validering samt fråga D övningar/uppgi?er

Labora&on 4 CSS och validering samt fråga D övningar/uppgi?er Labora&on 4 CSS och validering samt fråga D övningar/uppgi?er 1M321 Webbteknik 1, 7,5hp Medieteknik 2017 Rune Körnefors rune.kornefors@lnu.se 1. Ladda ner arbetsdokument och skapa en mapp för U2 Till övningarna

Läs mer

- - - W e b d e s i g n s k o l a n - - - B i l d e r

- - - W e b d e s i g n s k o l a n - - - B i l d e r skriv ut» B i l d e r Att använda bilder kan vara ett sätt att lyfta fram ett skrivet budskap eller helt enkelt för att göra webplatsen mer attraktiv och lättnavigerad. Bilder skapar du själv i ett bildbehandlingsprogram

Läs mer

Kursplanering Utveckling av webbapplikationer

Kursplanering Utveckling av webbapplikationer Kursplanering Utveckling av webbapplikationer Fakta Ämne Programmering Poäng 40 Yh-poäng Kurskod YSYS-WEB Klass Systemutvecklare.NET Syfte och koppling till yrkesrollen För att kunna arbeta som systemutvecklare

Läs mer

725G61 - Laboration 7 Implementation av ett API. Johan Falkenjack

725G61 - Laboration 7 Implementation av ett API. Johan Falkenjack 725G61 - Laboration 7 Implementation av ett API Johan Falkenjack December 13, 2013 1 Inledning Hittills i kursen har vi tittat på grundläggande programmering och grundläggande objektorientering. I den

Läs mer

Utveckling av webbapplikationer med.net, DVA213 (1 av 5)

Utveckling av webbapplikationer med.net, DVA213 (1 av 5) Utveckling av webbapplikationer med.net, DVA213 (1 av 5) TENTAMEN Utveckling av webbapplikationer med.net, DVA213, 15/08/12 kl. 8:10-12:30 Ansvariga lärare: Afshin Ameri, Dag Nyström Max poäng: 60p Betygsgränser:

Läs mer

Checklista med Tips & råd för din webbplats

Checklista med Tips & råd för din webbplats Checklista med Tips & råd för din webbplats Din hemsida är navet i din marknadsföring. Den ska visa vem du är, vad du erbjuder och hur just du kan lösa dina kunders problem och den ska hjälpa dig sälja

Läs mer

SÄTT DIG NER, 1. KOLLA PLANERINGEN 2. TITTA I DITT SKRIVHÄFTE.

SÄTT DIG NER, 1. KOLLA PLANERINGEN 2. TITTA I DITT SKRIVHÄFTE. SÄTT DIG NER, 1. KOLLA PLANERINGEN 2. TITTA I DITT SKRIVHÄFTE. Vad gjorde vi förra gången? Har du några frågor från föregående lektion? 3. titta i ditt läromedel (boken) Vad ska vi göra idag? Optik och

Läs mer

Riktlinjer för Verksamhetsförlagd utbildning inom. Förskollärarutbildningen. UVK3: Specialpedagogik VT 15

Riktlinjer för Verksamhetsförlagd utbildning inom. Förskollärarutbildningen. UVK3: Specialpedagogik VT 15 Riktlinjer för VFU3 150113 Yvonne P Hildingsson, VFU ledare Förskola Riktlinjer för Verksamhetsförlagd utbildning inom Förskollärarutbildningen UVK3: Specialpedagogik VT 15 Yvonne P Hildingsson yvhi@hh.se

Läs mer

Utvärdering av föräldrakurs hösten 2013

Utvärdering av föräldrakurs hösten 2013 Utvärdering av föräldrakurs hösten 2013 - Har du verktyg för att bemöta din oroliga och nedstämda tonåring? Föräldrakursen oro/nedstämdhet är ett samarbete mellan Råd & stöd, Gamla Uppsala familjeenhet

Läs mer

Laboration med Internet och HTML

Laboration med Internet och HTML Laboration med Internet och HTML Denna laboration går ut på att du skall kunna skapa enkla hemsidor i HTML. Vi kommer inte att ta upp edstorer för hemsidor som t.ex. DreamWeaver eller FrontPage. Dessa

Läs mer

Labora&on 6 CSS och responsiv webbdesign övningar/uppgi:er

Labora&on 6 CSS och responsiv webbdesign övningar/uppgi:er Labora&on 6 CSS och responsiv webbdesign övningar/uppgi:er 1M321 Webbteknik 1, 7,5hp Medieteknik 2016 Rune Körnefors rune.kornefors@lnu.se 1. Ladda ner arbetsdokument Till övningarna i denna labora&on

Läs mer

Blogga med wordpress. Lina Tannerfalk Wiberg

Blogga med wordpress. Lina Tannerfalk Wiberg Blogga med wordpress Lina Tannerfalk Wiberg Blogga med Wordpress Varför blogga i skolan? - öka antalet mottagare för elevernas arbete. - förmågan att kommunicera tränas och utvecklas. - otaliga användningsområden,

Läs mer

Laborationer i kursmomentet Datoranvändning E1. Laboration nr 5: Mer om FrameMaker

Laborationer i kursmomentet Datoranvändning E1. Laboration nr 5: Mer om FrameMaker Sid 1 Laborationer i kursmomentet Datoranvändning E1 http://www.etek.chalmers.se/~hallgren/eda/ : Mer om FrameMaker 1996, 1997 Magnus Bondesson 1998 och 99-09-22 Thomas Hallgren 1 Introduktion I Laboration

Läs mer

Administration - Skapa och administrera användare. Din roll som administratör 1. Meny och huvudfunktioner 2-4. Skapa en användare...

Administration - Skapa och administrera användare. Din roll som administratör 1. Meny och huvudfunktioner 2-4. Skapa en användare... myschenker.se Administration - Skapa och administrera användare Din roll som administratör 1 Meny och huvudfunktioner 2-4 Skapa en användare.... 5-8 Lägga till/ta bort kundnummer och e-tjänster för användare..

Läs mer

Repetition. Hypertext. Internet HTTP. Server och klient Text försedd med länkar till andra texter. Många sammankopplade nät

Repetition. Hypertext. Internet HTTP. Server och klient Text försedd med länkar till andra texter. Många sammankopplade nät Repetition Internet Hypertext Server och klient Föreläsning 2 HTTP HTML Internet Hypertext Många sammankopplade nät Text försedd med länkar till andra texter Gemensamma adresser T ex 10.10.0.1 Gemensamma

Läs mer

Repetition. Hypertext. Internet HTTP. Server och klient Föreläsning 2. Text försedd med länkar till andra texter. Många sammankopplade nät

Repetition. Hypertext. Internet HTTP. Server och klient Föreläsning 2. Text försedd med länkar till andra texter. Många sammankopplade nät Repetition Föreläsning 2 Internet Hypertext Server och klient HTTP HTML Internet Många sammankopplade nät Gemensamma adresser T ex 10.10.0.1 Gemensamma protokoll Protokoll = regler och algoritmer för kommunikation

Läs mer

Sammanställning av studerandeprocessundersökning GR, hösten 2010

Sammanställning av studerandeprocessundersökning GR, hösten 2010 Sammanställning av studerandeprocessundersökning GR, hösten 2010 Utbildningsanordnare: NTI Utbildning: El (2 starter) och El-automation (3 starter) Antal utskick: 69 Antal svar: 22 Svarsfrekvens: 32% Här

Läs mer

Studiehandledning. MTA102, Cad inom Robotiken, 7,5 hp 1 2016-01-17

Studiehandledning. MTA102, Cad inom Robotiken, 7,5 hp 1 2016-01-17 Studiehandledning MTA102, Cad inom Robotiken, 7,5 hp 1 2016-01-17 Välkommen till kursen! Du som tänker läsa kursen läser till Civilingenjör inom robotik. Normalt läser du kursen under ditt första år. Dessa

Läs mer

En liten introduktion till SLI Community

En liten introduktion till SLI Community En liten introduktion till SLI Community Välkommen till SLI Community! Ta dig gärna lite tid och läsa igenom den här introduktionen (många sidor, men det tar inte många minuter) så tror vi att du enklare

Läs mer

Övning (X)HTML 2. Sidan 1 av 7 2010-11-11

Övning (X)HTML 2. Sidan 1 av 7 2010-11-11 Sidan 1 av 7 2010-11-11 Övning (X)HTML 2 Innan du börjar med laborationen ska du se till så att du har öppnat din editor (till exempel Notepad++). I denna editor ska du skriva (X)HTML-kod som du sedan

Läs mer

Kursprogram Golfträning 2014

Kursprogram Golfträning 2014 Kursprogram Golfträning 2014 Välkommen till årets kursprogram på Åda Golf & Country Club. Jag hoppas programmet kommer att inspirera dig till att börja träna golf och att du tar chansen att tillsammans

Läs mer

Webbprogrammering 725G54

Webbprogrammering 725G54 Webbprogrammering 725G54 Hej! Jakob Bandelin, gästadjunkt jakob.bandelin@liu.se Interaktionsdesign, webbdesign, apputveckling Agenda Kursmål och -upplägg HTML Teckenkodning Validering Lab 1. Kursmål exemplifiera

Läs mer

Appar eller mobilwebb? Vad är bäst för bibliotekets tjänster?

Appar eller mobilwebb? Vad är bäst för bibliotekets tjänster? Appar eller mobilwebb? Vad är bäst för bibliotekets tjänster? Ahmet Kurt, NSB, juni 2011 Mobiltätheten exploderar bland befolkningen. Mobilen har man alltid tillgänglig, utan lång starttid. Just nu (2011)

Läs mer

Kursutvärdering Ämne: SO Lärare: Esa Seppälä/Cecilia Enoksson Läsåret 12-13 Klass: SPR2

Kursutvärdering Ämne: SO Lärare: Esa Seppälä/Cecilia Enoksson Läsåret 12-13 Klass: SPR2 8 Mycket bra Bra Dåligt Mycket dåligt EAS 1. Hur var ditt första intryck av denna kurs? Mycket bra 6 21 Bra 21 75 Dåligt - - Mycket dåligt 1 4 EAS - - Antal EAS:. Antal svarande: 28. Mv: (Skala 1) = 78,57

Läs mer

[Plats för ev. illustration] Projektrapport inom Datateknik, Webbanvändbarhet, 7,5 poäng. Webbplats. Bergsåkers Pensionärers Biljardklubb

[Plats för ev. illustration] Projektrapport inom Datateknik, Webbanvändbarhet, 7,5 poäng. Webbplats. Bergsåkers Pensionärers Biljardklubb MITTUNIVERSITETET Institutionen för informationsteknologi och medier (ITM) Lärare: Mikael Hasselmalm, Mattias Dahlgren Författarens e-postadress: mawe0507@student.miun.se Utbildningsprogram: Webbutveckling,

Läs mer

Laboration 2 Grunderna i Photoshop

Laboration 2 Grunderna i Photoshop Mitthögskolan Institutionen för Informationsteknologi och medier. Jan-Erik Jonsson 060-14 87 90 Laboration 2 Grunderna i Photoshop Interaktiva multimedier v1.0 2001-11-27 lab_2.doc Sida 2/5 Allmänt Materialet

Läs mer

När du nu förberett medarbetarens utvecklingssamtal i Bisnode People är det dags att planera själva samtalet.

När du nu förberett medarbetarens utvecklingssamtal i Bisnode People är det dags att planera själva samtalet. Inledning När du nu förberett medarbetarens utvecklingssamtal i Bisnode People är det dags att planera själva samtalet. Den här lektionen beskriver hur du har ett coachande förhållningssätt i utvecklingssamtalet

Läs mer

Barn på sjukhus FÖRBEREDELSETIPS FRÅN BARN- OCH UNGDOMSSJUKVÅRDEN, SUS

Barn på sjukhus FÖRBEREDELSETIPS FRÅN BARN- OCH UNGDOMSSJUKVÅRDEN, SUS Barn på sjukhus FÖRBEREDELSETIPS FRÅN BARN- OCH UNGDOMSSJUKVÅRDEN, SUS Du är tryggheten Att vara ett stöd och en lugn, trygg punkt för ditt barn är om möjligt ännu viktigare när barnet hamnar på sjukhus.

Läs mer

Enkel Digital Skyltning. på några minuter...

Enkel Digital Skyltning. på några minuter... Enkel Digital Skyltning på några minuter... Enkel Digital Skyltning 105mm i litet format... Det finns enkel digital skyltning, med enkla genomtänkta system... Paketen Vi har tagit fram tre färdiga paket

Läs mer

ElevkårENS. - Motionsguide -

ElevkårENS. - Motionsguide - ElevkårENS Årsmöte - Motionsguide - 2015 Motionsguide Vad är en motion? En motion är ett förslag från en medlem om att ändra något inom elevkårens organisation, lägga till något som ska genomföras eller

Läs mer

[MANUAL TILL LUVITS GRUNDFUNKTIONER]

[MANUAL TILL LUVITS GRUNDFUNKTIONER] 2011 Eslövs kommun Gymnasie- och Vuxenutbildningsförvaltningen [MANUAL TILL LUVITS GRUNDFUNKTIONER] Manualen vänder sig till dig som är studerande vid Yrkeshögskolan, Komvux, Sfi, Särvux, Gymnasiet och

Läs mer

Ändra, kopiera eller radera publikation (staff)

Ändra, kopiera eller radera publikation (staff) Ändra, kopiera eller radera publikation (staff) ändra, ladda upp fil i efterhand, kopiera eller radera publikationer i DiVA Om du är forskare/anställd och inloggad som staff i DiVA kan du ändra eller radera

Läs mer

Elisabeth Bejefalk IT-Assistent Avesta kommun

Elisabeth Bejefalk IT-Assistent Avesta kommun Elisabeth Bejefalk IT-Assistent Avesta kommun Du ska nu få lära dig hur du enkelt kan göra ett bildspel i PowerPoint. Utifrån det du snart har lärt dig kan du sen göra mer avancerade bildspel genom att

Läs mer

Lektion 2 - CSS. CSS - Fortsätt så här

Lektion 2 - CSS. CSS - Fortsätt så här Lektion 2 - CSS I den här lektionen behandlas HTML och CSS. Det förutsätts att lektion 1 är gjord, eller att du har tillräckliga kunskaper i grundläggande HTML för att klara den här lektionen. CSS - Fortsätt

Läs mer

RealPresence Desktop 3.1

RealPresence Desktop 3.1 RealPresence Desktop 3.1 Arbetsplats: Länsteknik Sunderby Sjukhus Sida 2 (11) RealPresence Desktop Vi uppgraderar nu den befintliga klienten för videokonferens från CMA-Desktop till RealPresence-Desktop.

Läs mer

F07 Stilmallar Dagens agenda

F07 Stilmallar Dagens agenda F07 Stilmallar Dagens agenda CSS, Stilmallar Lokala, interna, externa Selektorer - Taggselektorer - Klasselektorer - ID-selektorer Egenskapsarv Pseudo-klasser och element Kombinatorer Specificitet Stilmallar

Läs mer

Introduktion till Blästadsgatans diskussionsforum. Inledning. Layout ej inloggat läge

Introduktion till Blästadsgatans diskussionsforum. Inledning. Layout ej inloggat läge Introduktion till Blästadsgatans diskussionsforum Inledning Som en del av vår webbplats, blastadsgatan.se, finns ett diskussionsforum. Tanken med forumet är att det ska fungera som en diskussionsplats

Läs mer

Komma igång med Widgit Online

Komma igång med Widgit Online Komma igång med Widgit Online Innehåll 1. Logga in 2. Hitta i Widgit Online 3. Skapa ett dokument 4. Skapa ett rutnät 5. Kontakta oss Hej! Den här guiden bör ge dig den information du behöver för att börja

Läs mer

ANSÖKAN OM VALIDERING INOM LÄRARLYFTET VT15

ANSÖKAN OM VALIDERING INOM LÄRARLYFTET VT15 ANSÖKAN OM VALIDERING INOM LÄRARLYFTET VT15 Du som antagits till en kurs inom Lärarlyftet VT15 har möjlighet att ansöka om validering av dina kunskaper och färdigheter i relation till kursens lärandemål.

Läs mer

DK-serien. Gör en fotobok med myphotobook.se

DK-serien. Gör en fotobok med myphotobook.se DK-serien Gör en fotobok med myphotobook.se 1 Gör din egen fotobok Den här kursen är gjord för dig som vill vara lite kreativ med dina digitala bilder. Här lär du dig att göra en personlig fotobok där

Läs mer

Val inför årskurs 2 & 3. Naturvetenskapsprogrammet 13 januari 2016

Val inför årskurs 2 & 3. Naturvetenskapsprogrammet 13 januari 2016 Val inför årskurs 2 & 3 Naturvetenskapsprogrammet 13 januari 2016 Din framtid Studera? Jobba? Resa? Praktik? Utomlandsstudier? Hur tänker du? Du har möjlighet att välja själv Individuell studieplan Ansvaret

Läs mer

Web Service Index 2014. Information & Service. www.fysioterapeuterna.se

Web Service Index 2014. Information & Service. www.fysioterapeuterna.se Web Service Index 2014 Information & Service www.fysioterapeuterna.se Om undersökningen Här kommer Ditt Web Service Index. Med Web Service Index får Du insyn i vad just Dina besökare tycker om Din Webbplats.

Läs mer

Clicker 5. Lathund kring de vanligaste och mest grundläggande funktionerna för att komma igång med Clicker. Habilitering & Hjälpmedel

Clicker 5. Lathund kring de vanligaste och mest grundläggande funktionerna för att komma igång med Clicker. Habilitering & Hjälpmedel Clicker 5 Lathund kring de vanligaste och mest grundläggande funktionerna för att komma igång med Clicker. Habilitering & Hjälpmedel Vad är Clicker 5? Clicker 5 är ett stöd till personer i behov av extra

Läs mer

Några övningar att göra

Några övningar att göra Några övningar att göra Dagens kort Du ber om ett kort som kan vägleda och hjälpa dig genom dagen. Kortet beskriver hur du kan förhålla dig till dagen eller om du ska tänka på något speciellt idag. Drar

Läs mer

Manual för version V2

Manual för version V2 Innehållsförteckning 1. Om 2. Installera Administration 3. Programmets skrivbord 4. Lägga upp din första kund 5. Kontaktpersoner 6. Besiktningsadresser 7. Kontrollpunkter/Besiktningspunkter 8. Koppla kontrollpunkter/besiktningspunkter

Läs mer

INTRODUKTION TILL AM SYSTEM. en molntjänst för kvalitetsledning

INTRODUKTION TILL AM SYSTEM. en molntjänst för kvalitetsledning INTRODUKTION TILL AM SYSTEM en molntjänst för kvalitetsledning INTRO TILL AM SYSTEM - ÖVERBLICK Vad är AM System? Argument för AM System AM Systems referenser Vilka ligger bakom? Mer om Ärende Så kommer

Läs mer

Bedömningsuppgifter: Skriftligt prov Vatten och Luft Vattentornet (modell och ritning) Scratch (program)

Bedömningsuppgifter: Skriftligt prov Vatten och Luft Vattentornet (modell och ritning) Scratch (program) Planering Tema Vatten Vatten och luft är en självklarhet för oss i Sverige. När vi vrider på kranen kommer det rent vatten och vi andas relativt ren luft. Men vad är vatten egentligen och vilka former

Läs mer