LAP Web-Mediendesign Flashcards
- Erklären Sie die Begriffe Web-Auftritt (Web-Site und Web-Seite (Web-Page)).
Web-Site = Speicherort
Web-Seite = einzelne Seite/Dokument, .html, .php usw.
Web-Space = Speicherplatz (Space = Menge/Raum)
Homepage = allererste Seite, Index (auch genannt default, welcome, aber nicht üblich)
Webauftritt = Präsentation (es kann mehrere Webauftritte innerhalb einer Web-Site geben)
- Beschreiben Sie die Dienste des Internets.
www = Protokoll http:// (für sichere Seite https:// )
e-Mail = pop (post office protokoll) <- empfangen
smtp (simple mail transfer protokoll) <- senden
imap (internet message access protokoll) <- verteilt Informationen, E-Mail bleibt an
einem Ort
ftp = file transfer protokoll (Dienst&Protokoll! bspw. FileZilla)
Chat = IRC (internet relay chat)
Telefonieren = VOIP (voice over IP)
telnet = Dienst&Protokoll bspw. Fernzugriff auf Terminal, einloggen & konfigurieren (cmd-Zentrale bei Windows), keine Benutzeroberfläche, extrem reaktiv (schnell), Nachteil: auch Passwörter werden textbasiert übermittelt, leichter Zugriff für Hacker. Für TeamViewer wird ein anderes Protokoll verwendet!
SSH
- Erklären Sie den Begriff URL.
uniform ressource locator = Pfadangabe einer Datei
Erfinder war Tim BurnersLee (Schweiz/CERN) ursprünglich URI uniform ressource identifer
besteht aus
Protokoll://Server.Domain-Name/Ordner/Datei
http://www.xyz.de/blubb/index.html
- Erklären Sie den Begriff Rollover-Effekt.
Bild/Zustandswechsel (bei Maus-Berührung), früher mit Java heute mit CSS3/HTML5 und Sprite
- Welche Möglichkeiten stehen Ihnen zur Umsetzung einer Navigation zur Verfügung?
Konzept (1. hirachisch, 2. linear, 3. verwoben) -> Gestaltung (Konzept gibt die Gestaltung vor) -> Technik (Textlinks, Bildlinks, Dropdown = wie wird die Navigation umgesetzt)
- Wo liegt der Unterschied zwischen Rollover-Navigation und Navigation über Imagemaps?
Rollover = Zustandwechsel bei MouseOver
Imagemaps = Teile eines Bildes werden verlinkt
- Beschreiben Sie den Arbeitsablauf bei der Erstellung eines Web-Auftrittes.
Konzeption (Zielgruppen, Zielsetzung, Inhalte, Botschaften) allgemeine Fragen berücksichtigen (Fotos?, Texte? - Woher?, Animation oder Flash?)
Gestaltung (CI berücksichtigen)
Technik (Server? Domain? Umsetzung?)
allgemeine Fragen berücksichtigen (Domain, Server, Budget?)
Vor der Umsetzung Bilder, Logos, Texte, Freigaben einholen!
- Sie haben sich gerade selbstständig gemacht und einen Web-Auftritt für ihre Eigenwerbung produziert. Was müssen Sie nun tun, um ihn im Internet veröffentlichen zu können?
Webspace kaufen (inkl. PHP&MySQL <- auf Versionen achten), Domain & SubDomains, E-Mail, Suchmaschinenoptimierung, SEO search engine optimizing = Text ist wichtig!
Suchmaschinen suchen nach Texten. Bei Text heißt das: Keywords benutzen (häufige Suchbegriffe im Fließtext einbinden), Bilddateien richtig benennen (nicht bild05.jpg sondern freiheitsstatue.jpg) auch auf Alt-Tags setzen!
Quelltext ordentlich strukturieren (h1-h6) denn auch diese werden durchsucht nach ihrer Wichtigkeit!
Als Tipp für LAP: weiterreden! ;)
- Erklären Sie die Begriffe IP-Adresse, Domain und URL.
IP-Adresse = siehe oben, nummerische Adresse unter dem eine Domain/PC erreichbar ist
Domain = ist Name für Web-Auftritt, DNS wandelt die IP-Adresse in einen für Menschen verständlichen
Namen
URL = Pfadangabe für Dateien
- Wo kann der Flaschenhals bei der Übertragung von Daten über das Internet liegen?
Flaschenhals = Engpass, schwächstes Glied in der Kette Viel Zugriff auf eine Datei, Modem/Switch, Traffic
- Wie lange braucht ein Bild mit 64 KByte bei einer ISDN-Internet-Verbindung zum Download?
64KByte x 1024 (auf Byte) x 8 (auf Bit) = 524.288 : 1000 = 5.242,8 : 64 (weil pro Sec) = 8 Sekunden : 2 (bei 2 Kanälen 128kBits) = 4 Sec
also ergibt sich bei einer ISDN Verbindung von
- 64KBit/s = 8 Sekunden
- 128KBit/s = 4 Sekunden
- Welchen Einschränkungen unterliegen Sie bei der Gestaltung von Web-Seiten?
Bildschirmauflösungen (Scrollbalken, Suchleisten, Tabs, etc. miteinberechnen)
- FULL HD 1920x1080 = 16:9
- 1920x1200 = 16:10
- im Idealfall ca. 1000x700 Pixel verwenden
Zusatzinfos:
- -> responsive Design (%-Angaben, keine absoluten Werte)
- -> relative Auflösung = ein Wert im Verhältnis zu einem anderen
- -> Retina-Dispays schaffen bis zu 300 ppi
Farben & Helligkeit (Office User haben meistens keine kalibrierten Bildschirme) auf helle und dunkle Bildstellen achten, keine „absaufenden“ Bildstellen
Schriften einbinden in Website (Google Webfonts), viele Schriften = große Ladezeit
PlugIns = Erweiterungen für Browser, sparsam einsetzen (niemand installiert gerne Dinge um sich etwas anzusehen)
Videos via HTML5 einbinden ACHTUNG bei Formaten
- Chrome&Safari = mp4
- Firefox = ogg
- Opera = webm, ogg
Idealerweise also mp4 und ogg einbinden!
- Worauf sollten Sie bei der Benennung von Dateien für Web-Auftritte achten?
keine Sonderzeichen (Unterstriche sind möglich), kleinschreiben!, alte DOS-Systeme erkennen nur 8 Zeichen vor dem Punkt und 3 danach (.htm statt html)
- Ein (technisch unbedarfter) Kunde bittet Sie, seinen (in XPress erstellten) Katalog ins Internet zu stellen. Wie überzeugen Sie ihn davon, dass es nicht klug ist, einfach den Katalog aus dem XPress-Layout in HTML-Format zu konvertieren und ins Web zu stellen?
ich erkläre ihm folgendes:
- kein Platz für Navigation
- Funktionalität (Bestellvorgang) ist nichtgegeben (Web-Shop nicht möglich mit der Struktur)
- Schriften (zu viele, selten Standard-Schriften die Webkonform sind)
- Bilder (zB bei Doppelseiten, sehr große Bilder)
- alleine Struktur und Navigation sind ein enomer finanzieller und zeitlicher Aufwand!
- Wie könnten Sie den Katalog mit identischer Optik ins Internet stellen?
Welche Problematik hätten Sie dennoch?
als PDF-Download oder Flash-Katalog, Probleme ergeben sich aus mehreren Faktoren.
Die PDF müsste ausgedruckt werden bzw. die Qualität ließe stark zu wünschen übrig für den Flash-Katalog müsste wieder ein PlugIn erzwungen werden generell besteht die Problematik darin, dass der Konsument generell faul ist und sich für nichts irgendeine Zusatz-Arbeit antun möchte. Wird er zu etwas gezwungen verliert er schnell das Interesse.
Daher wäre es generell besser einen Web-Shop zu realisieren.
- Welche Medienarten können Sie standardmäßig in Web-Auftritten verwenden?
Durch PlugIns, aber solche müssen immer vorab installiert werden bei vielen Browsern und darauf hat der User/Nutzer/Kunde keine Lust :)
- Worum handelt es sich bei Quicktime? Steht es ausschließlich für die Apple-Plattform zur Verfügung?
Quicktime ist eine komplette Multimedia-Medienplattform von Apple (Bild,Ton, Video) es gibt sie auch für Windows außerdem gibt es eine kostenfreie und eine kostenpflichtige Version (beherrscht en- und decodieren), es gibt auch Quicktime-Server für Video-Streaming
- Erklären Sie den Unterschied zwischen PDF, Quicktime und dem Flash-Shockwave-Format.
PDF = portable document format (PDFa = archivieren, PDFx = PostScript Information)
Quicktime = Video
Flash = 2D Animationen gedacht, wird verdrängt von HTML5
generell liegen die Unterschiede in den Anwendungsgebieten!
- Was versteht man unter Streaming-Video und wo liegt der Vorteil?
Datei wird lokal zwischengespeichert
dadurch ist es möglich sich Videos bereits bis zu einem vorgeladenen Teil anzusehen während der Rest parallel weiterlädt. Man muss also nicht erst die vollständige Datei laden
- Zählen Sie die wichtigsten Bildformate für das Internet auf und erklären Sie die Unterschiede.
- Welches Bildformat unterstützt Transparenz? Um welche Art handelt es sich dabei?
GIF und PNG
- Warum werden Flash-Auftritte üblicherweise nur als Zweit-Web-Auftritt erstellt?
PlugIn notwendig, Firewalls sperren teilweise Flash, außerdem wird es weitestgehend von HTML 5 abgelöst.
- Wie groß ist die Bildschirmauflösung Ihres Kunden beim Betrachten eines von Ihnen produzierten Internetauftrittes? Wie groß gestalten Sie Ihre Seite?
Die Bildschirmauflösung des Kunden weiß man im Regelfall nicht, daher wird standardmäßig 960 Pixel in der Breite verwendet. Möglich sind auch variable Angaben oder Grid-Systeme
Untergrenze = 1024px, Obergrenze = 2560px <- allerdings müssen hier noch die Browser-Kästchen
(Scrollbalken, Tabs, Suche usw) abgezogen werden
- Worauf müssen Sie bei der Verwendung von Schriften bei der Erstellung von Web-Seiten achten?
Nicht alle Schriften können in Web eingebunden werden, da manche Browser diese nicht unterstützen. Welche verwendet werden können:
- Systemschriften
- Schriften umwandeln in Vektor (SVG) oder Prixelgrafik (GIF)
- Schriften einbetten: OTf (Standard), TTf, EOT, WOf
- Google-Web-Fonts
- Nennen Sie die HTML-Tags für Absatz, Schrift, Fettschrift, Kursivschrift, Tabellenzeile und Tabellenzelle.
<font> <b> <i> <tr> <td>
</td>
</tr></i></b></font>
- Erklären Sie die Begriffe „HTML“ , „Tag“ und „Attribut”
HTML = Hypertext Markup Language = Auszeichnungssprache, Scriptsprache (weil keine Befehle)
TAG = Elemente in HTML (Auszeichnungen) zB
Attribute = Eigenschaften des Tags (wird ins CSS ausgelagert) zB width, height, background
- Was versteht man unter einem dynamischen, was unter einem statischen Web-Auftritt?
dynamisch = sobald Server generiert (zB Formular)
statisch = reiner HTML Code
- Wie lösen Sie in HTML eine automatische Weiterschaltung von einer HTML-Seite zur anderen?
entweder Script (onload geturl)
oder im Headbereich einen Meta-Tag refresh nach einer gewissen Anzahl von Sekunden
- Was ist die Aufgabe der HTML-Bestandteile?
<doctype> = beschreibt welche Sprachversion verwendet wird (html5)</doctype>
= Titel, Meta-Tags, CSS-Definitionen oder Links zu CSS-Dateien und Skripte
= Seiteninhalt, Layout
- Was ist ein Hintergrundbild? Welche Besonderheiten hat es in HTML?
Ein Bild im Hintergrund, andere Bilder/Texte sind darüber gestellt. Im HTML würde es kacheln, in CSS kann es definiert werden (no-repeat, repeat-x/y usw.)
- Nennen Sie zwei typische Elemente, die im Head-Teil plaziert werden.
Meta, Script, CSS, Verknüpfungen (java, css)
- Wie werden Sonderzeichen in HTML dargestellt?
named entities, (mit UTF bereits direkt belegt), Beispiel = © ©
- Wie werden Farben in HTML dargestellt?
HexaDezimal-Code, 2 Zahlen pro Kanal
RGB, RGBa und HLS sind ebenfalls möglich
Farbnamen (black, white)
- Was versteht man unter Web-Save-Colors?
ist eigentlich veraltet, früher konnten nicht alle Farben richtig angezeigt werden (weil die Grafikkarten nur 8 Bit Farbtiefe erlaubten und daher viele Unterschiede von Monitor zu Monitor entstanden), bzw. nur 256, daher wurde eine Farbenpalette benötigt, die nicht von der Grafik durch Ditherin angenähert werden musste. Betriebssysteme belegen für eigenen Gebrauch etwa 16 bis 20 nicht anders benutzbare Farben, so verblieben ca. 236 verwendbare Farben. Eine weitere Überlegung war für jede Grundfarbe (RGB) sechs verschiedene Farbtöne anbieten zu können also ergab sich hier für die Rechnung 6x6x6 = 63= 216 (3 Farbkanäle je 6 Werte).
Einige Zeit nach dem die 216 websicheren Farben definiert wurden, entdeckten David Lehn und Hadley Stern, dass lediglich 22 der 216 sicheren Farben tatsächlich „sicher“ waren (neben schwarz und weiß auch dunkle Blautöne, grelle Grün- und Gelbvarianten)
- Wie wird ein geschütztes Leerzeichen in HTML erzeugt?
non breaking space
- Wofür dient das „Schlüsselwort-Tag“?
Keywords = früher für die SEO notwendig, heute veraltet oder kaum gebräuchlich
- Wie werden CSS Layouts realisiert?
Div-Container werden über IDs und Classen im CSS gestyled und definiert.
.class darf öfter verwendet werden
#id darf nur einmal verwendet werden
Bei CSS-Layouts wird unterschieden, ob die CSS intern oder extern geschrieben wurde..
- Was ist ein div Tag?
Ein Layout-Container, rechteckig werden in HTML5 ersetzt durch <header> <nav> <section> <article> usw. um Text als Div zu behandeln erhält der p-Tag ein display:block</article></section></nav></header>
