Want to make creations as awesome as this one?

Multimedia / HTML

Transcript

Multimedia- / HTML Crashkurs

Lerne die weite Welt des Internets kennen

START

Internet -> leicht gemacht

Index

Schwerpunkte

HTML Aufgaben

Informatik

HTML Grundkurs

Wissens-Quiz

Ende

Grundbegriffe

Multimedia Beispiele

Die Welt des Internets

Der Prozess

+ info

+ info

+ info

+ info

00 Was soll erreicht werden?
Dein Ziel

Step 1

Step 2

Lerne die Multimedia-Welt kennen

Meistere Aufgaben und stell dein gelerntes auf die Pobe

Step 3

Abschluss, sehe was du geschafft hast.

Step 4

Vertiefe dein Können

Hierrunter zählen alle Grundinformationen zu Medium, Multimedia, Multimediasystem, MM Anwendungsgebiete, Internet, WWW, Dokument, Hypertext, HTTP und HTML

Dein erstes Quiz steht hier bevor. Geprüft wird das bisher erlernte im Kurs.

Im vorletzten Schritt erhälst du eine HTML Grundausbildung. Wie wird HTML benutzt und angewendet.

Zum Abschluss werden deine HTML Fähigkeiten getestet. Und danach bist du für deine eigenen Projekte gewappnet.

01 Los gehts...

Los gehts?
Aber womit haben wir es zu tun?

INFO

Internet = Informatik?
HTTP = Multimedia?
WWW = HTML?
HTML = Informatik?

Um die passenden Informationen zu klären, müssen wir erst einmal Grundwissen aufbauen.

"In der Informatik geht es genauso wenig um Computer wie in der Astronomie um Teleskope"

Edsger Wybe Dijkstra

INFO

02 Informatik

Denn es geht mehr um die Infomationen z.B. die mittels Software vermittelt werden und weniger um die Hardware.

In unserem Kurs begrenzen wir uns auch nur auf einen sehr kleinen Teil der Informatik.

INFO

02 Information

Informatik setzt sich aus Infomation und Automatik zusammen.
Aber was ist eigentlich Information?

Information ist in der Informationstheorie das Wissen, das ein Absender einem Empfänger über einen Informationskanal vermittelt. Die Information kann dabei die Form von Signalen oder Code annehmen. Der Informationskanal ist in vielen Fällen ein Medium. Beim Empfänger führt die Information zu einem Zuwachs an Wissen.

1. einen materiellen

2. einen symbolischen

03 Medium

Medienbegriff

Ein Medium ist ein materieller Zeichenträger, der Begriff umfasst immer zwei Aspekte:

...auch das Zeichensystem, der Code, wird als Medium bezeichnet (also z.B. die Sprache, die Gestik, die Musik, die bildliche Darstellung), dieser Aspekt bezeichnet die symbolische Darstellung des Inhalts einer Kommunikation.

als Medium wird einerseits der materielle Träger bzw. Kanal bezeichnet (z.B. Zeitung, Buch, CD, Telefon); dies ist oft mit Technik und Apparaten verbunden.

04 Multimedia

Multimedia was ist das?

Multimedia (MM) ist eine Technologie, die verschiedene Medien und Wege verwendet, um bei der Vermittlung von Informationen mehrere Sinnesorgane gleichzeitig anzusprechen. Charakterisierend für eine Multimediaanwendung ist, dass sie mehrere Medien zu einem integralen Gesamtwerk kombiniert. Dabei werden offene, netzwerkartig verknüpfte, nichtlineare Strukturen verwendet.

Begriff nach Yass:

05 Multimediasystem

Multimediasystem

Nach Steinmetz ist ein Multimediasystem durch die rechnergesteuerte, integrierte Erzeugung, Manipulation, Darstellung, Speicherung und Kommunikation von unabhängigen Informationen gekennzeichnet, die in mindestens einem kontinuierlichen (zeitabhängigen) und einem diskreten (zeitunabhängigen) Medium kodiert sind.

(im engeren Sinn)

06 Multimediagebiete

MM-Anwendungen können für den Desktop-Einsatz, den Online-Bereich (Internet) oder für beides konzipiert werden.
-> Ausbildung -> Kommunikation
-> Online-Präsentationen im Internet
-> Deskop-Präsenation und -Dokumenation
-> Spiele und Entertaiment -> Interaktives Fernsehen
-> Virtual Reality / Augmented Reality
-> Electronic Publishing
-> Kiosksysteme

Anwendungs-gebiete

Das Internet verkörpert einen weltweiten Verbund von Computernetzwerken, die auf der Basis gemeinsamer Protokolle miteinander kommunizieren.

07 Internet

08 WWW

World Wide Web
Multimedia orientiertes und hyperlink basiertes Informationssystem, das auch Schnittstellen zu anderen Internetdiensten bietet (Dienst mit wohl größtem Anteil an der Entwicklung der Popularität des Internets)


09 Geschichte des WWW

Begründet durch
T. Berners-Lee und
R. Cailleau am Genfer Cern

1989

Weltweit erste Webseite info.cern.ch wurde veröffentlicht

1991

Anfangs hieß das Web noch Mesh (Geflecht)

...

1998

Der erste Internet Explorer

1995

Die Suchmaschinene Google ist da.

Ursprüngliches Ziel war die Möglichkeit der Bereitstellung von Dokumenten auf unterschiedlichen Plattformen über verschiedene Nutzerschnittstellen in einem Rechnernetz.

Die Seite ist immer noch aktiv!

Das WWW hat sich zu einem über das ganze Internet verteilten Hypermedia-Informationssystem entwickelt.

WWW-Server halten Dokumente vor, die über WWW-Clients (Browser) abgerufen werden können.

09 Geschichte des WWW

Mit dem sogenannten
Web 2.0 wurden Webseiten populär

2000er Jahre

Das Internet wird mobil auf Telefonen

2000

Facebook startet und ein Jahr später YouTube

2004 2005

Das Fernsehen wandert ins Internet

2013

IP-Adressen gehen aus.

2011

Es ist das heute am häufigsten genutzte Informationssystem.

Die regionale Internet-Registrierstelle für Asien und Australien, APNIC, gibt bekannt, dass die IPv4-Adressen – die Namen, mit denen Privatrechner, Webserver und andere Geräte sich im Netz bewegen – zur Neige gehen. Im Februar hatte die internationale Vergabestelle für IP-Adressen, IANA, den letzten freien Block von einmal mehr als vier Milliarden IPv4-Adressen an die APNIC vergeben. In Zukunft werden die IP-Adressen auf das neue System IPv6 umgestellt, das rund 340 Sextillionen neue IP-Adressen ermöglicht.

IP-TV heißt Fernsehen übers Web: Höhere Datenübertragungsraten und immer umfangreichere Mediatheken der TV-Sender machen IP-TV attraktiv. Zusätzlich fällt die Bindung an feste Sendezeiten weg. Auch Software und Apps liefern Livestreams etlicher TV-Sender. In den USA hat der IP-TV-Anbieter Netflix im April 2013 erstmals den bisherigen Platzhirschen auf dem TV-Markt, den Pay-TV-Sender HBO, bei den Abonnentenzahlen überholt. Damit verdrängt erstmals ein Web-Video-Anbieter einen "normalen" TV-Sender von der Spitze.


Arbeitsdefinition Dokument

Wir wollen unter einem Dokument eine Sammlung von Medienobjekten zusammen mit einer Menge von strukturellen Beziehungen zwischen diesen Objekten verstehen. Ergänzend können Präsentations- und Interaktionsregeln gegeben sein.


10 Dokument

Hypertext

“Hypertext is text which is not constrained to be linear” Ted Nelson, 1965

INFO

11 Hypertext

Hypertext-Dokumente erlauben über ausreichende Hyperlinks den Verweis auf Stellen im betrachteten Dokument oder in anderen Dokumenten (welche ihrerseits wiederum Hyperlinks enthalten können).

HTTP

Hypertext Tranfer Protocol (HTTP) ist ein Protokoll in der Anwendungsschicht des Internet für die Kommunikation zwischen Browsern und Servern im WWW.

INFO

12 HTTP

Browser fragt Hypertext-Dokument an, Server stellt Dokumente zur Verfügung schematischer Kommunikationsablauf.

Hier könnte es noch weiter in die Tiefe gehen, aber wir sind nicht im Informatikstudium des wegen machen wir einfach weiter.


Zur Beschreibung von Hypertext-Dokumenten werden Markup Languages (Auszeichnungssprachen) benutzt.
Unter einer Markup Language verstehen wir eine Menge von Regeln zur textlichen Beschreibung von Dokumenten unter Benutzung spezieller technischer Zeichenfolgen (markups, tags). Letzere gruppieren, organisieren und markieren inhaltliche Teile eines Dokuments. Und dann sind wir schon beim HTML.


Zwischenpause.

Bevor wir mit dem spannenden Thema HTML weiter machen wird dein Wissen zum vergangenen Stoff/Input geprüft.
Ab hier gibt es kein Zurück!


INFO

Pause

Nimm dir eine kurze Pause, du hast es schon weit geschafft. Trinke etwas oder schnapp dir einen kleinen Snack zur Stärkung, wenn du es braucht. Jetzt wird es noch mal knifflig.




next

Right!

Wissens-Quiz

EIn Hypertext Dokumente sind auch viele Internetwebseiten, aber nicht jede.

next

RIGHT!

Wissens-Quiz

Explanation:
Du hast es richtig erfasst. Es wurde erst von IPv4 auf IPv6 aufgestockt, ob diese jemals verbraucht werden, können wir zu diesem Zeitpunkt noch nicht sagen.

Wrong!
Die Antwort war leider falsch.

ERROR!

TRY AGAIN

Wissens-Quiz

EMPEZAR

Quiz Was hast du gelernt? Wie gut ist dein Wissen?

Teste dich auf dein Können.
Zähle deine richtigen Antworten.

START

QUESTION 1/10

In der Informatik geht es um Hardware.

Nein

Ja

Vielleicht

Wissens-Quiz

QUESTION 2/10

ein materieller Zeichenträger

ein Code des Inhalts einer Kommunikation

symbolische Darstellung

Wissens-Quiz

Ein Medium ist...

QUESTION 3/10

Eine Markup Language

Das Dokument enthält Formatierungsanweisungen und Hyperlinks

Jede Internetwebseite

Wissens-Quiz

Was versteht man unter
Hypertext Dokument?

QUESTION 4/10

Was heißt HTTP ausgeschrieben?

HyperText Transfer Protocol

Hypertextprotocol

Hypertransfer Textprotocol

Wissens-Quiz

QUESTION 5/10

Information ist Wissen was ein Absender einem Empfänger vermittel.

Manschmal

Wahr

Falsch

Wissens-Quiz

vs

QUESTION 6/10

Falsch

Richtig

Wissens-Quiz

Informatik ist eine Zusammenstellung zwischen Information und Mathematik.

Wissens-Quiz

QUESTION 7/10

Wer hat HTML und
das WWW erfunden?

Bill Gates

Hedy Lamarr

Tim Berners-Lee

Wissens-Quiz

QUESTION 8/10

Multimedia ist eine Technologie die
verschiedene ... verwendet.

Gebiete

Materialien

Medien und Wege

QUESTION 9/10

Klaro

Leider nein

Wissens-Quiz

IP-Adressen halten für immer.

QUESTION 10/10

1. Netzwerke
2. Computer

1. Netzwerke
2. Protokolle

1. Protokolle
2. Computer

Wissens-Quiz

Das Internet verkörpert einen weltweiten Verbund von 1.
Die Basis dafür bieten 2.

Platz 1

Platz 2

Platz 3

Deine Ergebnisse vom Wissens-Quiz

RESULTS

8-10 correct

5-7 correct

2-4 corrects

Erster Platz


Herzlichen Glückwunsch

Du hast super aufgepasst und dir alles gemerkt.

Zweiter Platz


Herzlichen Glückwunsch

Die goldene Mitte, du hast schon super mitgemacht, aber vielleicht erprobst du dein Wissen beim nächsten Mal noch ein wenig mehr.

Dritter Platz


Super du hast es aufs Treppchen geschafft. Aber vielleicht strengst du dich das nächste Mal etwas mehr an um noch mehr Wissen zu sammeln.

INFO

Dein erstes Abzeichen hast
du erhalten.

Gleich geht es mit der Vertiefung deiner HTML-Kentnisse weiter.

Hier lernst du alle Basics um ein HTML-Dokument zu erstellen und den Abschlusstest zu bewältigen.

Wie gehts weiter?

Nach dem Kurs wirst du grundlegendes HTML programmieren können. Programmieren ist aber hier das falsche Wort, eher erstellen können, weil programmieren passt hier nicht. HTML ist um genau zu sagen keine Programmiersprache sondern eine Markup Language. Wenn man andere Sachen wie PHP, Java oder CSS machen möchte, muss man HTML aus dem Handgelenkt können. Es ist somit der erste Schritt und die Grundlagen schauen wir uns jetzt an.


INFO

Lektion 13 HTML

HTML (Hypertext Markup Languages)

ist als Format für WWW-Dokumente anzusehen. Mittels HTML können Dokumente schnell und einfach erstellt und einem großen Publikumskreis im WWW zugänglich gemacht werden.
Entwicklung geht wie beim HTTP auf T. Berners-Lee zurück.


Strukturierungsmöglichkeiten sind:
Absätze, Tabellen, Verweise, Grafik-Einbindung, Formulare, Einbindung von Multimedia-Objekten.

Im Grundkurs den du gerade besucht wird es nur um HTML-Basics gehen.

Wie du vielleicht schon weißt, beinhaltet ein Internetdokument HTML als Grundgerüst aller Webseiten.

Allerdings bei den meisten Seiten im Internet gibt es noch css (Cascading Style Sheets) für die Layout-Beschreibung und JavaScript was Interaktionen hinzufügt. Im Kurs testen wir allein die Beschreibung von Dokumentenstruturen/-inhalten aus.



Lektion HTML

+ info

Schon mal einen HTML-Code gesehen?

Wie wir wissen hat jede Webseite ein HTML-Gerüst, wenn du z.B. in einem neuen Tab eine beliebige Webseite aufrufst und auf F12 tipps, öffnet sich der Quellcode der jeweiligen Seite. Abhänig von Windows und Apple IOS kannst du auch mit der rechten Maustaste dir den Seitenquelltest anzeigen lassen.

Wenn wir jetzt selbst etwas mit HTML machen wollen, brauchen wir einen Webbrowser und einen Editor.
Ich benutzte gerne Firefox als Benutzeroberfläche und Atom oder Notepad++ als Editor.
Entscheide selbst was zu dir passt.
Jede belieblige Oberfläche die einen Zugang zum Internet bietet ist geeignet.

Lektion HTML

+ info

Erste Schritte:
Öffne dafür den Editor deiner Wahl und erstelle ein leeres html Dokument mit dem Namen index.html
Dieses kannst du jetzt in deinen Webbrowser öffnen, mit Datei öffnen oder einfach mit der Maus reinziehen.
Wenn du eine weiße Seite siehst hast du alles richtig gemacht.
Wir wollen diese Seite jetzt mit Leben füllen. Dafür kehre zurück in deinen Editor.
Zunächste wollen wir uns anschauen wie funktionieren einzelne Codes.


INFO

Lektion HTML

+ info

Was ist was?
Jedes HTML-Dokument hat ein Kopf, Titel und Körper.
Die HTML-Codes lassen sich gut aus dem Englischen ableiten.
Kopf heißt head, Titel title, Körper body.
Die Schreibweise der einzelnen Codes sind in spitzen Klammern geschrieben. Ein anfangs Tag (so werden die einzelnen Codes genannt)
sieht so aus <...> und am Ende wird die Klammer mit einem Slash geschlossen </...>.
Da haben wir schonmal die allerwichtigste Regel gelernt.



Sobald du das nicht vergisst bist du gut dabei;).

Lektion HTML

+ info

Wie funktionierts?
Du kannst dir das Codesystem wie ein Baum vorstellen. Jedes Jahr wächst der Baum und bekommt Ringe die geschichtet sind. Der HTML-Code hat auch ein System was in einander greift. Auf dem Bild siehst du ein Beispielt wie es korrekt und falsch dargestellt ist.

+ info

Elemente bestehen aus:
- Start-Tag <...>

- End-Tag </...>

- Elementinhalt ...

- Optionalen-Attributen (Metainformationen)



Die Strukturierungsmöglichkeiten sind:
- Absätze

- Tabellen

- Verweise

- Grafik-Einbindung

- Formulare

- Einbindung von Multimedia-Objekten

Lektion HTML

Document Object Model

DOM-Elementbaum
<html>

<body>

<head>

<a

<hi>

<title>

+ info

HTML-Baum und Zugriff über DOM darauf

Das Verständnis des DOM ist sehr wichtig. Daher wird es hier in aller Ausführlichkeit erklärt.

Über dieses Model können wir auf jedes Element einer HTML-Seite und seine Inhalte zugreifen und diese auslesen, ändern, ersetzen und auch setzen. Aber der Reihe nach. Erst den Aufbau verstehen.

Dazu schauen wir uns eine sehr einfache HTML-Datei an.


- Elemente sind Entities, die spezifizieren, wie das HTML-Dokument aufgebaut ist.

- Ein Attribut wird verwendet, um die Eigenschaften eines HTML-Elements zu definieren und ist innerhalb Start-tag des Elements angeordnet.

- HTML-Tags sind, wie wir schon wissen, Anweisungen in spitzen Klammern, auch HTML Markup (Kennzeichnung oder Auszeichnung) genannt.



"Überschrift 1"

"Seitentitel"

href

""Text des Links"

Root Element

Element

Text

Attribut

Text

Element

Lektion HTML

+ info

Übertrage in deine HTML-Datei die Tags im grünen Feld.

+ info

Wenn du damit fertig bist, lade diese Datei wieder neu in deinem Browser. Falls sich keine Tippfehler eingeschlichen haben, siehst du jezt oben im Tab deinen Titel. Aber deine Seite sieht noch ziehmlich leer aus, deswegen weiter gehts.


Hier ein Beispielt wie es aussehen soll:


meine erste Seite

Hallo Welt

0

Wenn du in deinem HTML Dokument Befehle Kommentieren oder Auskommentieren magst geht das ganz einfach.

0

HTML Befehl (HTML-Tag) Beschreibung <!-- KOMMENTAR -->
In diesem Fall ist der <!--QUELLCODE ohne Wirkung-->

0

0

Über diese Anweisung können Kommentare im HTML-Code gemacht werden bzw. Teile des auskommentiert werden. Somit sind diese Teile für einen Browser nicht existent. Das ist z.B. gut zum Testen von HTML-Befehlen.

Probiere es doch gleich mal aus und schau was passiert (oder auch nicht passiert).

Lektion HTML

div

span

01

Ein weiterer wichtiger Punkt ist das definieren von Bereichen mit div bzw. span und den Attributen id und class.

02

<div id="Name">BEREICH</div>

03

<div class="Name">BEREICH</div>

04

<span id="Name">BEREICH</span>

05

<span class="Name">BEREICH</span>

+ id

Angesprochen wird der Breich über seinen ID-Namen. ID kann nur für ein Element pro HTML-Seite verwendet werden. ID dient also zur eindeutigen Bestimmung eines Elementes.


+ class

Der DIV-Bereich kann per CSS über seinen Klassen-Namen angesprochen werden. Das besondere an CLASS ist, dass damit mehrere Elemente ausgezeichnet werden.


Lektion HTML

Mit SPAN können Textstellen markiert werden und diese dann üer CSS mit Design versehen werden. Das SPAN-Element ist ein Inline-Element, was den Unterschied zum DIV-Element ausmacht.

Über DIV wird ein Bereich definiert. Diesen Bereich kann man über CSS dann ein Design überstülpen. Bei DIV handelt es sich um ein Blockelement, dass Blockelement nutzt die komplette Bildschirmbreite

INFO

Bevor wir zum Test starten hier noch die wichtigsten Tags zur Verwendung im HTML.


Schau sie dir in Ruhe an.

Lektion HTML

Text strukturieren
HTML-BefehleBeschreibung
<h1> ... <h1>
Hauptüberschrift - wichtig, sollte einmal auf jeder einzelnen Seite kommen (engl. h = headline = Überschrift)
<h2> ... <h2>
bis
<h6> ... <h6>
Unterüberschriften - sollten in der logischen Reihenfolge verwendet werden. Nach <h2> kommt <h3>
<p> ... <p>
Absatz - nach dem Absatz wird automatisch Platz gehalten
(engl. p = paragraph = Absatz)
<br>erzwungener Zeilenumbruch (Zeilenende)
<br> kann einzeln stehen und braucht keine geschlossene Klammer
(engl. br = break = Umbruch)
<hr>Trennlinie - trennt unterschiedliche Inhalte
(engl. hr = horizontal ruler = horizontale Linie)

Textstellen hervorheben
HTML-Befehle (HTML-TAG)Beschreibung
<b> ... </b>Schrift wird fett angezeigt
(engl. b = bold = fett)
<strong>...</strong>
wichtiger Bereich, Schrift wird fett angezeigt
(engl. strong = kräftig, überzeugend)
<i> ... </i>Schrift wird kursiv angezeigt
(engl. i = italic = kursiv, schräg)
<del> ... </del>
durchstrichener Text, sprich Inhalt gilt nicht mehr
(engl. del = deleted = gelöscht)
<ins> … </ins>
neuer Inhalt im Text (gut um Änderungen hervorzuheben)
(engl. ins = inserted = neu eingefügt)
<small> … </small>
ür das "Kleingedruckte" im Text
(engl. small = klein)
<blockquote> … </blockquote>
um Zitate zu kennzeichnen
(engl. blockquote = Blockzitat)

Links, Verweise
HTML-Befehle (HTML-TAG)Beschreibung
<a href="URL">BESCHREIBUNG</a>
für interne und externe Links.
"Beschreibung" wird später im Browser als Link (blau unterstrichen) angezeigt und kann angeklickt werden. Die URL innerhalb des Attributs href wird aufgerufen
(engl. a = anchor = Anker)
(engl. href = hyper reference = Hypertext-Referenz)
<a href="index.htm">STARTSEITE</a>
<a href="index.html">STARTSEITE</a>
interner Link (als Endung kann sowohl .html wie auch .htm genutzt werden)

Aufzählungen
HTML-Befehle (HTML-TAG)Beschreibung
<li>AUFZÄHLUNGSPUNKT</li>
Jeder einzelne Punkt bei einer Aufzählung muss von diesem HTML-Befehl umschlossen werden.
(engl. li = list item = Listeneintrag)
<ul>...</ul>Art der Auflistung. Umschließt alle einzelnen <li>
Wird für Aufbau der Seitennavigation benötigt und andere Aufzählungen (engl. ul = unordered list = unsortierte Liste)
<ol>...</ol>Art der Auflistung. Umschließt alle einzelnen <li>
Die einzelnen Listenpunkte bekommen dann entsprechende Nummerierung 1., 2., 3. usw. (engl. ol = ordered list = nummerierte Liste)

Lektion HTML

Die Möglichkeiten einer rein HTML formatierten Seiten

+ info

Falls dich der Ergeitz gepackt hat und es dir in den Fingern gribbelt, probiere dich aus und kreiere deine eigene Seite ganz nach deinen Vorlieben.

HTML Tabellen

HTML Formulare

Lektion HTML

Literaturempfehlung
http://wiki.selfhtml.org

+ info

Weil wir im Kurs nicht auf alles eingehen können, findest du alle weitere Informationen und nennenswerten Tag / HTML Codes auf der Seite https://wiki.selfhtml.org/.


Vertiefe dein Können in HTML

03

Step 3

Meistere Aufgaben und stelle dein gelerntes auf die Probe

02

Step 2

Lerne die Multimedia-Welt mit ihren verschiedenen Grundbegriffen kennen

Step 1

04

Abschlusstest, sehe was du drauf hast.

Step 4

+ info

01

Ein kurzer Blick auf die Timeline.
Wir befinden uns kurz vor der Ziellinie. Noch ein Schritt und du hast es geschafft.

Timeline

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna.

Title here

Bevor es los geht noch ein kleines Vorbereitungsvideo

Jetzt gehts los mit dem HTML-Basic Abschlusstest

Dein letzter Test für diesen Kurs, prüfe deine ganzen HTML-Skills

START

Lass dich nicht von den Spielereichen Bildern und Gimmigs ablenken. Die Zeit tickt.

Wrong!

Wrong!

Volltreffer!

Richtig!

Next question

Yeah!

Resultat

Yeah!

Question 1/10

Hyper Text Modul Language

Hyperlink Markup Language

Hyper Text Markup Language



HTML steht für...

HTML Basic

Question 1/10

<image>

<picture>

<img>


Was ist der richtige HTML-Code bei der Verwendung eines Bildes.

Question 2/10

HTML Basic

Question 1/10

// This is an HTML comment

/* This is an HTML comment */

<!-- This is an HTML comment -->


Wie schreibt man ein
HTML Kommentar?

Question 3/10

HTML Basic

vs

Question 1/10

true

false



<h3> is the biggest heading tag.

Question 4/10

HTML Basic

Question 1/10

<strong>Some text.</strong>

<i>Some text.</i>


Wie schreibt man einen Text kursiv?

<italic>Some text.</italic>

Question 5/10

HTML Basic

Question 1/10

1. <a href>
2. </a href>

1. <a>
2. </a>


Jede HTML Verlinkung
hat ein 1. am Anfang und
2. am ende eines Tags

1. <a href>
2. </a>

Question 6/10

HTML Basic

Question 1/10

neuer Absatz

Brücke

Wofür steht <br>?


bold / fett

Question 7/10

HTML Basic

Question 1/10

macht das gleiche wie ein ID-Attribut

weist einem Tag einen Namen zu


Welche Rolle spielt das class-Attribut in html?

ordnet ein Element einer oder mehreren Klassen zu

Question 1/10

HTML Basic

Question 1/10

ja


Ist es möglich eine Tabelle in einer anderen Tabelle zu nutzen/zu erstellen?

nein

Question 1/10

HTML Basic

Question 1/10

<b>


Welcher Tag steht für fett?

<bold>

Question 10/10

HTML Basic

Question 1/5

Zusatzfrage
Kann <br> ohne </br> stehen?

Nein, nur in Ausnahmefällen

Nein, alle Tags müssen geschlossen werden

Ja muss es sogar

HTML Basic

Results

5-7 Correct

0-4 Correct

8-10 Correct

Play again

You should study more (0-4 Correct)

Das war aber keine Glanzleistung, schade nächstes mal wird's bestimmt besser.

Feel like a Genius (8-10 Correct)

Herzlichen Glückwunsch, du bist bist auf dem besten Weg zum Profi.

Not bad (5-7 Correct)

In der Ruhe liegt die Kraft, du bist im guten Mittelfeld.

Congratulations!

Du hast alle deine Tests gemeistert
wuhu einmal Konfetti bitte!!!


Ich hoffe du fühlst dich jetzt nicht erschlagen von dem ganzen Input und bist mit deinen Resultaten zu frieden.

Teile mir gern mit einem Feedback mit wie es für dich war, dass wäre super und ich würde mich sehr freuen :)

sabrina.handge@stud.hs-merseburg.de

Du glaubst, dass hier ist das Ende?
Jedes Ende hat auch einen Anfang.
Vielleicht sehen wir uns beim nächsten Kurs.
Bis bald.

Content create by Sabrina Handge
Bilderhost by genial.ly