Digitale dokumenter 3
|
|
|
- Torild Rønningen
- 8 år siden
- Visninger:
Transkript
1 Digitale dokumenter 3 HTML5 og metadata Digitale dokumenter Delvis basert på forelesningsnotater av Tor Arne Dahl
2 Dagens forelesening Praktisk informasjon Oppgave 2 Søkemotoroptimalisering Metadata og HTML Microdata Schema.org Oppgave 3
3 Praktisk informasjon Hermetegn som skaper krøll Har du hatt problemer med å koble stilark til HTML? Klipp og lim lenken fra eksemplet på nytt. Det var noe feil med et hermetegn. Tomme elementer i må avsluttes med skråstrek, fordi vi jobber med HTML5 som XML. <br /> Vanskelig å finne årsaken til feilen? Sjekk ut kap. 20 i Castro og Hyslop (2012)
4 Oppgave 2 Bygg videre pa nettsiden du allerede har laget, eller lag en ny hvis det frister mere. Hent innholdet fra et annet sted (f.eks. programplanen, e-bok fra Project Gutenberg, wikipedia, annet materiale som dere har lov å spre.) Ikke bruk for lang tid pa innholdet, fokuser pa strukturen. Fyll på med mere innhold (Se forelesningsnotatene for inspirasjon) Overskrifter Avsnitt Strukturelle elementer (article, section, nav etc.) Elementer i løpende tekst Lister Lenker Bilder Tenk semantikk, og bruk elementer med mening. Eksempel på en løsning:
5 HTML5 Semantikk Nye elementer og attributter Elementer fjernet eller omformulert All presentasjon overlates til CSS (stilark) Microdata Medietyper Tegning (<canvas> og javascript) Video (<video>) Lyd (<audio>) Webapplikasjoner Lokal lagring av data Offline kjøring
6 HTML 5 demo-video Giorgio Sardo (Microso< Corpora>on), 16. november 2011: «HTML5 Demo Fest: The Best from the Web», fra W3Conf: Prac>cal Standards for Web Professionals Noe av terminologien som brukes i videoen: SVG Scalable Vector Graphics, en W3C-spesifikasjon. Canvas Et skjermområde å tegne på, del av HTML5-spesifikasjonen. DOM Document Object Model, en W3-spesifikasjon. JavaScript Et skriptspråk for webklienter (nettlesere o.l.), formalisert i ECMAScript-specifikasjonen. Tett forbindelse til DOM. Web apps Webapplikasjoner som er laget med HTML5 og andre W3C-teknologier. Kan kjøres on- og offline på alle plattformer og enheter. Local storage Lokal lagring av data. Kalles formelt for Web Storage, som inngår i familien av HTML5-teknologier utviklet av W3C. Tett forbindelse til Web apps.
7 Lyst til å lese mer om HTML5? Pilgrim, M. (2010). HTML5: Up and running. Sebastopol, CA: O Reilly. Online- versjon: hzp://diveintohtml5.info/
8 Over eller under panseret Under panseret: «Maskinlesbarhet» Over panseret: «Sluttbrukerlesbarhet»
9 Søkemotorer En søkemotor består av tre deler: Et robotprogram (også kalt spider eller web crawler) Et indekseringsprogram Søkemotorens database
10 Slik virker en søkemotor Illustrasjon fra: hzp:// do- search- engines- work
11 Søkemotoroptmialisering (SEO) Optimalisering for både søkemaskiner OG brukere Best practice Basisoptimalisering Optimalisering av innhold WebCrawlere Nettsider for mobiltelefoner Promotering og analyser Basert på Google (2010)
12 God bruk av <title>-elementet Korte presise titler Lag unike titler for hver underside Vises i trefflister
13 Beskrivelse i <meta />-elementet Oppsummerer sidens innhold Litt lengre beskrivelse enn <title> <head> </head> <meta name="description" content="dette er en litt lengre beskrivelse av hva nettsiden din handler om. " /> Brukes til snippets i Google trefflister, hvis ikke andre deler av siden er mer relevante.
14 URL-struktur Lag deskriptive kategorier og filnavn på dokumenter Bedre organisering Enklere for søkemotorer Enklere å lenke til Eksempel side1.html Hvilken av disse er mest beskrivende?? Bowlingsiden.html Ha en enkel men beskrivende mappestruktur! Avspeiles i URL en HiO(A) Utg. Fag År Emne Kategori Filnavn
15 Linktekst (anchor text) <a href="www ">Linktekst</a> Sier noe om hvilken side du lenker til Både interne og eksterne lenker Lag konsise linktekster Ha synlige lenker Universell utforming
16 Eksempel fra VG
17 Hvor ser det ut bak panseret? <div class="article-content"> <span style="width: 464px;" class="df-img-container"> <span class="df-img-container-inner"> <a href=" <img width="462" height="282" src=" w=462;h=282; jpg" alt=" " class="article-image" /> </a><span class="df-img-layer"><a href=" artikkel.php?artid= "> </a> </span></span></span> Bildet er en lenke <h3><span style="font-size: 30px;"><a title="dæhli om heftig flytur: - Glad for å være på bakken " href=" Dæhli til hektene etter heftig flytur: </a></span></h3> ( ) <p><strong><span style="font-size: 23px;">MOLDE (VG) </span> <span style="font-size: 24px;"> <a href=" Les hele saken</a></span></strong></p><div class="clearer"></div> </div> Overskri<en er lenket opp i flere deler, og har beskrivelse i <>tle> Denne typen lenke er ikke beskrivende, og anbefales ikke!
18 Bilder <img src="bilder/filezilla-koble.png" alt="tilkobling med FileZilla" /> Filnavn med mening (kort og presist) Alternativ tekst med alt-attributtet Vises hvis ikke bildet kan vises Gir informasjon om bildet Brukes i tjenester som Pinterest, Google bildesøk osv. Begrens bruken av bilder som lenker Bruk tekstlenker der det er mulig Lagre bildene dine samlet Bruk filformater som støttes av mange nettlesere
19 Overskrifter Bruk overskriftene hierarkisk Som å lage en disposisjon Ikke hopp over nivåer Ikke bruk for mange overskrifter Enklere navigasjon
20 Navigasjon Hvordan skal brukeren navigere rundt på siden? Breadcrumb Delbare URL er site map Brukere Søkemaskiner (XML Sitemap) Bruk tekst som navigasjon Tilpasset 404-side (Not Found) Eksempel fra ww.ravelry.com
21 Kvalitet er viktig Sider med interessant innhold blir populære på egen hånd. Til brukere på ulike nivå Skriv let-leselig tekst Vær organisert Lag friskt unikt innhold Lag innhold for brukere, ikke søkemaskiner
22 Attributter De fleste HTML-elementer kan ha ett eller flere attributter Eksempel: <a href=" til HiOA</a> Attributter er par av navn og verdi Verdien skrives med anførselstegn rundt Gir ekstra informasjon om elementet Brukes ofte som knagger til CSS
23 Attributter id Unik ID (dvs. må være unikt i dokumentet) Brukes til bokmerker/navigasjon Kan brukes som CSS-selektor, men det anbefales ikke. class Brukes ofte til å knytte CSS til grupper av elementer Gjør det enkelt å endre utseende på elementer som tilhører samme klasse. Velg navne som har semantisk verdi IKKE class= blue (du endrer kanskje mening om fargen i morgen!) Kan brukes med et sett forhåndsbestemte verdier fra microformats.org title Brukes til å gi elementer en merkelapp som synes når man holder musen over (tool tip). Også nyttige for universell utforming Digitale dokumenter
24 Microdata Foreløpig spesifikasjon: Legger til semantikk fra standardiserte vokabularer i et sett med attributter (tags), som kan brukes på alle elementer. En item består av en gruppe med par av navn/verdi Formål: Bidra til den semantiske weben og forbedre gjenfinning i søkemotorer "Hey search engine, this informa3on describes this specific movie, or place, or person, or video (schema.org, 2011).
25 Schema.org Felles vokabular til å markere opp HTML-dokumenter Brukes sammen med microdata-formatet (etter hvert også andre formater) Tilføyer informasjon (metadata) om innholdet i HTMLdokumentet Forstås av søkemaskiner som Google, Bing (Microsoft), Yandex og Yahoo! Kan muliggjøre nye verktøy og apps som drar nytte av strukturen.
26 Itemscope og itemtype Eksempel: HTML- dokument om filmen Avatar Informasjon om regissør Link >l trailer <article> <h1>avatar</h1> </article> <span>director: James Cameron (born August 16, 1954)</span> <span>science fiction</span> <a href="../movies/avatar-theatricaltrailer.html">trailer</a>
27 Itemscope og itemtype <article itemscope> <h1>avatar</h1> </article> <span>director: James Cameron (born August 16, 1954)</span> <span>science fiction</span> Ved å >lføye itemscope sier jeg at innholdet i <ar>cle>- elementet er OM noe bestemt (item). <a href="../movies/avatar-theatricaltrailer.html">trailer</a>
28 Itemscope og itemtype <article itemscope itemtype=" <h1>avatar</h1> </article> <span>director: James Cameron (born August 16, 1954)</span> <span>science fiction</span> Ved å >lføye itemtype spesifiserer jeg hva det egentlig handler om. Nemlig film, her definert av schema.org. <a href="../movies/avatar-theatricaltrailer.html">trailer</a>
29 itemprop Brukes for å markere egenskaper (properties) ved noe (item). For å markere regissør tilføyes itemprop="director" til elementnavnet rundt regissørens navn. For å markere navnet på filmen brukes itemprop="name" For å markere sjanger brukes itemprop="genre" For å markere traileren brukes itemprop="trailer" Se for flere itempropegenskaper knyttet til filmer.
30 Eksempel - itemprop <article itemscope itemtype =" <h1 itemprop="name">avatar</h1> </article> <span>director: <span itemprop="director"> James Cameron</span> (born August 16, 1954)</ span> <span itemprop="genre">science fiction</span> <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">trailer</a>
31 Innebygde (embedded) items Brukes når verdien i en itemprop (egenskap) har sitt eget sett med egenskaper. Eksempel: En Regissør av en film er også en person, som har egenskapene navn (name) og fødselsdag (birthdate) For å angi at verdien av itemprop er en annen item startes det en ny itemscope rett etter den itemprop den hører sammen med.
32 Eksempel innebygde items <article itemscope itemtype =" <h1 itemprop="name"&g;avatar</h1> <div itemprop="director" itemscope itemtype=" Director: <span itemprop="name">james Cameron</span> (born <span itemprop="birthdate">august 16, 1954)</span> </div> <span itemprop="genre">science fiction</span> <a href="../movies/avatar-theatrical- trailer.html" itemprop="trailer">trailer</a> </article>
33 Schema.org som vokabular Beskriver et bredt utvalg av forskjellige typer item, som alle sammen har sitt eget sett med egenskaper. Thing er den bredeste type item Egenskaper arves fra items som er mer generelle, dvs. foreldrene. Eksempel: LocalBusiness er barn av Place og Organization, som igjen er barn av Thing. LocalBusiness arver egenskaper fra både Place og Organization.
34 Mye brukte item types Creative works: CreativeWork, Book, Movie, MusicRecording, Recipe, TVSeries... Embedded non-text objects: AudioObject, ImageObject, VideoObject Event Organization Person Place, LocalBusiness, Restaurant... Product, Offer, AggregateOffer Review, AggregateRating Her er den fulle listen over alle item types.
35 Gode vaner Mer er bedre, bortsett fra ved skjult tekst Dess mer som markeres med microdata, dess bedre Forhåndsdefinerte verdier vs tekst Expected types er valgfrie Det er greit å bare bruke ren tekst eller URL URL som egenskap Brukes pa sider som har en samling av items F.eks. en serie av personer Tilføy egenskapen url til hver enkel person
36 Oppgave 3 - oppsummering Last ned css-fil (stilark.css) fra Fronter (i oppgavemappen), og lagre på din M:\public_html\html5 Koble stilarket (CSS-filen) pa html-dokumentet ditt Som vist i presentasjonen fra seminar 1 Undersøk hvordan stilarket påvirker dokumentet ditt. Alt er kommenter, så ta deg tid til å se pa det Regler knyttet til elementer blir utført uansett, hvis du har brukt disse elementene Lag klasser og id er som passer til stilarket, slik at disse reglene ogsa tas i bruk. Gjør endringer i stilarket, for å se effekten Gjerne med utgangspunkt i ditt eget dokuments klasser og elementer. Eksempel med CSS
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
Oblig 3 Webutvikling
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 SEO-konsulent for disse i én uke. På denne uken skulle du gjennomført
SENSORVEILEDNING. Dato: Eventuelt:
SENSORVEILEDNING Emnekode: ITF10511 Emnenavn: Eksamensform: Webutvikling Digital Dato: 03.12.2018 Faglærer(e): Michael A. Lundsveen Eventuelt: Læringsutbytte for emnet KUNNSKAP: Studenten kan forstå nettsteders
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
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
Responsiv design Skalering av siden trenger å gjøres noe med, slik at den er tilpasset de fleste skjermstørrelser.
Oppgave 1 1) Analyse av bedriften (målsetting, kundegrupper, produkter, konkurrenter, salgskanaler osv, osv. ) Oppgave 1 er gjort i samarbeide med Håvard Ramstad. Nettadressen til websiden er http://7smaarom.no/.
the web Introduksjon Lesson
Lesson 1 the web 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
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
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
SEO. Erlend Nilsen Senior rådgiver Seo og Content Marketing
SEO Erlend Nilsen Senior rådgiver Seo og Content Marketing Erlend Ansatt: Jamba Gmbh(Samwer brødrene bak Zalando og My city deal/groupon) Mobildelen til Funcom ( Plutolife AS) Egne oppstarter Refero AS
Digitale dokumenter 1
Digitale dokumenter 1 Struktur: HTML5 Tine Lodberg Frost Digitale dokumenter 11.11.2013 Delvis basert på forelesningsnotater av Tor Arne Dahl Dagens forelesning Introduksjon Praktisk informasjon Bakgrunn
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
EKSAMEN. Noen spørsmål kan besvares som punktlister. Prøv her å strukturere svaret slik at hvert punkt omhandler ett tema/element.
EKSAMEN Høgskoleni østfold Emnekode: Emnenavn: ITF10511 Webutvikling Dato: Eksamenstid: 29/11-2016 09.00 13.00 Hjelpemidler: Faglærer: Ingen Michael A. Lundsveen Om eksamensoppgaven og poengberegning:
Eksamensoppgaven: Oppgavesettet består av fire deler: DEL 1: Påstander, DEL 2: Flervalg, DEL 3: Kodeoppgave og DEL 4: Langsvar.
Informasjon om eksamen EKSAMEN Emnekode og navn: ITF10511 Webutvikling Dato og tid: 3. desember 2018, 4 timer Fagansvarlig: Michael A. Lundsveen Hjelpemidler: Ingen Eksamensoppgaven: Oppgavesettet består
OBLIG 2 WEBUTVIKLING
OBLIG 2 WEBUTVIKLING Oppgave 1 Design ved hjelp av skisser eller wireframes et nettsted med et "avansert" design. Lag spesifikke design for ulike skjermstørrelser og utskrift. Fokuser spesielt på å få
Webutvikling Oblig 3. Oppgave 1
Webutvikling Oblig 3 Oppgave 1 Jeg har valgt å ta for meg bedriften Smartpanel. De er markeds ledende på MDF panel i Skandinavia. Noe som de alltid har hatt som målsetting. Kundegruppen deres er privatmarkedet,
Forsvunnet katt webside
Lesson 3 Forsvunnet katt webside 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
- reklamebannere mobil og tablet
Spesifikasjoner - reklamebannere mobil og tablet FINN.no Versjon 2.4 Sist oppdatert 16.08.2013 1. Innhold Innhold Introduksjon Målsetning Spesifikasjoner HTML Fysisk størrelse 225 px* Eksempler Størrelser
Lyd og video på nettsider
Lesson 8 Lyd og video på nettsider 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
Web fundamentals. Web design. Frontend vs. Backend 17.01.2008. Webdesign 17. januar 2008 3. Monica Strand
Web fundamentals Webdesign 17. januar 2008 Monica Strand Webdesign 17. januar 2008 1 Web design Fagområdet Web design inneholder flere disipliner Grafisk design Informasjonsdesign Brukergrensesnittdesign
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
NCE TOURISM FJORD NORWAY. FJORDNETT INTERNETTFORUM 2012 Bergen, 12./13. juni 2012
NCE TOURISM FJORD NORWAY FJORDNETT INTERNETTFORUM 2012 Bergen, 12./13. juni 2012 HACKERS HOUR Hvor langt kommer vi med FjordNett rammeverket? Html CSS Javascript Hva er bestanddelene av en nettside? Html
HTML-del. 1. <!-- ikke slett min kode, vær så snill --> er a) en HTML stil-tag b) en CSS stil-tag c) en HTML kommentar-tag d) en CSS kommentar-tag
HTML-del 1. er a) en HTML stil-tag b) en CSS stil-tag c) en HTML kommentar-tag d) en CSS kommentar-tag 2. Grafisk elementer på web skal være a) 72 ppi b) 144
Høgskoleni østfold EKSAMEN
Høgskoleni østfold EKSAMEN Emnekode: Emne: ITF10511 Webutvikling Dato: Eksamenstid: 27/11-2015 4 timer Hjelpemidler: Faglærer: Ingen Tom Heine Nätt Eksamensoppgaven: Oppgavesettet består av 10 sider inkludert
HTML5. Skjemaer på nettsider. Skjemaer med. Informasjonsteknologi 1 og 2. Gløer Olav Langslet Sandvika VGS
Skjemaer med HTML5 Gløer Olav Langslet Sandvika VGS Leksjon 10 Informasjonsteknologi 1 og 2 Skjemaer på nettsider I denne leksjonen skal vi se litt nærmere på bruk av skjemaer på nettsider. Du har sett
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
CASCADING STYLESHEETS (CSS)
CASCADING STYLESHEETS (CSS) HVA ER CSS Stylesheets er en metode for å flytte selve formatteringen av et HTML dokument ut av selve dokumentet og over i et eksternt regelsett. Dette skyldes HTMLs manglende
Grunnleggende om websider og HTML-kode
Grunnleggende om websider og HTML-kode Html er et språk / en standard som brukes for å gi instrukser til nettlesere om hvordan ulike elementer på en webside skal fortolkes og presenteres for en sluttbruker.
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
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
NORSKE MUSEER. Google Plus Local / Google Local. Agnete Tøien Pedersen Head of SEO. Copyright 2011, iprospect, Inc. All rights reserved.
NORSKE MUSEER Google Plus Local / Google Local Agnete Tøien Pedersen Head of SEO GOOGLE LOCAL / GOOGLE PLUS LOCAL Kjært barn har mange navn... Hvorfor? Hvordan ta eierskap til en eksisterende oppføring?
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
Søkemotoroptimalisering. Lenker/ popularitet. Tekster/innhold. Plattform/webarkitektur. SEO pyramiden
Sjekkliste for Søkemotoroptimalisering Lenker/ popularitet Tekster/innhold Plattform/webarkitektur SEO pyramiden Sjekkliste for Søkemotoroptimalisering (SEO) Crevita Marketing AS 1 Crevitas sjekkliste
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
La oss gjøre nettsiden vår bedre med noen stiler. I denne og den neste leksjonen skal vi lære hvordan man endrer farge, tekst, størrelser og mer!
Lesson 4 CSS 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
Håndbok for Office 365
ProCloud As P Håndbok for Office 365 Nyttige brukertips for å få mer ut av din løsning Geir Hogstad 2012 w w w. p r o c l o u d 3 6 5. n o Innholdsfortegnelse Forord... 2 Komme i gang med dokumentbiblioteker....
minportal Høyest mulig på Google
minportal Høyest mulig på Google Hva gjør Google (og andre)? Matche surfer og nettsted på gratisplass på reklameplass Hva skal du (portaleier) gjøre? Gratisplass Hvilke surfere og søkeord vil du nå? Tilpasse
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
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
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
1. XHTML. Innhold Innledning
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag XHTML Lene Hoff 19.9.2006 Lærestoffet er utviklet for faget XML Teknologi 1. XHTML Resymé: I denne leksjonen skal vi ta for oss standarden
Bli elsket av Google. Hva er SEO. Målet for kurset
Bli elsket av Gole er SEO Målet for kurset 1 Hvor viktig er førstesiden? Gole ruler på søk vi skal innom i dag Det du, alle andre Gole ser innholdet Det stort sett bare Gole ser teknolien Verktøy metoder
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
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.
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. Tar lang tid å laste inn siden: Mye bilder Mange animasjoner
DIAGNOSERAPPORT. B&W Caravan DA www.bwcaravan.no. Utført av: Jan Erik Iversen
DIAGNOSERAPPORT B&W Caravan DA www.bwcaravan.no Utført av: Jan Erik Iversen Generell synlighet (pagerank) En god start er å sjekke den generelle synligheten på siden. Dette er en test som rangerer med
INF1040 Oppgavesett 4: CSS
INF1040 Oppgavesett 4: CSS (Kapittel 5) Fasitoppgaver Ingen fasitoppgaver denne gang. Se flervalgsoppgavene under. Flervalgsoppgaver I følgende oppgaver er det oppgitt fem alternativer der nøyaktig ett
DIAGNOSERAPPORT. for. Dato:19122012 Utført av: Tommy Svendsen
DIAGNOSERAPPORT for Dato:19122012 Utført av: Tommy Svendsen Generell synlighet (pagerank) En god start er å sjekke den generelle synligheten på siden. Dette er en test som rangerer med utgangspunkt i hvor
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
TENK TECH SUMMERCAMP BYGG DIN EGEN NETTSIDE
TENK TECH SUMMERCAMP BYGG DIN EGEN NETTSIDE JULIE HILL ROA MIRA THOEN FEIRING HVA ER WEBUTVIKLING? SERVER KLIENT HTTP request HTML, CSS, JavaScript HTTP response HTML Innhold CSS Utseende JAVASCRIPT Oppførsel
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å...
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
Oppgavesett videregående kurs i NVivo 9
Oppgavesett videregående kurs i NVivo 9 Oppgave 1 Alt i en mappe Når man skal kode på lyd og video er det lurt å ha disse filene i samme mappa som NVivo-prosjektfila. Opprett en mappe på skrivebordet.
Høgskoleni østfold EKSAMEN
Høgskoleni østfold EKSAMEN Emnekode: Emne: ITF10511 Webutvikling Dato: Eksamenstid: 03/12-2014 09.00-13.00 Hjelpemidler: Faglærer: In en Tom Heine Nått Eksamensoppgaven: Oppgavesettet består av 6 sider
praktiske eksempler DOM Document Object Model DOM og Høst 2013 Informasjonsteknologi 2 Læreplansmål Gløer Olav Langslet Sandvika VGS
DOM og praktiske eksempler Gløer Olav Langslet Sandvika VGS Høst 2013 Informasjonsteknologi 2 DOM Document Object Model Læreplansmål Eleven skal kunne programmere med enkle og indekserte variabler eller
"Dette skjer når jeg trykker på denne knappen" "Når jeg skriver i dette feltet, ser jeg at det andre forandrer seg"
Tegning med SVG Skrevet av: Teodor Heggelund Kurs: Elm Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon I denne oppagaven skal vi lære
Synlighet for brukeren optimalisering av søk
Synlighet for brukeren optimalisering av søk Optimalisering handler om å gjøre opplevelsen best mulig for brukeren. Når vi snakker om søk: Den best mulige opplevelsen er at det er enkelt å finne det vi
DIAGNOSERAPPORT. Utført av: Jon Petter Hellesvik
DIAGNOSERAPPORT Utført av: Jon Petter Hellesvik Generell synlighet (pagerank) En god start er å sjekke den generelle synligheten på siden. Dette er en test som rangerer med utgangspunkt i hvor synlig siden
INF1040 Oppgavesett 2: Nettsider og XHTML
INF1040 Oppgavesett 2: Nettsider og XHTML (Kapittel 4) Fasitoppgaver Ingen fasitoppgaver denne gang. Se flervalgsoppgavene under. Flervalgsoppgaver I følgende oppgaver er det oppgitt fem alternativer der
Hvordan komme høyere opp på søketreff hos Google?
Hvordan komme høyere opp på søketreff hos Google? En praktisk guide i søkemotoroptimalisering, og litt om hva du kan gjøre for å få mer besøk på dine hjemmesider. Sircon Norge 2010 http://www.sircon.no
På oppdagelsesreise etter den tapte informasjonen. Søk og søkemotorer Teoretisk gjennomgang
På oppdagelsesreise etter den tapte informasjonen Søk og søkemotorer Teoretisk gjennomgang Å finne informasjon Å finne relevant informasjon er ikke alltid like lett det kan være du får altfor mange treff
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 http://www.hovikif.no/ Bruk av siden. Når du går inn på siden får du opp følgende bilde:
Brukerveiledning http://www.hovikif.no/ Bruk av siden Når du går inn på siden får du opp følgende bilde: Øverst i høyre hjørne kan du endre størrelsen på teksten og søke etter lagrede artikler. De enkelte
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:
Oblig 3 Webutvikling
Oblig 3 Webutvikling Av Thomas Gitlevaag. Oppgave 1 Ta for deg en selvvalgt bedrift (gjerne lokal/mindre) og tenk deg at du hadde fått i oppgave å være en SEO-konsulent for disse i én uke. På denne uken
DIAGNOSERAPPORT. Arne Fallrø AS. www.fallro.no. Utført av: Jan Erik Iversen
DIAGNOSERAPPORT Arne Fallrø AS www.fallro.no Utført av: Jan Erik Iversen Generell synlighet (pagerank) En god start er å sjekke den generelle synligheten på siden. Dette er en test som rangerer med utgangspunkt
Nyheter i eway 5 Contents
Nyheter i eway 5 Contents Sidekart... 3 Kort URLer... 4 Ny editor... 5 Listebilder... 7 Les mer URL er... 8 Sosiale lenker... 9 Nytt redaktør verktøy... 10 Meny og malredigering... 11 Sidenavigasjon á
6 TEKNISK - MOBIL Teknisk stand mobil-versjonen av nettsiden. 7 TEKNISK - DATAMASKIN Teknisk stand på desktop-versjonen av nettsiden.
SIDE FORBEDRINGSPOTENSIALE 2 SEO - INNLEDING 3 INNHOLD Forklaringer og status. 4 SØKEORDSANALYSE Søkeord, konkurranse og din posisjon. 5 URL ER, TITLER, META BESKRIVELSER Oversikt over status på alle undersider
Gruppe prosjekt del 3. INFO134 Klientprogrammering Vår 2017 Kandidatnummer: 304, 298
Gruppe prosjekt del 3 INFO134 Klientprogrammering Vår 2017 Kandidatnummer: 304, 298 Del 1 Forholdet mellom HTML, JavaScript og MongoDB HTML, er et markeringsspråk for hypertekst. HTML benyttes for å strukturere
Finnes du der ute? 3
Evnen til å finne 3 Finnes du der ute? In Real Life! Søkemotorenes betydning Nordmenn søker 9-13 ganger pr dag I Norge har Google en markedsandel på +95% I Norge så har Google over 28 millioner søk pr
Oblig 4 Webutvikling. Oppgave
Oblig 4 Webutvikling Oppgave Lag din egen Wordpress- site der du tester ut CMS- systemet. Det å lage egne templates fra bunnen kan være noe komplisert, så det holder for dette prosjektet om dere modifiserer
Javascript. Mer om layout
Javascript. Mer om layout Kirsten Ribu 04.10.04 Kirsten Ribu - Webpublisering - HiO -2004 1 Men først. Hvordan går det med klasser og blokker? Hjalp det med mailene? Litt mer om klasser og blokker ;-)
DEFINISJONER I DIGITAL MARKEDSFØRING
DEFINISJONER I DIGITAL MARKEDSFØRING Admira Bajrektarevic Markedsansvarlig Mobile Worker En god sjekkliste med markedsbegreper for deg som ønsker å jobbe mer med digital markedsføring! Her har vi listet
Aktivitetsplan - Adobe Pro kurs Infografikk høsten 2015
Aktivitetsplan - Adobe Pro kurs Infografikk høsten 2015 Hva er nytt i Adobe CC 2015 Adobe CC har mange flotte nyheter i InDesign, Illustrator og Photoshop. Vi vil guide deg gjennom nyhetene på en effektiv
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:...
Usus vinterkonferanse SYNLIGHET PÅ NETT v/digital rådgiver Bodil Sandøy Tveitan
Usus vinterkonferanse 2017 SYNLIGHET PÅ NETT v/digital rådgiver Bodil Sandøy Tveitan Kilde: https://www.thinkwithgoogle.com/articles/travel-trends-4-mobile-moments-changing-consumer-journey.html Vit hvorfor
Webutvikling oblig 1 Marius Hanssen
Webutvikling oblig 1 Marius Hanssen Oppgave 1 arngren.net er en rotete nettside, enkelt sett forpestet med et uorganisert layout og en kode så grov at jeg ikke skjønner hvordan de klarte å finne en så
Introduksjon til HyperText Markup Language
Introduksjon til HyperText Markup Language Skrevet av Atle Nes Avdeling for informatikk og e-læring Høgskolen i Sør-Trøndelag Dette er en kort introduksjon til hvordan du kan lage websider med en enkel
NCE Tourism Fjord Norway Håndbok NYE MEDIER
NCE Tourism Fjord Norway Håndbok NYE MEDIER søkemotoroptimalisering 1 Innhold Om Guiden 7 Oversikt 8 Om søkemotorer 8 Om søkeord 9 Om språk 10 Om sosiale medier 10 Generelle anbefalinger 11 Innholdsstruktur
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
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
1. Intro om SharePoint 2013
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag Intro om SharePoint 2013 Stein Meisingseth 09.08.2013 Lærestoffet er utviklet for faget LO205D Microsoft SharePoint 1. Intro om SharePoint
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.
Veileder i bruk av GoodReader
RISØR KOMMUNE Veileder i bruk av GoodReader Innhold 1. Laste ned dokument fra kommunens hjemmeside til GoodReader... 2 2. Bruke GoodReader... 7 3. Redigere filnavn... 8 4. Opprette kataloger / mapper...
To RDF or not to RDF Fagdag om Noark 5 og RDF
Ragnar Sturtzel 2014-06-17 To RDF or not to RDF Fagdag om Noark 5 og RDF Diskusjonstemaer Først en kort oppsummering av dagen Så noen spørsmål jeg har satt opp Til slutt åpen debatt 2 Oppsummering 1 Graham
oss? Hva må webredaktører kunne om universell Aud Marie Hauge, ekspert i brukervennlighet og
Hva kan man forvente at en leverandør kan ordne for oss? Hva må webredaktører kunne om universell utforming? Aud Marie Hauge, ekspert i brukervennlighet og tilgjengelighet, li t Epinova Hva er universell
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
Intentor Helpdesk - Installasjon Step #3: Microsoft Reporting Services
Intentor Helpdesk - Installasjon Step #3: Microsoft Reporting Services Dokumentasjon levert av: Prosjekt: Norsk Data Senter AS Installasjon av Intentor Helpdesk Norsk Data Senter AS e-post info@nds.no
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
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
Læringsmål og pensum. Hvordan virker webteknologi? (klient-tjener arkitektur) HTML - virkemåte. Nettleser: Firefox, Opera, Safari
1 2 Læringsmål og pensum TDT4105/4110 Informasjonsteknologi grunnkurs: Uke 35/36 HTML Førsteamanuensis Alf Inge Wang Læringsmål Lære å lage statiske hjemmesider Bilder Lenker Lister Tabeller Skjema for
Hva er et Prosjekt? NVivo ikke bare koding. Noen sentrale komponenter i NVivo, ord og uttrykk m.m.
Noen sentrale komponenter i NVivo, ord og uttrykk m.m. Steinar Theie Hva er et Prosjekt? Et prosjekt i NVivo korresponderer med hva vi vil kalle et forskningsprosjekt i den virkelige verden I prosjektet
BORRENYTT. Dette er en innføringsguide om hvordan man kan legge til nye poster, og hvordan disse bør settes opp.
Dette er en innføringsguide om hvordan man kan legge til nye poster, og hvordan disse bør settes opp. I denne guiden skal jeg ta for meg hvordan man kan legge til eller endre tekst, opprette nyheter og
Hvordan setteopp en wordpress site med wampserver. Lokal site på din pc.
Hvordan setteopp en wordpress site med wampserver. Lokal site på din pc. Av Thomas Gitlevaag Steg 1. Installasjon Steg 2. simpel utforsking av wordpress steg 3. Sette opp en veldig enkel side. Steg 1.
Aktivitetsplan - Adobe Pro kurs Infografikk våren 2015
Aktivitetsplan - Adobe Pro kurs Infografikk våren 2015 Hva er nytt i Adobe CC2014 Adobe CC har mange flotte nyheter i InDesign, Illustrator og Photoshop. Vi vil guide deg gjennom nyhetene på en effektiv
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
Hurtigstartveiledning
Hurtigstartveiledning Microsoft PowerPoint 2013 ser annerledes ut enn tidligere versjoner, så vi har laget denne veiledningen for å hjelpe deg med å redusere læringskurven. Finne det du trenger Klikk en
Pipfrog AS www.pipfrog.com. Flere nettbutikker og språk
Flere nettbutikker og språk Flere nettbutikker og språk For å nå en bredere kundebase og gi en bedre tjeneste ønsker du kanskje å tillate kundene å velge et språk de foretrekker når de handler. Pipfrog
Alle publiserte nyheter arkiveres i kategorier som du selv oppretter, Det gir deg en ryddig oversikt i arkivet senere.
PUBLISERING Som innlogget bruker får du tilgang til publiseringsfunksjoner... ABC for publisering Overskrift Ingress Ingressbilde Hovedtekst Widget Visning Verktøy Annet Alle publiserte nyheter arkiveres