Ultimativ HTML

Kursusindhold

Ultimativ HTML

Ultimativ HTML

1. Forståelse af Webudvikling

Velkommen til HTML og Webudvikling Hvad Er Internettet?Hvordan Fungerer Internettet?Forståelse af Hvordan Hjemmesider Fungerer Frontend og Backend Udvikling Forklaret

2. HTML Tags og Attributter

Forståelse af HTML-Tags Arbejde med HTML-Attributter Forståelse af Parrede og Enkeltstående Tags i HTML Tekstmarkering og Formatering i HTML Udfordring: Opret Dit Første Webside Afsnit Udfordring: Byg en Personlig Introduktionswebside Udfordring: Design en Filmudstillingswebside Brug af Links og Knapper i HTML Udfordring: Opret Links til Populære Websites Validering af Din HTML-Kode for Bedste Praksis

3. HTML-Dokumentstruktur

Hemmelighederne Bag Velstrukturerede Websider Forståelse af HTML-Dokumentstruktur Rollen af Dokumenthovedet Styring af Dokumentflow og Layout Udfordring: Strukturer et HTML-Dokument Korrekt Brug af Udviklerværktøjer til HTML-Inspektion og Fejlfinding

4. Arbejde med Medier og Tabeller

Tilføjelse af Billeder i HTML Udfordring: Arbejde Med Billeder Arbejde med Klikbare Billeder, Billedtekster og Optimering Forståelse af Vektor- og Rastergrafik Indlejring af Lyd og Video til Rigt Medieindhold Udfordring: Indlejr Lyd og Video i HTML Oprette og Strukturere Tabeller i HTML Udfordring: Design en Funktionel HTML-Table

5. HTML-Formularer og Brugerinput

Introduktion til HTML-Formularer Grundlæggende Om Formularoprettelse i HTML Brug af Etiketter for Bedre Form Accessibility Forbedring af Formularer med Inputattributter Udforskning af Forskellige Inputtyper i HTML Udfordring: Opret Formular med Inputfelter og Etiketter Arbejde Med the Textarea-Elementet Til Indtastning af Flere Linjer Brug af Select-Elementet til Rullemenuer Brug af Datalist-Elementet til Foruddefinerede Inputforslag Gruppering af Formelementer for Bedre Struktur

Rollen af Dokumenthovedet

Dokumenthovedet kan inkludere metatags, hvoraf mange er ikke synlige for brugeren i browservinduet. Derfor vil du i de kommende eksempler ikke se noget synligt indhold. Disse tags gemmer metadataoplysninger om siden.

Sidetitel

Teksten inde i <title>-tagget vises i browsertabben. Titlen bør være en kortfattet beskrivelse af siden og bør højst være 60 tegn lang.

index.html

Med hjælp af denne kode kan du opnå et sådant udseende på hjemmesiden. I browsertabben vil du se den præcise tekst, der er indkapslet inden for <title>-tagget (hvid ramme i billedet).

Metadata

<meta>-tagget indeholder information til browsere og søgemaskiner: dokumentkodning, datakommunikation og meget mere. Metatags kan have mange attributter, da de alle formidler forskellig information. Den vigtigste er sidekodning. Det hjælper en browser med at vise teksten korrekt. I tilfælde af ikke at angive kodning, kan browseren vise mojibake i stedet for tegnene.

index.html

Betydning af meta Tag Attributter

name: navnet på en egenskab kan være ethvert ord eller sætning, webbrowsere forventer generelt en værdi, som de kan genkende og bruge til at udføre en handling. Et eksempel ville være <meta name="author" content="name"> for at angive forfatteren af siden;
content: specificerer egenskabens værdi. Et eksempel ville være <meta name="language" content="english"> for at specificere sidens tekstsprog;
http-equiv: står for HTTP ækvivalent, og det bruges til at simulere HTTP-responsoverskrifter. Dette er sjældent at se. Et eksempel ville være <meta http-equiv="refresh" content="30"> for at sige til browseren at opdatere siden hvert 30. minut.

Grundlæggende meta Tags for SEO Forbedring

<meta name="description"/>: angiver en kort beskrivelse af websiden;
<meta name="author" />: angiver websidens forfatter;
<meta name="language"/>: angiver websidens sprog;
<meta name="robots"/>: fortæller søgemaskiner, hvordan de skal crawle eller indeksere websiden;
<meta name="googlebot" content="notranslate"/>: informerer Google om ikke at tilbyde automatiske oversættelser af websiden;
<meta name="copyright" content="Copyright 2024"/>: angiver websidens ophavsret.

index.html

1. Hvor skal `<meta>`-taggen placeres?

2. Hvilket tagindhold vil blive vist på brugerfanen?

3. Hvad kan gøres for at hjælpe browseren med at indeksere siden?

Hvor skal <meta>-taggen placeres?

Select the correct answer

Inde i <head>-taggen

Inde i <body>-taggen

Hvilket tagindhold vil blive vist på brugerfanen?

Select the correct answer

<title>-taggen

<meta/>-taggen

Hvad kan gøres for at hjælpe browseren med at indeksere siden?

Select the correct answer

Give farverige billeder

Give en kort indholdsbeskrivelse

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 3. Kapitel 3

Spørg AI

Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat

Kursusindhold

Ultimativ HTML

Ultimativ HTML

1. Forståelse af Webudvikling

Velkommen til HTML og Webudvikling Hvad Er Internettet?Hvordan Fungerer Internettet?Forståelse af Hvordan Hjemmesider Fungerer Frontend og Backend Udvikling Forklaret

2. HTML Tags og Attributter

Forståelse af HTML-Tags Arbejde med HTML-Attributter Forståelse af Parrede og Enkeltstående Tags i HTML Tekstmarkering og Formatering i HTML Udfordring: Opret Dit Første Webside Afsnit Udfordring: Byg en Personlig Introduktionswebside Udfordring: Design en Filmudstillingswebside Brug af Links og Knapper i HTML Udfordring: Opret Links til Populære Websites Validering af Din HTML-Kode for Bedste Praksis

3. HTML-Dokumentstruktur

Hemmelighederne Bag Velstrukturerede Websider Forståelse af HTML-Dokumentstruktur Rollen af Dokumenthovedet Styring af Dokumentflow og Layout Udfordring: Strukturer et HTML-Dokument Korrekt Brug af Udviklerværktøjer til HTML-Inspektion og Fejlfinding

4. Arbejde med Medier og Tabeller

Tilføjelse af Billeder i HTML Udfordring: Arbejde Med Billeder Arbejde med Klikbare Billeder, Billedtekster og Optimering Forståelse af Vektor- og Rastergrafik Indlejring af Lyd og Video til Rigt Medieindhold Udfordring: Indlejr Lyd og Video i HTML Oprette og Strukturere Tabeller i HTML Udfordring: Design en Funktionel HTML-Table

5. HTML-Formularer og Brugerinput

Introduktion til HTML-Formularer Grundlæggende Om Formularoprettelse i HTML Brug af Etiketter for Bedre Form Accessibility Forbedring af Formularer med Inputattributter Udforskning af Forskellige Inputtyper i HTML Udfordring: Opret Formular med Inputfelter og Etiketter Arbejde Med the Textarea-Elementet Til Indtastning af Flere Linjer Brug af Select-Elementet til Rullemenuer Brug af Datalist-Elementet til Foruddefinerede Inputforslag Gruppering af Formelementer for Bedre Struktur

Rollen af Dokumenthovedet

Dokumenthovedet kan inkludere metatags, hvoraf mange er ikke synlige for brugeren i browservinduet. Derfor vil du i de kommende eksempler ikke se noget synligt indhold. Disse tags gemmer metadataoplysninger om siden.

Sidetitel

Teksten inde i <title>-tagget vises i browsertabben. Titlen bør være en kortfattet beskrivelse af siden og bør højst være 60 tegn lang.

index.html

Med hjælp af denne kode kan du opnå et sådant udseende på hjemmesiden. I browsertabben vil du se den præcise tekst, der er indkapslet inden for <title>-tagget (hvid ramme i billedet).

Metadata

<meta>-tagget indeholder information til browsere og søgemaskiner: dokumentkodning, datakommunikation og meget mere. Metatags kan have mange attributter, da de alle formidler forskellig information. Den vigtigste er sidekodning. Det hjælper en browser med at vise teksten korrekt. I tilfælde af ikke at angive kodning, kan browseren vise mojibake i stedet for tegnene.

index.html

Betydning af meta Tag Attributter

name: navnet på en egenskab kan være ethvert ord eller sætning, webbrowsere forventer generelt en værdi, som de kan genkende og bruge til at udføre en handling. Et eksempel ville være <meta name="author" content="name"> for at angive forfatteren af siden;
content: specificerer egenskabens værdi. Et eksempel ville være <meta name="language" content="english"> for at specificere sidens tekstsprog;
http-equiv: står for HTTP ækvivalent, og det bruges til at simulere HTTP-responsoverskrifter. Dette er sjældent at se. Et eksempel ville være <meta http-equiv="refresh" content="30"> for at sige til browseren at opdatere siden hvert 30. minut.

Grundlæggende meta Tags for SEO Forbedring

<meta name="description"/>: angiver en kort beskrivelse af websiden;
<meta name="author" />: angiver websidens forfatter;
<meta name="language"/>: angiver websidens sprog;
<meta name="robots"/>: fortæller søgemaskiner, hvordan de skal crawle eller indeksere websiden;
<meta name="googlebot" content="notranslate"/>: informerer Google om ikke at tilbyde automatiske oversættelser af websiden;
<meta name="copyright" content="Copyright 2024"/>: angiver websidens ophavsret.

index.html

1. Hvor skal `<meta>`-taggen placeres?

2. Hvilket tagindhold vil blive vist på brugerfanen?

3. Hvad kan gøres for at hjælpe browseren med at indeksere siden?

Hvor skal <meta>-taggen placeres?

Select the correct answer

Inde i <head>-taggen

Inde i <body>-taggen

Hvilket tagindhold vil blive vist på brugerfanen?

Select the correct answer

<title>-taggen

<meta/>-taggen

Hvad kan gøres for at hjælpe browseren med at indeksere siden?

Select the correct answer

Give farverige billeder

Give en kort indholdsbeskrivelse

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 3. Kapitel 3

Vi beklager, at noget gik galt. Hvad skete der?

some-alt