Presentera dig själv Laboration 1

Relevanta dokument
Copy Cat Laboration 4

Laboration 1. Webbprodution Struktur & innehåll HT2015

Struktur och innehåll Laboration 2

En stiligare portal Laboration 3

Laboration 2. Webbproduktion En stiligare webbsida HT2015

Laborationsanvisning. HTML5 Laboration 6. Författare: Johan Leitet Version: 1 Datum:

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

Laboration 4. Laboration 4, Formulärvalidering. Inledning. Observera. Mål. Genomförande

Välkommen som användare av medietekniks och informatiks publika studentserver

Projektanvisning. Webbsideprojekt. Författare: Johan Leitet Version: 2 Datum:

Det ska endast finnas två bilder av samma typ på spelplanen.

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

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

Webbprogrammering 725G54

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

Content Management System. Publiceringssystem

Sammanfattning av hantering av redovisning av uppgift U1

Webbutveckling Laboration 1: HTML5 och CSS3.

Scio. en liten användarguide. Skriven av: Josefine Siewertz

Webbteknik för ingenjörer

Övning (X)HTML 2. Sidan 1 av

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

Konfigurera Wordpress som Hemsida istället för blogg

LABORATION 1 Pingpong och Installation av Server 2008 R2

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

Laboration 0. Enhetsbokstaven anges med ett kolon efter och man läser ofta ut detta, exempelvis C:(sekolon).

Mappar och filer för webbsidor

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

F02 En första sida. Dagens agenda

[ HUR DU UPPDATERAR FÖRSTASIDAN PÅ OTHELLO.NU ]

Frontermanual för Rektorsprogrammet

Webbservrar, severskript & webbproduktion

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

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

Bli ett proffs på arkitekt.se

Projektuppgift- Mashup- Applikation

Blogga med Wordpress

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

Webbutveckling grundkurs, DA120A sm10

Laboration 2: Xhtml och CSS.

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

När man trycker på knappen får man upp ett fönster med alla tillgängliga bilder, och väljer en av dem genom att trycka på bilden:

Introducerande övningar i HTML

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

Användarmanual för Content tool version 7.5

Webbprogrammering, grundkurs 725G54

Labora&on 7 Syfte med laborationen:

Skriv före adressen och lämna bort www enligt modellen:

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

Labora&on 1 Introduk&on &ll utvecklingsmiljön övningar/uppgi<er

WEBBUTVECKLING Kursplanering

3. Skapa sida 5. Hitta innehåll 6. Meny 7. Användare

Så här funkar Föreningsliv

Content Management System. Publiceringssystem

Office 365 Windows 10

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

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

Manual för Typo3 Site-Admins version 4.04

Zimplit CMS Manual. Introduktion. Generell Information

Handledning för installation och komma igång med Joomla

Arbetsmaterial HTML pass 1 - Grunder

Introduktion Till WordPress

Webbutveckling grundkurs, DA120A sm11

Lathund för redaktörer. Lokala webbplatser Sacoföreningar, Sacoråd och Akademikerföreningar

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

On-line produktion TDDC61

IT-körkort för språklärare. Modul 2: Blogg

Användarguide itslearning 3.3 för studenter

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

Välkomna! Utveckling och drift av mjukvarusystem. Webbprogrammerare. #wplnu #udmlnu.

Tillämpad programmering CASE 1: HTML. Ditt namn

Laboration med Internet och HTML

ShowYourPics. Kom igång guide Alpha True Fiction P roduction AB Sveavägen 98, Stockholm info@truefiction.se

IT-körkort för språklärare. Modul 3: Ljud, del 1

Version: Datum: DynaMaster 5 Golf Övergripande manual

Wordpressguide - Palmstiernska Släktföreningen. Det här kan du göra:

Internet. En enkel introduktion. Innehåll:

Skapa spellista i play.lnu.se Gör en samling med filmer som hör ihop

Användarguide itslearning

Projekt Foreläsning VI

Publicera på sodrastation.org

Text och galleri på fotoklubbens nya hemsida

Manual för blogg.lnu.se

Itslearning introduktion

Personalsupport. Medicinska fakulteten, Lunds universitet. Textredigeraren. Moodle version 2.7.1

Snabbkurs i Wordpress för IOGT-NTO

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

Steg-för-steg vägledning. Hur du använder din etwinning-plats

Webbstudieplatsen Moodle

Introduktion till betaversionen av mediaportalen

Användarmanual HOIF.org

Användarguide itslearning 3.3 för studenter

Självbetjäning för arbetsgivare. Användarhandledning Arbetsgivartjänsten Lämna uppgifter

Elektronisk publicering TNMK30

CMS. - Content management system

Lägga in filer i filarkivet

Manual för din hemsida

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

Google Suite For Education

Transkript:

Laborationsanvisning Presentera dig själv Laboration 1 Författare: Johan Leitet Version: 2 Datum: 2011-08-01

Inledning Denna inledande laboration syftar i mångt och mycket till att du ska känna dig bekväm med den laborationsmiljö som skolan erbjuder eller få möjlighet att skapa dig en egen miljö hemma. Uppgifterna kommer inte att vara allt för svåra och har du sysslat med html tidigare så kommer du troligtvis få en behaglig resa så här i början. Du som är ny på html kan finna mycket hjälp i de inspelade demonstrationer som du hittar via kursens webbplats. Mål Efter genomförd laboration ska du kunna skapa enklare html-dokument som du kan ladda upp till skolans webbserver för publicering. Du kommer vidare att kunna valideras dessa uppladdade dokument. Du kommer att få lära känna de enklaste html-taggarna så som p, h, ul lite bättre. Förberedelse Innan du kommer till laborationstillfället bör du vara så förberedd att du känner att du hinner genomföra och redovisa laborationen under det handledda tillfället. Du får givetvis göra laborationen helt klar i förväg och du har då möjlighet att utnyttja handledningstillfället för frågor och redovisning. Läs igenom hela laborationshandledningen innan du påbörjar laborationen. Genomförande Utför laborationens uppgifter och moment samt dokumentera vad du kommer fram till på de olika delarna. Vid redovisning av laborationen ska du kunna besvara frågor om hur du har löst de olika delarna och varför de är lösta på det sätt du löst dem på. När du anser dig vara klar med laborationen kontrollerar du att din källkod uppfyller laborationens samtliga krav. Plagiat Laborationen ska genomföras enskilt. Du får givetvis fråga klasskamrater om hjälp men du ska skriva din egen kod och kunna svara för varför du skrivit din kod på det sätt du gjort. Vid fuskmisstanke lämnas misstankar samt berörda dokument över till universitetets disciplinnämnd. 2 (6)

Uppgift 1.1 www-katalog Vi ska börja med att bekanta oss med laborationsmiljön. Beroende om du sitter på campus eller på distans så kommer denna uppgift att skilja sig åt något. Det du ska göra är att kontrollera att du på nätverksenheten p: har en katalog som heter www. Campus Sitter du inloggad på en dator på campus kan du öppna en filhanterare (win+e) och navigera dig till p: Väl där kontrollerar du att katalogen www existerar och att du har en fil, default.htm, i denna katalog. Distans På distans så har du inte direkt tillgång till nätverksenheten p:. Det finns dock flera olika möjligheter för dig att koppla upp dig mot denna enhet för att föra över filer. Bästa sättet för att lyckas bra med laborationerna i denna kurs är att använda ett separat ftp-program, alternativt använda en editor med inbyggt stöd för ftp. På kursens webbplats finns inspelade demo som visar hur du använder ftp. Alternativ två är att använda http://wfm.lnu.se. Denna webbklient låter dig få tillgång till p: och du kan då på samma sätt som campus kontrollera om du har tillgång till www-katalogen. Om du inte har någon www-katalog Om du inte har någon www-katalog så ska du inte själv heller skapa denna katalog. Kontakta i så fall kursansvarig så fort som möjligt så ser vi till att denna katalog skapas till dig. Anledningen till att du inte har en www-katalog är att du troligtvis studerat någon icke it-relaterad utbildning eller kurs vid LNU, HIK eller VXU tidigare och ditt konto är då inte uppgraderat. 3 (6)

Uppgift 1.2 Ett första dokument Under kursens laborationer kommer du steg för steg att bygga upp en blogg, eller enklare hemsida som ska kunna användas för att bland annat presentera laborationer på. Det första steget vi ska ta nu är att skapa ett första html-dokument som kommer att innehålla en presentation över dig, vad du gjort tidigare etc. Du är fri att själv forma innehållet men det vore intressant att bland annat få veta följande: Intressen Familj Vad du är bra respektive mindre bra på Tidigare utbildning? Arbetslivserfarenhet? Har du programmerat tidigare? Vad fick dig att söka utbildningen? Tankar inför framtiden? Denna sida döper du till presentation.html. Sidan ska placeras i en katalog som du döper till pages och som du lägger i din www-katalog på p: I presentation.html ser du nu till att skapa ett html-dokument med de delar som detta innebär. Se även till att validera ditt dokument tidigt så att du vet att du är på rätt spår. Om du följt instruktionerna och lagt filen presentation.html i katalogen pages som ligger i katalogen www, så når du denna fil genom webbadressen: http://homepage.lnu.se/student/xx222yy/pages/presentation.html där xx222yy byts ut mot ditt användarnamn. Det är även denna webbadress som du skriver in i validatorn. För att uppgiften ska vara godkänd ska ditt dokument minst innehålla följande: Två rubriknivåer Text separerad med hjälp av paragraftaggar. Samtliga listor. (ol, ul, dl) Minst en lista som ligger inuti en annan lista. Minst en kommentar Texten Ansvarig för materialet på denna sida är följt av ditt namn. 4 (6)

Uppgift 1.3 Startsidan Du ska nu göra din startsida som kommer att fungera som en form av blogg för att presentera uppgifter som du gör i kursen. Skapa dig en ny html-sida som du döper till index.html och som du publicerar direkt i katalogen www. Du kan samtidigt ta bort filen default.htm som du troligtvis har i katalogen www. Detta gör att webbservern nu kommer att servera filen index.html om man skriver in adressen: http://homepage.lnu.se/student/xx222yy/ där xx222yy byts ut mot ditt användarnamn. Skapa nu en lämplig rubrik för din sajt och skriv ett första blogginlägg, komplett med rubrik och stycken. Tänk redan nu på att du kommer att skapa flera inlägg under kursens gång. Ett exempel på hur detta kan se ut: h1 h2 h3 p p Observera! Tänk inte i detta skede alls på presentationsdetaljer. Kanske vill man ändra färg på texten, ändra typsnitt, ha kursiv text etc. Detta är inget vi ska bry oss om i detta skede. Det viktiga nu är att vår kod är så semantisk och välskriven som möjligt. 5 (6)

Vanliga problem: P: Filen heter presentation.html och ligger i katalogen pages i www-katalogen men jag kommer inte åt den genom att skriva in adressen ovan. L: Det är mycket möjligt att du råkat döpa filen till presentation.html.html om du sitter i Windows eftersom Windows normalt sett döljer filtilläggen. Kontrollera därför noga att du inte har döpt filen till.html.html, alternativt.html.txt L: Har du skapat din www-katalog själv för att den inte fanns från början? Kontakta i så fall kursledningen. Katalogen www kan man inte skapa själv. P: Svenska tecken, ÅÄÖ och andra specialtecken ser lustiga ut. L: Du använder inte samma teckenuppsättning på ditt dokument som du angivit i meta-taggens charset. Se demo på kurswebben för lösning. Vanliga frågor: F: Behöver jag publicera på p:\www? S: Nej, men du måste publicera din site på en publikt åtkomlig webbserver. F: Måste jag använda de filnamn som används ovan? S: Nej, men det underlättar rättningsarbetet. Känner du dig trygg med att döpa filerna till andra namn och lägga dem i andra kataloger är du fri att göra så. F: Får jag redan nu använda andra taggar eller css? S: Ja, så länge som resten av kraven är uppfyllda är detta okej. 6 (6)