Oppgavesamling til Webutvikling < >
|
|
|
- Martha Johannessen
- 7 år siden
- Visninger:
Transkript
1 TOM HEINE NÄTT EVA M. HORNNES JOSTEIN NORDENGEN Oppgavesamling til Webutvikling Oppdatert < >
2 2 Kapittel 1 Introduksjon til webutvikling 1.1 Hva husker du? Teori: Gå sammen to og to og besvar følgende spørsmål: 1. Hva er HTML en forkortelse for? 2. Hvilke seksjoner finner vi i et HTML-dokument (se nedenfor)? <!DOCTYPE html> <html> <head> </head> <body> </body> </html> <title> Vår første nettside</title> <meta charset="utf-8" /> <h1>velkommen til vår første nettside</h1> 3. I hvilken seksjon finner vi de taggene som blir synlig i nettleservinduet? 4. Hva gjør disse taggene: 1. <h1> </h1> 2. <p> </p> 5. Hvorfor bruker vi stilark (CSS)? 6. I hvilken seksjon plasserer vi metadata? Og hva er egentlig metadata? 7. <!DOCTYPE html> står først i HTML-dokumentet hva gjør denne taggen?
3 3 1.2 Dyreadopsjon html repetisjon Sørg for å opprette en undermappe i mappen Webutvikling/Kapittel1 som du kaller dyreadopsjon. Kopier følgende bildefiler hest.png, katt.png og hund.png inn i mappen dyreadopsjon. Opprett en oppstartsfil i mappen som du kaller index.html. Prøv å huske hvilke tagger du trenger (ved behov se sist i oppgaven) for å få resultatet under.
4 4 Opprett en ny side som heter katt.html med følgende innhold: Opprett en ny side som heter hund.html med følgende innhold Opprett siden hest.html med følgende innhold:
5 5 Endre i index.html slik som under. Legg inn hyperkoplinger til de html-filene du nettopp laget. Opprett stilarket stil.css og legg inn en kopling til dette stilarket i alle html-filene. Slik skal resultatet bli:
6 6 Tagger du vil få bruk for: Tagg <!DOCTYPE html> <html></html> <head></head> <title></title> <meta charset="utf-8" /> <link rel="stylesheet" type="text/css" href="filnavn.css" /> <body></body> Forklaring HTML5-standard Start og slutt på koden Seksjon med info til nettleser og søkemotorer Legge inn tittel i arkfanen på hver fil Tegnsett Sette inn lenke til et stilark Seksjon som blir synlig <h1></h1 <p></p> <img src="hest.png"> Nytt avsnitt Sette inn bilde <a href="hest.html">klikk her</a>
7 7 Kapittel 2 HTML og CSS 2.1 Pokemon GO 1. Opprett en mappe i kapittel1 som du gir navnet pokemon 2. Opprett en undermappe bilder i mappen pokemon I denne mappa legger du bilder av følgende Pokemon: Du skal også finne logoen til Pokeman GO og legge i bildemappa. Dette bildet skal ha navnet logo.jpg. 3. Opprett en ny fil som du lagrer i mappen pokemon med navnet index.html, og skriv inn følgende kode: Taggen <button> setter inn en menyknapp. Når du så også setter inn taggen <a>, sørger du for at denne knappen fungerer som en hyperlink slik at du kan hoppe til en side kalt pikachu.html.
8 8 Opprett en ny fil i samme mappe som du gir navnet pikachu.html, og skriv inn følgende kode: 4. Sørg for at begge filer er lagret og forhåndsvis begge i nettleseren. Du skal nå kunne bruke menyknappene for å hoppe fram og tilbake mellom sidene. 5. Du skal så opprette én side per pokemon og sørge for at det er en menyknapp for hver side i alle sider, inkludert index.html. Det betyr at taggen <body> i hver eneste fil skal inneholde følgende, bytt ut ** ** med riktig tekst:
9 9 6. Test at du kan hoppe fritt mellom alle sider. Du skal nå formatere samtlige sider og sørge for at bildene får en bredde på 200 px og at de får en ramme rundt med rødfargen fra pokemonballen. Alt innhold skal rykkes inn 20 piksler mot høyre. 7. Velg Fil > Ny i editoren og lagre som stilarkfil.css. 8. Skriv så inn følgende kode:
10 10
11 11 Kapittel 3 Strukturere websider 3.1 Reisebyrået «Ryk og Reis» Bruk kapittel 3 til oppslag for å finne nødvendige koder. Du skal lage et nettsted for et reisebyrå. Nettstedet skal presentere flere ulike reisemål med både tekst og bilde. 1. Opprett en mappe kalt reisebyrå i mappen kapittel3. 2. Opprett to undermapper, bilder og filmer. 3. I mappen bilder legger du bildene kajakk.jpg, skihopp.jpg, new york4.jpg og rovinj_by.jpg. 4. I mappen filmer legger du videotest.ogg. 5. Opprett en ny fil i notepad++ som du gir navnet index.html. 6. Skriv inn nødvendig kode for å få vist følgende innhold (husk å bruke tittellinjen): Som du ser, er deler av teksten formatert, og du trenger derfor et stilark. 7. Opprett en ny fil som du gir navnet feriestil.css, og skriv inn nødvendig kode slik at din index.html blir lik eksemplet over. 8. Gå så til index.html og sett inn bildene fra mappen bilder under teksten du allerede har. Bildene skal ha hvert sitt attributt slik at når du peker på bildet, kommer følgende tekster frem (tips: title): a. Norgesferie b. Skiferie i Sveits c. Storbyferie i New York d. Badeferie i Rovinj 9. Skriv inn nødvendig kode i stilarket ditt slik at bildene: - får en høyde på 300 piksler - får en felles bildetekst som sier «Pek på bildene for å få litt informasjon. Klikk på bildet for å gå til en side for å lese mer om reisemålet».
12 Sørg for at du står i index.html og legg til nødvendig kode slik at du får vist følgende tekst under bildene: 11. Legg så til kode slik at du får en strek før resten av teksten og avspilling av filmen videotest.ogg: 12. Endre igjen i stilarket slik at du får følgende resultat når du forhåndsviser index.html i nettleseren din:
13 13 Du skal nå sørge for at hvert bilde blir en hyperlink til en side som har informasjon om valgt destinasjon. 13. Lag en side for hver destinasjon og navngi de for eksempel slik: a. norge.html b. sveits.html c. newyork.html d. rovinj.html 14. Sørg for at hver av disse sidene har en mulighet for å komme tilbake til index.html og at de inneholder en tabell med informasjon om ulike reiser på valgt destinasjon. Finn på egne data, bruk gjerne internett for å finne relevant informasjon. 15. Formater tabellen i stilarket slik at den likner mest mulig på eksemplet som er vist under:
14 14 Kapittel 4 Formgi nettsider 4.1 Megafunpark utvidelse Før du går i gang er det en god ide å ha utført eksempelet «Interaktivtet» side Oppgaven baserer seg på at du har utført oppgave Megafunpark s Finn noen bilder av attraksjoner som kan brukes som illustrasjon til «The raptor» og «Dizzyrun» og lagre i kapittel4 Bruk semantisk tag og lag en meny som vist i eksempelet Interaktivitet (starter nederst s 87) Bakgrunnsfarge skal være lik tekstfargen på <h1> Når du peker på knappen, skal bakgrunnsfargen endres til fargen på <h2> Legg også på nødvendig kode i stilarket slik at man kun ser innhold til det menyvalget du har klikket på Bruk bildene, angi størrelse, ramme og legg på skyggeeffekter som vist på s. 105 Finn gjerne skyggefarge på
15 15 Kapittel 5 Mer om layout og design 5.1 Hvordan lage midtstilt nettsted som kan skaleres Hoveddelen skal utvides etter hvert som den fylles med innhold. Nettsiden skal alltid være midstilt uansett zoomverdi. Menyen skal lages som en unordered liste. 1. Opprett mappen layout i mappen kapittel5 2. Åpne malfila og lagre som index.html i denne mappa 3. Skriv inn følgende kode i index.html: Alt innhold på nettsiden legges inne i en <div> som vi gir navnet «wrapper» Inne i wrapperen ligger <header>, <nav> og <main> <ul> vil utgjøre menyen som vist over
16 16 4. Opprett en mappe bilder i mappen layout 5. Lagre bildet logo.png i bildemappen 6. Opprett en ny fil og gi den navnet stil.css. Husk å endre i index.html slik at den refererer til riktig stilfil 7. Skriv inn koden under i stil.css for å formatere «wrapperen» - den delen av koden som sørger for nettsidens størrelse og posisjonering Forklaring: 1. Vi vil benytte flexbox som er den nye måten å posisjonere innhold på i CSS 2. Vi vil ha innholdet i «wrapperen» i hver sin rad (ikke kolonne) 3. Vi vil ha radene under hverandre 4. Heltrukken kantlinje, rød farge 5. Bredden på nettsiden er 970px 8. Skriv inn koden under i stil.css for å formatere <header>-del altså den delen som inneholder logoen Forklaring: Vi vil benytte heltrukken kantlinje rundt logoen 2. Vi vil at størrelsen på logoen skal være 100% (=970 px i dette tilfelle) når nettsiden åpnes
17 17 9. Skriv inn koden under i stil.css for å formatere <nav>-delen, altså den delen om inneholder menyen Forklaring: Vi vil benytte heltrukken kantlinje rundt menyen 2. Vi vil at størrelsen på menyen skal være 100% (=970 px i dette tilfelle) når nettsiden åpnes Skriv inn koden under i stil.css for å formatere den delen av nettsiden hvor innholdet skal være. Forklaring: Flex: auto medfører at <main> endrer størrelse avhengig av innholdet 2. Uansett mengde innhold skal høyden være minimum 800 px 10. Vi skal nå formatere punktlisten slik at den fungerer bedre som en meny. Skriv inn koden under i stil.css Forklaring: 1. Fjerner kulepunkter 2. Fjerner marger 3. Sørger for at menyen dekker hele bredden av <nav>-delen
18 Vi skal nå formatere menyen videre. Merk at dette kun vil gjelde for punktlistelementer som fungerer som en hyperkobling (<a>). Husk at vi leser fra høyre mot venstre. Skriv inn koden som vist under i stil.css Forklaring: Listen holder seg innenfor <nav>delen 2. Fjerner tekstformatering her sørger vi for at menyvalget ikke blir understreket, noe som ellers er standard for et <a>-element 3. Farge på menyen ( olors_names.asp) 4. Tekstfarge sort, størrelse 30px 5. Setter avstand 10px til kantlinja (topp, høyre, bunn og venstre) Forklaring: 1. Når vi tar musepeker over et menyvalg, endres fargen til angitt hexakode (rødfargen fra logoen) Forklaring: 1. Sørger for at menyen blir horisontal 2. Hvert menyvalg dekker 25% av total størrelse som er tilgjengelig 12. Sørg for at du står i index.html i editoren. Endre <h1>-teksten til «Bestilling». Velg Fil > Lagre som og gi den navnet bestille.html Endre så <h1>-teksten til «Kontakt oss» og lagre som kontaktoss.html. Endre så <h1>-teksten til «Vareutvalg» og lagre som vareutvalg.html.
19 19 Du vil nå ha følgende filer i mappen layout: 5.2 Håndtere innhold som går utover skjermens høyde Løsning 1 (oppgave midstilt nettside): - Main utvides ved økt innhold vil gå utover det som vises i nettleservinduet - For å lese innhold som ikke vises, benyttes scrollbaren i nettleseren
20 20 Løsning 2: - Hele main vil alltid vises i nettleservinduet - Dersom innhold overskrider størrelsen på main, blir det satt inn en scrollbar i main Utfør følgende endringer i selectoren main i stilarket: main { border-style: solid; flex: auto; height: 820px; overflow-y:auto; } Sett fast størrelse på main Vis scrollbar dersom innholdet overstigerer størrelsen på main
21 Sportsforretningen Intersalg Du er ansatt i sportsforretningen Intersalg og har fått i oppdrag å lage et nytt nettsted for forretningen. Bruk kunnskapen du nå har tilegnet deg samt kapittel 1-5 i boka, og utfør følgende oppgaver: Opprett et nytt webområde og kall det for intersalg Opprett en hovedside hvor du kort presenterer firmaet Intersalg Bruk gjerne layoutoppsettet som vist på side i boka Webutvikling Gi websiden tittelen Velkommen til Intersalg best på sportsutstyr. Lagre den som index.html På hovedsiden skal det være en enkel meny med følgende valg: Kontaktinformasjon, Om oss, Våre produkter og Samarbeidspartnere Lag gjerne menyen som vist i boka Webutvikling side eller som vist i oppgave 5.1. Opprett et stilark hvor du eksempelvis formaterer valgt meny. Et annet eksempel er beskrivelse av skrifttyper som vist på side i boka Webutvikling. Opprett videre en ny webside hvor du oppgir kontaktinformasjon til de ulike ansatte i forretningen. Lagre websiden som kontakt.html Lag en hyperlink til kontaktsiden fra menypunktet på hovedsiden Lagre også ferdig de andre websidene i webområdet (om oss, våre produkter og samarbeidspartnere), og opprett hyperlinker til disse fra menyen i samtlige websider Finn selv på tekst, filnavn og titler. Legg til punktmerkede og nummererte lister der det er naturlig. Testkjør websidene og sjekk at hyperlinkene fungerer Lag et banner for sportsbutikken i valgt bildebehandlingsprogram og legg denne på toppen av alle websidene Sett inn bilder og illustrasjoner som passer til en sportsbutikk, på de ulike websidene. Bruk gjerne posisjoneringsteknikken floating for plassering av bilder se i boka Webutvikling side Forhåndsvis nettstedet i en nettleser
22 Malerforretningen Fargeklatten Du er ansatt i malerforretningen Fargeklatten og har fått i oppdrag å lage et nytt nettsted for forretningen. Bruk kunnskapen du nå har tilegnet deg samt kapittel 1-5 i boka, og utfør følgende oppgaver: Opprett et nytt webområde og kall det for fargeklatten Bruk gjerne layoutoppsettet som vist på side i boka Webutvikling Opprett en hovedside hvor du kort presenterer malerforretningen Fargeklatten Gi websiden tittelen Velkommen til Fargeklatten vi setter farge på tilværelsen, og lagre den som index.html På hovedsiden skal det være en meny med følgende valg: Kontaktinformasjon, Om oss, Våre produkter og Fargekart Lag gjerne menyen som vist i boka Webutvikling s eller som vist i oppgave 5.1 Opprett et stilark hvor du eksempelvis formaterer valgt meny. Andre eksempler er formatering av tekst side Opprett de aktuelle websidene og finn selv på aktuell tekst, filnavn og titler Lag hyperlinker til websidene fra menyen slik at linkene fungerer på alle nettsider Testkjør websidene og kontroller at hyperlinkene fungerer På nettsiden Våre produkter skal du benyttet en tabell - se i boka Webutvikling side for tips til formatering av tabellen Lag en banner for malerforretningen og legg denne på toppen av alle websidene Sett inn bilder og illustrasjoner som passer til en malerforretning på de ulike websidene. Bruk gjerne posisjoneringsteknikken floating for plassering av bilder se i boka Webutvikling side Sett også gjerne inn skyggeeffekt på bildene se side 105 i boka Webutvikling Forhåndsvis nettstedet i en nettleser
23 Serie Du har fått i oppdrag av en serieprodusent å lage et nettsted som presenterer en serie for norsk ungdom mellom 16 og 20 år. Du må gjerne få inspirasjon fra andre nettsider om samme serie, men du skal utvikle et nettsted med «ditt» brukergrensesnitt. Oppgavebeskrivelse Se s.126 -> for alternative oppsett Lag en collage som synliggjør det visuelle utrykket i valgt serie. Denne collagen skal danne utgangspunkt for det brukergrensesnittet du velger deg Lag så en fargepalett, bruk med utgangspunkt i bildet fra punktet over Lag et bilde i et bildebehandlingsprogram som viser «din» fargepalett. Sett på fargekoden til hver farge, og skriv også hva den enkelte farge skal brukes til (for eksempel farge på bakgrunn, farge på tekster, bilderammer, logo osv.) Velg én eller flere fonter du vil bruke på nettstedet, og begrunn valget. Bruk gjerne en google-font, evt. last ned en egen font Lage et webområde/site på localhost på egen maskin, gi siten et passende navn. Siten skal kun inneholde de filene som trengs for å vise nettstedet på nett. Filene skal ha fornuftige navn og formater Presenter historien, persongalleriet og annen informasjon med både tekst og bilde Nettstedet skal også ha en egenutviklet logo som skal gå igjen på hver side, og logoen skal inneholde tekst og bilde Nettsidene skal bygges opp ved hjelp av wrapper og semantiske tagger (side ). Samtlige nettsider skal ha det samme oppsettet Wrapper, semantiske tagger og andre tagger skal formateres i et eksternt stilark (CSS) Nettstedet skal ha et menysystem, bruk liste som formateres i stilarket (se side 130). Nettstedet skal ha et ikon (favicon) som lages i Photoshop eller ved hjelp av en favicon-generator. Kode til <head>-del: <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"> <link rel="icon" href="/favicon.ico" type="image/x-icon"> Bytt ut filnavn og type med det som passer ditt favicon. Hver enkelt nettside i webløsningen skal ha en egen tekst i tittellinja Alle bilder du bruker, skal bearbeides i valgt bildebehandlingsprogram, for eksempel ved tilpasning av bildestørrelse. Sørg for at filmseriens navn vises som en tekst på bildet Nettstedet skal inneholde minst én animasjon. En animert gif laget i valgt bildebehandlingsprogram settes inn som et vanlig bilde. Bruk følgende kode dersom
24 24 du har laget en animasjon i verktøy som Adobe Animate CC: <embed src="navn på animasjon.swf"> Forbered deg på å vise løsningen din for lærer hvor du viser det ferdige nettstedet viser collage og fargeprofilen i valgt bildebehandlingsprogram begrunner valg av font forklarer kode fra dine nettsider (både HTML og CSS) Favicon-generator Kapittel 11 i IT 1, basisbok om «lov om opphavsrett» Kapittel 12 i IT 1, basisbok om «brukergrensesnitt» Kapittel 1-5 i boka Webutvikling Til inspirasjon: Eksempel på en nettside for serie
25 25 Kapittel 6 Eksempel - Festival 6.1 Repetisjon Se side 54 i boka «Webutvikling» for å vise tagger som tekst 1. Lag en mappe som du kaller cheatsheet 2. Åpne fila mal.html 3. Velg Fil Lagre som og gi den navnet index.html 4. Skriv inn følgende kode:
26 26 5. I <nav> skal vi som vanlig sette inn en meny i form av en punktliste (to valg i første omgang): <nav> <ul> </ul> <li><a href="index.html">hjem</a></li> <li><a href="tagger.html">nyttige tagger</a></li> Finn selv på aktuelle menyvalg for tips se begynnelsen av oppgaven </nav> 6. I <header> skal du sette inn en overskrift: <header> <h1>webutvikling i IT1-faget skoleåret </h1> </header> 7. I <main> skal du skrive inn lett tekst og bruker den semantiske taggen <article>: <main> <article> <h1>presentasjon av meg selv</h1> <p>...skriv noe her...</p> </article> <article> <h1>læreplanmål i IT-1 faget</h1> <p>...presenter de tre læreplanmålene...</p> </article> <article> <h1>verktøy</h1> <p>...om de verktøyene du bruker i faget...</p> </article> </main> 8. Lagre som index.html og forhåndsvis i nettleser
27 27 Du er nå klar til å formatere utseende i et eksternt stilark: 9. Opprett en ny fil som du kaller stil.css 10. For å være sikker på at du bestemmer størrelsen på alle marger og padding setter du disse til 0 innledningsvis for alle elementer (*). Skriv inn følgende først i stilarket: 11. Du skal så beskrive «wrapper», body og de semantiske taggene du har tatt i bruk 12. I <header> har du lagt en overskrift (<h1>). Denne skal du nå formatere, men samtidig sørge for at dette ikke påvirker andre overskrifter på nettstedet. 13. Lagre og forhåndsvis i nettleser hvorfor blir teksten i <header> midstilt? Du er nå klar til å omgjøre punktlisten til en meny: 14. Skriv inn følgende beskrivelse av punktlisten i stilarket:
28 Forhåndsvis i nettleseren og se at du har en horisontal meny (alle valg på samme linje) 16. Endre i nav ul slik at det står du får linjebrudd for hvert menyvalg Bestem selv om du vil ha menyen slik den er nå, eller om du vil ha den horisontal (nowrap), altså på samme linje. 17. Til sist skal du legge til kode i stilarket som gjør at menyvalget endrer farge når du peker på det med musepekeren 18. Legg til innhold i alle sidene:
29 29 Tips: Hvis du vil ha inn bilder som teksten skal flyte rundt kan du bruke floating. - Sett inn bilde i HTML-dokumentet - Formater <img>-taggen i stilarket slik at teksten flyter rundt. Her har vi bestemt at bildet skal justere seg til høyre i forhold til teksten. I dette eksempelet har vi flere <article>-tagger som inneholder både tekst og bilde:
30 30 Kapittel 11 Arbeide med SQL 11.1 Oppgave inventar (oppgave med én tabell) Skolen ønsker en oversikt over hva slags inventar de har på skolen. Dette vil de registrere i en database slik at de kan søke etter og telle opp utstyr. Opprett en database/skjema inventar Opprett en tabell du kaller utstyr med følgende felt: Feltnavn Datatype Beskrivelse objektnr Tall (Heltall) Felt som skal fungere som teller, og den skal automatisk øke med én for hver registrering. Primærnøkkelfeltet for tabellen objektnavn Tekst (45) Tekstfelt avsatt med feltstørrelse 45 posisjoner. Feltet må alltid fylles ut, det kan ikke stå tomt beskrivelse Tekst Felt der hvert objekt kan beskrives med en lengre fritekst (for eksempel like mye tekst som på et A4-ark) regdato Dato Velg format dato Registrer minst 6 poster i tabellen Ta utgangspunkt i utstyr du ser i rommet du sitter i (stoler, pulter, tavle, skap, søppelbøtte, papirbøtte, prosjektor) Sørg for at du registrerer minst to like objekter, f.eks. to skap
31 SQL-øvinger Opprett en SQL-spørring ved å trykk på fram: i knapperaden. Lag følgende spørringer som viser Alle poster som er registrert i tabellen utstyr, ta med alle felt * SELECT * FROM utstyr; Alle poster som er registrert i tabellen utstyr, ta med kun objektnr og objektnavn SELECT objektnr, objektnavn FROM utstyr; Vis alle poster som er registrert i tabellen utstyr. Ta kun med feltene objektnavn og regdato. Sorter utlistingen slik at det objektet som er sist registrert, kommer sist SELECT objektnavn,regdato FROM utstyr ORDER BY regdato; Endre sorteringen slik at du får de som er registrert sist, øverst i lista SELECT objektnavn,regdato FROM utstyr ORDER BY regdato DESC; Vis alle poster i tabellen utstyr som har objektnavn som begynner på s, ta med kun objektnr og objektnavn SELECT objektnr, objektnavn FROM utstyr WHERE objektnavn LIKE 's%';
32 32 Vis alle poster i tabellen utstyr som har objektnavn som inneholder bokstaven s, ta med kun objektnr og objektnavn SELECT objektnr, objektnavn FROM utstyr WHERE objektnavn LIKE '%s%'; Vis alle poster som er registrert i 2017 SELECT objektnr, objektnavn, regdato FROM utstyr WHERE regdato >= ' '; Sørg for at du har registrert minst to skap. Tell så opp hvor mange skap det finnes på skolen SELECT COUNT(objektnavn) FROM utstyr WHERE objektnavn = Skap ;
33 33 Kapittel 12 Koble dynamiske nettsider og MySQL 12.1 Forberedelse til dynamisk web 1. Åpne valgt editor og skriv inn følgende kode: Forklaring: 1: lagringssted (her: wamp>www) 2: navn på bruker 3: passord (her: blankt) 4: navn på database 2. Lagre i mappen C eller D > wamp > www med navnet mal.php Bruk denne malfila i oppgavene fra kap 12 og utover i Webboka Bruk av «Kodegeneratoren» 1. Lagre mal.php i mappen wamp/www/kapittel12 med navnet sitaterenkel.php 2. Skriv inn følgende adresse i nettleseren din:
34 34 Resultat: Du skal nå lage en tilkobling til tabellen sitat som viser feltene id og tekst. 3. Gå til nettsiden 4. Fyll inn data som vist under : 5. Trykk på generer og merk/kopier koden som kommer opp: 6. Sørg for at filen sitaterenkel.php er åpen i editoren og lim inn den kopierte kodesetningen som vist under:
35 35 Som du ser, har du fått generert akkurat den koden du trengte for å koble deg til ønsket database altså en enklere måte enn å skrive inn alt selv slik du gjorde da du laget malfila. Slett den innlimte kodesetningen du trenger bare én. Du skal nå lage en tilkobling til tabellen sitat i denne databasen og vise feltene id og tekst. I stedet for å skrive inn all koden selv skal du benytte kodegeneratoren. 7. Sørg for å stå i fila sitaterenkel.php i editoren, rett under php-koden som sørger for tilkoblingen til databasen: 8. Gå til nettsiden 9. Finn alternativet Plukke ut et datasett og skriv inn sql-setningen som vist i rødt på side 241 i boka «Webutvikling» (SELECT id, tekst FROM sitat): <?php 10. Klikk på Generer og merk/kopier koden som kommer opp 11. Lim inn koden som vist: $tilkobling = mysqli_connect("localhost","root","","sitatregister"); $sql = "SELECT id, tekst FROM sitat"; $datasett = $tilkobling->query($sql);?> 12. Åpne nettsiden i nettleseren og sjekk at du ikke får noen feilmeldinger 13. Fullfør oppgaven start på pkt 3 side 241
36 36 Kapittel 13 Hente ut data 13.1 Oppgave inventar (oppgave med to tabeller) Skolen ønsker en oversikt over hva slags inventar de har på skolen. Dette vil de registrere i en database slik at de kan søke etter og telle opp utstyr. De vil også registrere hvilket rom det enkelte utstyr står i og hva slags utstyr vi har i en etasje. Opprett en database som du gir navnet skoleinventar Opprett en tabell du kaller rom med følgende felt: Registrer følgende data: Opprett en tabell du kaller utstyr med følgende felt:
37 37 Registrer følgende data I tabellen: 13.2 SQL-øvinger Opprett en SQL-spørring ved å trykk på fram: i knapperaden. Lag følgende spørringer som viser Alle rom i bygget SELECT * FROM rom; Alle rom i første etasje SELECT * FROM rom WHERE etasje = 1; Objektnavn, beskrivelse og romnr for alt utstyr i alle rom SELECT objektnavn, beskrivelse, utstyr.romnr FROM utstyr;
38 38 Objektnavn, beskrivelse, romnr og etasje for alt utstyr i alle rom Siden du nå skal hente data fra to tabeller, må du si ifra at du bare vil se de dataene som er koblet sammen med fremmednøkkel (utstyr.romnr). SELECT objektnavn, beskrivelse, utstyr.romnr, etasje FROM utstyr,rom WHERE utstyr.romnr = rom.romnr; Forsøk så å fjerne siste setning i SQL-spørringen hva blir nå resultatet? Registrer noen flere rom i etasje 3 og 4. Registrer også noe utstyr i disse rommene. Fortsett å lage spørringer som viser: Objektavn, beskrivelse, romnr, etasje sortert på romnr SELECT objektnavn, beskrivelse, utstyr.romnr, etasje FROM utstyr,rom WHERE utstyr.romnr = rom.romnr ORDER BY romnr; Objektavn, beskrivelse, romnr, etasje i etasje 2 og 4, sortert på romnr SELECT objektnavn, beskrivelse, utstyr.romnr, etasje FROM utstyr,rom WHERE utstyr.romnr = rom.romnr AND (etasje = 2 OR etasje = 4) ORDER BY romnr;
39 39 Kapittel 14 Legge inn og oppdatere data 14.1 Database med tilhørende nettsted Denne oppgaven forutsetter at du har utført oppgavene i kapittel 11 tom 14. Database du skal lage her er svært lik databasen i disse kapitlene og du vil finne hjelp til å løse oppgavene i boka «Webutvikling». I kapittel 9 i IT 1, basisbok kan du lese om ulike sikkerhetstrusler. Tenk deg at en bedrift ønsker at du skal utvikle en database hvor de ansatte kan registrere ulike trusler de opplever. Registreringen skal skje fra et nettsted. Fra det samme nettstedet skal man kunne se alle truslene som er registrert. Opprette databasen og registrere testdata Bedriften ønsker økt fokus på IT-sikkerhet. De ønsker å registrere sikkerhetstrusler og ta ut oversikter over hva slags sikkerhetstrusler virksomheten utsettes for. IT-sjefen ønsker å opprette en database der alle hendelser knyttet til IT-sikkerhet skal registreres. Hver hendelse registreres som en trussel, og hver trussel skal knyttes til en kategori. 1. Se i kap 11 i webboka og implementer datamodellen gi databasen navnet sikkerhetsdatabase: 2. Registrer følgene kategorier: idkate Kategorinavn Kategoribeskrivelse gorier 1 Malware Kategorien for tilfeller av virus, spyware, trojaner, ormer og rootkit på PC 2 Botnett Kategorien for tilfeller der bedriftens pc er blir zoombier i et botnett 3 Hoax Kategori for falske sikkerhetstrusler 4 Malware mobil Kategori for tilfeller av virus på mobiltelefoner 5 Hacking Kategori for tilfeller det bedriften opplever hacker-angrep 6 Sosial engeenering Kategori for tilfeller der sikkerheten ble utfordret på grunn av menneskelig feil og svakheter 7 spoofing Kategori for tilfeller der ansatte oppdager at de mottar e-post fra «falske» avsendere 8 Phishing Kategori for tilfeller der ansatte oppdager at de er på falske nettsider (kopinettsider)
40 40 9 Account hijacking Kategorien for tilfeller der ansatte opplever at brukernavn og kontoer er blitt stjålet og misbrukt 10 Feil i programkode Kategori for tilfeller der det er blitt sikkerhetsbrudd som følge av programkodefeil internt eller eksternt 3. Finn deretter på noen trusler som du registrerer i tabellen trusler og knytt disse til en kategori Opprette ulike spørringer med SQL Opprett tre ulike spørringer i MySQL Workbench og lagre dem med fornuftige navn 1. Opprett en spørring i SQL som viser fram alle kategorier 2. Opprett en spørring i SQL som viser fram alle kategorier som begynner på bokstaven M 3. Opprett en spørring i SQL som viser fram alle kategorier med tilhørende trusler Opprett site og nettsider Opprett så nettsider som du kobler til denne databasen. Krav til løsningen: 1. Lage et webområde/site på localhost på egen maskin, gi siten et passende navn. Siten skal kun inneholde de filene som trengs for å vise nettstedet på nett. Filene skal ha fornuftige navn og formater. 2. Nettsidene skal inneholde bilder og passende tekst, og de skal utvikles i HTML og PHP. 3. Utvikle et banner eller logo i GIMP eller Photoshop som går igjen på alle nettsidene. Størrelsen må passe til de valg du gjør i forhold til design (bredde, høyde). 4. Nettsidene skal bygges opp ved hjelp av en wrapper og semantiske tagger. Samtlige nettsider skal ha det samme oppsettet med header, nav og main. Bruk gjerne oppsett som vist i oppgave Kap 5 - lage midstilt nettsted med header nav og main, Kap 6 - festivallight - repetisjon og malløsning eller som vist i kapittel 6 i webboka. 5. Nettsidene skal formateres i et eksternt stilark (CSS) 6. Nettstedet skal ha et menysystem du må gjerne benytte <ul> som vist i tidligere oppgaver 7. Nettstedet skal inneholdefølgende sider: a. En generell side som presenterer IT-portalen og de ansatte som jobber der b. En PHP-side som viser fram innholdet i tabellen trusler, det vil si alle trusler som er registrert med tilhørende kategori c. En PHP- side om gjør det mulig for ansatte å registrere trusler de opplever, og knytte den aktuelle trusselen til en allerede registrert kategori
41 41 Vedlegg benyttes ved behov Forklaring til sikkerhetsdatabaseoppgave Forstås slik: sikkerhetsdatabase SELECT idtrusler, trusselbeskrivelse, trusseldato, ansattnavn FROM trusler
42 42 Vise registrerte kategorier 1. Hente alle felt i tabellen kategorier som skal vises 2. Lage tabell og sette inn data fra tabellen kategorier Samme navn på datasett Husk å dobbeltsjekke at du bruker samme navn på felt som du har oppgitt som Column Name i MySQL!
43 43 Vise registrerte trusler Skriv inn koden under i body-delen slik at du får en tabell med 4 kolonner som skal vise de dataene som er lagret i databasen: Lager en overskriftsrad i tabellen Henter verdier fra tabellen trusler OBS!!! Navn må være helt like! Sjekk hvordan du har navngitt dine felt i tabellen «trusler» - navnene her må være helt like de som står i tabellen i MySQL Legg så til php-kode øverst i dokumentet slik at du får hentet de dataene som skal vises i tabellen:
44 Registrere en kategori Legg til følgende kode i HTML-delen: Oppgavesamling til «Webutvikling» 44 Sett inn et skjema med to felt og en knapp. Det navnet du bruker som id MÅ brukes når du så skal legge til kode for å lagre de dataene som skrives inn i feltene txtnavn txtbeskrivelse Legg så til følgende kode øverst i dokumentet slik at du kobler deg til databasen og setter inn de data som er fylt inn i feltene: Sjekk at din tabell heter «kategorier» og at du har navngitt feltene som her, nemlig «kategorinavn» og «beskrivelse»
45 45 Registrere trussel og angi kategori Legg til følgende kode i <body>-del slik at du får frem et skjema hvor du kan skrive inn verdier + åpne en listeboks og velge riktig kategori: Legg så til kode øverst i dokumentet slik at du får fylt opp listeboksen med registrerte kategorier: Gjør klar til å vise feltet «kategorinavn» i listeboksen og tar vare på nøkkelverdi («idkategorier») til valgt kategori sjekk at du har sammen feltnavn! Dobbeltsjekk at du har samme navn på tabell («kategorier») og samme feltnavn («idkategorier» og «kategorinavn».
46 46 Plasser deg foran?> i koden du nettopp skrev inn. Legg så til kode for å lagre data som skrives inn i feltene/velges fra listeboksen: Husk at du må bruke nøyaktig samme navn som du har valgt i MySQL Sjekk at du bruker sammen navn som du angav som id i <body>-delen I større font ser koden slik ut: if(isset($_post["submit"])) { $sql = sprintf("insert INTO trusler(trusselbeskrivelse, trusseldato, ansattnavn, idkategorier) VALUES('%s','%s','%s',%s)", $tilkobling->real_escape_string($_post["txttrusselbeskrivelse"]), $tilkobling->real_escape_string($_post["txttrusseldato"]), $tilkobling->real_escape_string($_post["txtansatt"]), $tilkobling->real_escape_string($_post["lstkategori"]) ); $tilkobling->query($sql); }
47 47 Totalt ser koden slik ut:
Oppgavesamling til Webutvikling < >
TOM HEINE NÄTT EVA M. HORNNES JOSTEIN NORDENGEN Oppgavesamling til Webutvikling Oppdatert 25.11.2016 < > 2 Kapittel 1 Introduksjon til webutvikling 1.1 Hva husker du? Teori: Gå sammen to og to og besvar
Oppgavesamling til Webutvikling < >
TOM HEINE NÄTT EVA M. HORNNES JOSTEIN NORDENGEN Oppgavesamling til Webutvikling Oppdatert 08.09.2016 < > 2 Kapittel 1 Introduksjon til webutvikling 1.1 Hva husker du? Teori: Gå sammen to og to og besvar
Steg 1: Vi starter fra toppen
CSS: Layout Skrevet av: Lars Klingenberg Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon Målet med oppgaven er å lære hvordan
I denne oppgaven forventer vi at du har vært gjennom HTML- og CSS-oppgavene så langt og/eller er kjent med <div> - og HTML5-taggene.
CSS: Layout Ekspert Web Introduksjon Målet med oppgaven er å lære hvordan man lager en nettside med en meny og et innholdsfelt. I denne oppgaven forventer vi at du har vært gjennom HTML- og CSS-oppgavene
OBLIG 1 - WEBUTVIKLING
OBLIG 1 WEBUTVIKLING Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Problemer med funksjonalitet / bruk Uoversiktlig side For
(X)HTML, CSS og JavaScript HTML. Det første dokumentet 26.11.2007. Grunnleggende programmering i Java Monica Strand 26.
(X)HTML, CSS og JavaScript Grunnleggende programmering i Java Monica Strand 26. november 2007 Gr. leggende Java 26. november 2007 1 HTML HTML = Hyper Text Markup Language Strukturerer tekstinnhold HTML
Brukermanual til Domenia Norges adminløsning
Brukermanual til Domenia Norges adminløsning 1. Login For å logge inn på løsningen din skriver du inn domenenavnet ditt og /siteadmin (f.eks www.domenia.no/siteadmin ). Skriv inn brukernavn og passord
CSS-formatering: stilark med kommentarer
CSS-formatering: stilark med kommentarer /* Demonstrasjon av stilarkregler. Jeg har satt inn forslag til farger og fonter, men du setter inn dine egne valg selvfølgelig. */ /* Stilregler for html-taggen
HTML: Del inn nettsiden
HTML: Del inn nettsiden Erfaren Web Introduksjon Målet med denne oppgaven er å lære hvordan man kan organisere en nettside ved å dele den inn med forskjellige tagger. Dersom du ikke er kjent med tagg-strukturen
EKSAMEN Webpublisering
Høgskolen i Telemark Fakultet for allmennvitenskapelige fag EKSAMEN 6101 Webpublisering 03.12.2015 Tid: Målform: Sidetal: 3 timer Bokmål 5 (inkludert denne) Hjelpemiddel: Ingen Merknader: Alle oppgavene
Vedlikeholde nettstedet i Joomla 2.5 +
Vedlikeholde nettstedet i Joomla 2.5 + Innlogging: Klikk deg inn på din nettside. I menyen på ditt nettsted vil det være en link til logg inn eller adm. Klikk på denne og logg inn med det brukernavnet
EKSAMEN Web-publisering
EKSAMEN 6101 Web-publisering 02.06.2016 Tid: Målform: Sidetall: 3 timer Bokmål 5 (inkludert denne) Hjelpemiddel: Ingen Merknader: Vedlegg: Alle oppgavene er vektet, pass på å fordele tiden du bruker mellom
Oppgave 1 (Etter forelesning 31/8) Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oblig 1 Oppdatert: 10/09 Nye oppgaver Oppgave 1 (Etter forelesning 31/8) Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Oppgave 2 (Etter
BRUK AV TEKSTEDITOREN
Dynamisk Internett-publisering med DM Web BRUK AV TEKSTEDITOREN BRUKERVEILEDNING 2007 Datamann AS er Brukermanualen er utarbeidet av Datamann AS Postboks 74 9551 ØKSFJORD Telefon 78 45 95 00 Telefaks 78
Kursdokumentasjon for Dreamweaver
Kursdokumentasjon for Dreamweaver Skrevet av 2/13 1 Komme i gang med Dreamweaver... 3 2 Bruk av Dreamweaver... 4 2.1 Verktøylinja...5 2.2 Properties... 5 3 Sidens egenskaper... 6 4 Tekst... 7 4.1 Endre
SiteGen CMS. Innføringsmanual
SiteGen CMS Innføringsmanual Copyright Barlind Solutions AS 2008 Hva er SiteGen CMS? SiteGen CMS er et såkalt content-management-system; eller med litt andre ord et publiseringssystem. Det kan brukes til
Publiseringsveiledning for www.tromsfylke.no
Publiseringsveiledning for www.tromsfylke.no Sist oppdatert 09.07.2013 av Khalil Dahbi Innholdsliste 1. Side:... 3 a. Lage en ny side:... 3 b. Endre innstilling til en side:... 3 c. Slette en side:...
WordPress. Brukerveiledning. Kjære kunde. Innlogging:
Brukerveiledning WordPress Sist oppdatert: 26.02.2014 Kjære kunde Her er en liten guide for å hjelpe deg gjennom det grunnleggende i Wordpress. Denne veilederen vil ta deg gjennom: Innlogging - s.1 Kontrollpanel
Innholdsfortegnelse. Side 1 av 33
Innholdsfortegnelse Viktige begrepsforklaringer... 2 Innlogging... 3 Lage en artikkel... 4 Redigere en artikkel... 7 Fjerne en artikkel... 7 Sette inn et bilde i en artikkel... 8 Bytte bilde i en artikkel...
Brukermanual. Itpays W3 Publish. Sette opp, logge inn og komme i gang. Redigert den 23. mai 2005. http://www.itpays.no/produkter/publisering/
Brukermanual Itpays W3 Publish Sette opp, logge inn og komme i gang Redigert den 23. mai 2005 http://www.itpays.no/produkter/publisering/ Innholdsoversikt: 1 Generelt om Itpays w3 publish Side 3 2 Sette
file:///c:/users/michaelp/sites/dkdm/dw6/dreamweaver6.html
1 of 9 15.04.2015 14:15 Spry og behaviours Både Spry and Behaviours er basert på programmeringsspråket Javascript. Javascript kjører i nettleseren og ikke på webserver som PHP og Perl. På en lignende måte
Brukerveiledning WordPress. Innlogging:
Brukerveiledning WordPress Her er en liten guide for hjelpe deg gjennom det grunnleggende i Wordpress. Denne veilederen vil ta deg gjennom: Innlogging Lage en side Lage et innlegg Innlogging: For å logge
www.eidsvold-turn.no/handball www.eidsvold-turn.no/handball www.eidsvold-turn.no/handball www.eidsvold-turn.no/handball www.eidsvold-turn.
Webansvarlig ETF håndball Ver.02 / 2012 Geir Vold-webredaktør http://www.eidsvold-turn.no Hvordan formatere et bilde som skal inn på websiden.... 3 Hvordan beskjære et bilde... 3 Ingressbilder... 5 Brødtekstbilder...
Oblig 1. Oppgave 1. Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oblig 1 Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Problemer med arngren.net: 1. Nettsiden er SYKT uoversiktlig! 2. Det er
Klikk på publisering + offentlig + nyhet for å lage en artikkel som skal komme som nyhetssak på forsiden av fylkeslagssiden.
1. Logg deg inn i portalen: Klikk på Min side og oppgi medlemsnummer og passord: Inntil du endrer passord, er det NJFF + ditt postnummeret, som er passord, f.eks. NJFF1378. Velg fylkeslag fra dropdown-menyen
I denne oppgaven skal du lære hvordan du kan flytte rundt på elementer og gjemme elementene bak andre elementer ved hjelp av CSS.
CSS: Skjul ninjaene Skrevet av: Oversatt fra Code Club UK (//codeclub.org.uk) Oversatt av: Trude Martinsen Kurs: Web Tema: Tekstbasert, Nettside Fag: Matematikk, Programmering, Teknologi, Kunst og håndverk
MMT105 Internettprogrammering Uke 44, høst 2007
MMT105 Internettprogrammering Uke 44, høst 2007 Introduksjon til CSS MMT105 HiNT 2007 1 HTML-elementenes strukturerende egenskaper HTML-elementene skal markere strukturen i et webdokument, dvs. at de forskjellige
CSS: Style nettsider. Introduksjon. Skrevet av: Arve Seljebu
CSS: Style nettsider Skrevet av: Arve Seljebu Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon Nå skal vi lære å endre på
Administrering av SafariSøk
Administrering av SafariSøk Administrering av SafariSøk Revisjonshistorie Revisjon $Revision: 1.6 $ $Date: 2003/08/05 12:44:02 $ Innholdsfortegnelse 1. Om programmet... 1 Generelt... 1 2. Fremgangsmåter...
file:///c:/users/michaelp/sites/dkdm/dw5/dreamweaver5_1.html
1 of 10 09.04.2015 15:49 Fra forrige gang: Om tabeller Tabeller er i utgangspunktet en måte å presentere data på. Skal ikke brukes for å legge ut sider Dreamweaver har fasiliteter for å opprette, redigere
Webutvikling. Innholdsfortegnelse per Introduksjon til webutvikling. 2. HTML og CSS. 3. Strukturere websider
Webutvikling Innholdsfortegnelse per 22.8.2016 1. Introduksjon til webutvikling Utviklingsmiljø Ditt første prosjekt Lage nettsiden med HTML Knytte til et stilark Lage side nummer to Koble hovedside og
Nettside24 Brukerveiledning Nettside24 Brukerveiledning
Nettside24 Brukerveiledning Nettside24 Brukerveiledning 1 av 14 Oversikt over brukerveiledningen. 2. Oversikt. 3. Logge inn på nettsiden. 4. Redigere innholdet på undersidene. 5. Redigere innholdet i blokkene.
Manual for innlegging av standard sideinnhold og nyheter via «backend»
Manual for innlegging av standard sideinnhold og nyheter via «backend» 23.3.2006 Utarbeidet av: 2 Innlogging og beskrivelse av hovedelement i «backend» For å få tilgang til redigeringsmodul velges følgende
EKSAMEN / 6101N WebPublisering
EKSAMEN 6101 / 6101N WebPublisering 09.12.2016 Tid: Målform: Antall sider: 3 timer Bokmål 8 (inkludert denne) Hjelpemidler: Ingen Merknader: Vedlegg: Alle oppgavene er vektet, pass på å fordele tiden du
Her er en enkel bruksanvisning på administrasjonspanelet til hjemmesiden din på QTSystems.
Her er en enkel bruksanvisning på administrasjonspanelet til hjemmesiden din på QTSystems. Redigert 10.februar 2010. For at det skal bli lettere å lese denne manualen kan du justere størrelsen på dette
PUBLISERING AV INNHOLD TIL KVAMSSIDA.NO
PUBLISERING AV INNHOLD TIL KVAMSSIDA.NO Innhold Kapitel 1 - Registrering og innlogging... 2 Kapitel 2 - Lage ny artikkel uten bruk av bilder eller annen grafikk... 3 Kapitel 2a - Ingress... 4 Kapitel 3
Oblig 1 Erlend Hannestad
Oblig 1 Erlend Hannestad Oppgave 1 Nettsiden er ustrukturert og uryddig når det kommer til layout og design, det er vanskelig å holde oversikt over alt som vises på siden, det er rett og slett for mye
Brukerveiledning for hjemmesider
Hegra Idrettslag Brukerveiledning for hjemmesider En kort innføring for bidragsytere på www.hegrail.no Ivar Friheim 2009-05-18 Innhold Innledning... 3 Nyheter... 3 Sider... 3 Kalenderinnslag... 3 Pålogging...
Memoz brukerveiledning
Memoz brukerveiledning http://memoz.hib.no Pålogging...1 Oversikt...2 Profilside...2 Inne i en memoz...3 Legg til ting...3 Tekstboks...3 Rediger og flytte på en boks...4 Bildeboks...5 Videoboks...7 HTML-boks...7
Oppgave 1: Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oppgave 1: Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Svar: Ved første øyekast har utvikleren av nestesiden plasser altfor mange div
Brukermanual - Joomla. Kopiering av materiale fra denne Bonefish manualen for bruk annet sted er ikke tillatt uten avtale 2010 Bonefish.
Brukermanual - Joomla Bonefish brukermanual - Joomla Gratulerer med ny nettside fra Bonefish. Du er nå blitt eier og administrator for din egen nettside, noe som gir deg visse forpliktelser ovenfor din
Steg 1: Felix har forsvunnet!
HTML: Forsvunnet katt Skrevet av: Arve Seljebu Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi, Norsk Klassetrinn: 5.-7. klasse, 8.-10. klasse, Videregående skole Introduksjon Katten
Veiledning hjemmeside Stjørdal Friidrettsklubb
Veiledning hjemmeside Stjørdal Friidrettsklubb Hjemmesida med adressen www.sfik.no er åpen for alle. Hvis du skal publisere et innlegg på hjemmesida må du logge deg inn med brukernavn og passord. Dette
Oppgave 1. Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Når man tar pilen over fanene, dukker det opp utrolig mange tagger. Dvs alt er
Bildebehandling i GIMP
Bildebehandling i GIMP 9.1 Opprette et dokument & 9.2 Bildestørrelse For å opprette et nytt dokument velger du File > New (Fil > Ny...) Da vil følgende vindu dukke opp: Her er bildets oppløsning satt til
AUTOCAD 2008. Artikkelserie. Tabeller
Odd-Sverre Kolstad AUTOCAD 2008 Artikkelserie Tabeller Gyldendal Norsk Forlag AS 2007 Omslag Marianne Thrap Redaktør: Rune Kjelvik Formgiver: Rune Kjelvik 1. opplag ISBN 978-82-05-37108-8 Alle henvendelser
BRUKERMANUAL (versjon 1.0)
BRUKERMANUAL (versjon 1.0) 1. Innlogging Du må ha en egen bruker for å kunne logge inn på nettsidene. Du logger inn ved å scrolle helt nederst på forsiden av Forbundet.no, til det svarte feltet, og trykke
Innhold. ailæring Lage/endre leksjon. Innledning Lage en leksjon Legge inn tekst, kulepunktliste og bilde... 6
Lage/endre leksjon 1 Innhold Innledning... 2 Lage en leksjon... 3 Legge inn tekst, kulepunktliste og bilde... 6 Kopiere og lime inn tekst fra andre programmer... 10 Bygge inn en video... 10 Sette inn hyperkobling...
KOMME I GANG 2. Logge på 2. I redigeringsvinduet 3 OVERSIKT OVER KNAPPENE SOM LIGGER ØVERST I REDIGERINGSVINDUET 5
Innhold KOMME I GANG 2 Logge på 2 I redigeringsvinduet 3 OVERSIKT OVER KNAPPENE SOM LIGGER ØVERST I REDIGERINGSVINDUET 5 Lukk 6 Ny 6 Flytt opp/ Flytt ned 6 Klipp 7 Kopier 7 Lim inn (krysspubliser, ny,
www.borettslag.net Brukermanual Versjon 2.0
www.borettslag.net Brukermanual Versjon 2.0 Brukermanual for hjemmesider fra Borettslag.net Innholdsfortegnelse: Velkommen som redaktør...3 Innlogging...4 Meny...5 Generelle innstillinger...6 Hovedmeny...8
Brukermanual. www.bygdekvinnelaget.no
Brukermanual www.bygdekvinnelaget.no Viktige endringer Nye Bygdekvinnelaget.no er lagt opp på en måte der brukere og redaktører står for innhold, mens systemet i enda større grad en tidligere står for
KOMME I GANG 3. Logge på 3. I redigeringsvinduet 4 OVERSIKT OVER KNAPPENE SOM LIGGER ØVERST I REDIGERINGSVINDUET 6
Innhold KOMME I GANG 3 Logge på 3 I redigeringsvinduet 4 OVERSIKT OVER KNAPPENE SOM LIGGER ØVERST I REDIGERINGSVINDUET 6 Lukk 7 Ny 7 Flytt opp/ Flytt ned 7 Klipp 8 Kopier 8 Lim inn (krysspubliser, ny,
Intro til WWW, HTML5 og CSS
Intro til WWW, HTML5 og CSS Håkon Tolsby 20.08.2015 Håkon Tolsby 1 World Wide Web Webserver: Programvare som distribuerer websider og/eller maskin hvor programmet kjører Webbrowser (nettleser): Program
BRUKERMANUAL KOM I GANG... 2 BLOGGINNLEGG... 4 UNDERSIDER... 6 LAST OPP BILDER/VIDEO... 8 KOMMENTARER PÅ INNLEGG... 9 UTSEENDE...
BRUKERMANUAL KOM I GANG... 2 SKRIV ET INNLEGG... 2 LEGG TIL UNDERSIDE... 2 LAST OPP BILDER... 2 REDIGER MENYINNHOLD... 3 LEGG INN SIDEMENY ELLER BUNNTEKST... 3 TILPASS BLOGGENS DESIGN... 3 BLOGGINNLEGG...
KF Lokal personalhåndbok - brukerveiledning for redaktør
KF Lokal personalhåndbok - brukerveiledning for redaktør Innhold 1. KF Lokal personalhåndbok og KF Infoserie... 2 2 Din rolle - Redaktør... 4 3 Skriv lokal tekst... 4 4 Lag lenker i lokal tekst... 6 5.
Slik lager du et web-område bestående av flere sammenhengende websider i. Frontpage 2003. Laget av Magnus Nohr Høgskolen i Østfold
Slik lager du et web-område bestående av flere sammenhengende websider i Frontpage 2003 Laget av Magnus Nohr Høgskolen i Østfold Innholdsfortegnelse 1 Opprett Web-område 3 2 Opprett en navigasjonsstruktur
WINDOWS 10 OPPDATERING HØSTEN 2018 (VERSJON 18.09) HVA ER NYTT?
WINDOWS 10 OPPDATERING HØSTEN 2018 (VERSJON 18.09) HVA ER NYTT? For å finne ut hvilken versjon av Windows 10 en har på sin PC kan du finne ut ved å gjør følgende: 1. Klikk på Startknappen og velg Innstillinger.
Her prøver vi å gi en enkel introduksjon til Venstres publiseringssystem for nettsider (Venstre Publish):
9 IT i lokallaget 9.1 Hjemmesider Redigering av lokallagets hjemmesider skjer via et publiseringsverktøy som du finner på https://publish.venstre.no. Brukernavn og passord får du ved å henvende deg til
Kom i gang med E-Site - Med E-Site er det enkelt og trygt å redigere dine websider
Kom i gang med E-Site - Med E-Site er det enkelt og trygt å redigere dine websider Innhold Side 1 Introduksjon...2 2 Logge inn i administrasjonsområdet...3 2.1 Fyll inn brukernavn og passord...3 2.2 Glemt
Om du allerede kjenner Scratch og har en Scratchbruker kan du gå videre til Steg 1.
Pingviner på tur Skrevet av: Geir Arne Hjelle Kurs: Scratch Tema: Blokkbasert, Spill Fag: Programmering Klassetrinn: 1.-4. klasse, 5.-7. klasse, 8.-10. klasse Introduksjon Velkommen til Scratch. Vi skal
CSS: Style nettsider Nybegynner
CSS: Style nettsider Nybegynner Web Introduksjon Nå skal vi lære å endre på stilen til nettsider. I denne oppgaven forventer vi at du har gjort HTML-oppgavene eller er litt kjent med HTML fra før av. I
CSS: Animasjon Nybegynner
CSS: Animasjon Nybegynner Web Introduksjon I denne oppgaven skal du lære å animerer HTML-objekter ved hjelp av CSS. Under ser du hvordan resultatet vil bli til slutt: Men før vi starter å lage animasjonen
Brukermanual for Onepage. Tema for WordPress
Brukermanual for Onepage Tema for WordPress Innhold Forord 2 Kom i gang 3 Første oppsett av Onepage 5 Alternativer 6 Uten framhevet bilde 6 Framhevet bilde som banner 7 Framhevet bilde som bakgrunn 10
EKSAMEN. Emne: Innføring i informasjons- og kommunikasjonsteknologi
EKSAMEN Emnekode: LA101IKT Emne: Innføring i informasjons- og kommunikasjonsteknologi Dato: 26.11.2010 Eksamenstid: kl. 09:00 til kl. 15:00 Hjelpemidler: Ingen trykte, kun hjelpefunksjoner på datamaskinen
Brukerdokumentasjon PIM Bohus
Brukerdokumentasjon PIM Bohus Til Fra Bohus WebOn AS Dato: 10.08.2105 Vår ref: Camilla Hetty Osa Telefon: 41 56 51 59 E-post: camilla@webon.net Ver: 2.0 WebOn AS, Wirgenes vei 8 B, P.O. Box 2198, N-3103
Businesscatalyst PAGES
Businesscatalyst 1. Gå til http://www.businesscatalyst.com/ og login med brukernavn og passord. Du kommer da til administrasjonspanelet der du kan organisere nettsiden. Her kan du også se hvordan nettsiden
Brukerveiledning. Kom i gang. publiseringsverktøy. versjon 2 - revidert 10.02.2010 AESTON. Side 1
Brukerveiledning Kom i gang publiseringsverktøy versjon 2 - revidert 10.02.2010 AESTON Side 1 Velkommen som bruker av Kameleon Introduksjon Kameleon er et publiseringsverktøy (Content Management system
Administrasjon Nettbutikk: www.dittdomene.com/administrasjon Bruk brukernavn og passord som er sendt på e-post.
Administrasjon Nettbutikk: www.dittdomene.com/administrasjon Bruk brukernavn og passord som er sendt på e-post. - Konfigurasjon Klikk på Konfigurasjon i menyen helt til venstre, og deretter Min butikk.
Publisere på nvfnorden.org
Kommunikasjonsgruppen i NVF Publisere på nvfnorden.org En guide til de viktigste funksjonene i publiseringsverktøyet LiSA Live, 2. utg. Johanne Solheim 22.02.2013 Innhold Introduksjon... 1 Logg deg på...
Formatering og bruk av bilder på Hemings hjemmeside
Formatering og bruk av bilder på Hemings hjemmeside Generelt om bildebruk Bilder skaper liv på en side. Mange undersøkelser har vist at øynene dras mot bilder på nettet. Noe av det første våre øyne dras
Kort veiledning for mottakere
Kort veiledning for mottakere Side 1 Innholdsfortegnelse Innholdsfortegnelse Kort veiledning for mottakere Daglige Oppgaver Mottak Legge inn merknader på en transport Se om et oppdrag har merknad Se alle
Radix en enkel innføring
Radix en enkel innføring Dette er en enkel oppskrift på den mest vanlige bruken av Radix. 1 Utgangspunkt: Du har laget en video som du vil dele med dine studenter i Fronter. Du kan da bruke Radix som lagrings-
WordPress. Brukerveiledning. Kjære kunde. Innlogging
Brukerveiledning WordPress Sist oppdatert: 07.01.2015 Kjære kunde Her er en liten guide for å hjelpe deg gjennom det grunnleggende i Wordpress. Denne veilederen vil ta deg gjennom: Innlogging - s.1 Kontrollpanel
Oblig 1 Webutvikling av Jon-Håkon Rabben
Oblig 1 Webutvikling av Jon-Håkon Rabben Oppgave 2 og 3) http://www.it-stud.hiof.no/~jhrabben/boxmodel.html Oppgave 6) http://www.it-stud.hiof.no/~jhrabben/oblig1oppg6.html Oppgave 1) Siden tar lang tid
Brukermanual For app.minmemoria.no
Brukermanual For app.minmemoria.no For videomanual: søk etter MinMemoria App på www.youtube.com Velkommen! Memoria er en digital minnebok og en plattform for sosial kommunikasjon mellom familier, helsepersonell
Oblig 3 Webutvikling. Oppgave 1
Oblig 3 Webutvikling Oppgave 1 Ta for deg en selvvalgt bedrift (gjerne lokal/mindre) og tenk deg at du hadde fått i oppgave å være en SEOkonsulent for disse i én uke. På denne uken skulle du gjennomført
Det du skal gjøre i denne oppgava er først å sette opp bakgrunnen til spillet og så rett og slett å få firkanter til å falle over skjermen.
Tetris Introduksjon Processing Introduksjon Lag starten på ditt eget tetris spill! Det du skal gjøre i denne oppgava er først å sette opp bakgrunnen til spillet og så rett og slett å få firkanter til å
Veiledning i administrering av egne loge-/leirsider i portalen www.oddfellow.no
Veiledning i administrering av egne loge-/leirsider i portalen www.oddfellow.no Innhold: Skjermbilde 3: Skjermbilde 4-8: Skjermbilde 9-13: Skjermbilde 14-17: Skjermbilde 18-20: Skjermbilde 21-24: Skjermbilde
Hjemmesidemanual. Innholdsfortegnelse. Notater: - 1 -
Hjemmesidemanual Innholdsfortegnelse Pålogging... - 2 - Logg på din hjemmeside og generell support info... - 2 - Kontrollpanel... - 3 - Oppdatering av profil opplysninger... - 3 - Meny... - 4 - Menypunkter...
Steg 1: Animasjons-attributtet
CSS: Animasjon Skrevet av: Lars Klingenberg Kurs: Web Tema: Tekstbasert, Nettside, Animasjon Fag: Matematikk, Programmering, Kunst og håndverk Klassetrinn: 5.-7. klasse, 8.-10. klasse, Videregående skole
Bruksanvisning for administrasjon av www.lillehammerfk.no
Bruksanvisning for administrasjon av www.lillehammerfk.no Målet med lillehammerfk.no er å være en levende nettside for hele klubben. For å få til det, må de enkelte lagene selv legge til innhold på nettsiden.
Kjøre Wordpress på OSX
Kjøre Wordpress på OSX Alt etter hva du ønsker å bruke Webserveren til er det flere måter å gjøre dette på. Ønsker du kun en side som skal dele sider du lager manuelt, med PHP, GD etc eller med server
Brukerveiledning for PedIT - Web
Brukerveiledning for PedIT - Web PedIT- Web Logg inn For å kunne logge inn, trenger du et brukernavn og et passord. Det er administrator sin oppgave å legge til brukere. Venstremargen Margen til venstre
Oppbygging av innhold på responsive nettsider.
Oppbygging av innhold på responsive nettsider. HTML og CSS er koder som forteller nettleseren hvordan strukturen og utseende på en nettside skal vises på skjermen din. Selv om du ikke ser kildekoden når
Hvordan redigere blogg sider i Joomla 3.x
Hvordan redigere blogg sider i Joomla 3.x Side 1/8 For å endre en side/artikkel i Joomla logger du inn. Velkomstskjermen er denne. Klikk på artikler. Eller velg artikler fra toppmenyen: Innhold >> Artikler
Produktdokumentasjon. Madison Møbler Administrasjonsside og Nettbutikk
Produktdokumentasjon Madison Møbler Administrasjonsside og Nettbutikk 1 1. Forord 1.1 Dokumentasjonen Dette er en teknisk dokumentasjon på produktet som er utviklet. Denne er tiltenkt personer med teknisk
en hjemmeside Lesson Introduksjon Du kjenner en del HTML tagger, så nå er det på tide å lage din første hjemmeside! La oss begynne med en gang.
Lesson 2 en hjemmeside All Code Clubs must be registered. Registered clubs appear on the map at codeclub.org.uk - if your club is not on the map then visit jumpto.cc/18cplpy to find out what to do. Introduksjon
Side 1. Sniggabo CMS brukermanual rev. 2
Side 1 Sniggabo CMS brukermanual rev. 2 INNHOLDSFORTEGNELSE Logg inn... 3 Menylinje... 3 Artikkelliste... 4 Ny artikkel... 5 Aktiviteter... 8 Rediger aktivitet... 9 Dokumenter... 9 Nytt dokument... 10
Tetris. Introduksjon. Skrevet av: Kine Gjerstad Eide. Lag starten på ditt eget tetris spill!
Tetris Skrevet av: Kine Gjerstad Eide Kurs: Processing Introduksjon Lag starten på ditt eget tetris spill! Det du skal gjøre i denne oppgava er først å sette opp bakgrunnen til spillet og så rett og slett
Hurtigstartveiledning
Hurtigstartveiledning Microsoft Word 2013 har et annet utseende enn tidligere versjoner, så vi laget denne veiledningen for å minimere læringskurven. Verktøylinjen for hurtigtilgang Kommandoene her vises
Følgende «tommelfinger-regler» bør (må) følges:
Notat Denne «oppskriften» er basert på erfaringer om hva som går bra når en benytter Word til å lage navigasjonsdiagrammer. Det finnes sikkert andre måter som også gir et brukbart resultat. Det er bare
Veiledning Claw 2 CMS Innhold
Veiledning Claw 2 CMS Innhold Pålogging:...2 Knapper for redigering:...3 Sett inn bilde:...3 Endre filstørrelse på bilder:...5 Bildeegenskaper:...6 Sett inn tabell:...7 Link:...8 Anker:...9 Tekst:... 10
få en ny og og god hjemmeside på få minutter Quick guide
få en ny og og god hjemmeside på få minutter Quick guide 1 Få en profesjonell hjemmeside på få minutter GoMinisite nå: Sett deg foran PC en din, åpne nett-browseren din og skriv www.gominisite.no Fyll
Manual for innlevering av eksamensbesvarelser på it s learning (ITL)
Manual for innlevering av eksamensbesvarelser på it s learning (ITL) Først og fremst: start internett og gå til siden www.itslearning.com ITLs eksamensmodul har en egen påloggingsside, du kan altså ikke
Oblig 5 Webutvikling
Oblig 5 Webutvikling Magnus Kristiansen Oppgave 1 Jeg startet med å laste ned wordpress fra www.wordpress.org, og installerte det gjennom WAMP (lokalserver). Og brukte guiden i https://codex.wordpress.org/child_themes
Uansett hvilken håndbok du benytter vil fremgangsmåten være den samme. I denne veiledningen benytter vi personalhåndboken som eksempel.
Velkommen som bruker av nettbaserte håndbøker fra Hovedorganisasjonen Virke. Våre nettbaserte håndbøker kan tilpasses din virksomhet. De er redigerbare, samtidig blir de automatisk oppdatert med nye lover
Hvordan legge ut en melding i Fronter
OPPDATERT 1. sept 2008 Hvordan legge ut en melding i Fronter Vi skal her lære å legge ut meldinger. De vil være noe kjedelige av utseende fordi vi har lagt vekt på at det skal være rask å bruke, lett å
Legg opp din nye Website raskt og enkelt!
Legg opp din nye Website raskt og enkelt! Det å bytte fra gammel til ny løsning tar normalt sett ikke lang tid, siden du allerede vet hvordan du ønsker at siden din skal være bygget opp og inneholde. o
Brukermanual. Support: Skytterkontoret Tlf: 02419, tast 2 support@dfs.no http://www.dfs.no/support. Velkommen til EPI-Server 7.
Velkommen til EPI-Server 7.5 (CMS) Levert av Skytterkontoret. EPI-Server 7.5 (CMS 7.5) er et publiseringssystem som gjør det enkelt for deg å oppdatere innholdet på dine Internettsider. I denne brukerdokumentasjonen
HTML: Legg til lyd og video
HTML: Legg til lyd og video Skrevet av: Oversatt fra Code Club UK (//codeclub.org.uk) Oversatt av: Trude Martinsen Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi, Norsk Klassetrinn: