VL
Fichier Détails
| Cartes-fiches | 382 |
|---|---|
| Langue | Deutsch |
| Catégorie | Marketing |
| Niveau | Université |
| Crée / Actualisé | 29.06.2022 / 30.06.2022 |
| Lien de web |
https://card2brain.ch/box/20220629_medieninformatik
|
| Intégrer |
<iframe src="https://card2brain.ch/box/20220629_medieninformatik/embed" width="780" height="150" scrolling="no" frameborder="0"></iframe>
|
Créer ou copier des fichiers d'apprentissage
Avec un upgrade tu peux créer ou copier des fichiers d'apprentissage sans limite et utiliser de nombreuses fonctions supplémentaires.
Connecte-toi pour voir toutes les cartes.
Was ist die Geschichte von html?
- Generic Markup Language (GML): Vorläufer 1969
- beinhaltete Möglichkeit, Dokumenttypen zu definieren und verfassen
- 1978: ISO Standard = Standard Generic Markup Language
- 1991: Berners-Lee und Caillau entwickeln html basierend auf SGML
- 1993: erster Browser (Mosaic)
- 1999: html4 von W3C als Standard empfohlen
- 2008: erste Version von html5
Was sind Elemente bei html?
- Textteile werden mittels Elementen gekennzeichnet (<...>)
- Schlüsselworte = Inhalt (Konvention: Kleinbuchstaben)
<schlüsselwort>
- Schlüsselworte = Inhalt (Konvention: Kleinbuchstaben)
- sind für Formatierung in Anzeige verantwortlich
- aber: Formatierung in html Dokument hat keinen Einfluss auf Ausgabe
- paarweise auftretende Elemente, die Beginn und Ende markieren
p = Paragraph: <p> Hier steht ein eigener Paragraph. </p> - alleinstehende (leere) Elemente, die nur Beginn markieren
z.B.: Zeilenumbruch (br = Break)- Dieser Satz enthält <br> einen Zeilenumbruch
Was sind Attribute?
- beinhalten zusätzliche Infos für Elemente
- werden nicht angezeigt
- im Start Tag spezifiziert
- als "Attribut-Wert-Paare" angegeben
- <tag attribute="value"> text </tag>
- zuverlässige Attribute = abhängig vom konkreten Tag
- bsp. Titelattribut für Paragraphen, wird angezeigt, wenn Maus sich über Element bewegt
<p titel="mein allererster"> Hier steht ein eigener Paragraph. </p>
- bsp. Titelattribut für Paragraphen, wird angezeigt, wenn Maus sich über Element bewegt
Wie wird der folgende Html Code in der Ausgabe angezeigt?
<p>
<!-- Kommentar: Dies hier ist sehr interessante Info. -->
Welche Sie
<!-- unbedingt -->
lesen sollten !!!
</p>
Welchen Sie lesen sollten !!!
Wie sieht eine Dokumentenstruktur aus?
- DOCTYPE: Kopfzeile (Deklaration des Dokumententyps (html))
- html Dokumente beginnen mit Kopfzeile
- html5: <!DOCTYPE html>
- html-Hauptteil: Beginn der html-Datei
- <head>
- <body>
Wie sieht der Hauptteil der Dokumentenstruktur aus?
- in html Element eingeschlossen
- Kopfbereich
- Titelangaben (zwingend)
- Metainformationen (beschreiben Dokument genauer)
- Autor, Ändeurngsdatum, Suchbegriffe
- nicht auf Website dargestellt, aber ggf. von Suchmaschine ausgewertet
- Bezug zu anderen Dateien, z.B. CSS oder JavaScript
- Rumpfbereich (Body)
- Inhalt und Struktur des Dokuments
- sichtbarer Teil, der im Browser angezeigt wird
- Standardelemente helfen bei Seitenstrukturierung
- Textauszeichnung, Hyperlinks, -media, Seitenstrukturierung
Was sind logische Auszeichnungen zur Textstrukturierung?
- logische Auszeichnungen, die die inhaltliche Funktion beschreiben
- Überschriften
- Listen (ordered/nummeriert vs. unordered/ungeordnet)
- Abschnitte (<section>)
- thematischer Wechsel mit Trennlinie (<hr>)
- Tabellen: teilen Fläche in Zeilen und Spalten
- betonter Text
- Zitate
- vorformatierter Text (dichtengleiche Schrift, Umbruch und Leerzeichen wie in der html Datei)
- generell gilt:
Text wird logisch ausgezeichnet, aber die konkrete Formatierung wird separat festgelegt
Was sind physische Auszeichnungen bei der Textstrukturierung?
- fett oder kursiv
- mittlerweile veraltet, bei html 5 nur noch logische Auszeichnungen
Was sind Hyperlinks?
- geräteunabhängige Mediendateien erstellen, die über einheitliches Verweissystem (Links) verbunden werden können
- html Verweise = unidirektional
- Definition als Verweis (Link)
- Element <a> (anchor): markierter Anker im Text
- Attribut href (hyperreference): Referenz auf Ziel
Wie kann man das Ziel des Hyperlinks beschreiben?
- absolute Adressierung: vollständige URL
- relative Adressierung: im Verhältnis zum Speicherort der Quelldaten
- z.B. bei untergeordneten oder übergeordneten Verzeichnissen
- untergeordnet: "unterordner/name.html"
- übergeordnet: "../name.html"
Wie kann man spezielle Stellen im Dokument adressieren (Bookmarks)?
- Definition des Ankers: <a href = "..."> Übung </a>
- zu bestimmten Absatz oder Überschrift springen
- Deklaration der Zielstelle
Zielstelle muss wissen, dass sie eine Zielstelle ist- falls Element vorhanden, zu dem man springen will: <p id="stelle">Text</p>
- falls Element nicht vorhanden, kann es mithilfe von <span> definiert werden: <span id="stelle">Text</span>
Was sind Hypermedia und wie können sie eingebunden werden?
- Multimedia = mehr als nur Text
- Bilder, Audio, Videos
- vor html5: Einbettung über Plugins
- seit html5: Einbettung in allen gängigen Browsern unterstützt
- Bilder
- Element: <img>
- Attribute: scr (Quelle), width, height (px oder %), alt (textuelle Alternativbeschreibung, falls Bild nicht angezeigt wird)
- Audio
- Element: <audio>
- Attribute: scr (Quelle, unterstützte Formate: MP3, Wav, Ogg), Autoplay)
- Kontrollelemente: controls (play, pause, ...)
- Source Elemente: Angabe von alternativen Quellen und Angaben des Dateitypes
- Video
- vgl. Audio
- Zusätzlich: Größe des Videos
- unterstützte Formate: mp4, WebM, Ogg
Was sind Formulare?
- erlauben es Anwendern Eingabefelder auszufüllen, Optionsfelder auszuwählen, Schaltflächen zu drücken, Listen aus Einträgen auszuwählen
- Bsp. Name, Geschlecht angeben
- <form>
- jedes untergeordnete <input> Element besteht aus Attributen für Eingabetyp und Namen/Wert
Welche Eingabetypen gibt es?
- Text
- text (Textfeld)
- textarea (mehrzeiliges Textfeld)
- password (Textfeld zur Passwortabfrage)
- Auswahlboxen
- checkbox (Mehrfachauswahl möglich)
- radio (Radioknöpfe für Alternativen)
- Schaltknöpfe
- button (normale Schaltfläche)
- submit (Schaltfläche zum Absenden)
- reset (Schaltfläche zum Zurücksetzen des Inhalts)
ab html5: Eingabetypen, die korrekte Eingabe erzwingen und Möglichkeit, eigene Ausdrücke anzugeben
Wie kann man Webseiten strukturieren?
- Layout
- verschiedene Bestandteile, unterschiedliche Funktionen
- Ziel: übergreifende logische Struktur für gesamten Webauftritt
- Bsp.:
- Kopfbereich (header): alle Seiten gleich
- Navigationsbereich: z.B. Linkliste, für alle Seiten gleich
- Hauptteil: individuelle Inhalte
- Fußzeile (footer): Impressum, für alle Seiten gleich
- Realisierungsmöglichkeiten:
- Blockelemente <div> id
- html5 Strukturelemente
Wie hat sich die Verwendung von digitalen Medien über die Jahre geändert?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- Änderung der Informationsgesellschaft durch Arbeitswandel und PC (Personal Computers)
- Medien als Kommunikationskanäle
= stark internetabhängig - 1900: Industriegesellschaft
- 1960: Informationsgesellschaft
- 1980: Mediengesellschaft
- 2022: ca. 94% nutzen Internet, junge Erwachsene: 99%
- Nutzungsdauer ± 7h pro Tag bei jungen Erwachsenen
Was ist das Internet?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- Basistechnologie und Grundlage für Internetdienste
- Verbindung verschiedener Netze zu weltumspannenden Computernetzwerken
- www (World Wide Web) baut auf Internet auf
- über Internet abrufbares System mit Hypertext und -media Dokumenten
- googlet man etwas, schaut man im www nach
- Internetdienste = Anwendungen, die Internet als Infrastruktur zur Datenübertragung nutzen
- bspw.: www, E-Mail, FTP (File Transfer Protocol = Datendownload), VoIP (Voice over IP = Internettelefonie), Internetstreaming
Was war der Ursprung des Internets?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- ARPANET (1969)
- Auftrag: Amerikanisches Verteidigungsministeriums
- verschiedene kooperierende Unis
- Ziel: Ausfallsicheres Computernetz zur allgemeinen Kommunikation zwischen mehreren Computern
= dezentrales System - Netzwerk zur Verknüpfung von PCs existiert
In welchen Phasen hat sich das Internet entwickelt?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- 1969: APRANET (vernetztes Rechnersystem verschiedener Unis)
- Vielzahl an Netzwerken entstand, die technisch inkompatibel waren
- Anfang 70er:
- Zusammenschluss der Netzwerkbetreiber
- Entwicklung von Sprachen und Regeln (Protokolle) zur Verbindung unterschiedlicher Netzwerke
Was sind Computernetzwerke?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- physikalisch verbundene Maschinen, um Kommunikation zu ermöglichen
= Datenaustausch- physikalisch = Funk, Kabel etc.
- mehrere Computer sind miteinander vernetzt mittels "Links" (z.B. Kabel)
- Verwendung von Netzwerkschnittstellen (z.B. Netzwerkkarten)
Netzwerk = Sammlung von Geräten, die miteinander kommunizieren
Internet = Sammlung von Netzwerken, die miteinander kommunizieren
Was sind Netzwerktopologien und welche existieren?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- Struktur der Verbindung mehrerer Geräte untereinander mit Kabel
- Auswahl der Topologien basieren auf: Ausfallsicherheit, Kabelaufwand, Erweiterbarkeit, Performance etc.
- Ring
- Star/Stern
- Tree/Baum (= ähnlich Baumdiagramm)
- Line/Linie (= Computer liegen auf der Linie)
- Bus (= Linie mit Abzweigungen pro Computer)
- Mesh (= Viele Computer sind untereinander verbunden, aber nicht alle mit allen und irgendwo ist noch eine Lücke)
- Fully connected (= jeder Rechner hat physikalische Verbindung zu allen anderen Rechnern)
Was zeichnet die Ring-Topologie aus?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- alle Arbeitsstationen sind ringförmig miteinander verbunden
- Daten werden von sendendem Computer in Ring eingespeist & von Rechner zu Rechner geleitet
- Vorteil
- keine Beschränkung der Länge (großflächige Abdeckung)
- Signal pro Rechner wird verstärkt (kein Verlust oder Beschädigung von Daten)
- Nachteile
- z.T. hoher Aufwand bei Verkabelung
- Sicherheit der Datenübertragung (alle Computer erhalten alle Daten)
- Ausfall eines Engerätes führt ggf. zu Unterbrechung der gesamten Netzkommunikation
- Alternative: Doppelring in beide Richtungen
Welche Nachteile hat die Stern-Topologie?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- Erweiterbarkeit ist begrenzt (Anzahl der Steckplätze beim mittleren Rechner = beschränkt)
- schlechtere Performance bei hoher Netzauslastung
Worüber werden Maschinen oft verbunden?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- Switches oder Hubs (indirekt)
- Computer werden an Steckplätze angeschlossen
- eintreffende Nachrichten über Steckplätze (Ports) verteilt
Port = Anschlüsse am Verteiler (hat noch eine andere Bedeutung)
- Switch= Intelligenter Hub (d.h. Daten werden über interne Tabellen dorthin verteilt, wo sie tatsächlich benötigt werden
- Hubs fast immer Sterntopologie, aber ohne Nachteile (da ≠ Begrenzung der Steckplätze)
Welche Arten von Netzwerken gibt es?
Commandes clavier:
= tourner,
= avant/arrière,
= faire défiler
- LAN (Lokal Area Network)
- WAN (Wide Area Network)
- WLAN (Wireless LAN)
- Interconnected LANs
Was sind LANs?
- größte Netzwerkgruppe
- lokales Netz, realisiert begrenzte Anzahl von Verbindungen von PCs, Workstations oder Servern in räumlich begrenztem Raum
- hohe Bandbreite (= Datenübertragung hoch)
- kurze Latenzzeiten (durch hohen Durchsatz)
- traditionell nur über ein Gebäude/wenige huntert Meter begrenzt
- heute: durch Glasfaser und Ethernet weitere Reichweiten (trotzdem begrenzte Fläche)
Was sind WANs?
- Weitverkehrsnetz
- große (aber limitierte) Anzahl von Verbindungen von PCs, Workstations, Servern oder LANs über sehr große Räume
- Je weiter Rechner entfernt, desto mehr Kabel benötigt
> größeres Risiko des Datenverlusts - eher in USA genutzt
Was sind WLANs?
- drahtloses, lokales Netzwerk (Funk)
- geringe Anzahl von Verbindungen von PCs, Workstations, Servern über kleine Räume
- niedrigere Bandbreite (mittlerweile etwas besser)
- Störanfällig durch Funk (bspw. Wände, Stahlträger)
Was sind interconnected LANs?
- Computernetzwerke können über Router verbunden werden
- Router hat viele Steckplätze, um verschiedene Netzwerke zu verbinden
- ermöglichung und Regulierung des Datenflusses zwischen einzelnen Netzwerken
In was unterscheiden sich die Netzwerke?
- Größe
- Bandbreite (Mbits/s)
- Geschwindigkeit (Latenz/Verzögerung in ms)
- Technische Umsetzun (Medium)
-
- 1 / 382
-
