WBA
WBA
WBA
Wofür steht das "true" bei der open-Methode ?
asynchrone Anfrage
Nenne drei Datenformate die bei Ajax-Anwendungen zwischen Server und Seite transferieren.
- JSON
- XML
- HTML
Was ist das Polling-Problem?
Woraus setzt sich der Begriff Ajax zusammen?
Wie lässt sich die Kommunikation mit dem Server bei Ajax beschreiben?
Wie heißt ein Vorläufer von Ajax (Microsoft)?
Remote Scripting
Wodurch werden HTTP Requests bei Ajax ersetzt?
Javascript Aufrufe
Wo wird Javascript Code bei Ajax ausgeführt?
Vervollständigen Sie folgende Aussage:
Frameworks sind überaus sinnvoll, denn sie…
- a) haben jeweils ein konsistentes Design in Form von Layouts, Grids und Typographien.
- b) haben alle die Philosophie „Mobile First“.
- c) helfen, Prototypen schnell zu konstruieren.
- d) fokussieren sich ausnahmslos auf Barrierefreiheit und Normen.
- e) haben alle ein sehr ähnliches Layout und sind somit schwer zu unterscheiden.
- f) unterstützen das responsive Design
a,c,f
Foundation folgt der Philosophie „Mobile First“. Was bedeutet das?
Ergänzen Sie folgenden Lückentext:
Foundation gibt es in _ verschiedenen Editionen. Die _______-Edition ist für jeden Anwendungstypen geeignet, da sie alle Bibliotheken enthält. Natürlich kann man mit der _____-Edition auch selbst entscheiden, welche Bibliotheken und Features man benötigt. Nach dem Download kann es auch schon direkt zur Einbindung gehen mit:
Die Einbindung erfolgt stets im ____. Währenddessen die Initialisierung im ____ erfolgt. Initialisiert wird stets mit einem ____ .
Foundation gibt es in 4 verschiedenen Editionen. Die Complete-Edition ist für jeden Anwendungstypen geeignet, da sie alle Bibliotheken enthält. Natürlich kann man mit der Custom-Edition auch selbst entscheiden, welche Bibliotheken und Features man benötigt. Nach dem Download kann es auch schon direkt zur Einbindung gehen mit:
Die Einbindung erfolgt stets im head. Währenddessen die Initialisierung im body erfolgt. Initialisiert wird stets mit einem < script > .
Foundation bietet ein breites Spektrum an verschiedenen Grids. Es gibt normale Grids und sogenannte _________-Grids. Grids können wie folgt für mobile und Desktop-Anwendungen gecodet werden:
Foundation bietet ein breites Spektrum an verschiedenen Grids. Es gibt normale Grids und sogenannte Block-Grids. Grids können wie folgt für mobile und Desktop-Anwendungen gecodet werden:
Es gibt 2 bekannte Plugins für Foundation: ______ und ______. Das neuere Plugin ______ wird im _______ eingebunden und im _____ initialisiert. Slides mit einem Bild, werden wie folgt erstellt:
('._______-item').slick ;
Währenddessen bei mehreren Items der Code wie folgt geändert wird:
$('._______-items').slick();
Es wird immer wichtiger, dass Anwendungen auch auf mobilen Endgeräten richtig angezeigt wird. Füllen Sie den folgenden Code so aus, dass auch bei einer Auflösung von 1280px x 720px und 800px x 600px das Dargestellte noch gut sichtbar ist. Verwenden Sie dazu bei der höheren Auflösung je 3 Items mit 3 Slides und bei der niedrigeren je 2 Items mit 2 Slides.
Es gibt 2 bekannte Plugins für Foundation: Orbit und Slick. Das neuere Plugin Slick wird im head eingebunden und im body initalisiert. Slides mit einem Bild, werden wie folgt erstellt:
$ ('.single-item').slick ( ) ;
Währenddessen bei mehreren Items der Code wie folgt geändert wird:
$ ('.multiple-items').slick ( );
Es wird immer wichtiger, dass Anwendungen auch auf mobilen Endgeräten richtig angezeigt wird. Füllen Sie den folgenden Code so aus, dass auch bei einer Auflösung von 1280px x 720px und 800px x 600px das Dargestellte noch gut sichtbar ist. Verwenden Sie dazu bei der höheren Auflösung je 3 Items mit 3 Slides und bei der niedrigeren je 2 Items mit 2 Slides.
Füllen Sie folgenden Code so aus, dass eine vertikale Navigation mit 3 Sektionen dabei entsteht.
Lösung
Wie breit ist die leere Spalte?
Da wir mit 12 Spalten Systemen arbeiten und die beiden article eine Gesamtbreite von bisher 6 Spalten erreicht haben, ist die leere Spalte 6 Spalten breit.
Was macht ein responsive CSS-Framework aus?
- Webseite mit responsive CSS Framework auf verschiedenen Geräten gut angezeigt
- Spaltensystem
Beschreibe wesentliche Merkmale des Bootstrap-Frameworks.
- Vielseitigkeit in der Programmierung -> HTML, CSS, JS, LESS, SASS
- einfache Handhabung -> Einfügen der benötigten Dateien in Projektordner
Kreuze die zutreffenden Aussagen über Bootstrap an?
Quelltext bearbeiten
Lösung
Ein Framework ist ein _________________________ für den Programmierer. Darin sind verschiedene _______________ enthalten. Zwei der bekanntesten _____________ CSS-Frameworks sind Bootstrap und Foundation, die im Bereich der _________-Entwicklung genutzt werden. Beide Frameworks haben vorgefertigte Klassen für _________, ________ und _____________________.
Ein Framework ist ein Grundgerüst für den Programmierer. Darin sind verschiedene Klassen enthalten. Zwei der bekanntesten responsive CSS-Frameworks sind Bootstrap und Foundation, die im Bereich der Web-Entwicklung genutzt werden. Beide Frameworks haben vorgefertigte Klassen für HTML5, CSS3 und JavaScript.
Ordnen Sie folgende Begriffe den richtigen Definitionen zu.
1. Protokoll | 2. Format | 3. Dienst
Ein [＿] ist eine Funktion, die von einem Rechner anderen Teilnehmern in einem Computernetzwerk bereitgestellt wird.
Ein [＿] ist eine, oft standardisierte Beschreibung wie Informationen in einer Datei gespeichert werden.
Ein [＿] ist ein Satz von Regeln nach denen Daten zwischen Computern bzw. Prozessen ausgetauscht werden, die durch ein Netzwerk miteinander verbunden sind.
3,2,1
Kreuzen Sie bitte aus den unten aufgeführten Aussagen die korrekten an.
[ ] HTTP ist die Auszeichnungssprache für Web-Dokumente.
[ ] Das POP ist ein Protokoll zur Übertragung von Dateien über IP-Netzwerke.
[ ] Der Statuscode 2xx zeigt an, dass eine HTTP-Anfrage erfolgreich war.
[ ] In der URI kann der Host über seine IP-Adresse angegeben werden.
[ ] Der Cache ist ein Pufferspeicher auf dem Server für bereits einmal abgerufene Ressourcen.
[ ] Ein Proxy ist eine Kommunikationsschnittstelle in einem Netzwerk.
[ ] HTTP ist die Auszeichnungssprache für Web-Dokumente.
[ ] Das POP ist ein Protokoll zur Übertragung von Dateien über IP-Netzwerke.
[ x ] Der Statuscode 2xx zeigt an, dass eine HTTP-Anfrage erfolgreich war.
[ x ] In der URI kann der Host über seine IP-Adresse angegeben werden.
[ ] Der Cache ist ein Pufferspeicher auf dem Server für bereits einmal abgerufene Ressourcen.
[ x ] Ein Proxy ist eine Kommunikationsschnittstelle in einem Netzwerk.
foo://example.com:8042/over/there?name=ferret#nose
\_/ \______________/ \_______/ \________/ \__/
| | | | |
1 2 3 4 5
1: scheme
2: authority
3: path
4: query
5: fragment
Was passiert beim Abruf einer Website via Internet mithilfe eines Browsers?
Wir gehen davon aus, dass der Rechner des Nutzers mit dem Internet verbunden, die angeforderte Seite verfügbar und "private browsing" o.ä. deaktiviert ist.**
Nachdem der Nutzer die Adresse eingegeben hat prüft der Browser, ob er diese Seite noch in einer aktuellen Version lokal (im Cache) gespeichert hat . Falls ja, zeigt er diese lokale Kopie an.
[ ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser baut eine Verbindung mit einem Domain Name Server (DNS) auf, welcher den Domain-Namen in eine IP-Adresse übersetzt.
[ ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser baut eine Verbindung zu dem Web-Server mit dieser IP-Adresse auf.
[ ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser sendet einen HTTP-Request an den Web-Server.
[ ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser sendet mit dem Request an den Server einen Statuscode im Header der Nachricht mit.
[ ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Server generiert oder lädt daraufhin den HTML-Code der Webseite und sendet ihn zurück an den Browser des Benutzers (HTTP-Response).
[ ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser interpretiert die HTML-Tags und formatiert die Seite im Browserfenster.
[ ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser komprimiert alle Elemente der Seite im Zip-Format und speichert sie lokal ab zur späteren Verwendung.
[ ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Nachdem der Nutzer die Adresse eingegeben hat prüft der Browser, ob er diese Seite noch in einer aktuellen Version lokal (im Cache) gespeichert hat . Falls ja, zeigt er diese lokale Kopie an.
[ x ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser baut eine Verbindung mit einem Domain Name Server (DNS) auf, welcher den Domain-Namen in eine IP-Adresse übersetzt.
[ ] passiert immer | [ x ] passiert manchmal | [ ] passiert nie
Der Web-Browser baut eine Verbindung zu dem Web-Server mit dieser IP-Adresse auf.
[ x ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser sendet einen HTTP-Request an den Web-Server.
[ x ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser sendet mit dem Request an den Server einen Statuscode im Header der Nachricht mit.
[ ] passiert immer | [ ] passiert manchmal | [ x ] passiert nie
Der Web-Server generiert oder lädt daraufhin den HTML-Code der Webseite und sendet ihn zurück an den Browser des Benutzers (HTTP-Response).
[ x ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser interpretiert die HTML-Tags und formatiert die Seite im Browserfenster.
[ x ] passiert immer | [ ] passiert manchmal | [ ] passiert nie
Der Web-Browser komprimiert alle Elemente der Seite im Zip-Format und speichert sie lokal ab zur späteren Verwendung.
[ ] passiert immer | [ ] passiert manchmal | [ x ] passiert nie
Bitte notieren Sie zu den unten aufgeführten Begriffen, ob es sich um ein a) Protokoll, b) Dienst oder c) Format handelt?
jpeg
http
html
DNS
tcp
jpeg -> Format
http -> Protokoll
html -> Format bzw. Auszeichnungssprache
E-Mail -> Dienst
DNS -> Dienst
tcp -> Protokoll
Ergänzen Sie folgende Definitionen mit den drei Säulen des Word Wide Webs.
Geben Sie jeweils die abgküzte und ausgeschriebene Form an
Die Spezifikation für die Kommunikation zwischen Web-Clients und Web-Servern - das so genannte ................................................................................
Die Spezifikation für die Adressierung beliebiger Dateien und Datenquellen im Web und im übrigen Internet - das Schema der sogenannten ................................................................................
Die Spezifikation einer Auszeichnungssprache für Web-Dokumente, der Berners-Lee den Namen ................................................................................ gab.
Die Spezifikation für die Kommunikation zwischen Web-Clients und Web-Servern - das so genannte HTTP = Hypertext Transfer Protocol
Die Spezifikation für die Adressierung beliebiger Dateien und Datenquellen im Web und im übrigen Internet - das Schema der sogenannten URI = Uniform Resource Identifier
Die Spezifikation einer Auszeichnungssprache für Web-Dokumente, der Berners-Lee den Namen HTML = Hypertext Markup Language gab.
Ergänzen sie den folgenden Lückentext.
Bitte benutzen Sie dabei die englischsprachigen Begriffe.
Die Kommunikation findet nach dem ........................................-Prinzip statt. Wenn der HTTP-Client, in diesem Fall der Browser, ein Dokument anfordert, sendet er einen HTTP-........................................ an den HTTP-Server (Webserver). Der Server bearbeitet diesen und sendet einen HTTP-........................................ an den Client zurück.
Die Kommunikation findet nach dem Client-Server-Prinzip statt. Wenn der HTTP-Client, in diesem Fall der Browser, ein Dokument anfordert, sendet er einen HTTP-Request an den HTTP-Server (Webserver). Der Server bearbeitet diesen und sendet einen HTTP-Response an den Client zurück.
Wie hieß der Vorläufer des World Wide Webs?
ARPANET
Nennen und erläutern Sie kurz jeweils drei Vor- und Nachteile von web-basierten Anwendungen.
Vorteil
- Aktualisierbarkeit: Änderung der Inhalte von webbasierten Anwendungen sind im Vergleich zu anderen Medien mit geringerem Aufwand möglich.
- Kosten für den Betrieb einer Website und die Pflege der Inhalte ist geringer als die für das Verlegen einer Zeitschrift. Es entstehen hauptsächlich nur Personalkosten für die Person, die die Inhalte pflegt.
- Zugänglichkeit: eine webbasierte Anwendung kann über mehrere unterschiedliche Sinne wahrgenommen werden. Somit somit ist sie für eine sehr breite Masse an Menschen mit unterschiedlichen Voraussetzungen zugänglich.
Nachteile
- Keine Haptik: Inhalte einer webbasierten Anwendung sind "nicht greifbar", da sie über keine reale Haptik verfügen
- Technisches Equipment in Form eines Computers mit installierten Browser, ist für die Nutzung einer web-basierten Anwendung nötig. Zudem muss dieser Zugang zum Internet haben
- Sicherheit (gläserner User) Unsicherheit von personenbezogenen Daten die bei web-basierten Anwendungen hinterlegt sind. Je nach dem wie großzügig die hinterlegten Daten sind, lassen sich eindeutige Informationen über den Nutzer sammeln, was ihn so zum "gläsernen Nutzer" macht.
Erklären Sie das Konzept welches hinter dem Begriff Hypertext steht. Erstellen Sie ggf. eine Skizze dazu.
- Texte und visuelle Informationen auf nicht lineare Weise zu lesen und durch sie zu navigieren
- Informationen durch Querverweise (Hyperlinks) miteinander verknüpfen -> netzartige Struktur der Objekte bzw. Ressourcen.
Wie heißt der Erfinder des Internet?
Tim Berners-Lee
Erklären sie kurz welche Funktion der Cache im Bezug von Web-basierten Anwendungen hat.
- Puffer-Speicher im Browser für bereits abgerufene Ressourcen (Texte, Bilder)
- Kopie der abgerufenen Daten auf lokaler Festplatte aufbewahrt
- Ressource bei erneutem Abruf sofort verfügbar, keine Ladezeit
Welche Möglichkeiten hat man mit HTML?
Wofür steht die Abkürzung HTML?
Hypertext Markup Language
Ordnen Sie die folgenden Elemente ihrer korrekten Bedeutung zu.
- [＿] Das Element zeichent eine Definitionsliste aus.
- [＿] Das Element zeichnet einen Listenpunkt aus.
- [＿] Das Element zeichnet einen Paragraphen aus.
- [＿] Das Element zeichnet eine Überschrift aus.
- [＿] Das Element zeichnet einen Content mit hoher Wichtigkeit aus.
- [＿] Das Element zeichnet einen Verweis aus.
[ dl ] Das Element zeichent eine Definitionsliste aus.
[ li ] Das Element zeichnet einen Listenpunkt aus.
[ p ] Das Element zeichnet einen Paragraphen aus.
[ h1 ] Das Element zeichnet eine Überschrift aus.
[ strong ] Das Element zeichnet einen Content mit hoher Wichtigkeit aus.
[ a ] Das Element zeichnet einen Verweis aus.
Welche der folgenden HTML-Grundstrukturen ist korrekt?
2
Ordnen Sie die folgenden HTML-Elemente den korrekten Elementtypen zu.
- p
- span
- img
- section
- div
- strong
- img
- article
Block-Elemente:
Inline-Elemente:
Block-Elemente: p,div, section, article
Inline-Elemente: img, span, strong
Ergänzen Sie folgenden Text um ein möglichst reichhaltiges semantisches Markup ..............................................................................................................................
..................Ich bin die wichtigste Überschrift in einem Artikel...............................
..................Ich bin eine kurze Beschreibung, festgehalten in einem sehr, sehr
.......................langen Paragraphen. .......................Ich bin ein sehr wichtiger Text innerhalb des Paragraphen .......................
.............................................................................................................................. .............................................................................................................................. ..............................................................................................................................
.......................Listenpunkt 1:..............................................Link zu home.html..............................................
.......................Listenpunkt 2:..............................................Link zu impressum.html..............................................
.............................................................................................................................. .............................................................................................................................. ..............................................................................................................................
Lösung
Ich bin die wichtigste Überschrift in einem Artikel
Ich bin eine kurze Beschreibung, festgehalten in einem sehr, sehr
langen Paragraphen.
Ich bin ein sehr wichtiger Text innerhalb des Paragraphen.
-
Listenpunkt 1:
-
Listenpunkt 2:
Ergänzen Sie bitte folgenden Lückentext sinnvoll.
Eine gewöhnliche HTML-Datei besteht grundsätzlich aus folgenden Teilen. Als erstes wird in der .................................................. festgelegt welche HTML-Version in dem Dokument verwendet wird. Im ............................................. werden Angaben zum Titel des HTML-Dokument und ............................................. definiert. Der anzuzeigende Inhalt der Seite wird im ............................................. definiert.
Eine gewöhnliche HTML-Datei besteht grundsätzlich aus folgenden Teilen. Als erstes wird in der DOCTYPE festgelegt welche HTML-Version in dem Dokument verwendet wird. Im HEAD werden Angaben zum Titel des HTML-Dokument und META-TAGS definiert. Der anzuzeigende Inhalt der Seite wird im BODY definiert.
Bitte schreiben Sie zu folgenden Aussagen die korrekten Elemente auf.
Das Element für eine ungeordnete Liste: ..............................
Das Element für eine Definitionsliste: ..............................
Das Element für eine geordnete Liste: ..............................
Das Element für einen Defitionsausdruck: ..............................
Das Element für einen Defitionserklärung: ..............................
Das Element für einen Listenpunkt in einer geordneten und ungeordneten Liste: ..............................
Das Element für eine ungeordnete Liste: ul
Das Element für eine Definitionsliste: dl
Das Element für eine geordnete Liste: ol
Das Element für einen Defitionsausdruck: dt
Das Element für einen Defitionserklärung: dd
Das Element für einen Listenpunkt in einer geordneten und ungeordneten Liste: li
-
- 1 / 172
-
Flashcards
Vervollständigen Sie folgende Aussage:
Frameworks sind überaus sinnvoll, denn sie…
- a) haben jeweils ein konsistentes Design in Form von Layouts, Grids und Typographien.
- b) haben alle die Philosophie „Mobile First“.
- c) helfen, Prototypen schnell zu konstruieren.
- d) fokussieren sich ausnahmslos auf Barrierefreiheit und Normen.
- e) haben alle ein sehr ähnliches Layout und sind somit schwer zu unterscheiden.
- f) unterstützen das responsive Design
a,c,f
Foundation folgt der Philosophie „Mobile First“. Was bedeutet das?
Ergänzen Sie folgenden Lückentext:
Foundation gibt es in _ verschiedenen Editionen. Die _______-Edition ist für jeden Anwendungstypen geeignet, da sie alle Bibliotheken enthält. Natürlich kann man mit der _____-Edition auch selbst entscheiden, welche Bibliotheken und Features man benötigt. Nach dem Download kann es auch schon direkt zur Einbindung gehen mit:
Die Einbindung erfolgt stets im ____. Währenddessen die Initialisierung im ____ erfolgt. Initialisiert wird stets mit einem ____ .
Foundation gibt es in 4 verschiedenen Editionen. Die Complete-Edition ist für jeden Anwendungstypen geeignet, da sie alle Bibliotheken enthält. Natürlich kann man mit der Custom-Edition auch selbst entscheiden, welche Bibliotheken und Features man benötigt. Nach dem Download kann es auch schon direkt zur Einbindung gehen mit:
Die Einbindung erfolgt stets im head. Währenddessen die Initialisierung im body erfolgt. Initialisiert wird stets mit einem < script > .
Foundation bietet ein breites Spektrum an verschiedenen Grids. Es gibt normale Grids und sogenannte _________-Grids. Grids können wie folgt für mobile und Desktop-Anwendungen gecodet werden:
Foundation bietet ein breites Spektrum an verschiedenen Grids. Es gibt normale Grids und sogenannte Block-Grids. Grids können wie folgt für mobile und Desktop-Anwendungen gecodet werden:
Es gibt 2 bekannte Plugins für Foundation: ______ und ______. Das neuere Plugin ______ wird im _______ eingebunden und im _____ initialisiert. Slides mit einem Bild, werden wie folgt erstellt:
('._______-item').slick ;
Währenddessen bei mehreren Items der Code wie folgt geändert wird:
$('._______-items').slick();
Es wird immer wichtiger, dass Anwendungen auch auf mobilen Endgeräten richtig angezeigt wird. Füllen Sie den folgenden Code so aus, dass auch bei einer Auflösung von 1280px x 720px und 800px x 600px das Dargestellte noch gut sichtbar ist. Verwenden Sie dazu bei der höheren Auflösung je 3 Items mit 3 Slides und bei der niedrigeren je 2 Items mit 2 Slides.
Es gibt 2 bekannte Plugins für Foundation: Orbit und Slick. Das neuere Plugin Slick wird im head eingebunden und im body initalisiert. Slides mit einem Bild, werden wie folgt erstellt:
$ ('.single-item').slick ( ) ;
Währenddessen bei mehreren Items der Code wie folgt geändert wird:
$ ('.multiple-items').slick ( );
Es wird immer wichtiger, dass Anwendungen auch auf mobilen Endgeräten richtig angezeigt wird. Füllen Sie den folgenden Code so aus, dass auch bei einer Auflösung von 1280px x 720px und 800px x 600px das Dargestellte noch gut sichtbar ist. Verwenden Sie dazu bei der höheren Auflösung je 3 Items mit 3 Slides und bei der niedrigeren je 2 Items mit 2 Slides.
Füllen Sie folgenden Code so aus, dass eine vertikale Navigation mit 3 Sektionen dabei entsteht.
Lösung
Wie breit ist die leere Spalte?
Da wir mit 12 Spalten Systemen arbeiten und die beiden article eine Gesamtbreite von bisher 6 Spalten erreicht haben, ist die leere Spalte 6 Spalten breit.
Was macht ein responsive CSS-Framework aus?
- Webseite mit responsive CSS Framework auf verschiedenen Geräten gut angezeigt
- Spaltensystem
Beschreibe wesentliche Merkmale des Bootstrap-Frameworks.
- Vielseitigkeit in der Programmierung -> HTML, CSS, JS, LESS, SASS
- einfache Handhabung -> Einfügen der benötigten Dateien in Projektordner
Kreuze die zutreffenden Aussagen über Bootstrap an?
Quelltext bearbeiten
Lösung
Ein Framework ist ein _________________________ für den Programmierer. Darin sind verschiedene _______________ enthalten. Zwei der bekanntesten _____________ CSS-Frameworks sind Bootstrap und Foundation, die im Bereich der _________-Entwicklung genutzt werden. Beide Frameworks haben vorgefertigte Klassen für _________, ________ und _____________________.
Ein Framework ist ein Grundgerüst für den Programmierer. Darin sind verschiedene Klassen enthalten. Zwei der bekanntesten responsive CSS-Frameworks sind Bootstrap und Foundation, die im Bereich der Web-Entwicklung genutzt werden. Beide Frameworks haben vorgefertigte Klassen für HTML5, CSS3 und JavaScript.
