2I1073 Föreläsning 1. HTML och XHTML XHTML

Save this PDF as:
 WORD  PNG  TXT  JPG

Storlek: px
Starta visningen från sidan:

Download "2I1073 Föreläsning 1. HTML och XHTML XHTML"

Transkript

1 2I1073 Föreläsning 1 XHTML, stilmallar och Javascript 1 KTH-MI Peter Mozelius HTML och XHTML HyperText Markup Language Element = taggar + taggarnas innehåll <h3> innehåller lite text</h3> taggarna kan även ha attribut <tagg attribut= värde > HTML + XML = XHTML 2 XHTML Alla taggar ska skrivas med gemener Krav på perfekt nästling: <h1><b>medicinsk informatik</b></h1> INTE <h1><b>medicinsk informatik</h1></b> Validatorer för att kontrollera syntaxen 3 1

2 Stilsättning med CSS Innehållet i en XHTML-fil Stilsättningen som ett CSS Cascading Style Sheet Separera stilsättningen från innehållet CSS i en egen fil som länkas in <link href="./lektion1b.css" rel="stylesheet" type="text/css" /> 4 Stilsättning med CSS Det går att åstadkomma många både vackra och hemska effekter med färger och bilder Ett allmänt råd är att ofta hålla igen på t ex antalet färger på en hemsida. Vilka färger passar tillsammans? Det viktigaste på en hemsida är väldigt ofta att formatera texten så att den är lätt att läsa 5 Textformatering från CSS Det finns massor av textegenskaper som går att styra från en stilmall. Några av de absolut viktigaste är: Teckengrad Teckensnitt Radlängd Textens färg Bakgrundsfärg 6 2

3 XHTML- listor Ordnade listor <ol> de ingående objekten är numrerade Oordnade listor <ul> de ingående objekten är INTE numrerade Båda varianterna använder <li> </li> Definitionslistor <dl> Använder <dt> och <dd> 7 Nästlade listor Hur är detta nästlat? 8 Navigationslistor Nytt i XHTML <nl> <label>kända programmerare</label> <li href="#intro">allmän översikt</li> <li> <nl> <label>kända personligheter</label> <li href="#ada">ada Lovelace</li> <li href="#billy">billy Joy</li> </nl> </li> <li href="#spel">spelprogrammering</li> <li href="#os">operativsystem</li> </nl> 3

4 XHTML- tabeller Tabellstruktur i XHTML <table> <tr> <td> data </td> </tr> </table> <caption> <thead> <tbody> <tfoot> 10 XHTML- tabeller Tabellformatering i CSS color: green; background-color: white; border-style: solid; border-width: 4px; Attributet rules för linjer mellan cellerna rows, cols, all, none XHTML- tabeller caption thead tbody 12 tfoot 4

5 IV1006/2I1073 Föreläsning1 13 Bilder i XHTML XHTML < 2 <img id="bild" src= bild.jpg" alt= Bild på en hund" width="152" height="160" /> XHTML >= 2 <object id="bild" type="image/jpeg" data="bild.jpg" width="152" height="160"> <p>bild på en hund</p> </object> 14 Bildformat för nätet Punktgrafik (bitmap) GIF JPEG - JPEG2000 PNG Vektorgrafik SVG (Scalable Vector Graphics) 15 5

6 Bildbehandling Två program som finns i IT-Forum: GIMP Photoshop Kom igång med GIMP: mp_start.php Komigångövningar för Photoshop: 16 Javascript Ett interpreterat skriptspråk Objektbaserat men INTE objektorienterat Används på klientsidan för t ex: animeringar beräkningar datavalidering styrning av SVG 17 Javascript Syntaxen är väldigt lik Java MEN, det finns mycket som skiljer Svag typning till skillnad från Java Objekt och metoder document write() 18 6

7 Javascript inne i XHTML <html> <head> <title>2i1073 Javascript 1</title> </head> <body> <script language= JavaScript type= text/javascript > document.write( Hej KTH-MI! ); </script> </body> </html> 19 Javascript inlänkat från fil Det blir lätt grötigt och svårläst om allt ligger i samma fil. Lägg Javascriptet i en egen fil och länka in i XHTML-filen <script type="text/javascript" src="lektion1c.js"> </script> Skriptet ligger i filen: lektion1c.js 20 Model - View - Controller MVC en vanlig bra princip som vi tidigare har pratat om för javaprogrammering Ett annat exempel på MVC är Model = innehållet/xhtml-filen View = stilsättningen/css-filen Controller = javaskriptet Håll sakerna separerade i olika filer 21 7

8 FTP Ett protokoll för att flytta filer via Internet Används inte lika mycket nu som för 10 eller 20 år sedan Här på 2I1073/IV1006 ska ni lägga upp era lösningar av uppgifterna på valfri server med valfri FTP-klient FTP SFTP 22 SFTP och WinSCP SFTP = Secure File Transfer Protocol 23 Första delens laborationer Uppgift1a: Bygg en redovisningssida i XHTML Uppgift1b: Stilsätt sidan med ett validerat CSS Uppgift1c: Lägg in bilder, listor och tabeller Uppgift1d: Flytta över resultatet till ditt konto Uppgift1e: Grundläggande Javascript Uppgift1f: Frivillig fördjupning i Javascript Uppgift1g: Frivillig fördjupning i Javascript 24 8

9 Samtliga laborationer Uppgifterna är tänkta som träning och stöd för ert projektarbete som ska bygga på teknikerna i lösningarna till laborationerna Handledningen ger huvudsakligen hjälp och tips för lösningar till de obligatoriska labbarna Allmänna frågor i First Class Så även frågor om de frivilliga uppgifterna Kurshemsidan: 25 Apache Tomcat Om du sedan tidigare är van att jobba med de tekniker som jag har tagit upp här idag och snabbt blir klar med första delens övningar: Starta upp er Apache Tomcat: XHTML Quiz: 26 Vi ses igen efter lunch! 9

ITK:P2 F1. Hemsidor med HTML HTML. FTP, HTTP, HTML, XML och XHTML

ITK:P2 F1. Hemsidor med HTML HTML. FTP, HTTP, HTML, XML och XHTML ITK:P2 F1 FTP, HTTP, HTML, XML och XHTML DSV Peter Mozelius 1 Hemsidor med HTML Hur många av er har provat på att bygga en egen hemsida med HTML eller XHTML? För hand eller med hjälpverktyg? Har ni lagt

Läs mer

1 Se till att dokumentet C:\Webbkurs\html\pronto\index4.html är öppet i Anteckningar.

1 Se till att dokumentet C:\Webbkurs\html\pronto\index4.html är öppet i Anteckningar. Grundläggande HTML 9 Listor Listor kan komma väl till pass när kortfattad information ska presenteras på ett lättöverskådligt sätt. I HTML kan du skapa flera olika typer av listor; numrerade listor och

Läs mer

INT 3 F3. En texts läsbarhet. Teckensnitt. Medieteknik Del1. Färger, teckensnitt och bildformat

INT 3 F3. En texts läsbarhet. Teckensnitt. Medieteknik Del1. Färger, teckensnitt och bildformat INT 3 F3 Medieteknik Del1 Färger, teckensnitt och bildformat DSV Peter Mozelius En texts läsbarhet Teckensnitt Teckengrad Radlängd Radavstånd Papper/Skärm Bakgrundsfärg Teckensnitt Teckensnitt kan delas

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

IT för personligt arbete F6

IT för personligt arbete F6 IT för personligt arbete F6 Datalogi del 2 DSV Peter Mozelius Datarepresentation Det som lagras i en dator representeras i grunden som 1:or och 0:or Dessa binära värden kan sedan tolkas på olika sätt i

Läs mer

Programmeringteknik. Planering 2014-05-12 MÅL LABB: MOMENT LAB4 HTML - EXEMPEL HTML. Webbdelen

Programmeringteknik. Planering 2014-05-12 MÅL LABB: MOMENT LAB4 HTML - EXEMPEL HTML. Webbdelen MÅL Programmeringteknik Webbdelen Efter webbmomentet ska du: kunna använda ett tiotal kommandon i: HTML (göra webbsidor) CSS (webbsidans utseende) Javascript (programmering - klienten) PHP (programmering

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

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

Hur hänger det ihop? För att kunna kommunicera krävs ett protokoll tcp/ip, http, ftp För att veta var man skall skicka

Hur hänger det ihop? För att kunna kommunicera krävs ett protokoll tcp/ip, http, ftp För att veta var man skall skicka Webben som verktyg Idag: Hur hänger det ihop? Viktiga tekniker Stegen i ett webbprojekt Verktyg Dreamweaver Photoshop Joomla CMS Storyboard och flödesschema Fixa webbhotell Hur hänger det ihop? För att

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

Att berätta med webb + En introduktion till HTML

Att berätta med webb + En introduktion till HTML Att berätta med webb + En introduktion till HTML Vad är en bra historia? Uppbyggnad En serie handlingar/händelser som tillsammans bildar en enhet Budskap Produkt Bra, användarvänlig, lättförståelig, etc.

Läs mer

En snabb titt på XML LEKTION 6

En snabb titt på XML LEKTION 6 LEKTION 6 En snabb titt på XML Bokstaven x i Ajax står för XML, ett mycket användbart beskrivningsspråk som gör det möjligt för Ajax-tillämpningar att hantera komplex strukturerad information. I den här

Läs mer

IT för personligt arbete F2

IT för personligt arbete F2 IT för personligt arbete F2 Nätverk och Kommunikation DSV Peter Mozelius Kommunikation i nätverk The Network is the Computer Allt fler datorer är sammankopplade i olika typer av nätverk En dators funktionalitet

Läs mer

JAVASCRIPT. Beteende

JAVASCRIPT. Beteende JAVASCRIPT Beteende OVERVIEW HTML Formulär JavaScript Syntax Events DOM Validering av fomulär WEBBPROGRAMMERING PÅ KLIENTSIDAN Skriptspråk som körs på klientsidan (klientskript) Koden exekveras i webbläsaren

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

CSS-övningar. 1. Grunder

CSS-övningar. 1. Grunder CSS-övningar 1. Grunder CSS Testa stilmallar Klasser Elementen div och span Ärvda egenskaper Mer om typsnitt, marginaler och mått Textdekor Fristående CSS -fil Attributet style Prioritetsordning hos stilelement

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

Övningar i kursen Webbdesign 100p

Övningar i kursen Webbdesign 100p Övningar i kursen Webbdesign 100p Innehåll ÖVNINGAR I KURSEN WEBBDESIGN 100P... 1 INLEDNING OCH HISTORIA... 7 ORDNA EGET HEMSIDEUTRYMME... 7 1. HEMSIDOR MED HTML... 8 MÄRKEN I VÅR FÖRSTA HEMSIDA... 8 ATTRIBUT,

Läs mer

Webbpublicering. Teknikintroduktion 1 Jody Foo (jodfo@ida.liu.se)

Webbpublicering. Teknikintroduktion 1 Jody Foo (jodfo@ida.liu.se) Webbpublicering Teknikintroduktion 1 Jody Foo (jodfo@ida.liu.se) Föreläsningsöversikt Föreläsning 1 Vad är webbpublicering? Lite historia - Internet och webben Statiska webbplatser Grundkoncept: webbläsare,

Läs mer

ORDLISTA WEBBDESIGN 100P

ORDLISTA WEBBDESIGN 100P ORDLISTA WEBBDESIGN 100P HTML- TAGGAR M.M. (DE BLÅFÄRGADE ORDEN ÄR OLIKA ATTRIBUT SOM HÖR TILL DE OLIKA TAGGARNA.) HTML Står för Hyper Text Markup Language och är en uppsättning markeringskoder.

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

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

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

DOM (Document Object Model) är modellen efter vilken en webbläsaren är uppbyggd. Alla objekt/element i webbläsaren finns hierarkiskt ordnade i DOM.

DOM (Document Object Model) är modellen efter vilken en webbläsaren är uppbyggd. Alla objekt/element i webbläsaren finns hierarkiskt ordnade i DOM. JavaScript del1 Syftet med detta häfte är att sammanfatta det viktigaste i JavaScript så kort och koncist som möjligt men ändå tillräckligt omfattande för att ge god kännedom om en av de vanligaste teknikerna

Läs mer

F12 Mobila enheter Dagens agenda

F12 Mobila enheter Dagens agenda F12 Mobila enheter Dagens agenda Tekniker för mobil surfning Möjligheter och fallgropar Statistik Opera Sidor för smartphones Testning Responsiv webbdesign... Olika tekniker Det finns/fanns många olika

Läs mer

Hantera informationspaket i system för bevarande

Hantera informationspaket i system för bevarande Kompetensutveckling har erbjudits deltagare inom projektet Elektroniskt bevarande i form av en kurs i XML. Kursen har genomförts av Riksarkivet och haft en praktisk inriktning. Ett 10-tal personer deltog

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

Internet och WWW Laboration 3 VT10 Högskolan Dalarna Hans Rosendahl. Laboration 3 CSS del 2. 1 av 20

Internet och WWW Laboration 3 VT10 Högskolan Dalarna Hans Rosendahl. Laboration 3 CSS del 2. 1 av 20 Laboration 3 CSS del 2 1 av 20 Vad kommer jag att lära mig på laboration 3? 1. Skriva en stilmall Boxegenskaper o border o margin o padding o width o float o clear Färger och bakgrundsbilder Positionering

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

GRUNDEN STRUKTURELLA DEFINITIONER FORMELLA DEKORATIONER. Dokumenttyp <HTML></HTML> (start och slut på fil)

GRUNDEN STRUKTURELLA DEFINITIONER FORMELLA DEKORATIONER. Dokumenttyp <HTML></HTML> (start och slut på fil) HTML-TAGGAR Grunden sida 1 Strukturella definitioner sida 1 Formella dekorationer sida 1 Länkar och grafik sida 2 Textindelning sida 3 Listor sida 3 Bakgrunder och färger sida 4 Särskilda tecken sida 4

Läs mer

Webbteknik för ingenjörer

Webbteknik för ingenjörer Institutionen för 2015-01-22 Tillämpad fysik och elektronik Karin Fahlquist Webbteknik för ingenjörer HTML5 & CSS laboration Målsättning Att skapa en webbplats utifrån en Lo-fi prototyp och implementera

Läs mer

Namn: (Ifylles av student) Personnummer: Tentamensdatum: 2013-03-25 Tid: 14.00 19.00. Hjälpmedel: Inga hjälpmedel

Namn: (Ifylles av student) Personnummer: Tentamensdatum: 2013-03-25 Tid: 14.00 19.00. Hjälpmedel: Inga hjälpmedel Webbprogrammering Provmoment: Ladokkod: Tentamen ges för: Tentamen NWP011 Systemarkitektprogrammet 7,5 högskolepoäng Namn: (Ifylles av student) Personnummer: (Ifylles av student) Tentamensdatum: 2013-03-25

Läs mer

Webbdesign vt. 2010. Innehållsförteckning

Webbdesign vt. 2010. Innehållsförteckning Webbdesign vt. 2010 mångar: Kl. 8:30 12:00 Innehållsförteckning 2. FTP-hur gör man? 3. Grundtaggar 5. Tabeller 6. Infoga bilder 7. Rubriker och fonter 8. Övning 1 9. Installera HTML-edit 11. Startsidans

Läs mer

Introduk+on +ll programmering i JavaScript

Introduk+on +ll programmering i JavaScript Föreläsning i webbdesign Introduk+on +ll programmering i JavaScript Rune Körnefors Medieteknik 1 2012 Rune Körnefors rune.kornefors@lnu.se Språk Naturliga språk Mänsklig kommunika+on T.ex. Svenska, engelska,

Läs mer

Webbdesign. maj 2008 Daniel Cronholm Sensus Studieförbund daniel.cronholm@gmail.com 073 600 8000

Webbdesign. maj 2008 Daniel Cronholm Sensus Studieförbund daniel.cronholm@gmail.com 073 600 8000 Webbdesign Bestäm dig för på vilket sätt du vill lära dig att göra webbsidor. Titta på de metoder som används när du kodar. Skapa en första sida med XHTML och CSS. Gör lite övningar. En sammanställning

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

www.skillspartner.com

www.skillspartner.com Mål Deltagarna ska förstå: Vad XML är Hur XML fungerar Vilka problem XML löser Hur XML används Känna till begrepp: DTD, DOM, XSL etc. Känna till verktyg Innehåll Vad är XML XML i relation till HTML XML

Läs mer

2I1073 Föreläsning 3. Säkerhet. Kryptering

2I1073 Föreläsning 3. Säkerhet. Kryptering 2I1073 Föreläsning 3 Säkerhet, filhantering och XML 1 KTH-MI Peter Mozelius Säkerhet Ökade krav på säkerhet i datasystem bl a mot Intrång Stölder Förfalskningar Virusattacker Vi ska titta på några enkla

Läs mer

729G28. Webbprogrammering och databaser. Introduktion till webbutveckling med PHP. Jakob Pogulis Institutionen för Datavetenskap (IDA)

729G28. Webbprogrammering och databaser. Introduktion till webbutveckling med PHP. Jakob Pogulis Institutionen för Datavetenskap (IDA) 729G28 Webbprogrammering och databaser Introduktion till webbutveckling med PHP Jakob Pogulis Institutionen för Datavetenskap (IDA) 729G28 Webbprogrammering och databaser Introduktion till webbutveckling

Läs mer

Att styla webbsidor. Nivå. Uppgiften

Att styla webbsidor. Nivå. Uppgiften Nivå 2 Att styla webbsidor All Code Clubs must be registered. Registered clubs appear on the map at codeclubworld.org - if your club is not on the map then visit jumpto.cc/ccwreg to register your club.

Läs mer

Elektronisk publicering TNMK30

Elektronisk publicering TNMK30 Elektronisk publicering TNMK30 Förra gången Usability & interaktionsdesign Projektintroduktion Bildbehandling. Byte av handledare Istället för Martin Johansson Annsofi Pettersson, annpe655@student.liu.se

Läs mer

Dynamisk HTML JavaScript och webbläsarens objektmodell

Dynamisk HTML JavaScript och webbläsarens objektmodell Dynamisk HTML 1 JavaScript och webbläsarens objektmodell Ove Lundgren (2009) Ove Lundgren - 1 - DOMDHTML2009.doc Innehåll Dynamisk HTML Webbläsarens variabler och metoder. Objektmodellen. Anropa metoder

Läs mer

Innehåll Introduktion... 3 InteractiveScene.config... 3 Scener <scenes>... 3 Typsnitt <fonts>... 3 Övergångar <transitions>...

Innehåll Introduktion... 3 InteractiveScene.config... 3 Scener <scenes>... 3 Typsnitt <fonts>... 3 Övergångar <transitions>... Innehåll Introduktion... 3 InteractiveScene.config... 3 Scener ... 3 Typsnitt ... 3 Övergångar ... 4 Mall för slide ... 5 , ...

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

Översikt. Installation av EasyPHP 1. Ladda ner från http://www.easyphp.org/ Jag använder Release 5.3.4.0 2. Installera EasyPHP.

Översikt. Installation av EasyPHP 1. Ladda ner från http://www.easyphp.org/ Jag använder Release 5.3.4.0 2. Installera EasyPHP. Laboration 1 Översikt 1. Att komma igång med laborationsmiljön a. installera Aptana Studio 3 b. Installera EasyPHP 2. Testa lite programmering a. Testa enkla uppgifter b. Testa automatiskt 3. Skapa inloggningsformulär

Läs mer

Webbdesign vt. 2009. Innehållsförteckning

Webbdesign vt. 2009. Innehållsförteckning Webbdesign vt. 2009 Fysiska träffar onsdagkvällar: Kl. 18:00 21:00 28/1 11/2 11/3 25/3 1/4 22/4 6/5 Innehållsförteckning 2. FTP-hur gör man? 3. Vad ska jag göra? 4. Grundtaggar 6. Tabeller 7. Infoga bilder

Läs mer

ASP.NET MVC. Copyright Mahmud Al Hakim mahmud@dynamicos.se http://www.webbacademy.se. Innehåll

ASP.NET MVC. Copyright Mahmud Al Hakim mahmud@dynamicos.se http://www.webbacademy.se. Innehåll ASP.NET MVC Copyright Mahmud Al Hakim mahmud@dynamicos.se http://www.webbacademy.se Innehåll Introduktion till MVC Controller Action-metoder Views Arbeta med Layout-sidor och sektioner Route konfiguration

Läs mer

Allmänna anvisningar: Skriv dina svar på svarsblanketten (se nästa sida) Markera och ange alla svar tydligt och entydigt efter instruktionerna.

Allmänna anvisningar: Skriv dina svar på svarsblanketten (se nästa sida) Markera och ange alla svar tydligt och entydigt efter instruktionerna. Webbprogrammering Provmoment: Ladokkod: Tentamen ges för: Om-Tentamen NWP011 Systemarkitektprogrammet 7,5 högskolepoäng Namn: (Ifylles av student) Personnummer: (Ifylles av student) Tentamensdatum: 2014-06-13

Läs mer

Innehåll. Webbproduktion. Prototyputveckling. Arbetsgång (R)

Innehåll. Webbproduktion. Prototyputveckling. Arbetsgång (R) Innehåll Webbproduktion Produktion och publicering av större webbplatser Produktion Användbarhet/Användbarhetstest Publicering Underhåll Arbetsgång (R) 1) Utred mål och syfte (verksamhets- och målgruppsanalyser)

Läs mer

Olika slags datornätverk. Föreläsning 5 Internet ARPANET, 1971. Internet började med ARPANET

Olika slags datornätverk. Föreläsning 5 Internet ARPANET, 1971. Internet började med ARPANET Olika slags datornätverk Förberedelse inför laboration 4. Historik Protokoll, / Adressering, namnservrar WWW, HTML Föreläsning 5 Internet LAN Local Area Network student.lth.se (ganska stort LAN) MAN Metropolitan

Läs mer

InkScape. Inkscape är ett gratisprogram för objektgrafik (vektorgrafik) Man använder programmet till att illustrera, rita, skapa logotyper och figurer

InkScape. Inkscape är ett gratisprogram för objektgrafik (vektorgrafik) Man använder programmet till att illustrera, rita, skapa logotyper och figurer InkScape Inkscape är ett gratisprogram för objektgrafik (vektorgrafik) Man använder programmet till att illustrera, rita, skapa logotyper och figurer Gunnar Markinhuhta ITLyftet 2012-10-09 sida 1 Med Ctrl-tangenten

Läs mer

Handbok HTML. Vi utvecklar kontinuerligt nya titlar, besök www.rxk.se för aktuell statuslista. Gör din beställning direkt i vår webbutik.

Handbok HTML. Vi utvecklar kontinuerligt nya titlar, besök www.rxk.se för aktuell statuslista. Gör din beställning direkt i vår webbutik. Handbok HTML I denna Handbok lär du dig att skapa egna hemsidor från grunden. Handboken innehåller information om hur du hanterar texter, bilder, tabeller, ramar och listor. Du får även läsa om grunderna

Läs mer

WEBBUTVECKLING Bilder

WEBBUTVECKLING Bilder Bildformat Kurskod: WEBWEU01 Kursmål: och media med alternativa format, optimering och tillgänglighet. Bildformat De bilder som används på webben är vanligtvis JPG, PNG eller GIF-bilder. Anledningen till

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

Anvisningar för ifyllning av Excelark för databaser (xml-filer)

Anvisningar för ifyllning av Excelark för databaser (xml-filer) 2009-10-09 (reviderad 2011-01-04, 2011-02-14, 2011-10-20, 2012-09-17) Riksarkivet IT-avdelningen Anvisningar för ifyllning av Excelark för databaser (xml-filer) 1 Anvisningar för ifyllning av Excelark

Läs mer

TDDD52 CSS. Färger. Färger 1/3/13

TDDD52 CSS. Färger. Färger 1/3/13 Jag önskar göra det lä0are för användarna genom a0 markera vissa delar med en annan färg? HTML är bra, men det är inte så snyggt? TDDD52 - CSS CSS regler och selectors gör a0 jag kan styla min HTML precis

Läs mer

Labora&on 7 Syfte med laborationen:

Labora&on 7 Syfte med laborationen: Labora&on 7 Syfte med laborationen: - att förstå enkel 7ilhantering i PHP - att repetera grundläggande PHP- begrepp såsom loopar, arrayer, stränghantering och formulär. VIKTIGT: uppgift 3-5 är repetitionsuppgifter

Läs mer

Dagens föreläsningar

Dagens föreläsningar Webuppgift Dagens föreläsningar HTTP och hur kontakten sker mellan klient och server. Apache-servern HTML. Exekvera Pythonscript. Formulär. Model-View-Controller på webben. CSS. Presentation av uppgiften.

Läs mer

Undervisningen ska ge eleverna tillfälle att arbeta i projekt samt möjlighet att utveckla kunskaper om projektarbete och dess olika faser.

Undervisningen ska ge eleverna tillfälle att arbeta i projekt samt möjlighet att utveckla kunskaper om projektarbete och dess olika faser. WEBBTEKNIK Webbteknik används för att utveckla och vidareutveckla statiska och dynamiska webbsidor, webbplatser, webbapplikationer eller andra applikationer där webbtekniker används, till exempel applikationer

Läs mer

WD406F - Interaktiva medier I 7,5hp Moment: Web Usability Inlämningsuppgift 1ab. Wynona Ekesrydh 2010-12-13

WD406F - Interaktiva medier I 7,5hp Moment: Web Usability Inlämningsuppgift 1ab. Wynona Ekesrydh 2010-12-13 Här följer min reflektion över innehållet i Jonathan Lazars bok Web Usability, kapitel 1 2, 6 7. Webbanvändbarhet För att infrastrukturen ska fungera behövs system som på ett enkelt och effektivt sätt

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

Nätet. Uppgiften. Nivå

Nätet. Uppgiften. Nivå Nivå 1 Nätet All Code Clubs must be registered. Registered clubs appear on the map at codeclubworld.org - if your club is not on the map then visit jumpto.cc/ccwreg to register your club. Uppgiften Har

Läs mer

Inför prov 1 i webbdesign

Inför prov 1 i webbdesign Inför prov 1 i webbdesign Skapa ett grundläggande HTML-dokument sidtitel övriga instruktioner Grundläggande märken, samt hur de används startmärke

Läs mer

Grundläggande datavetenskap, 4p

Grundläggande datavetenskap, 4p Grundläggande datavetenskap, 4p Kapitel 4 Nätverk och Internet Utgående från boken Computer Science av: J. Glenn Brookshear 2004-11-23 IT och medier 1 Innehåll Nätverk Benämningar Topologier Sammankoppling

Läs mer

2009-10-09 (reviderad 2011-01-04, 2011-02-14, 2012-09-17) Riksarkivet IT-avdelningen. Anvisningar för ifyllning av Excelark för webbleveranser

2009-10-09 (reviderad 2011-01-04, 2011-02-14, 2012-09-17) Riksarkivet IT-avdelningen. Anvisningar för ifyllning av Excelark för webbleveranser 2009-10-09 (reviderad 2011-01-04, 2011-02-14, 2012-09-17) Riksarkivet IT-avdelningen Anvisningar för ifyllning av Excelark för webbleveranser 1 Anvisningar för ifyllning av Excelark för webbleveranser...

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

Styla och formatera text

Styla och formatera text Nivå 2 Styla och formatera text All Code Clubs must be registered. By registering your club we can measure our impact, and we can continue to provide free resources that help children learn to code. You

Läs mer

Fakulteten för humaniora och samhällsvetenskap. Utbildningsplan. Webb och Multimedia

Fakulteten för humaniora och samhällsvetenskap. Utbildningsplan. Webb och Multimedia Dnr HS 2014/105 1 (7) Fakulteten för humaniora och samhällsvetenskap Utbildningsplan Webb och multimedia Programkod: Programmets benämning: SGWOM Högskolepoäng/ECTS: 120/180 Beslut om inrättande: Undervisningsspråk:

Läs mer

Introducerande övningar i HTML

Introducerande övningar i HTML Introducerande övningar i HTML En webbsida består av en textfil som innehåller sidans text och koder i språket HTML, för att formatera innehållet. Har man bilder på sidan, så finns de som separata filer

Läs mer

Webbservrar, severskript & webbproduktion

Webbservrar, severskript & webbproduktion Webbprogrammering Webbservrar, severskript & webbproduktion 1 Vad är en webbserver En webbserver är en tjänst som lyssnar på port 80. Den hanterar tillgång till filer och kataloger genom att kommunicera

Läs mer

Öppna standarder. Programvaror och tjänster 2014

Öppna standarder. Programvaror och tjänster 2014 Sid 1 (35) 2016-03-07 Dnr 96-38-2014 Öppna standarder Programvaror och tjänster 2014 Sid 2 (35) Innehållsförteckning 1 Bakgrund 3 2 Listans innehåll 4 3 Listans vidare utveckling 4 4 Analyserade öppna

Läs mer

Internet A. HTML Grunder. 02-01-14 Maximilien Chiang 1

Internet A. HTML Grunder. 02-01-14 Maximilien Chiang 1 Internet A HTML Grunder 1 HTML Tags (Speciella markeringar) < Instruktion> De flesta instruktioner avslutas också med en 2 untitled Min

Läs mer

WEBB PRODUKTION. Tillgänglighet och Användbarhet. 2010 Thomas Mejtoft. Thomas Mejtoft 2010-12-13 2

WEBB PRODUKTION. Tillgänglighet och Användbarhet. 2010 Thomas Mejtoft. Thomas Mejtoft 2010-12-13 2 WEBB 2010 PRODUKTION Tillgänglighet och Användbarhet 2010-12-13 2 1 Tillgänglighet och Användbarhet Tillgänglighet (Accessibility) Användbarhet (Usability) 2010-12-13 3 Tillgänglighet och Användbarhet

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

- - - 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

HEMSIDA FÖR ETT MUSIKBOLAG

HEMSIDA FÖR ETT MUSIKBOLAG HEMSIDA FÖR ETT MUSIKBOLAG Masoud Youssefi Patrik Andersson EXAMENSARBETE 2006 Kommunikation och Informationsteknik HEMSIDA FÖR ETT MUSIKBOLAG WEBSITE FOR A MUSIC COMPANY Masoud Youssefi Patrik Andersson

Läs mer

LATHUND FRONTPAGE 2000 SV/EN

LATHUND FRONTPAGE 2000 SV/EN LATHUND FRONTPAGE 2000 SV/EN RXK Läromedel AB, Riddarplatsen 36 Plan 7 177 30 Järfälla Tel: 08-580 886 00, Fax: 08-580 259 40 www.rxk.se, e-post: info@rxk.se Detta material är författat av RXK Läromedel

Läs mer

Evaluation Summary - CT3380 Grundäggande webbdesign HT06 Dan Levin

Evaluation Summary - CT3380 Grundäggande webbdesign HT06 Dan Levin Evaluation Summary - CT8 Grundäggande webbdesign HT6 Dan Levin Antal kursutvärderingar: Q. Anser du dig ha tillräckligt med förkunskaper för att klara kursen? (=JA =NEJ) Q. a Kurslitteratur? 6 Medel:,6

Läs mer

Innehåll. JavaScript - Grundkurs. Vad är JavaScript? Vad är JavaScript? Vad behövs? Lite historia

Innehåll. JavaScript - Grundkurs. Vad är JavaScript? Vad är JavaScript? Vad behövs? Lite historia JavaScript - Grundkurs Mahmud Al Hakim mahmud@dynamicos.se www.dynamicos.se www.webbacademy.se Innehåll Introduktion till JavaScript JavaScript i HTML-dokument Lite om DOM (Document Object Model) Händelser

Läs mer

Avancerade Webbteknologier

Avancerade Webbteknologier Projektledning, Business Knowledge Användbarhet & Layout Avancerade Webbteknologier Lkti Lektion 1 Kommunikation Tobias Landén tobias.landen@chas.se Avancerade webbteknologier del 1 (4 KY poäng) Syfte

Läs mer

Föreläsning 030910. Salsakurs. Tentaanmälan. Poäng för kursen. Studiestress och datorergonomi. En lugn labb?

Föreläsning 030910. Salsakurs. Tentaanmälan. Poäng för kursen. Studiestress och datorergonomi. En lugn labb? Salsakurs Föreläsning 030910 Kursstart: söndag 21 september, ÖG Nation Maila: dansasalsa@home.se Ring: 070-391 20 06, Alexander Prova på gratis 2 kurser för priset av en om du är kille! (först till kvarn)

Läs mer

Uppdatering och vidareutveckling av ett webbaserat intresseanmälningssystem. Lars Wikberg

Uppdatering och vidareutveckling av ett webbaserat intresseanmälningssystem. Lars Wikberg Uppdatering och vidareutveckling av ett webbaserat intresseanmälningssystem Lars Wikberg Examensarbete för ingenjörs (YH)-examen Utbildningsprogrammet för informationsteknik Vasa 2014 EXAMENSARBETE Författare:

Läs mer

Anvisningar för ifyllning av Excelark för databaser (sekventiella textfiler)

Anvisningar för ifyllning av Excelark för databaser (sekventiella textfiler) 2009-10-09 (reviderad 2011-01-04, 2011-01-31, 2011-10-03, 2012-02-20, 2012-09-17) Riksarkivet IT-avdelningen Anvisningar för ifyllning av Excelark för databaser (sekventiella textfiler) 1 Anvisningar för

Läs mer

Kurs 6:1 Att publicera på webben

Kurs 6:1 Att publicera på webben Kurs 6:1 Att publicera på webben S TUDE NTDATOR UTBILDNINGE N MALMÖ HöGSKOLA Beijerskajen 8, K3, källaren, sal Apollo (A01:303), 205 06 Malmö www.bit.mah.se/undervisning/sdm Att publicera på webben, del

Läs mer

Tillgänglighetskrav på teknik Dessa krav baseras på WCAG 2.0, http://www.w3.org/tr/wcag20/

Tillgänglighetskrav på teknik Dessa krav baseras på WCAG 2.0, http://www.w3.org/tr/wcag20/ Tillgänglighetskrav på teknik Dessa krav baseras på WCAG 2.0, http://www.w3.org/tr/wcag20/ UPPDRAGSGIVARE: Malmö stad VÅR REFERENS: Andreas Cederbom 08-555 770 64 andreas.cederbom@funkanu.se DATUM: 2009-04-03

Läs mer

Macromedia. Dreamweaver 8. Grundkurs. www.databok.se

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

Läs mer

Photoshop Elemements 2.0

Photoshop Elemements 2.0 Mittuniversitetet ITM Telefon 063-16 53 00 Photoshop Elemements 2.0 Laborationskompendium för grundläggande digital bildbehandling Detta exemplar tillhör: VT 2005 Innehållsförteckning Gränssnitt 1 Laborationskompendium

Läs mer

Webbens grundbegrepp. Introduktion till programmering. Ytterligare exempel. Exempel på webbsida. Föreläsning 5

Webbens grundbegrepp. Introduktion till programmering. Ytterligare exempel. Exempel på webbsida. Föreläsning 5 Introduktion till programmering Föreläsning 5 Programmering av webbsidor. Webbens grundbegrepp HTML HTML (HyperText Markup Language) är det språk som används för att skriva webbsidor. HyperText: text med

Läs mer

Webbkurs för distriktsansvariga. Stockholm den 7 och 13 september 2011

Webbkurs för distriktsansvariga. Stockholm den 7 och 13 september 2011 Webbkurs för distriktsansvariga Stockholm den 7 och 13 september 2011 Klistra in text från Word Klistra in: all formateringskod från Word kommer med och är den som styr det webbläsaren visar, även om man

Läs mer

Christoffer Nykvist. LunchApp VASA YRKESHÖGSKOLA

Christoffer Nykvist. LunchApp VASA YRKESHÖGSKOLA Christoffer Nykvist LunchApp VASA YRKESHÖGSKOLA IT-Tradenom 2014 2 Utbildningsprogrammet för informationsbehandling ABSTRAKT Författare Christoffer Nykvist Lärdomsprovets titel Lunchapp År 2014 Språk Svenska

Läs mer

Skapa en webbplats med WordPress

Skapa en webbplats med WordPress Skapa en webbplats med WordPress Daniel Karlsson 2016-01- 26 Licens Creative Commons Attribution- NonCommercial 2.0 Du får fritt sprida, redigera och kopiera guiden, men ej för ekonomisk vinning och endast

Läs mer

Objektorienterad programmering i Java. Föreläsning 5 Kort om Java-Applets

Objektorienterad programmering i Java. Föreläsning 5 Kort om Java-Applets Objektorienterad programmering i Java Föreläsning 5 Kort om Java-Applets 1 Läsanvisningar Den här föreläsningen syftar till att ge en bild av vad en Java-Applet är och är ganska fristående från föregående

Läs mer

Hemsideutveckling för Anjool AB

Hemsideutveckling för Anjool AB Beteckning: Akademin för teknik och miljö Hemsideutveckling för Anjool AB Christopher Gidlöf Maj 2012 Examensarbete 15hp B nivå Datavetenskap Internetteknologi Examinator: Carina Petterson Handledare:

Läs mer

Föreläsning i webbdesign. Bilder och färger. Rune Körnefors. Medieteknik. 2012 Rune Körnefors rune.kornefors@lnu.se

Föreläsning i webbdesign. Bilder och färger. Rune Körnefors. Medieteknik. 2012 Rune Körnefors rune.kornefors@lnu.se Föreläsning i webbdesign Bilder och färger Rune Körnefors Medieteknik 1 2012 Rune Körnefors rune.kornefors@lnu.se Exempel: Bilder på några webbsidor 2 Bildpunkt = pixel (picture element) Bilder (bitmap

Läs mer

Appar med ryggrad. Introduktion till JavaScriptramverket Backbone

Appar med ryggrad. Introduktion till JavaScriptramverket Backbone Appar med ryggrad Introduktion till JavaScriptramverket Backbone Vanlig webbsida Databas MVC - Model View Controller MVC - Model View Controller MVC Backbone.js Ger struktur Bygger på MVC konceptet Tvingar

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

Utseende. Lauri Watts Översättare: Stefan Asserhäll

Utseende. Lauri Watts Översättare: Stefan Asserhäll Lauri Watts Översättare: Stefan Asserhäll 2 Innehåll 1 Utseende 4 1.1 Allmänt............................................ 4 1.2 Teckensnitt.......................................... 4 1.3 Stilmallar...........................................

Läs mer

Ikon Menyalternativ Funktion och beskrivning Sök och ersätt text i arbetsfältet. Ramformatering

Ikon Menyalternativ Funktion och beskrivning Sök och ersätt text i arbetsfältet. Ramformatering Innehåll Redigeringsverktyget... 3 Hantera bilder... 5 Infoga pdf-fil... 5 Lägg till mall... 6 Infoga YouTube-klipp... 6 Infoga länk... 7 Infoga tabell... 8 Kodupprensning... 10 CSS-klass... 10 Egna anteckningar:...

Läs mer

<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

<script src= http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js></script> AngularJS Skriven av: Isak Glans. Datum: 2015-04-29. Kurs: Webbutveckling. Lärare: Per Sahlin. Utbildning: Systemutvecklare i.net, Newtons Yrkeshögskola. 1 Sammanfattning Syftet med denna uppsats är att

Läs mer

1 PROTOKOLL. Nätverk. Agenda. Jonas Sjöström

1 PROTOKOLL. Nätverk. Agenda. Jonas Sjöström Nätverk Jonas Sjöström jonas.sjostrom@dis.uu.se Baserat primärt på kapitel 4 i Brookshear (2008) samt valda kapitel ur Gralla Agenda 1. Protokoll 2. LAN och WAN 3. Kort om infrastruktur 4. Paketering och

Läs mer