WEBBUTVECKLING Kursplanering

Storlek: px
Starta visningen från sidan:

Download "WEBBUTVECKLING Kursplanering"

Transkript

1 Kursplanering v 35-37: Struktur, mappar, google-skills, planering, html-grunder, bra/dåliga exempel, webbläsare, editorer v 38-43: HTML - länkar, färger, text, listor, bilder. v 44: Höstlov v 45: Repetition, Prov 1 v 46-50: CSS - formatering av text och bild, dreamweaver v 51: Repetition, Prov 2 v 52-1: Jullov v 2-8: HTML & CSS - praktiskt arbete v 9: Sportlov v 10: HTML & CSS - praktiskt arbete v 11-15: APL v 16: Påsklov v 17-18: HTML & CSS - praktiskt arbete v 19-22: CMS-hantering, MAMP, Wordpress

2 Struktur Innan vi börjar prata om kodning: Planering och struktur. Sjukt viktigt.

3 Struktur Något som är extremt viktigt är att ha en bra struktur på alla mappar och dokument. Vid arbete med stora webbsajter blir det helt omöjligt att arbeta om det inte finns en vettig struktur. Dessutom är det väldigt lätt att få stora problem med länkning mellan olika dokument, bilder etc. om man inte har en bra struktur redan från början.

4 Struktur - namngivning av dokument När man arbetar med webb måste man komma ihåg några saker vid namngivning av filer man arbetar med. En fil som heter "Index.htm" inte är samma sak som filen "index.htm". Använd *inte* mellanslag i filnamnen. Använd inte siffror eller åäö i filnamnen. Döp filerna ordentligt så blir det lätt att hitta dom, vilket förenklar vid felsökning. Exempel på ett bra filnamn: "stockholmsbilder.htm" Exempel på ett dåligt filnamn: "Mina Läckra Bilder Från Stan den 12:e augusti.htm"

5 Struktur - namngivning av dokument Hur många fel hittar du i filnamnet? "Mina Läckra Bilder Från Stan den 12:e augusti.htm"

6 Struktur - namngivning av dokument Jag hittar 15: "Mina Läckra Bilder Från Stan den 12:e augusti.htm"

7 Google skills

8 Google skills Att webbutveckla är att skriva kod, bildbehandla och hantera filer. Men minst lika viktigt är att kunna hitta information om hur man gör det ena eller andra. Det mest färska informationen finns alltid på webben - långt innan den kommer i en tidning eller bok. Därför är det viktigt att kunna använda Google. Google svarar snällt på det mesta, men det viktigaste är att ställa "rätt fråga" annars kommer svaren bara bli förvirrande. Att skriva "lägga text på rätt ställe" kommer att ge mycket sämre resultat än att skriva "positionera text in css-fil" som i sin tur kommer ge sämre resultat än att skriva "position text in css" (dvs på engelska).

9 Google skills Engelska! Engelska! Engelska! Trist nog är den bästa, mest färska informationen på engelska. Alltså: Plugga engelska. Och en sak till: Plugga mer engelska.

10 Google skills One more thing. Study english.

11 Planering

12 Planering Innan man överhuvudtaget börjar tänka på att skriva kod så ska man planera hur webbsajtens olika sidor ska sitta ihop. En bra idé är att använda ett träddiagram för att få en vettig överblick. Det enklaste sättet att göra sånt diagram är med papper och penna. En annan bra idé är att göra en grovskiss av sidans layout. Det är mycket enklare att sudda bort en felaktigt placerad bild/knapp från ett papper än att göra det i kod. Alltså; innan kodning ska du alltid jobba med papper och penna.

13 Planering Ett diagram och en skiss behöver inte vara något märkvärdigt alls. Det viktiga är att man själv förstår vad man ska göra. Men: Det ska alltid finnas en skiss och ett diagram.

14 HTML - Webbsidor En webbsida är skriven i HTML. HTML betyder "HyperText Markup Language". Hypertext är text med hyperlänkar, alltså länkar som tar dig till andra sidor när du klickar på dem. Markup innebär att man tar vanlig text och märker upp denna så att webbläsaren ska förstå vad det för text. Man märker upp vad som är rubrik, underrubrik, stycke, var bilder ska sitta och så vidare. Language betyder som bekant språk. :)

15 HTML - Webbsidor De stora fördelen med HTML är att det inte ställer några speciella krav på maskinen det ska visas på. En webbsida kan visas lika bra på en mobiltelefon som på en Windows-PC med 30"-skärm (nästan i alla fall - vi kommer prata mer om det...).

16 HTML - Taggar HTML-kod består av taggar som sitter före och efter en text, bild eller liknande. Taggar beskriver för webbläsaren vad det som är "uppmärkt" är för något. Vi tar taggen "p" som exempel: <p>textstycke. Mer eller mindre långt.</p> Här berättar vi för webbläsaren att den ska visa ett stycke text, helt enkelt. P i taggen betyder "Paragraph", alltså engelska för "Stycke".

17 HTML - Taggar Taggar är alltid i par. En innan och en efter det man märker upp. Det ska alltid finnas en starttagg och en sluttagg. Det som ligger mellan start- och sluttagg är det som kommer påverkas av taggen. Man ser enkelt skillnad på start- och sluttagg; Sluttaggen innehåller ett slash-tecken: / Alltså: <p> </p> Starttagg Sluttagg

18 HTML - Taggar Här är väldigt enkel sida, som den ser ut i kod och som den ser ut i en webbläsare: Den ser väl inte helt obegripligt ut, eller hur?

19 HTML - Grundkod Grunden i ett html-dokument ser alltid ut på följande sätt: <html> <head> <title> </title> </head> <body> </body> </html>

20 HTML - Grundkod Vad betyder då dessa taggar? Vi går igenom: <html> <head> <title> </title> </head> <body> </body> </html> Överst hittar vi taggen <html> Den berättar helt enkelt att det som följer är ett htmldokument. Sist i dokumentet ligger avslutningstaggen</html> som berättar att dokumentet tar slut.

21 HTML - Grundkod Vad betyder då dessa taggar? Vi går igenom: <html> <head> <title> </title> </head> <body> </body> </html> Nästa tagg är <head>. Den innehåller vanligtvis inte så mycket, men vanligtvis finns det alltid en annan tagg i <head>, nämligen <title>taggen. När en tagg ligger inuti en annan tagg såhär, brukar man prata om nästlade taggar.

22 HTML - Grundkod Vad betyder då dessa taggar? Vi går igenom: <html> <head> <title> </title> </head> <body> </body> </html> Taggen <title>är såklart dokumentets titel. Titeln är det som syns i fönsterlisten på webbläsaren.

23 HTML - Grundkod Vad betyder då dessa taggar? Vi går igenom: <html> <head> <title> </title> </head> <body> </body> </html> Efter <head>-taggen kommer <body>-taggen. I <body> finns i princip allt innehåll på webbsidan, som bilder, text och filmer.

24 HTML - Grundkod Lägg märke till indragen i texten. Detta kallas "indentering". Poängen med att strukturera texten på det här sättet är att Det blir mycket enklare att felsöka koden. Ta för vana att alltid indentera din kod. Indentering av kod gör man genom att trycka på tabbtangenten. I många editorer sker detta automatiskt. <html> <head> <title> </title> </head> <body> </body> </html>

25 HTML - Grundkod De flesta taggar kan ha något som kallas attribut - tillbehör till taggen, skulle man kunna säga. Exempel: Taggen <a> </a> (som betyder anchor) har vanligtvis attributet href, som betyder hypertextreferens, det vill säja själva målet för länken - vanligtvis en annan webbsida. Ett attribut skrivs i själva taggen, mellan klamrarna. I det här exemplet blir det alltså <a href></a> tagg attribut Attribut brukar vanligtvis innehålla någon form av värde. I exemplet <a href> så skulle värdet kunna vara tex. facebook.com och då skulle hela starttaggen se ut såhär: <a href= >

26 HTML - Grundkod För att göra en komplett länk till facebook använder man följande kod: <a href= https://www.facebook.com >Gå till Facebook</a> Alltså först starttagg: <a href= https://www.facebook.com > Sedan det som ska bli själva länken: Gå till Facebook Sen stänger man man taggen med: </a> Svårare än så är det inte!

27 HTML - Grundkod En bra idé är att börja med en grundsida eller mall som man sedan kopierar till alla sidor man ska göra. Den bör se ut så här: <!doctype html> <html> <head> <title> </title> <meta charset= utf-8 /> </head> <body> </body> </html> Lägg märke till att koden är indenterad. Det gör att det blir rätt enkelt att snabbt se att tex taggen <head> innehåller taggarna <title> och <meta>. Det är en del taggar vi inte talat om än, men lugn, vi kommer dit.

28 HTML - Grundkod Dags att läsa! Läs igenom sid Svara på frågorna på sid och på sid 49. Skriv svaren i ett Word-dokument och lämna in via på thomaslundberg.se. Gör sedan övningarna på sid 49 och 50. Du behöver inte göra övningarna på sid 19.

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

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

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

Carl-Oscar Hermansson WEBB DESIGN

Carl-Oscar Hermansson WEBB DESIGN Carl-Oscar Hermansson WEBB DESIGN Del SKAPA DIN WEBBPLATS MED HTML. Öppna ett HTML-dokument... 8 6. HTML grundkod... 9 7. Färger... 0 8. Textformatering... 9. Listor... 0 0. Bilder.... Bakgrundsbilder...

Läs mer

Du kan själv följa med i denna steg-för-steg guide i din texteditor.

Du kan själv följa med i denna steg-för-steg guide i din texteditor. Grundläggande HTML HTML Steg-för-steg Du kan själv följa med i denna steg-för-steg guide i din texteditor. doctype Linköpings universitet I textdokument som används på internet finns på första raden information

Läs mer

Arbetsmaterial HTML pass 1 - Grunder

Arbetsmaterial HTML pass 1 - Grunder Arbetsmaterial HTML pass 1 - Grunder Det vi idag kallar Internet växte fram ur ett amerikanskt nätverk kallat ARPAnet som skapades i slutet av 60 talet. Ett topphemligt verktyg för att koppla ihop stordatorer

Läs mer

Att bygga enkla webbsidor

Att bygga enkla webbsidor Nivå 1 Att bygga enkla 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/18cplpy to find out what

Läs mer

FrontPage Express. Ämne: Datorkunskap (Internet) Handledare: Thomas Granhäll

FrontPage Express. Ämne: Datorkunskap (Internet) Handledare: Thomas Granhäll FrontPage Express I programpaketet Internet Explorer 4.0 och 5.0 ingår också FrontPage Express som installeras vid en fullständig installation. Det är ett program som man kan använda för att skapa egna

Läs mer

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

Labora&on 2 HTML och validering övningar/uppgi:er

Labora&on 2 HTML och validering övningar/uppgi:er Labora&on 2 HTML och validering ö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 finns det

Läs mer

12 Webb och kurshemsidor

12 Webb och kurshemsidor 12 Webb och kurshemsidor Många lärare använder sig av kurswebbsidor eller egna personliga webbsidor som ett ställe att samla information och dokumentation kring sitt arbete. Om du ska skapa en webbsida,

Läs mer

En bortsprungen katt

En bortsprungen katt Nivå 1 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. En bortsprungen katt

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

Hyperlänkar. I HTML skapar man en hyperlänk med taggen , som är en förkortning av ordet ankare, på (engelska anchor).

Hyperlänkar. I HTML skapar man en hyperlänk med taggen <a> </a>, som är en förkortning av ordet ankare, på (engelska anchor). Länkar, ankar och resurser En länk är en hänvisning från ett dokument till en resurs. En resurs kan nästan vara vad som helst. Det mesta på internet är resurser i någon form, som exempelvis HTLM-dokument,

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

Introduktion till programmering

Introduktion till programmering 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

På många sätt är webben, när det kommer till kritan, en samling länkar. Inom varje given plats, gör länkarna det möjligt att snabbt navigera från ett

På många sätt är webben, när det kommer till kritan, en samling länkar. Inom varje given plats, gör länkarna det möjligt att snabbt navigera från ett På många sätt är webben, när det kommer till kritan, en samling länkar. Inom varje given plats, gör länkarna det möjligt att snabbt navigera från ett relaterat ämne till ett annat. En länk från en sida

Läs mer

Kort om World Wide Web (webben)

Kort om World Wide Web (webben) KAPITEL 1 Grunder I det här kapitlet ska jag gå igenom allmänt om vad Internet är och vad som krävs för att skapa en hemsida. Plus lite annat smått och gott som är bra att känna till innan vi kör igång.

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

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

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

<header> </header> <footer> </footer> Tidigare har man använt taggen för att märka delar av dokument. I HTML5 har man lagt till stöd för de nya taggarna för att det inte ska bli så många -taggar. I exemplet nedan använder

Läs mer

Användarmanual för Content tool version 7.5

Användarmanual för Content tool version 7.5 Användarmanual för Content tool version 7.5 TM WEB Express AB Manual Content tool 7.5 Sid 2 INNEHÅLLSFÖRTECKNING 1 OM PUBLICERINGSVERKTYGET... 3 1.1 ALLMÄNT... 3 2 ÖVERSIKT... 3 3 ALLMÄNT OM WEBBSIDAN

Läs mer

Alla filer som bearbetar PHP script ska avslutas med ändelsen.php, exempelvis ska en indexsida till en hemsida heta index.php

Alla filer som bearbetar PHP script ska avslutas med ändelsen.php, exempelvis ska en indexsida till en hemsida heta index.php Introlektion PHP är ett av de enklare språken att lära sig just pga. dess dynamiska struktur. Det används för att bygga upp båda stora och mindre system. Några vanliga system som använder sig av PHP är

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

Innehållsförteckning. Adobe GoLive CS

Innehållsförteckning. Adobe GoLive CS Innehållsförteckning 1 Om GoLive CS... 1 Mappar och filstruktur...1 Vad är en webbsida?...1 Vad är speciellt för en webbsida?...2 Vad är en webbplats?...3 Vanliga fallgropar med webbdesign...3 Överföra

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

Användarmanual WebNailer. 19 januari 2004

Användarmanual WebNailer. 19 januari 2004 Användarmanual WebNailer Tobias Holgers Mattias Castegren 19 januari 2004 1 Innehåll 1 Inledning 3 1.1 Definitionerochförkortningar... 3 2 WebNailer 4 2.1 Knapprad... 4 2.1.1 Gemensamma... 4 2.1.1.1 Webbläsare...

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

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

F02 HTML. Föreläsning 2, HT2013 HTML. Kurser: Klientbaserad Webbutveckling 1DV435. Johan Leitet

F02 HTML. Föreläsning 2, HT2013 HTML. Kurser: Klientbaserad Webbutveckling 1DV435. Johan Leitet Föreläsning 2, HT2013 HTML F02 HTML Kurser: Klientbaserad Webbutveckling 1DV435 Johan Leitet F02 HTML Dagens agenda doctype taggar, element, attribut, värden teckenkodning HTML/XHTML

Läs mer

Gör en modern släktbok för CD eller webben

Gör en modern släktbok för CD eller webben Gör en modern släktbok för CD eller webben 21 Den traditionella släktboken består av ett antal tabeller och i bästa fall en grafisk stam- eller antavla, och man kan med ett register eller hänvisningar

Läs mer

ATT GÖRA WEBBSIDOR. Frivillig labb

ATT GÖRA WEBBSIDOR. Frivillig labb Numerisk analys och datalogi KTH 100 44 Stockholm Kerstin Frenckner, tel 790 7143, e-post kfrenck@nada.kth.se 2D1339 Programkonstruktion Hösten 2001 Datorintroduktion Frivillig labb ATT GÖRA WEBBSIDOR

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

Bilder. Bilder och bildformat

Bilder. Bilder och bildformat och bildformat Det första du måste göra är att skaffa bilder att lägga in i ett HTMLdokument. Ta en bild med din mobil/ webbkamera eller rita bilden själv.du kan ta gratisbilder från Google, gå in på bilder

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

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

Kom igång med FrontPage 2003

Kom igång med FrontPage 2003 Kom igång med FrontPage 2003 Skolorna i Kristianstads kommun har inte gemensam licens som med vissa övriga Microsoft-program utan licens måste köpas för varje dator som det ska installeras på. Din tekniker

Läs mer

http://office.microsoft.com/sv-se/word/ha100444731053.aspx

http://office.microsoft.com/sv-se/word/ha100444731053.aspx 1. Öppna Word 2007 i 97-2003 2. Vilken Explorer har jag 3. Inloggning med Explorer 8 4. Sökväg till sidan 5. Ha två fönster öppna 6. Stilar 7. Storleksändra 8. Inklistring av text 9. Bilder till startsidan

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

Användning av pdf Vägledningen 24-timmarswebben

Användning av pdf Vägledningen 24-timmarswebben 1 (7) Användning av pdf Version 1.1 Uppdaterad: 2007-07-03 Användning av pdf I den här checklistan får du veta hur du skapar tillgängliga pdf-dokument. Checklistan är ett extramaterial till 1. Använd gärna

Läs mer

Webbserver och HTML-sidor i E1000 KI

Webbserver och HTML-sidor i E1000 KI 1 Funktion och användningsområde E1000-terminalen (E1032-E1151) kan användas som webbserver. En webbserver är ett program som hanterar filer som ska visas i en webbläsare som exempelvis Internet Explorer.

Läs mer

Ljud och video på webbsidor

Ljud och video på webbsidor Nivå 3 Ljud och video på 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

Läs mer

Att använda laget.se

Att använda laget.se 2012 Att använda laget.se för ungdomsledare i MSSK Dokumentet är framtaget för att hjälpa till att förenkla användningen av lagens webbsidor. Har du förslag på ändringar eller ser felaktigheter kan du

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

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

Wordpress och Sociala medier av Sanna Ohlander 110308. Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se

Wordpress och Sociala medier av Sanna Ohlander 110308. Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se 1 Innehållsförteckning Tänk på! Sid 3 Logga in sid 4 Panel sid 5 Sidor och inlägg 1. Skapa eller redigera en sida eller inlägg

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

HUR MAN SKAPAR EN SÖKMOTORVÄNLIG LANDNINGSSIDA.

HUR MAN SKAPAR EN SÖKMOTORVÄNLIG LANDNINGSSIDA. HUR MAN SKAPAR EN SÖKMOTORVÄNLIG LANDNINGSSIDA. Innehåll Introduktion... 2 Title... 2 Huvudrubrik... 2 Underrubriker... 3 Alt-attributet... 3 Fetstil och kursivering... 3 Brödtexten... 4 Meta Description...

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

Labora&on 3 HTML och struktur övningar/uppgi:er

Labora&on 3 HTML och struktur övningar/uppgi:er Labora&on 3 HTML och struktur övningar/uppgi:er 1M321 Webbteknik 1, 7,5hp Medieteknik 2016 Rune Körnefors rune.kornefors@lnu.se 1. Skapa em nym HTML-dokument I denna labora&on ska du skapa tre sidor, som

Läs mer

2009-08-20. Manual för Typo3 version 4.2

2009-08-20. Manual för Typo3 version 4.2 2009-08-20 Manual för Typo3 version 4.2 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.1.1

Läs mer

LÄRARHANDLEDNING TILLGÄNGLIGA WEBBSIDOR

LÄRARHANDLEDNING TILLGÄNGLIGA WEBBSIDOR UPPDRAGSGIVARE: IT-CENTER VÅR REFERENS: STEFAN JOHANSSON TEL.: 0708-23 10 64 E-POST: stefan.johansson@funkanu.se INNEHÅLL: LÄRARHANDLEDNING TILLGÄNGLIGA WEBBSIDOR _ Funka Nu AB Finnbodavägen 2, 131 31

Läs mer

Webbplats analys cofra.it

Webbplats analys cofra.it Webbplats analys cofra.it Genereras på Januari 16 2017 07:17 AM Ställningen är 37/100 SEO Innehåll Titel COFRA - Born To Work - Längd : 22 Perfekt, din titel innehåller mellan 10 och 70 tecken. Beskrivning

Läs mer

Webbplats analys ipchecker.us

Webbplats analys ipchecker.us Webbplats analys ipchecker.us Genereras på Juni 22 2016 19:19 PM Ställningen är 39/100 SEO Innehåll Titel IPChecker.us - Display Your IP - Whois IP - IP Lookup - What Is My IP? Längd : 70 Perfekt, din

Läs mer

I den tidigare filen Manual Editor belystes grunderna för enkel uppdatering samt editorns utformning.

I den tidigare filen Manual Editor belystes grunderna för enkel uppdatering samt editorns utformning. Sida 1 av 23 Editor, Avancerad I den tidigare filen Manual Editor belystes grunderna för enkel uppdatering samt editorns utformning. Detta dokument syftar till att hjälpa dig som vill jobba mer aktivt

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

Manual Söka ledig tjänst Landstinget i Östergötland. Senast reviderad 2012-03-02

Manual Söka ledig tjänst Landstinget i Östergötland. Senast reviderad 2012-03-02 Manual Söka ledig tjänst Landstinget i Östergötland Senast reviderad 2012-03-02 Sök en specifik tjänst... 3 Första gången du registrerar en ansökan... 4 Vill ansöka och har redan ett användarkonto... 5

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

Gör en släktbok med Disgen

Gör en släktbok med Disgen Gör en släktbok med Disgen Bengt Kjöllerström: En modern släktbok med Mer-knapp Mer-knappen ger möjlighet att koppla moderna släktboken till egna sidor som kan ge mer information om personerna i släktboken.

Läs mer

Uppmärkningsspråk. TDP007 Konstruktion av datorspråk Föreläsning 4. Peter Dalenius Institutionen för datavetenskap

Uppmärkningsspråk. TDP007 Konstruktion av datorspråk Föreläsning 4. Peter Dalenius Institutionen för datavetenskap Uppmärkningsspråk TDP007 Konstruktion av datorspråk Föreläsning 4 Peter Dalenius Institutionen för datavetenskap 2015-02-03 Från förra gången XML-dokument specificeras med t.ex. en DTD Två olika sätt att

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

Arg-administratörens guide till Umbraco v 1.2.1

Arg-administratörens guide till Umbraco v 1.2.1 Arg-administratörens guide till Umbraco v 1.2.1 Logga in 1. Öppna en webbläsare och gå till inloggningssidan: https://www.sfog.se/umbraco/ 2. Skriv in följande användarnam & lösenord : 3. Klicka på Logga

Läs mer

Zimplit CMS Manual. Introduktion. Generell Information

Zimplit CMS Manual. Introduktion. Generell Information Zimplit CMS Manual Introduktion Detta dokument ger en överblick av Zimplit CMS (Content Management System) användargränssnitt och dess funktioner. (För mer information och hjälp-forum, se zimplit.org.)

Läs mer

Webbsida i Wordpress. Existens på webben och bli sökbar

Webbsida i Wordpress. Existens på webben och bli sökbar Webbsida i Wordpress Existens på webben och bli sökbar Om Susann Rickan Susann Rickan bor i Nora Byggt webbsidor i 16 år Eget företag sedan 2009. Hjälper företag med webb och foto. Tycker om att bygga

Läs mer

Om include-filer i PHP

Om include-filer i PHP Programmering för webben! 1 Om include-filer i PHP För att få bättre struktur och slippa skriva vanligt förekommande kod flera gånger använder man ofta include-filer i PHP. Här kommer en kort beskrivning

Läs mer

Guide för att skapa & ändra Sidor och Statiska block - Speedcom E-Handel

Guide för att skapa & ändra Sidor och Statiska block - Speedcom E-Handel Guide för att skapa & ändra Sidor och Statiska block - Speedcom E-Handel * Zooma dokumentet (150%) så ser du skärmdumparna bättre. De flesta texter som du kan ändra ligger i statiska block så vi börjar

Läs mer

Wordpress och Sociala medier av Sanna Ohlander 110319. Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se

Wordpress och Sociala medier av Sanna Ohlander 110319. Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se 1 Innehållsförteckning Tänk på! Sid 3 Logga in sid 4 Panel sid 5 Sidor och inlägg 1. Skapa eller redigera en sida eller inlägg

Läs mer

Manual till publiceringsverktyg

Manual till publiceringsverktyg Manual till publiceringsverktyg Allmänt När man har loggat in hamnar man direkt på översikten över hela webbplatsen. Överst hittar man en meny som alltid ligger med i verktyget. Denna meny innehåller översikten

Läs mer

24-timmarswebben. Riktlinje Förklaring Så uppfyller vi den

24-timmarswebben. Riktlinje Förklaring Så uppfyller vi den 24-timmarswebben WebPublish gör det möjligt att skapa läsvänliga sidor. Vi tycker att det är en självklarthet att informationen på en webbplats ska vara tillgänglig för och kunna läsas av så många som

Läs mer

Dreamweaver för nybörjare

Dreamweaver för nybörjare Startpaketet Dreamweaver för nybörjare För att kunna skapa en hemsida så måste du först öppna en plats för den och även skapa en bild mapp om du vill ha bilder på din hemsida. Tänk på en regel inom hemsideskapande,

Läs mer

Mappar och filer för webbsidor

Mappar och filer för webbsidor Mappar och filer för webbsidor I de4a dokument illustreras det hur du kan arbeta med mappar och filer, då du skapar webbsidor och ska publicera dem för uppgi=erna. Det visas också hur du skickar in redovisningar

Läs mer

I den här övningen tränar du på att göra olika programfönster. Övningarna går att göra på egen hand.

I den här övningen tränar du på att göra olika programfönster. Övningarna går att göra på egen hand. I den här övningen tränar du på att göra olika programfönster. Övningarna går att göra på egen hand. Innehållsförteckning Kontrollpanelen i kategoriläge. Frågor 2 Utforskaren, hantera filer och mappar.

Läs mer

Introduktion HTML och PHP 732G16 Databaser design och programmering

Introduktion HTML och PHP 732G16 Databaser design och programmering Introduktion HTML och PHP 732G16 Databaser design och programmering 08-04-22 Ingrid Alin Nilsson 1 Presentationen tar upp Lite grundläggande om HTML Grunderna i PHP Styrstrukturer Funktioner Filhantering

Läs mer

Användarhandledning Version 1.2

Användarhandledning Version 1.2 Användarhandledning Version 1.2 Innehåll Bakgrund... 2 Börja programmera i Xtat... 3 Allmänna tips... 3 Grunderna... 3 Kommentarer i språket... 4 Variabler... 4 Matematik... 5 Arrayer... 5 på skärmen...

Läs mer

3. Hämta och infoga bilder

3. Hämta och infoga bilder Sida 1 av 8 Lektion 1: sida 4 av 4 «Sida 3 av 4 Till kursens framsida 3. Hämta och infoga bilder Nu vet vi ju hur man sätter in text i sin sida. Men hur gör man med bilder? Det är inte svårt alls! Det

Läs mer

LATHUND FRONTPAGE 2000

LATHUND FRONTPAGE 2000 LATHUND FRONTPAGE 2000 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 AB.

Läs mer

Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se

Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se 1 Innehållsförteckning Tänk på! Sid 3 Logga in sid 4 Panel sid 5 Sidor och inlägg 1. Skapa eller redigera en sida eller inlägg

Läs mer

Version: 1.0.1 Datum: 2012-05-23. DynaMaster 5 Golf Övergripande manual

Version: 1.0.1 Datum: 2012-05-23. DynaMaster 5 Golf Övergripande manual Version: 1.0.1 Datum: 2012-05-23 DynaMaster 5 Golf Övergripande manual Innehållsförteckning 1 Inledning 3 1.1 Systemkrav 3 2 Logga in 4 3 Översikt 5 4 Verktygsfält och funktioner 6 4.1 Översikt gränssnitt

Läs mer

Kom igång. Readyonet Lathund för enkelt admin. Logga in Skriv in adressen till din webbsida följt av /login. Exempel: www.minsajt.

Kom igång. Readyonet Lathund för enkelt admin. Logga in Skriv in adressen till din webbsida följt av /login. Exempel: www.minsajt. Kom igång Logga in Skriv in adressen till din webbsida följt av /login. Exempel: www.minsajt.se/login Nu dyker en ruta upp på skärmen. Fyll i ditt användarnamn och lösenord och klicka på "logga in". Nu

Läs mer

Skapa mappar, spara och hämta dokument

Skapa mappar, spara och hämta dokument Skapa mappar, spara och hämta dokument Övningen görs på hårddisken i mappen Mina dokument 1a Starta programmet utforskaren 1 b Huvudgrupper i utforskaren 1c Expandera huvudgrupper, enheter och mappar Skapa

Läs mer

1. När du öppnar DW första gången får du några alternativ att välja på:

1. När du öppnar DW första gången får du några alternativ att välja på: Dreamweaver CS3 Grundinställningarna är något du kommer att behöva göra varje gång du kommer till en ny dator i skolan för att kunna vara säker på att programmet arbetar efter XHTML standarden och inte

Läs mer

Surfa till adressen https://cms10.mdh.se/polopoly/ och logga in med dina vanliga användaruppgifter.

Surfa till adressen https://cms10.mdh.se/polopoly/ och logga in med dina vanliga användaruppgifter. Surfa till adressen https://cms10.mdh.se/polopoly/ och logga in med dina vanliga användaruppgifter. När du är inloggad: 1. Klicka på plustecknet vid ditt ämne i innehållsträdet till vänster. Då fälls alla

Läs mer

Lathund skapa och redigera sidor en projektwebb

Lathund skapa och redigera sidor en projektwebb Lathund skapa och redigera sidor en projektwebb 1. Gå in via redigeringsadressen: https://projektwebbaradmin.lansstyrelsen.se/miljosamverkanskane 2. Skapa sida Navigera till den del av webbplatsen där

Läs mer

Lägga in och publicera rapporter i rapportserien

Lägga in och publicera rapporter i rapportserien Lägga in och publicera rapporter i rapportserien Se till att du sparat rapportfilen med namnet enligt exemplen nedan. Detta för att rapporterna ska komma i rätt ordning och vara lätta att hitta. OBS -

Läs mer

Redigera bilder snabbt och enkelt!

Redigera bilder snabbt och enkelt! Redigera bilder snabbt och enkelt! När du ska ladda upp bilder till din hemsida så är det klokt att anpassa bilderna så att dom får rätt storlek och att dom blir så lätta som möjligt i filstorlek. Detta

Läs mer

Lektion 1 - HTML och CSS

Lektion 1 - HTML och CSS Lektion 1 - HTML och CSS Introduktion HTML (Hyper Text Markup Language) är ett märkspråk, som består av en uppsättning märktaggar. Varje HTML-dokument beskrivs med HTML-taggar, och varje tag är olika element

Läs mer

Frontpage 2002/XP (2)

Frontpage 2002/XP (2) Frontpage 2002/XP Frontpage 2002 eller Frontpage XP som det också kallas är ett hemsideprogram där du inte behöver kunna koda som annars är fallet om man gör en hemsida. Att snabbt, enkelt och snyggt kunna

Läs mer

Steg 5 Webbsidor One.com och OpenOffice Writer Mac OS X

Steg 5 Webbsidor One.com och OpenOffice Writer Mac OS X Steg 5 Webbsidor One.com och OpenOffice Writer Mac OS X Nov 13 Liljedalsdata.se Liljedalsdata Steg 5 Mac Sida 1 Inledning Förkunskaper Steg 1, 2, 3 och 4. Innan du är mogen för att lägga ut en sida på

Läs mer

HTML & webbteknik. Introduktion till HTML. Formatering. Struktur HTML. Uppdelning. Hur man skapar hemsidor. Öppen standard W3C. Plattformsoberoende

HTML & webbteknik. Introduktion till HTML. Formatering. Struktur HTML. Uppdelning. Hur man skapar hemsidor. Öppen standard W3C. Plattformsoberoende Introduktion till HTML HTML & webbteknik Hur man skapar hemsidor Öppen standard W3C World Wide Web Consortium Plattformsoberoende Om standarden följs. XHTML Utveckling av HTML, kommer kanske i framtiden

Läs mer

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

Handbok till bloggen Uppdaterad

Handbok till bloggen Uppdaterad Handbok till bloggen Uppdaterad 160901 Gå till www.soroptimistsweden.se/sitefactory Logga in med din blogganvändare och blogglösenord (det är alltså INTE samma som till medlemssidorna på www.soroptimistsweden.se).

Läs mer

20/01/2016. html och css

20/01/2016. html och css html och css 1 Kommunikation Dator med webbläsare Förfrågan: http://www.umu.se Webserver Returnerar HTML-kod Webbläsare http://gs.statcounter.com/#desktop-browser-se-monthly-201501-201601-bar 2 Verktyg

Läs mer

Guide. Webbsidor i Studentportalen. Innehåll. Uppdaterad: 2014-10-07

Guide. Webbsidor i Studentportalen. Innehåll. Uppdaterad: 2014-10-07 Guide Eva Pärt-Enander, 2012-12-14 Webbsidor i Studentportalen Uppdaterad: 2014-10-07 Innehåll Webbsidor i Studentportalen... 1 Om webbsidor... 2 Lägg till en webbsida... 2 Lägg till samma webbsida på

Läs mer

1. Uppdateringsmodul (CMS)

1. Uppdateringsmodul (CMS) Innehåll 1. Uppdateringsmodul (CMS)... 2 2. Artiklar... 3 2.1 Upprätta din första artikel... 4 2.2 Skapa innehåll i artikeln... 5 2.2.1 RUBRIK I ARTIKELN:... 5 2.2.3 INFOGA BILDER:... 7 2.2.4 CELLER...

Läs mer

Administration av asrp.se

Administration av asrp.se Administration av asrp.se Inloggning sker från: http://www.asrp.se/cms/admin_login.php Avdelningar/rubriker: - Sidor - Användare - Galleri - Övrigt - Annonser - Hästar - Faktablad - Logga ut SIDOR Under

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

Nya www.lu.se liten manual i Drupal 2012-03-07 Version 1.1

Nya www.lu.se liten manual i Drupal 2012-03-07 Version 1.1 Nya www.lu.se liten manual i Drupal 2012-03-07 Version 1.1 Innehåll Inloggning... 3 Beskrivning av översta menyn... 3 Förklaring av Workbench... 3 My content:... 3 Skapa innehåll... 3 My sections... 3

Läs mer

Medieteknologi Webbprogrammering och databaser MEB725, 5p (7,5 ECTS) Klientprogrammering JavaScript Program på flera sidor

Medieteknologi Webbprogrammering och databaser MEB725, 5p (7,5 ECTS) Klientprogrammering JavaScript Program på flera sidor http://w3.msi.vxu.se/multimedia Medieteknologi Webbprogrammering och databaser MEB725, 5p (7,5 ECTS) Klientprogrammering JavaScript Program på flera sidor Rune Körnefors Innehåll Variabler i JavaScript

Läs mer