WEB1 Zusammenfassung WS 2024 PDF

Web und Internet Marina Tubic INHALT 1.1. Organisation und Aufbau des Internets..................................................................................... 1 1.1.1. Zentrale vs dezentrale Organisation.................................................................................. 1 1.1.2. Aufbau des Internets......................................................................................................... 1 2.1. Überblick Basisinfrastruktur...................................................................................................... 2 2.1.1. Basisinfrastruktur.............................................................................................................. 2 2.2. Grundlagen zu Rechnernetzen und Netzwerkkomponenten.................................................... 3 2.2.1. Netzwerktopologien.......................................................................................................... 3 2.2.2. Netzwerkkomponenten..................................................................................................... 3 2.2.3. Hub (veraltet).................................................................................................................... 3 2.2.3.1. Switch............................................................................................................................ 3 2.2.3.2. Router............................................................................................................................ 4 2.2.3.3. Gateway........................................................................................................................ 4 2.2.3.4. Kombigeräte.................................................................................................................. 4 2.3. Begriffe Intranet, Extranet......................................................................................................... 4 3.1. Überblick.................................................................................................................................... 5 3.2. Client-Server-Prinzip................................................................................................................... 5 3.3. Schichtenmodelle für die Datenkommunikation....................................................................... 6 3.4. Basiskommunikation im Internet............................................................................................... 6 3.4.1. TCP/IP – Transmission Control Protocol / Internet Protocol............................................. 6 3.4.2. Adressierung...................................................................................................................... 7 3.4.2.1. IP-Protokoll (IPv4) – Internet Protocol.......................................................................... 7 3.4.2.2. IPv6................................................................................................................................ 7 3.4.2.3. Vergabe von IP-Adressen und Netzbereichen.............................................................. 7 3.4.2.4. Private vs. Öffentliche IP-Adressen............................................................................... 8 3.4.3. Routing............................................................................................................................... 8 3.4.3.1. Network Adress Translation (NAT)................................................................................ 8 3.4.4. Domain Name Service (DNS)............................................................................................. 8 3.4.4.1. Domänennamensraum.................................................................................................. 8 3.5. World Wide Web........................................................................................................................ 9 3.5.1. HTML Hypertext Markup Language (Sprache).................................................................. 9 3.5.2. http/https Hypertext Transport Protocol (Protokoll)........................................................ 9 3.5.3. Technologien: HTML, CSS, server- und clientseitige Scripts, Cookies............................... 9 3.6. E-Mail........................................................................................................................................ 10 3.6.1. Prinzip von E-Mail............................................................................................................ 10 Marina Tubic 3.6.2. Programme...................................................................................................................... 10 3.7. Dateitransfer (FTP – File Transfer Protocol)............................................................................. 10 4.1. Auswahlkriterien...................................................................................................................... 11 4.2. Anschlusstechnologien ans Internet........................................................................................ 12 4.2.1. Direkt-Verbindung mit Router......................................................................................... 12 4.2.2. Digital Subscriber Line – DSL / xDSL................................................................................. 12 4.2.3. Internetzugang über Kabel-TV („Internet oder DVB“)..................................................... 12 4.2.4. Drahtloser Internetzugang mittel UMTS/LTE/5G............................................................ 12 4.2.4.1. Standards..................................................................................................................... 12 4.2.4.2. Funktionsweise des Internetzugangs.......................................................................... 12 4.2.4.3. Fiber to Home (FTTH), Fiber to Node/Curb (FTTN/FTTC)............................................ 13 4.2.5. Kaum (mehr) gebräuchliche Zugangstechnologien......................................................... 13 5.1. Webprojekte, Projektmanagement......................................................................................... 15 5.2. Ablauf eines Webprojekts........................................................................................................ 15 5.2.1. Beteiligte.......................................................................................................................... 15 5.2.2. Internet-Marketingstrategie............................................................................................ 16 5.2.3. Initiierung des Website-Projekts..................................................................................... 16 5.2.3.1. Registrierung des Domainnamens.............................................................................. 16 5.2.3.2. Auswahl des Providers / Hosting................................................................................. 16 5.2.4. Analyse............................................................................................................................. 16 5.2.4.1. Erhebung der Anforderungen..................................................................................... 16 5.2.4.2. Methoden, Techniken, Hilfsmittel............................................................................... 16 5.2.5. Kreation Website-Inhalte und Design.............................................................................. 17 5.2.5.1. Aufgaben..................................................................................................................... 17 5.2.5.2. Screendesign............................................................................................................... 17 5.2.5.3. Methoden, Techniken, Hilfsmittel............................................................................... 17 5.2.6. Erstellung von grafischen und textlichen Inhalt, Überprüfung....................................... 17 5.2.6.1. Erstellung..................................................................................................................... 17 5.2.6.2. Test.............................................................................................................................. 17 5.2.6.3. Methoden, Techniken, Hilfsmittel............................................................................... 17 5.2.7. Launch, Promotion und Controlling................................................................................ 18 5.3. Hosting von Websites............................................................................................................... 18 5.3.1. Webhosting...................................................................................................................... 18 5.3.1.1. Überblick..................................................................................................................... 18 5.3.1.2. Arten des Webhosting................................................................................................. 18 5.3.1.3. Anbieter und Beispiele................................................................................................ 18 Web und Internet 1 Marina Tubic 5.3.2. Eigener Server.................................................................................................................. 19 5.3.3. Cloud Hosting................................................................................................................... 19 5.3.4. Serverhousing.................................................................................................................. 19 5.4. Agenturbriefing........................................................................................................................ 19 6.1. Überblick.................................................................................................................................. 21 6.2. HTML........................................................................................................................................ 21 6.2.1. Allgemeines..................................................................................................................... 21 6.2.2. Aufbau von HTML-Elementen......................................................................................... 21 6.2.3. Grundstruktur einer HTML-Seite.................................................................................... 21 6.2.4. Grundlegende Tags.......................................................................................................... 21 6.2.4.1. Elemente zur Text-Strukturierung............................................................................... 21 6.2.4.2. Verweise (Links).......................................................................................................... 22 6.2.4.3. Grafiken und Tabellen................................................................................................. 22 6.2.4.4. Formulare.................................................................................................................... 22 6.2.4.5. Strukturelemente, semantische Orientierung............................................................ 22 6.2.5. Multimedia...................................................................................................................... 22 6.2.6. Input-Elemente................................................................................................................ 22 6.2.7. HTML5 API (Application Programming Interfaces).......................................................... 22 6.3. Formate im Web....................................................................................................................... 23 6.3.1. Grafik-Formate................................................................................................................ 23 6.3.1.1. Pixelgrafik vs. Vektorgrafik.......................................................................................... 23 6.3.1.2. GIF (Graphics Interchange Format)............................................................................. 23 6.3.1.3. JPEG (Joint Photographic Experts Group)................................................................... 23 6.3.1.4. PNG (Portable Network Graphic)................................................................................ 23 6.3.1.5. SVG (Scalable Vector Graphics)................................................................................... 23 6.3.1.6. “Moderne” Grafikformate........................................................................................... 23 6.3.2. Audio-Formate................................................................................................................. 24 6.3.3. Streaming-Media............................................................................................................. 24 6.4. Cascading Stylesheets (CSS)..................................................................................................... 24 6.4.1. Überblick.......................................................................................................................... 24 6.4.2. Einbindung von CSS......................................................................................................... 24 6.4.3. Aufbau von CSS Regeln.................................................................................................... 24 6.5. CSS-Frameworks / Bootstrap................................................................................................... 25 6.5.1. Überblick.......................................................................................................................... 25 6.5.2. Verwendung von Bootstrap für eigene Webprojekte..................................................... 25 6.6. Clientseitige Programmierung.................................................................................................. 25 Web und Internet 1 Marina Tubic 6.6.1. Javascript......................................................................................................................... 25 6.6.1.1. Javascript einbinden.................................................................................................... 26 6.7. Serverseitige Programmierung................................................................................................. 26 6.7.1. Abarbeitung..................................................................................................................... 26 6.7.2. Serverseitige Programmiersprachen / Web-Frameworks............................................... 27 6.7.2.1. C#, ASP.NET................................................................................................................. 27 6.7.2.2. PHP.............................................................................................................................. 27 6.7.2.3. AJAX............................................................................................................................. 28 6.8. Grundkonzepte für Webapplikationen.................................................................................... 29 6.8.1. Datenübergabe („Query String“)..................................................................................... 29 6.8.2. Grundschema................................................................................................................... 29 7.1. Usability.................................................................................................................................... 31 7.1.1. Was ist Usability............................................................................................................... 31 7.1.2. Messung der Usability..................................................................................................... 31 7.1.3. Normen............................................................................................................................ 31 7.1.3.1. Aufgabenangemessenheit........................................................................................... 31 7.1.3.2. Selbstbeschreibungsfähigkeit...................................................................................... 32 7.1.3.3. Steuerbarkeit............................................................................................................... 32 7.1.3.4. Erwartungskonformität............................................................................................... 32 7.1.3.5. Fehlertoleranz............................................................................................................. 32 7.1.3.6. Individualisierbarkeit................................................................................................... 32 7.1.3.7. Lernförderlichkeit........................................................................................................ 32 7.2. Accessibility.............................................................................................................................. 33 7.2.1. Was ist Accessibility......................................................................................................... 33 8.1. CSV (Comma Seperated Value)................................................................................................ 34 8.2. XML (Extensible Markup Language)........................................................................................ 34 8.2.1. Wohlgeformtheit und Gültigkeit..................................................................................... 34 8.2.2. Definition der Struktur..................................................................................................... 34 8.3. JSON (Javascript Object Notation)........................................................................................... 35 9.1. Webserver................................................................................................................................ 37 9.1.1. Funktion........................................................................................................................... 37 9.2. Proxy-Server............................................................................................................................. 37 9.3. Content Delivery Network (CDN)............................................................................................. 37 9.4. Mehrschichtige Client-Server-Architekturen im Internet........................................................ 38 10.1. Arten von Suchmaschinen im Web.......................................................................................... 39 10.2. Aufgaben / Bestandteile von indexbasierten Suchmaschinen................................................. 39 Web und Internet 1 Marina Tubic 10.3. Ranking / Suchrang................................................................................................................... 39 10.4. Herausforderungen und Grenzen............................................................................................ 39 10.5. Suchmaschinenmarketing (SEM).............................................................................................. 40 10.5.1. Search Engine Optimization (SEO)................................................................................... 40 10.5.1.1. Ablauf SEO............................................................................................................... 40 10.5.1.2. SEO-Aufgabenbereiche / SEO-Maßnahmen........................................................... 40 10.5.2. Suchmaschinenwerbung (SEA)........................................................................................ 40 10.5.2.1. Grundprinzip........................................................................................................... 40 10.5.2.2. Anzeigerang und Kosten......................................................................................... 41 11.1. Regelkreis Web Controlling...................................................................................................... 42 11.2. Datensammlungsmethoden..................................................................................................... 42 11.2.1. Einfache Verfahren: Seitenzähler (veraltet).................................................................... 42 11.2.2. Server-basierte Verfahren: Logfile-Analyse..................................................................... 42 11.2.3. Client-basierte Verfahren: Tag- und Pixel-Tracking (State-of-the-art)............................ 42 11.2.4. Wiedererkennung der Benutzer...................................................................................... 43 11.2.4.1. Wiedererkennung durch SessionID........................................................................ 43 11.2.4.2. Wiedererkennung durch Cookies........................................................................... 43 11.2.4.3. Wiedererkennung durch Personalisierung............................................................. 43 11.3. Kennzahlen............................................................................................................................... 44 11.3.1. „Klassische“ Kennzahlen.................................................................................................. 44 11.3.2. Kennzahlen aus Systemperspektive (technische Perspektive)........................................ 44 11.3.3. Kennzahlen aus Angebotsperspektive (Präsentation des Angebots).............................. 44 11.3.4. Kennzahlen aus Kundenperspektive................................................................................ 44 12.1. Begriffe..................................................................................................................................... 46 12.2. Content Management, Content Management System............................................................ 46 12.2.1. Content Management..................................................................................................... 46 12.2.2. Funktionen, Aufgaben..................................................................................................... 46 12.3. Technik, gängige Systeme........................................................................................................ 46 12.3.1. Technik............................................................................................................................. 46 12.3.2. Systeme........................................................................................................................... 47 13.1. Begriffe, geschichtlicher Überblick........................................................................................... 48 13.2. Eigenschaften von Social Media............................................................................................... 48 13.3. Anwendungsklassen im Social Media...................................................................................... 48 13.3.1. Soziale Netzwerke (Social Network Services).................................................................. 48 13.3.2. Weblogs........................................................................................................................... 49 13.3.3. Microblogs....................................................................................................................... 49 Web und Internet 1 Marina Tubic 13.3.4. Wikis................................................................................................................................ 49 13.3.5. Podcast............................................................................................................................ 49 13.3.6. Social Media Sharing........................................................................................................ 49 14.1. Technologische Grundlagen..................................................................................................... 51 14.1.1. Mobile Endgeräte............................................................................................................ 51 14.1.2. Mobile Übertragungstechnologien................................................................................. 51 14.1.2.1. Mobilfunktechnologien (GSM, UMTS, LTE)............................................................ 51 14.1.2.2. WLAN...................................................................................................................... 51 14.1.2.3. Bluetooth................................................................................................................ 51 14.1.2.4. Mobile Betriebssysteme......................................................................................... 52 14.2. Mobile Applikationen............................................................................................................... 52 14.2.1. Native Apps...................................................................................................................... 52 14.2.2. Cross-Plattform-Apps...................................................................................................... 52 14.2.3. Mobile Web-Applikationen............................................................................................. 52 14.2.4. Hybride Applikationen..................................................................................................... 53 14.2.5. Gegenüberstellung.......................................................................................................... 53 14.2.6. Herausforderungen bei der Entwicklung......................................................................... 53 14.3. Responsive Design.................................................................................................................... 54 14.3.1. Grundprinzip Responsive Design..................................................................................... 54 14.3.2. Umsetzung, Frameworks................................................................................................. 54 14.4. Architektur von mobilen Anwendungen.................................................................................. 54 14.5. Location Based Services („Standortbezogene Dienste”, LBS).................................................. 54 14.5.1. Grundprinzip.................................................................................................................... 54 14.5.2. Lokalisierung.................................................................................................................... 54 Web und Internet 1 Marina Tubic 1. Organisation und Aufbau des Internets 1.1. 1.1.1. Zentrale vs dezentrale Organisation  Zentrale Organisation bei technischen Fragen: Technische Fragen des Internet (zB Entwicklung und Definition der Protokolle, Vergabe von IP- Adressen) werden zentral von verschiedenen Organisationen koordiniert. (World Wide Web Consortium, NIC)  Dezentrale Organisation bei Inhalten: Jeder Provider verwaltet seine Inhalte selbst. Es gibt keine zentrale Stelle, die das Informationsangebot plant, strukturiert, auf inhaltliche Richtigkeit prüft. Vor- und Nachteile: - Aktualität und Vielfalt der Informationen - Aufwändige Informationsrecherche - Mangelnde Qualität der Informationen - Probleme bezüglich rechtlicher Belange (Pornographie) 1.1.2. Aufbau des Internets Das Internet besteht aus:  einer hardwaretechnischen Basisinfrastruktur (Hardware, Kabelnetz, Zugänge, Protokolle) und  den darauf aufbauenden Diensten (www, Mail, ftp) Web und Internet 1 Seite 1 von 62 Marina Tubic 2. Aufbau des Internets: Basisinfrastruktur 2.1. Überblick Basisinfrastruktur  Das Internet besteht aus vielen miteinander vernetzten Netzwerken  Das Internet ist ein Global Area Network (GAN)  GAN = ein weltumspannendes Netzwerk (= viele verbundene kleinere Netze, kein einziges großes Netzwerk)  Verbindet verschiedene LANs und Einzelrechner miteinander  GANs nutzen die Glasfaserinfrastruktur von Weitverkehrsnetzen und schließen diese durch internationale Seekabel oder Satellitenübertragung zusammen. 2.1.1. Basisinfrastruktur  Provider: „Dienstleister“: Provider betreibt die Backbones zB liwest, A1, Telekom, Magenta Ist ein Dienstleister Einzelrechner und LANs erhalten den Zugang zum Internet über den Provider  Backbone: Verknüpft größere Städte eines Landes (vgl Autobahn) zB ACOnet = nationales Backbone-Netz für gemeinnützige Einrichtungen ist wiederum an andere größere Backbones angebunden Verbindung von Kontinenten erfolgt über viele Seekabel  Zugangskabel: Haben geringere Kapazitäten und können weniger Datenmengen übertragen (vgl Zubringerstraßen) Über die Zugangskabel sind zB Privathaushalte angebunden  Server: Software/Programm welche mit einem anderen Programm (Client) kommuniziert liefert Informationen an den Client Webserver → liefert Webseiten, Bilder an Client Mailserver → speichert E-Mails und empfängt/versendet E-Mails Hardware = leistungsfähiger PC Computer auf dem ein oder mehrere Server-Softwareprogramme laufen Web und Internet 1 Seite 2 von 62 Marina Tubic 2.2. Rechnernetz = Verbund mehrerer getrennter selbstständiger Rechner  Weitverkehrsnetze (WAN, Wide Area Network): geographisch entfernte Rechner  Lokale Netze (LAN, Local Area Network): auf ein Gebäude bezogen  GAN (Globale Area Network): über mehrere Kontinente  MAN (Metropolitan Area Network): Vernetzung von Unternehmen in Ballungsräumen (Hochgeschwindigkeitsnetz) 2.2.1. Netzwerktopologien  Es gibt unterschiedliche Arten ein Netzwerk aufzubauen  In LANs häufig Baum-Topologie (Datenübertragungsstandard Ethernet)  Internet = vermaschte Topologie 2.2.2. Netzwerkkomponenten = Bestandteile eines Rechnernetzes  Passive Netzwerkkomponenten: Kabeln  Aktive Netzwerkkomponenten: Hub (veraltet), Switch, Router, Gateway Um die Rechner eines Netzwerkes miteinander zu verbinden, werden verschiedene Kopplungseinheiten eingesetzt, die auf unterschiedlichen Schichten Anpassungen durchführen können. 2.2.3. Hub (veraltet)  Im Netzwerk-Umfeld kaum mehr eingesetzt  Kopplungseinheit, an der mehrere gleichartige Kabel angeschlossen werden und die Knoten sternförmig verbinden 2.2.3.1. Switch  Einzelne Computer miteinander verbinden (Netzwerkkabel) (ähnlich wie Hub)  Unterschied: Signale werden nicht an alle Teilnehmer des Netzwerks weitergeleitet, sondern nur an den Ausgangspunkt (Port), an dem der Zielrechner angeschlossen ist  Arbeitet in der Regel auf Schicht 2 Web und Internet 1 Seite 3 von 62 Marina Tubic 2.2.3.2. Router  Verbindet Netzwerke miteinander  Schnittstelle zwischen privaten Netzwerk (LAN) und dem Internet  Kernelement für Datenübertragung im Internet  Arbeitet auf Schicht 3  Hauptfunktion: Weiterleitung von Daten (von einem Gerät zum nächsten → next hop)  Router analysiert die Datenpakete, was ist die Empfängeradresse, leitet es weiter (Wegefindung für Pakete)  Kann nur ihm bekannte Protokolle weiterleiten 2.2.3.3. Gateway  Protokollumsetzer (kann Daten beliebig konvertieren)  Kann zusätzlich zwischen verschiedenen Protokollen übersetzen (zB Mail zu SMS-Gateways)  Arbeitet auf Schicht 7 (ermöglicht Kommunikation zwischen Netzwerken die auf völlig unterschiedlichen Protokollen basieren) 2.2.3.4. Kombigeräte  Vorallem im Heimbereich und Small-Office-Bereich  Vereinen Hub/Switch, Router, DSL-Modem, Firewall  Können Netzwerke miteinander verbinden (Routing) + Verwendung unterschiedlicher Protokolle (Gateway) 2.3. Web und Internet 1 Seite 4 von 62 Marina Tubic 3. Aufbau des Internets: Basisdienste 3.1. Die Dienste sind der Teil des Internets, mit dem man bewusst in Berührung kommt. Die Dienste sind jedoch technologisch komplex, daher gibt es dazugehörige Protokolle und Kommunikationsstandards für die Datenkommunikation. Was sind Protokolle?  Gemeinsame Sprache  Kommunikation von Computern  Protokolle sind Kommunikationsregeln  Regelwerk, das festlegt wie Daten von einem System zum anderen übetragen werden 3.2. Die Dienste basieren im Allgemeinen auf dem Client-Server-Prinzip = Aufteilung der Datenverarbeitung auf unterschiedliche Computersystem (Client & Server). Client und Server befinden sich in der Regel auf unterschiedlichen Computersystemen und kommunizieren über Netzwerke. Client (=Anwendung, die eine Kommunikation aufbauen will) muss Anfrage an den Server (=entfernter Rechner) stellen. Der Server liefert eine Antwort an Client zurück. Die Kommunikation zwischen Client und Server wird mittels Protokollen strukturiert. Web und Internet 1 Seite 5 von 62 Marina Tubic 3.3. Um die Komplexität zu reduzieren wird der Netzwerkverkehr als aufeinanderfolgende Schichten dargestellt. Jede Schicht ist für eine bestimmte Aufgabe zuständig. Bekanntestes Modell: ISO/OSI-Referenzmodell (Eingliederung der Datenkommunikation in 7 Schichten) 3.4.  Grundsätzlich gibt es Leitungs- und Paketvermittlung  Im Internet werden Daten paketvermittelt ausgetauscht  Daten werden in Pakete zerlegt und somit können einzelne Leitungen von mehreren Computern gleichzeitig verwendet werden  Einzelne, geografisch entfernte LANs werden mit Paketvermittlern (= Router) verbunden. 3.4.1. TCP/IP – Transmission Control Protocol / Internet Protocol  Ist eine Bezeichnung für eine Protokollfamilie (ca 500 Netzwerkprotokolle)  Ist ein paketvermittelndes Protokoll (Datenstrom wird in Pakete unterteilt)  Pakete können unterschiedliche Wege durch das Internet aufnehmen (wenn eine Leitungsverbindung ausfällt, sucht das Paket eine andere Verbindung zum Ziel)  Client setzt die Pakete dann in der richtigen Reihenfolge zusammen (Paket muss dafür Adress-Angabe/IP-Adresse und das wievielte Paket es ist enthalten)  Gängige Protokolle der TCP/IP- Protokollfamilie: Web und Internet 1 Seite 6 von 62 Marina Tubic Ports  Ports = ähnlich wie Gleise am Bahnhof. Es gibt bestimmte Ports, die für bestimmte Dienste reserviert sind.  Das Konzept der Ports wird von TCP verwendet  Durch Ports werden Datenpakete den richtigen Diensten (Protokollen) zugeordnet  Datenpakete, die an den Rechner adressiert sind, enthalten dieselbe IP-Adresse als Empfänger  Vorteil von Ports: verschiedene Dienste (zB http, ftp, …) können auf einem einzelnen Rechner laufen  Portnummern für welchen Dienst die Daten bestimmt sind werden von der IANA festgelegt 3.4.2. Adressierung 3.4.2.1. IP-Protokoll (IPv4) – Internet Protocol  Das Internet Protocol (IP-Protokoll) ist für die Adressierung im Internet verantwortlich (Paketvermittlung und Paketlenkung).  Alle Stationen und Endgeräte besitzen eine eindeutige Adresse im Netzwerk – IP-Adresse  Jeder Computer im Internet benötigt eine IP-Adresse  Die Aufgabe vom IP-Protokoll ist die Datenpakete zu adressieren und im Netzwerk zu vermitteln (Routing).  IP-Protokoll ist aktuell in der Version 4 (IPv4) verbreitet (Version 6 „IPv6“ ist die neuere Variante)  IPv4 ist 32 Bit groß/lang, in 4 Byte zerlegt, durch Punkte voneinander getrennt (193.170.126.101)  Jedes Byte kann zwischen 0 und 255 liegen 3.4.2.2. IPv6  Über IPv4 nur 4 Milliarden IP-Adressen vorhanden – daher Entwicklung von IPv6  IPv6 ist 128 Bit groß/lang 3.4.2.3. Vergabe von IP-Adressen und Netzbereichen  Werden an zentraler Stelle vergeben (Europa: RICE NCC)  IP-Adresse bekommt man vom Provider – Provider bekommt sie von der zentralen Organisation Web und Internet 1 Seite 7 von 62 Marina Tubic 3.4.2.4. Private vs. Öffentliche IP-Adressen  Private IP-Adressen gibt es im öffentlichen Internet nicht (werden von der IANA nicht weiter vergeben und im Internet nicht geroutet)  Private IP-Adressen werden verwendet da die öffentlichen IP-Adressen knapp geworden sind  Mittels NAT (Network Adress Translation) können mehrere private IP-Adressen mit nur einer öffentlichen IP-Adresse verwendet werden  Nicht jeder Rechner soll aus dem öffentlichen Internet erreichbar sein (Sicherheit) 3.4.3. Routing  Routing ist das Finden von Netzwerkpfaden zwischen Rechnern unterschiedlicher Subnetze  Weiterleitung von Datenpaketen zum nächsten Gerät (hop)  Router analysieren die IP-Pakete und entscheiden aufgrund der Zieladresse an welches Nachbarnetz das Paket weitergeleitet werden soll.  Wenn Paket nicht ankommen kann (weil zB Empfänger von Modem getrennt) wird ein Ablaufdatum verwendet (TTL „Time to Live). Die TTL wird bei jedem Vermittlungsrechner an den es gelangt um 1 reduziert und dann weitergeleitet.  Befehl „tracert“: Pfad den ein Paket zum Zielrechner zurücklegt  Befehl „ipconfig“: aktuelle Netzwerkkonfiguration (IP-Adresse, Netzmaske, Standard-Gateway)  Befehl „ping“: testet die Verbindung zu angegeben Zielrechner 3.4.3.1. Network Adress Translation (NAT)  Hauptsächlich wegen Mangel an IPv4-Adressen entwickelt  Häufig eingesetzt um privates Subnetz mit Internet zu verbinden (Sicherheit)  Umsetzung mit Router oder Firewall 3.4.4. Domain Name Service (DNS)  IP-Adresse schwer zu merken – daher Domains  DNS „übersetzt“ Domain-Namen (www.fh-ooe.at) in IP-Adresse  DNS verwaltet Namensräume im Internet 3.4.4.1. Domänennamensraum  Baumförmige Struktur  Top-Level Domains (TLD) (vergibt ICANN)  Generic Top Level Domains (gTLD)  Country Top Level Domain (ccTLD)  Subdomain: keine Registrierung notwendig (zB technischesmuseum.wien.at) Web und Internet 1 Seite 8 von 62 Marina Tubic 3.5.  Übertragung von Hypertext-Dateien (Sprache: HTML)  www ist nur ein Dienst de Internets (ist NICHT Internet)  „Browser“ = Software, um den Dienst WWW nutzen zu können (Chrome, Firefox, Safari, …)  Suchmaschinen sind KEIN Basisdienst, nur eine Webite 3.5.1. HTML Hypertext Markup Language (Sprache) einzelne Seiten mit Links verbinden 3.5.2. http/https Hypertext Transport Protocol (Protokoll) Protokoll: Regelwerk wie Computer miteinander kommunizieren können → http, https (Hypertext Transport Protocol Secure) (Secure = Verschlüsselung) 1) User gibt WWW-Adresse dem Client (Browser) an 2) Client (Browser) übermittelt Adresse dem Server 3) Server sucht die Seite (greift dabei auf HTML-Seiten zu) 4) Server schickt Client angeforderte Seite (in Form von Datenpaketen) 5) Datenpakete werden vom Browser zusammengesetzt → Seite geladen 3.5.3. Technologien: HTML, CSS, server- und clientseitige Scripts, Cookies  Clientseitige Scriptsprachen (HTML, CSS, Javascript) – um Webseiten anzeigen zu können (Browser muss was tun)  Serverseitige Scriptsprachen (PHP, Ruby, Phytion) – für komplexe Anwendungen (Technologien, die am Webserver laufen)  Cookie: eine kleine Textdatei wird im Browser des Websitebesuchers gespeichert wird vom Webserver an den Browser gesendet Webserver kann bei späteren, erneuten Besuchen dieser Seite die Cookie-Informationen direkt vom Server aus auslesen Aufgabe: Wiedererkennung des Surfers (Tracking), Abspeichern von Präferenzen, Abspeichern eines Warenkorbes Web und Internet 1 Seite 9 von 62 Marina Tubic 3.6. 3.6.1. Prinzip von E-Mail Zum Versenden bzw Empfangen von E-Mails benötigt man ein Benutzerkonto (Account) auf einem ans Internet angeschlossenen Mail-Server. Dieser Account wird zB vom Provider eingerichtet und eine eindeutige E-Mail Adresse vergeben.  2 Protokolle: SMTP (zum Versenden), POP/IMAP (zum Empfangen)  SMTP (Simple Mail Transfer Protocol): zum Versenden von Mails, Verbindung zu 1. Mail Server wird aufgebaut und baut wiederum Verbindung zu Empfänger Server auf (vgl Brief aufgeben, Post transportiert Brief zum Empfänger → SMTP  POP/IMAP (Post Office Protocol): zum Empfangen von Mails (vgl ich muss zum Briefkasten gehen und den Brief rausnehmen)  Browser kommuniziert nur mit dem Web-Server, der wiederum kommuniziert im Hintergrund mit dem Mail-Server  Mail-Client kommuniziert direkt mit dem Mail-Server  Schnelles, günstiges Kommunikationsmittel  E-Mail ist nicht verschlüsselt (Achtung bei sensiblen Daten)  Nicht rechtskonform, nicht „dokumenten-echt“  Phishing-Mails (Betrügerische Absicht zB Kontodaten erschaffen), erkennbar zB durch andere Mails, URL passt nicht zusammen 3.6.2. Programme  Entweder über Website (zB www.gmx.at) (Mails werden über den Browser angesehen, Webserver kommuniziert mit Mailserver) oder  Lokal auf dem Client-PC über Mail-Client (zB Microsoft Outlook, Mozilla Thunderbird) (direkte Kommunikation mit dem Mailserver) 3.7.  Dienst und Protokoll heißen gleich: FTP  FTPS - Secure  Dateiübertragung (zB für große Datenmengen) Upload und Download von entfernten Computern – in zwei Richtungen, d.h. vom Server Richtung Client und umgekehrt  zB Änderung auf der Website erfolgt über FTP, Server steht oft ganz wo anders (mit USB Stick kann ich zB die Änderung nicht an den Server weitergeben)  zB FileZilla (NICHT Dropbox, Google Drive) Web und Internet 1 Seite 10 von 62 Marina Tubic 4. Anschluss ans Internet Verbindung des eigenen lokalen Netzwerks mit dem öffentlichen Internet wir über einen Internet Service-Provider (ISP) hergestellt. 4.1. Datenübertragungsrate (Bandbreite)  Bestimmt die Geschwindigkeit der Übertragung  Für Videokonferenzen – hohe Bandbreite erforderlich, für E-Mail – Bandbreite egal  Im Internet heute übliche Datenübertragungsraten MBit/s und GBit/s Verfügbarkeit  Wahrscheinlichkeit, dass die Verbindung zum Internet tatsächlich besteht  Als Prozentwert angegeben (über 99,5% ist gut!) Geographische Möglichkeit  Nicht alle Zugangstechnologien flächendecken verfügbar  zB DSL in Österreich weit verbreitet, aber eben nicht überall verfügbar (auch LTE, 5G, etc) Sicherheit  Abhörsicherheit  Geteilt genutzte Medien (Shared Medien) zB WLAN, Satellit, Kabel-Modem sind unsicher Kosten  Einmalkosten (Hardware, Einrichtungskosten des Providers)  Laufende Kosten (Leitungskosten, Online-Zeit, Traffic, Mietkosten) Zusätzliche Dienstleistungen  zB E-Mail Adressen, redundante Datenanbindungen, Support, VPN, Speicherplatz, Domains Web und Internet 1 Seite 11 von 62 Marina Tubic 4.2. 4.2.1. Direkt-Verbindung mit Router  Der eigene Router wird direkt über eine Glasfaserleitung oder eine Kupferleitung mit dem Internet verbunden  Direkt-Anbindung an Router des Providers  Diese Anbindung ist vor allem für Betriebe interessant die das Internet intensiv nutzen und hohe Ansprüche an die Qualität der Internetverbindung haben  Fixe IP-Adressen  Hohe Bandbreiten möglich, stabil sicher  Teuer 4.2.2. Digital Subscriber Line – DSL / xDSL  Asymmetrische ADSL – große Reichweiten symmetrische SDSL – geringere Reichweite  IP-Adresse dynamisch zugewiesen  DSL nicht flächendecken verfügbar  Maximale Entfernung des Teilnehmers von der Vermittlungsstelle: 3-7 km Leitungslänge 4.2.3. Internetzugang über Kabel-TV („Internet oder DVB“)  Asymmetrische Bandbreiten  Mögliche Übertragungsgeschwindigkeit 10Gbit/s im Downstream und 1 Gbit/s im Upstream  Für private Endkunden: 600 Mbit/s  Mehrere Kabelmodemteilnehmer (bis zu 500) teilen sich den für den Datenverkehr reservierten Frequenzbereich 4.2.4. Drahtloser Internetzugang mittel UMTS/LTE/5G 4.2.4.1. Standards  UMTS: Mobilfunkstandard 3. Generation (3G)  LTE: Nachfolge-Standard von UMTS, höhere Bandbreiten, in Österreich gut ausgebaut  5G: aktueller Standard, wird ausgebaut 4.2.4.2. Funktionsweise des Internetzugangs  USB Datensticks oder Web Cubes bauen die Verbindung über die Mobilfunkstandards auf  Alle Nutzer eine Mobilfunkzelle teilen sich die Bandbreite Web und Internet 1 Seite 12 von 62 Marina Tubic 4.2.4.3. Fiber to Home (FTTH), Fiber to Node/Curb (FTTN/FTTC)  FTTH: Hier wird ein Glasfasernetz bis zum Haushalt gelegt → Hohe Kosten für den Ausbau der Infrastruktur  FTTN/FTTC: Verlegung der Glasfaserleitung nicht bis zum Haushalt, sondern bis zu einer Verteilstation in der Nähe der Teilnehmer 4.2.5. Kaum (mehr) gebräuchliche Zugangstechnologien  Einwahl mit Modem  Wireless LAN  Internet über Satellit  Internet über Stromkabel Web und Internet 1 Seite 13 von 62 Marina Tubic Lernfragen: 1) Wie ist das Internet organisiert und welche Auswirkungen entstehen daraus? 2) Welche Basisdienste gibt es im Internet? Erklären Sie die einzelnen Dienste sowie den Einsatzbereich des jeweiligen Dienstes. 3) Wofür werden Cookies eingesetzt? 4) Was passiert, wenn Cookies blockiert werden? 5) Was versteht man unter einem Server? 6) Was ist ein Intranet? 7) Was ist ein Extranet? 8) Was versteht man unter einem Protokoll? 9) Warum werden Schichtenmodelle verwendet? 10) Erläutern Sie die Funktionsweise und die Eigenschaften von TCP/IP! 11) Welche Protokolle (Schichten) verbergen sich hinter der Protokollfamilie „TCP/IP“? 12) Wie funktioniert die Datenübermittlung im Internet? 13) Welche Netzwerkkomponenten werden bei tracert angezeigt? 14) Was bewirkt der Befehl „ping“? 15) Welche Aufgabe hat ein Webserver? Inwieweit unterscheidet sich ein Webserver von einem Application Server? 16) Was ist ein Proxy-Server? 17) Eine Firma mit 12 Mitarbeitern befragt Sie um Rat, welchen Internet-Zugang sie wählen sollen. Was empfehlen Sie der Firma? Web und Internet 1 Seite 14 von 62 Marina Tubic 5. Website-Erstellung 5.1.  Häufiger Fehler: Beginn mit der Entwicklung ohne Planung  Problem: zu viel Zeit für Planung und Design führt häufig zu Verzögerungen  Projektmanagement = vor dem eigentlichen Start und begleitende Aktivitäten während des Projekts 5.2. 5.2.1. Beteiligte  Webdesigner  Webentwickler  Projektmanager  Webmaster  Content-Entwickler / Redakteur  Site-Sponsoren, -besitzer  Andere Mitglieder im Unternehmen Web und Internet 1 Seite 15 von 62 Marina Tubic 5.2.2. Internet-Marketingstrategie  Ausgangspunkt für die Entwicklung einer Website sollte eine Internet-Marketingstrategie sein (abgestimmt mit der Unternehmensstrategie)  Internet-Marketingstrategie – Internet-Marketingplan – Gestaltung und Umsetzung der Site  Wer sind wir? Mitbewerb? Marktsegmentierung? Markt? Ziele? USP? Marketingmix?  Analysephase, Strategische Planungsphase, Operative Planungsphase, Durchführungsphase, Steuerungsphase 5.2.3. Initiierung des Website-Projekts 5.2.3.1. Registrierung des Domainnamens  Domainnamen so früh wie möglich registrieren  Mehrere Domains (verschiedene Schreibweisen, mit Bindestrich) eintragen  Domain für SEO – bessere Sichtbarkeit des Unternehmens  Beantragung bei Internet Service Provider oder Registrar (zB easyname.com) 5.2.3.2. Auswahl des Providers / Hosting  Websites werden kaum selbst gehostet  Qualität der Dienstleistung abhängig von Leistung/Ladezeit der Website (Ladezeit) und Verfügbarkeit der Website  Bekannter Hosting-Provider zB world4you.com, hetzner.de 5.2.4. Analyse 5.2.4.1. Erhebung der Anforderungen  Anforderungen an die Website erheben  Bedürfnisse der Zielgruppen  Ziele? Zielgruppen? Kundenservice-Angebote? Positionierung der Website? Inhalt der Site? Struktur des Inhalts? Navigation?  Anforderungen aus Business-Sicht, User-Sicht, Usability-Sicht, Personalisierungssicht, Lokalisierungssicht 5.2.4.2. Methoden, Techniken, Hilfsmittel  Zielgruppenanalyse  Quantitative Analysen (bestehende Zugriffsstatistiken)  Qualitative Analysen (Interviews, Fragebögen)  Desk Research, Beobachtung der Konkurrenz Web und Internet 1 Seite 16 von 62 Marina Tubic 5.2.5. Kreation Website-Inhalte und Design 5.2.5.1. Aufgaben  Festlegung von kundenorientiertem Content (Nutzen für Besucher der Site, Qualität)  Struktur der Site (Strukturierung der Site nach Phasen der Customer Journey)  Navigation (wie einfach könne Informationen gefunden werden, Wegweiser)  Grafisches Design (Geschwindigkeit, Bildschirmauflösung, Anzahl der Farben beachten)  Testen! 5.2.5.2. Screendesign  „User Interface Desing“ bezieht sich auf die visuelle Gestaltung der Website.  Orientierung, Anreize, klickbare Links, Interaktion  Wahrnehumgs- und Gestaltungsgesetze  Gutes Webdesign (Einheitlichkeit, Angemessenheit, Einfachheit, Klarheit, Erwartungskonformität) 5.2.5.3. Methoden, Techniken, Hilfsmittel  Wireframes: Skizzierung grundsätzliches Layout einer Website  Card Sorting: welche Informationsobjekte als zusammengehörig betrachtet werden  Storyboard: Screenshots verschiedener Teile der Website, für komplexe Sachverhalte der Website (zB Bezahlvorgang)  Sitemap (Blueprint): Darstellung der Beziehung zwischen verschiedenen Seiten 5.2.6. Erstellung von grafischen und textlichen Inhalt, Überprüfung 5.2.6.1. Erstellung Eigentliche Umsetzungs- und Erstellungsphase:  Content Erstellung (Text, Bilder) und  Technische Implementierung (CMS, Statische Website, Dynamische Website) 5.2.6.2. Test  Fehlerhafte Links, fehlende Bilder, Darstellung der Website auf unterschiedlichen Browsern, inhaltliche Fehler, Usability Testing 5.2.6.3. Methoden, Techniken, Hilfsmittel  Content Management System (Wordpress, Typo3)  Tools Text- und Grafikbearbeitung (Notepad++, Photoshop)  Tools Erstellung und Verwaltung von Content (Contenbird)  Prototyping (Vorab Version mit potenziellen Kunden testen, Fehler so früh wie möglich erkennen Web und Internet 1 Seite 17 von 62 Marina Tubic 5.2.7. Launch, Promotion und Controlling  Website öffentlich zugänglich machen  Web-Auftritt auf Webserver stellen  Website bekannt machen, Traffic generieren  Social Media Marketing, Suchmaschinenmarketing  Zugriffe analysieren (zB Web Analytics-Tools wie Google Anlaytics) 5.3. Wie kann die Website am besten im Internet zur Verfügung gestellt werden. Kriterien: Kosten, Leistungsfähigkeit (Prozessor, Arbeitsspeicher), Leistungsumfang (Zusatzdienstleistungen), eigene Anforderungen, Anzahl der Zugriffe auf Website, Support, Server- Standort, eigenes Know-How Webserver (Software und Hardware) Funktion: Browser schickt Anfrage (HTTP-Request) an Webserver – Webserver liefert statische (HTLM-Seiten, Bilder) und dynamische Inhalte (Seiten werden beim Aufruf erzeugt) 5.3.1. Webhosting 5.3.1.1. Überblick  Website wird auf einem an das Internet angeschlossenen Webserver eines Internet Service Providers untergebracht  Webhoster stellt als Dienstleister Speicherplatz auf einem Server zu Verfügung  Nutzer kann auf seinem Webspace seine Homepage oder Bilder ablegen  Provider übernimmt Betreuung, kostengünstig, eigene Internet-Anbindung irrelevant  Server-Konfiguration ist nicht beeinflussbar, Rechenleistung wird mit anderen geteilt, nicht für aufwändige Lösungen geeignet 5.3.1.2. Arten des Webhosting  Shared Webhosting-Service: Bereitstellung von Webspace sowie Unterbringung von Webseiten auf dem Webserver des ISP, alle Domains nutzen den gemeinsamen Pool von Server-Ressourcen (kostengünstig, Betreuung durch Provider, nur für einfache Lösungen geeignet)  Root-Server: User hat vollen administrativen Zugriff auf eigenen Server, Verantwortung für Sicherheit und Wartung liegt bei User  Managed Server: Mischform, Betriebssystem und Software (Server) wird vom Anbieter überwacht und gewartet, weitere Services sind möglich (zB telefonischer Support) – eher teuer 5.3.1.3. Anbieter und Beispiele www.easyname.at, www.world4you.at, www.hetzner.de Web und Internet 1 Seite 18 von 62 Marina Tubic 5.3.2. Eigener Server  Betrieb eines eigenen Servers im Haus  Höchstmaß an Individualität, einfache Anbindung an interne Systeme  Sehr hoher Aufwand, Festverbindung nötig, ausgehende Bandbreite erforderlich, Sicherheitsprobleme 5.3.3. Cloud Hosting  Es wird Speicherplatz, Rechenleistung, Betriebssysteme und Anwendungssoftware über das Internet als Dienstleistung zur Verfügung gestellt.  Anbieter bieten „virtuelle Maschinen“ an die mit wenigen Mausklicks zB mit mehr oder weniger Ressourcen (CPU, Speicher) ausgestattet werden können  Leistung kann mit wenigen Mausklicks geändert werden  Verrechnung auf Basis bestimmter Metriken z.B. IONOS, Amazon EC2, Google Cloud 5.3.4. Serverhousing  Beim Provider wird ein eigener Server betrieben  Server des Kunden wird im Rechenzentrum des ISP aufgestellt und ans Internet angebunden  Individualität, einfach Anbindung interner Systeme, hohe Bandbreite, weitere Dienstleistungen des Providers mit verwendbar (zB Firewall)  Mittlerer Aufwand für Betrieb, Kosten für Server-Standplatz, erschwerter Abgleich von Daten (Server und Systeme beim Kunden + Daten beim gehousten Server) 5.4.  Auslagerung von Teilen an Agentur  Erwartungen an Agentur möglichst genau formulieren  Konkrete, messbare Ziele definieren  Anforderungen festhalten  Inhalte:  Ausgangssituation  Aufrtrag  Ziele und Zielgruppen  Anforderungen  Zeit und Budget Web und Internet 1 Seite 19 von 62 Marina Tubic Lernfragen: 1) Wie ist der Ablauf eines Web-Projekts? 2) Erläutern Sie die jeweiligen Phasen anhand eines Beispiels! 3) Warum sollte bereits zu Beginn des Projekts die Domain registriert werden? 4) Warum ist die Auswahl des ISPs wichtig? 5) Was versteht man unter Prototyping? Web und Internet 1 Seite 20 von 62 Marina Tubic 6. Programmierung im Internet 6.1.  Sprachen/Technologien für „Frontend“ (Anzeige im Browser, „clientseitig)  HTML, CSS, Javascript  Sprachen/Technologien für „Backend“ („serverseitig)  PHP, Java, mySQL, Apache, Linus, MS Windows  Statische Webseiten: Webserver liefert nur Inhalte in Form von Dateien (HTML, CSS, Javascript) aus (ohne Zwischenschritte)  Dynamische Webseiten: Inhalte werden im Moment des Aufrufes vom Webserver mit einer Script-Engine generiert und an den Client zurückgeschickt (PHP) 6.2. 6.2.1. Allgemeines  Hypertext Markup Language  Sprache zur Beschreibung und Gestaltung von Websites im www  Derzeit aktuell: HMTL 5 6.2.2. Aufbau von HTML-Elementen  Dateiendung.htm oder.html (Textdateien)  HTML-Dokumente enthalten HTML-Befehle (Tags) Beeinflusster Text  Fast alle HTML-Elemente durch einleitendes und abschließendes Tag markiert 6.2.3. Grundstruktur einer HTML-Seite  Eine Zeile mit Verweis auf die verwendete HTML Version  Header-Sektion  Body-Sektion 6.2.4. Grundlegende Tags 6.2.4.1. Elemente zur Text-Strukturierung  fett, kursiv, unterstrichen  Überschriften: ,  Textabsätze:  Listen: Web und Internet 1 Seite 21 von 62 Marina Tubic 6.2.4.2. Verweise (Links)  Verweise (URLs) sind der eigentliche Hauptbestandteil des Web  Verweistext  Projektexterne Verweise (www.orf.at) und projektinterne Verweise (ersteSeite.htm) 6.2.4.3. Grafiken und Tabellen  Grafiken sind nicht direkt in der HTML Datei gespeichert, sondern es werden nur Verweise auf Grafiken eingebettet    = neue Tabellenzeile  = ist eine Zelle in einer Zeile 6.2.4.4. Formulare  Für Datenerfassung, Suchmasken   Das verpflichtende Attribut “action” enthält die URL, an die die Formulardaten übertragen werden, diese Datei empfängt die Daten und muss sie weiterverarbeiten (serverseitige Programmierung)   6.2.4.5. Strukturelemente, semantische Orientierung  Neue Elemente in HTML 5 zur Strukturierung bzw semantischen Anordnung von Text  , , , , , 6.2.5. Multimedia  Einbettung von Audio /Video   6.2.6. Input-Elemente  Erleichtern insbesondere die Eingabe bei Mobilgeräten (zB Definition von Eingabe-Elementen die ein bestimmtes Format aufweisen müssen wie zB E-Mail-Adresse) 6.2.7. HTML5 API (Application Programming Interfaces)  Programmier chnittstellen  HMTL Geolocation, HTML Drag and Drop Web und Internet 1 Seite 22 von 62 Marina Tubic 6.3. 6.3.1. Grafik-Formate HTML-Seiten enthalten selbst keine Grafiken, sondern nur die Verweise darauf. 6.3.1.1. Pixelgrafik vs. Vektorgrafik  Pixelgrafik stellt eine Grafik in From von kleinen Punkten darf (beim Vergrößern werden aus kleinen Punkten große Punkte)  Vektorgrafik stellt das Bild mit mathematischen Funktionen dar (dadurch beliebig skalierbar, erscheinen beim Vergrößern nicht pixelhaft) 6.3.1.2. GIF (Graphics Interchange Format)  Verlustfreie Kompression  Interlaced  Animation  Transparente Farbe  Max 256 Farben  Geeignet für Logos, ungeeignet für Fotos 6.3.1.3. JPEG (Joint Photographic Experts Group)  Sehr gute Komprimierung  Bis 16,7 Mio. Farben  Geeignet für Fotos 6.3.1.4. PNG (Portable Network Graphic)  Für Web konzipiert  Vorteile von GIF und JPEG  Verlustfreie Kompression  Farbtiefe und Transparenz  Interlaced  Information zu Bildherkunft und Copyright  Als Erweiterung/Ersatz von GIF 6.3.1.5. SVG (Scalable Vector Graphics)  Für Besshreibung zweidimensionaler Vektorgrafiken  XML-basierend (SVG-Datei können mit Texteditor bearbeitet werden) 6.3.1.6. “Moderne” Grafikformate JPEG 2000, JPEG XR, WebP – Achtung, nicht alle Browser können diese neuen Formate anzeigen Web und Internet 1 Seite 23 von 62 Marina Tubic 6.3.2. Audio-Formate  Audio-Format beschreibt den Aufbau einer Audiodatei (enthalten nur Noten, kein vollständiges Tonsignal)  Verlustfreie Formate: Compact Disc, Digital Audia, wav, wv, wma)  Verlustbehaftete Formate: mp3, mp4, wma 6.3.3. Streaming-Media  Streaming erlaubt, die Wiedergabe zu beginnen, bevor die gesamte Datei heruntergeladen ist (Audio und/oder Video)  Man benötigt Streaming Client (Empfang von gestreamten Inhalt), Streaming Server (Auslieferung) und Streaming Protokoll (zB HTTP) 6.4. 6.4.1. Überblick  Ergänzung zu HTML  Sprache zur Definition von Formateigenschaften einzelner HTML-Elemente  Formate können zentral definiert werden (Formate in eigener Datei die für alle HTML-Seiten gelten) 6.4.2. Einbindung von CSS  Externe CSS-Datei (Endung.css) – Verweis im Head-Teil:  CSS-Anweisung direkt in der HTML Datei im Bereich …  Innerhalb eines HTML-Elements 6.4.3. Aufbau von CSS Regeln Web und Internet 1 Seite 24 von 62 Marina Tubic 6.5. 6.5.1. Überblick  Framework liefert “Bausteine”, die einfach verwendet werden können  Framework ist ein „Programmiergerüst“  Zur Erleichterung der Programmierung und Zeitersparnis  Frameworks teilweise sehr umfangreich und komplex 6.5.2. Verwendung von Bootstrap für eigene Webprojekte  Eines der populärsten Frameworks  Freies CSS-Framework  Enthält auf HTML und CSS basierende Gestaltungsvorlagen für Formulare, Buttons, Tabellen, Grid-Systeme, Navigationselemente  Modular aufgebaut (Einzelkomponenten von einer einer zentralen bootstrap-Datei zusammenführen)  Grundgerüst responsive gestaltet (Gestaltungsraster „Grid“ 12 Spalten)  2 Varianten zur Verwendung: CSS herunterladen und beim eigenen Webauftritt hosten oder Verweis auf CSS-Dateien im Web Web-Programmierung 6.6.  Verbesserung der Datendarstellung und Benutzerinteraktion  zB Eingabeformular prüfen (alle Muss-Felder ausgefüllt), Menüs mit Effekten  HTML zur Strukturierung des Inhalts, Datendarstellung  CSS für das Design (Farben, Schriften) 6.6.1. Javascript  Wichtigste clientseitige Programmiersprache  Ist kein direkter Bestandteil von HTML, sondern eine eigene Programmiersprache Web und Internet 1 Seite 25 von 62 Marina Tubic  Programmiersprache um die Interaktion mit dem Benutzer zu verbessern  Es gibt zahlreiche Bibliotheken/Frameworks (zB jQuery, Angular, React) 6.6.1.1. Javascript einbinden  Quellcode direkt in HTML-Datei eingebettet oder  In separaten Dateien  Javascript läuft in einer „Sandbox“ = „Sicherheitskäfig“ in dem die Programmiersprache eingesperrt ist (lesen und schreiben von Daten nicht beliebig möglich) 6.7.  zB um auf Daten die in Datenbanken, Warenwirtschaftssystemen abgelegt sind, zuzugreifen und damit die Webseiten, die zum Browser geschickt werden, dynamisch zu generieren  Dynamische Erzeugung/Bereitstellung von Daten  Sprache: PHP, Python, … alles, was ich mit PHP programmiert habe, ist für mich am Client nicht mehr sichtbar! Serverseitige Befehle kann man nicht mehr ansehen!  Verwendung bei umfangreichen Applikationen (zB Webshop, Einkaufskorb)  Einbindung von Datenbanken möglich  Webserver-Software kann serverseitige Scripte nicht direkt abarbeiten (Webserver-Software muss mit Modulen oder Plugins erweitert werden = Script Engine)  Script Engine führt Anweisungen aus 6.7.1. Abarbeitung 1. Anfrage an Server 2. Anfrage wird vom Webserver entgegengenommen. Wenn eine dynamische Ressource angefragt wird, wird die Abarbeitung an die Script- Engine übergeben 3. Script-Engine arbeitet die Befehle ab (evtl Zugriff auf eine Datenbank) 4. Antwortseite wird von Script-Engine generiert 5. Fertige Seite und statische Ressourcen werden an Nutzer zurückgeschickt 6. Clientseitige Skripte werden beim Client ausgeführt Web und Internet 1 Seite 26 von 62 Marina Tubic 6.7.2. Serverseitige Programmiersprachen / Web-Frameworks „Backend-Stack“ = Komponenten die serverseitig eingesetzt werden: 6.7.2.1. C#, ASP.NET  Free Web-Framework  Serverseitige Technologie von Microsoft  Mehrere Programmiersprachen möglich (häufig C#)  Sehr komplex – schwierig zu erlernen 6.7.2.2. PHP 6.7.2.2.1. Überblick  Open Source Skriptsprache (weit verbreitet)  Serverseitige Ausführung  Leichte Erlernbarkeit  Viele Frameworks  PHP-Code wird am Server ausgeführt, das Ergebnis wird zum Browser als HTML zurückgeschickt 6.7.2.2.2. PHP in HTML  PHP-Code wird direkt mit HTML-Code vermischt  PHP-Befehle werden direkt in den HMTL-Code, innerhalb der Zeichen eingebettet und mit einem Strichpunkt abgeschlossen  Ausgabe Befehl echo „…“ 6.7.2.2.3. Variablen  Variable speichert einen Wert (Texte oder Zahlen)  Mit Variablen können Berechnungen durchgeführt werden  Variablen in PHP beginnen mit einem $ Symbol gefolgt von einem Namen Web und Internet 1 Seite 27 von 62 Marina Tubic 6.7.2.2.4. Operatoren, Fallunterscheidungen und Schleifen  Operatoren: sollen Daten miteinander verbinden (>, >=, -Tag, Struktur der Site, Responsive Design, Page Speed  OffPage-Faktoren: Findet außerhalb der Website statt zB Linkbuilding, Social Media PR, Online-PR, Blog, Domain-Name SEO-Richtlinien bei Google:  Qualitativ hochwertigen Content  Klare und eindeutige Inhalte  Keywords (nicht die komplette Website damit füllen)  Versuchen dass andere Websites Links zur Website herstellen  Problemloser Zugriff auf die Website 10.5.2. Suchmaschinenwerbung (SEA) Schalten von bezahlten Werbeanzeigen in Suchmaschinen 10.5.2.1. Grundprinzip  Suchergebnis durch „Anzeige“ gekennzeichnet bzw farblich hinterlegt, oberhalb des organischen Suchergebnisses  Advertiser hinterlegt Keywords für die Anzeige (Keywords werden nach Auktions-Prinzip gekauft)  Advertiser legt Monatsbudget fest und bietet Maximalpreis für Keywords  Wenn ein Suchender in das Suchfeld einen Begriff eingibt, startet die Auktion jedes Mal aufs Neue Web und Internet 1 Seite 40 von 62 Marina Tubic 10.5.2.2. Anzeigerang und Kosten  Abrechnung auf Basis CPC-Modell (Cost per Click) – Bezahlung des Klickpreises fällt erst dann an, wenn ein Benutzer auf die Werbeanzeige geklickt hat  Anzeigenrang ist abhängig von CPC des Schlüsselwortes multipliziert mit Qualitätsfaktor des Schlüsselwortes  Qualitätsfaktor ist abhängig von CTR (Click-through-Rate), Relevanz des Anzeigetextes Click-through-Rate = Verhältnis Anzahl Klicks auf Werbebanner zu gesamten Impressionen (CTR bei klassischer Bannerwerbung im www im Promillebereich) Lernfragen: 1) Wie funktioniert eine indexbasierte Suchmaschine? 2) Sie möchten Ihren eigenen Webauftritt optimieren. Wie können Sie vorgehen? 3) Welche Maßnahmen für SEO können Sie treffen? 4) Erläutern Sie CPC und CTR! Web und Internet 1 Seite 41 von 62 Marina Tubic 11. Web-Controlling 11.1. Web-Controlling = Planung, Analyse und Steuerung des Webauftritts Wieso? Wirksamkeit und Wirtschaftlichkeit, Werttreiber und Kostentreiber eines Webauftritts Regelkreis bedeutet, dass Planung, Analyse und Steuerung kontinuierlich durchlaufen werden sollen, um nachhaltig Verbesserungen erzielen zu können. 11.2. 11.2.1. Einfache Verfahren: Seitenzähler (veraltet)  Wird mit jedem Seitenaufruf erhöht  Mäßige Aussagekraft  Gemessen werden die Hits auf eine HTML-Datei 11.2.2. Server-basierte Verfahren: Logfile-Analyse  Ist eine Textdatei, die ausgewertet werden muss  Automatisch erstellte Dateien (entstehen beim Webserver)  Inhalt: IP, Datum und Uhrzeit, angeforderte Dateien, Betriebssystem, Browser 11.2.3. Client-basierte Verfahren: Tag- und Pixel-Tracking (State-of-the-art)  Pixel-Tracking:  In den Quellcode der Website werden unsichtbare Mini-Bilder (Pixel) integriert (zB nur 1x1 Pixel groß, transparent, in der Farbe des Hintergrunds)  Aufruf des Pixels entspricht Seitenaufruf  Pixel liegt auf einem anderen Server (wird als Dienstleistung von einem Drittanbieter angeboten)  Tag-Tracking:  zB Google Analytics  Einsatz von Javascript-Code zu Datenerhebung  Javascript-Tags in den Quellcode der Seite integriert (anstatt des Pixels) …  Vorteil von Javascript Tag: es können zusätzliche Informationen über den abrufenden Client gesammelt werden  Pixel- und Tag-Tracking kann kombiniert werden Web und Internet 1 Seite 42 von 62 Marina Tubic 11.2.4. Wiedererkennung der Benutzer Die Identifikation des Benutzers ist mittels http Protokoll nicht möglich. Die IP-Adresse kann identifiziert werden. Allerdings können viele Benutzer die gleich IP-Adresse verwenden (zB bei Verwendung eines Proxyservers, Network Address Translation). IP Adresse ist nicht mit einem Benutzer gleichzusetzen. Benutzeridentifikation ist möglich durch: 11.2.4.1. Wiedererkennung durch SessionID  SessionID wird beim ersten Aufruf des Benutzers vergeben (Client sendet diese dann bei den folgenden Aufrufen immer mit)  SessionID wird entweder an die URL angehängt oder mit einem Cookie  SessionID wird verworfen, sobald der Browser geschlossen wird (Benutzer wird bei späterem Besuch nicht wiedererkannt) 11.2.4.2. Wiedererkennung durch Cookies  Cookie = Textdatei die beim Browser gespeichert wird, und die der Browser bei späterem Zugriff auf denselben Webserver zurücksendet  Webserver setzt Cookie bei Browser  Browser sucht bei jedem Aufruf einer Website nach Cookies, die von derselben Website stammen und fügt diese Cookies dem Aufruf (HTTP-Anfrage) hinzu.  Server erkennt Browser wieder  Cookies können blockiert oder gelöscht werden  Mit Cookie kann der User nicht identifiziert werden (mit IP-Adresse auch nicht), lediglich Rückschluss auf Browser möglich  Es gibt verschiedene rechtliche Regelungen rund um den Einsatz von Cookies  Cookies sind nur zulässig, wenn der User vorab im Detail informiert wird, vor dem Einsatz eine Zustimmung vorliegt und die Zustimmung freiwillig und durch eine aktive Handlung erteilt wurde. 11.2.4.3. Wiedererkennung durch Personalisierung  Benutzer identifiziert sich mit Benutzername und Kennwort  zB Amazon, Facebook  Personalisierung formal (zB Hintergrundfarbe) sowie inhaltlich (zB angezeigte Informationen)  Für die Bekanntgabe von persönlichen Daten muss Zusatznutzen geboten werden Web und Internet 1 Seite 43 von 62 Marina Tubic 11.3. 11.3.1. „Klassische“ Kennzahlen  Page Impression (Page Views, Anzahl der Seitenaufrufe): Anzahl der vollständig angezeigten Seiten  Visits (Besuche, Sessions, Anzahl der Sitzungen): zusammenhängender Nutzungsvorgang des Web-Angebots (ein Website-Besucher klickt auf mehrere einzelne Seiten)  Unique Visitors (Besucher, Unique Clients, Anzahl der Nutzer): Zahl der verschiedenen Nutzer  Verweildauer (durchschnittliche Sitzungsdauer, View Time, Besuchszeit): Zeit, die die Benutzer pro Besuch auf der Website verbringen  Durchschnittliche Absprungrate (Bounce Rate): Anteil jener Besuche, welche nur eine Seite aufgerufen haben und danach das Angebot wieder verlassen haben  AdImpressions: Anzahl der Werbeeinblendungen von Werbemitteln (Banner)  AdClicks: Anzahl der Klicks auf Werbemittel  Click-Through-Rate (Klickrate): Anzahl der Klicks auf ein Werbebanner im Verhältnis zu den gesamten Impressionen (CTR zwischen 0,01% und 0,1%, bei Google Ads 1%-4%) 11.3.2. Kennzahlen aus Systemperspektive (technische Perspektive)  Vitalität: optimales Zusammenspiel von Applikationen, Services, Serverprozesse, Datenbanken, CPU, Speicher, etc  Geschwindigkeit der Website: Ladezeit (hat Auswirkung auf Reihung in Suchergebnis) 11.3.3. Kennzahlen aus Angebotsperspektive (Präsentation des Angebots)  Direkte Aufrufe: Anzahl der Besucher, die die Adresse der Website direkt in die Adresszeile eingeben  Suchmaschinen: mit welchen Suchmaschinen und welchen Suchbegriffen gelangen Besucher auf die Website  Referral: Auf den Websites sind Links zum Angebot zu finden und diese Besucher haben auf einen dieser Verweise geklickt  Zielseiten (Landing Pages) und Ausstiegsseiten: Zielseiten zeigen an, welche Seiten am häufigsten als Einstiegsseiten verwendet werden Ausstiegsseiten sind jene Seiten, auf denen die Besucher am häufigsten die Website verlassen  Suchbegriffe: Welche Suchbegriffe in der Suchfunktion der Website eingegeben werden 11.3.4. Kennzahlen aus Kundenperspektive  Conversion Rate (=Zielerreichung): Umwandlung eines Kaufinteressenten in einen Käufer Verhältnis von Zielereignis zu Basisereignis Tatsächliche Bestellung / Besucher Webshop = CR in % Web und Internet 1 Seite 44 von 62 Marina Tubic Lernfragen: 1) Wie können die Daten für Kennzahlen gewonnen werden? 2) Was versteht man unter Cookies? Wofür werden Sie verwendet? 3) Warum sind Cookies im Kontext von Web-Analytics wichtig? 4) Erläutern Sie einige Kennzahlen im Detail! 5) Was ist der Unterschied zwischen Pixel-Tracking und Tag-Tracking? Web und Internet 1 Seite 45 von 62 Marina Tubic 12. Web Content Management 12.1. Content = Informationen die für bestimmte Benutzer in einem spezifischen Kontext einen Wert haben 12.2. 12.2.1. Content Management Content Management = alle Tätigkeiten und Hilfsmittel, die den Lebenszyklus digitaler Informationen in Form von Unterlagen und Dokumenten unterstützen (Text, Bild, Audio, Video) Content Lifecycle = Content ist nicht von allein da, sondern durchläuft einen Lebenszyklus → Planung – Erstellung – Veröffentlichung – Evaluierung – Archivierung Content Management System = Software zur Erstellung, Verwaltung und Organisation von Content Web Content Management System = Websites erstellen und verwalten Mithilfe von CMS können Websites erstellt und verwaltet werden (sinnvoll, wenn mehrere einzelne Webseiten verwaltet werden müssen). Aufwand für das händische Verwalten von HTML-Seiten wäre enorm hoch. 12.2.2. Funktionen, Aufgaben  Verwaltung und Darstellung von Inhalten  Editieren von Inhalten  Versionsverwaltung, Conten-Lifecycle-Management  Berechtigungen  Unterstützung der Benutzerinteraktion  Technische Funktionen 12.3. 12.3.1. Technik  Inhalte werden in einer Datenbank gespeichert  Inhalte können leicht geändert, ergänzt, gepflegt werden  WCMS basiert in der Regel auf serverseitiger und clientseitiger Programmierung (LAMP, XAMPP, Windows) Web und Internet 1 Seite 46 von 62 Marina Tubic 12.3.2. Systeme  Open Source CMS (Wordpress, Joomla, Drupal, Typo3/mittlere bis große Websites)  Kommerzielle CMS (sitecore, opentext, Adobe)  SEMRush (für Content-Erstellung im Hinblick auf SEO-Optimierung)  Contenbird (Zusammenarbeit, Planung, Erstellung von Content)  Hootsuite (Content für Social Media Kanäle planen, erstellen, verwalten, publizieren) Lernfragen: 1) Was versteht man unter Content Management? 2) Welche bekannten Content Management Systeme gibt es? 3) Warum wird ein Content Management System eingesetzt? 4) Was sind typische Funktionalitäten bei einem Content Management System? 5) Sie sind ein kleines produzierendes Unternehmen und möchten eine neue Website aufbauen. Welche Art von CMS könnte das Unternehmen verwenden und warum? Web und Internet 1 Seite 47 von 62 Marina Tubic 13. Social Media 13.1. Web 2.0  Was sich in und rund um das Web verändert (technisch, wirtschaftlich, sozial)  Internet-Anwendungen die die Nutzer aktiv in die Wertschöpfung integrieren  Grundidee ist, dass Benutzer möglichst einfach Inhalte für andere Benutzer bereitstellen können  Kein „neue Version“ des Web, sondern ein Oberbegriff für eine geändert Wahrnehmung und Nutzung des www  Wichtige Merkmale: Interaktivität, Dezentralität, Dynamik Social Media  Internet-Plattformen, auf denen Nutzer mit anderen Nutzern Beziehungen aufbauen und kommunizieren (Community)  Kommunikationskanäle die den Austausch von Inhalten ermöglichen  Internetanwendungen, die au den ideologischen und technologischen Grundlagen des Web 2.0 aufbauen und die Herstellung und den Austausch von User Generated Content ermöglichen 13.2.  Austausch von User Generated Content  User Generated Content kann sein: Text, Bilder, Videos, Audio (publizierte Inhalte)  Weitreichende Kommunikationsbeziehungen  Globale Reichweite, Zugänglichkeit, Benutzerfreundlichkeit  Aktualität und Schnelligkeit 13.3. 13.3.1. Soziale Netzwerke (Social Network Services)  Verbindung von Menschen in einer Gemeinschaft für das Web  Persönliches Profil  Adressbuch  Empfang und Versand von Nachrichten  Benachrichtigungen  Status, Blogs, Mikroblogging  Suche  zB Facebook Web und Internet 1 Seite 48 von 62 Marina Tubic 13.3.2. Weblogs  Website, die periodisch neue Einträge enthält (neueste Einträge stehen an oberster Stelle)  Dienen der Unterhaltung, der persönlichen Selbstdarstellung, Marketingzwecke im Web  Weblog-Software erforderlich (zB Wordpress)  Kann man über RSS-Feed abonnieren 13.3.3. Microblogs  Sonderform des Weblogs  Beiträge sind in der Länge beschränkt (SMS-ähnlicher Charakter)  Einsatzgebiete: Kommunikation, Marketing, Politik, Medien  zB Twitter 13.3.4. Wikis  Eine im www verfügbare Seitensammlung die von den Benutzern gelesen und geändert werden kann (einfache Formatierungscodes, um das Bearbeiten zu erleichtern)  Informationen schnell verfügbar und sofort bearbeitbar zugänglich zu machen  Wissensmanagement  Wiki-Software / Wiki-Engine erforderlich  zB Wikipedia 13.3.5. Podcast  Erstellen und Veröffentlichen von herunterladbaren Audio- oder Videodateien im Internet  Art eigene Radiosendung, die sich einem bestimmten Thema widmen  Meist kostenlos im Internet verfügbar  Kann man über RSS-Feed abonnieren  zB iTunes 13.3.6. Social Media Sharing  Teilen („sharen“) von Medien auf digitalen Plattformen  zB Youtube (Videoportal, finanziert durch Werbeanzeigen und verschiedenen Mitgliedschaftsprogammen), Instagram (kostenlos, finanziert durch Werbeanzeigen), Pinterest Web und Internet 1 Seite 49 von 62 Marina Tubic Lernfragen: 1) Was versteht man unter „Web 2.0“ bzw unter „Social Media“? 2) Welche Anwendungsklassen gibt es in Social Media? Erläutern Sie diese! 3) Was versteht man unter AJAX? 4) Welche Einsatzmöglichkeiten für Social Meida-Anwendungen könnten aus Sicht von Unternehmen interessant sein? Web und Internet 1 Seite 50 von 62 Marina Tubic 14. Mobile Web 14.1. 14.1.1. Mobile Endgeräte Grundlegende Eigenschaften eines mobilen kommunikationsfähigen Endgerätes:  Lokalisierbarkeit  Erreichbarkeit  Ortsunabhängigkeit Geräteklassen:  Transportable Geräte  Mobile Geräte  Wearables 14.1.2. Mobile Übertragungstechnologien Es gibt viele kabellose Übertragungstechnologien: Bluetooth, WLAN, ZigBee, NFC 14.1.2.1. Mobilfunktechnologien (GSM, UMTS, LTE)  Funkzellen werden durch eine Abstrahlung von den Basisstationen aufgebaut  Funkzellen überlappen sich  Mobilfunk 5G: Nachfolger von LTE, erste Vergabe in 2019, Bandbreite bis 20GBit/s  GSM Reichweite: 100m bis 10km  UMTS Reichweite: einige 10m bis 20km 14.1.2.2. WLAN  Wireless Local Area Network  Reichweite im Freien 250m, in Gebäuden 70m  Zur Übertragung von Daten, Hotspots oder zur Lokalisierung der Endgeräte  Häufig IEEE-802.11-Standard 14.1.2.3. Bluetooth  Zur Datenübertragung zwischen Geräten über kurze Distanzen per Funktechnik  Reichweite hängt von vielen Faktoren ab (Funklklasse, Umgebung, Empfindlichkeit des Empfängers, …) 1 Meter bis zu 100 Metern im Freien Web und Internet 1 Seite 51 von 62 Marina Tubic 14.1.2.4. Mobile Betriebssysteme  Propietäre Betriebssysteme: Auf „normalen“ Mobiltelefonen verwendet (Nokia Series 40)  Halb-offene Betriebssysteme: Sourcecode nicht verfügbar, aber Betriebssystem erweiterbar um Apps (iPhone OS, Windows Mobile)  Offene Betriebssysteme: Source Code verfügbar (Android) 14.2. 14.2.1. Native Apps  Bekommt man aus dem App Store, Google Play Store  Müssen auf dem Endgerät installiert werden  plattformabhänig  Programm, speziell für eine bestimmtes Betriebssystem programmiert  App ist immer am Screen des mobilen Endgeräts ersichtlich  Zugriff auf Hard- und Softwarefunktionen (Dateien, GPS, Mikrofon, Kamera)  Muss für jedes mobile Betriebssystem entwickelt werden (höherer Aufwand)  zB WhatsApp, Facebook-App, Runtastic-App 14.2.2. Cross-Plattform-Apps  App kann auf verschiedenen Betriebssystemen und Endgeräten ausgeführt werden  Funktioniert nicht immer zu 100% richtig für alle Betriebssysteme  Quellcode kann zwischen den Plattformen wiederverwendet werden  70% des Codes sind gleich, Rest wird angepasst 14.2.3. Mobile Web-Applikationen  Werden über Webbrowser des Mobilgeräts abgerufen (nur Website im Browser wird angezeigt)  Keine Installation erforderlich  Nicht in App Stores angeboten  Verwendung von Standards (HTML5, JavaScript, CSS)  Es muss nicht für mehrere Plattformen extra entwickelt werden  Aktive Internet-Verbindung erforderlich Web und Internet 1 Seite 52 von 62 Marina Tubic  Eingeschränkter Zugriff auf Hardware-Komponenten  Progressive Web App: Offlinefähigkeit und Push-Notifications möglich, App-like Design, Hardwarezugriff großteils möglich, Veröffentlichung über Stores, Add-To-Homescreen zB Starbuck, BMW, Uber, Pinterest, Spotify 14.2.4. Hybride Applikationen  Können auf unterschiedlichen Plattformen ausgeführt werden  Keine eigene Programmiersprache (HTML5, CSS, JavaScript)  Kombination der Vorteile der nativen App und Web-App  Zugriff auf viel Hard- und Softwarekomponenten möglich  Mit einer Entwicklung werden viele Plattformen abgedeckt (weniger Aufwand)  Weisen Sicherheitslücken auf  Nicht alle betriebssystemspezifischen Eigenschaften können benutzt werden  Werden in Stores schlecht gelistet 14.2.5. Gegenüberstellung 14.2.6. Herausforderungen bei der Entwicklung  Kleinheit des Displays  Mehr/andere Eingabemöglichkeiten (zB Touchscreen, Kamera)  Navigation (aufgrund der limitierten Größe)  Darstellung im Browser (wird anders angezeigt)  Leistung (Akkubetrieb Web und Internet 1 Seite 53 von 62 Marina Tubic 14.3. 14.3.1. Grundprinzip Responsive Design  Anpassung der Darstellung der Website an mobile Endgeräte (Website soll auf allen Geräten gut dargestellt werden)  Es wird nur eine Version der Website erstellt – die Darstellung soll aber flexibel sein  Je nach Auflösung/Größe des Displays andere Anordnung von Navigation, Layout, Bilder, Infoboxen (Breakpoints) 14.3.2. Umsetzung, Frameworks  Einsatz von „Media Queries“ (Konzept in CSS3)  Für Umsetzung sind zahlreiche Frameworks vorhanden (zB Bootstrap) 14.4.  Mobile Applikationen benötigen häufig Daten von „dahinterliegenden“ System oder speichern Daten in „dahinterliegenden“ Systemen (zB Wetter App, Fitness-App)  Daten müssen von einem Serversystem (Back End) bezogen werden  Wie und wo sollen die Daten gespeichert werden?  Wie erfolgt die Synchronisation ohne Mobilfunkempfang  App kommuniziert über eine API (Application Pogramming Interface) mit dem Server  App ruft Daten über eine Schnittstelle auf / speichert über eine Schnittstelle (API)  API: Software, stellt anderen Programmen eine Anbindungsmöglichkeit an das Softwaresystem zur Verfügung 14.5. 14.5.1. Grundprinzip  Mobile Dienste, die unter Zuhilfenahme von positionsabhängigen Daten dem Endbenutzer selektive Informationen bereitstellen  Voraussetzung ist, dass die Position des Endgeräts bestimmt werden kann (GPS aktiviert)  zB Routenplaner, Wo sind meine Freunde, Tracking Service, Notfall Dienste 14.5.2. Lokalisierung  Outdoor-Lokalisierung (netzwerkbasiert, GPS)  Indoor-Lokalisierung  Lokalisierung: Position des Geräts wird durch Infrastruktur erkannt  Positionierung: Gerät erkennt die Position (GPS) Web und Internet 1 Seite 54 von 62 Marina Tubic Lernfragen: 1) Nach welchen Kriterien können Sie Mobilgeräte auswählen? 2) Erläutern Sie den grundlegenden Aufbau von Mobilfunknetzen! 3) Wie kann eine Lokalisierung von Mobilgeräten durchgeführt werden? 4) Erläutern Sie die grundlegende Architektur von komplexeren nativen Apps! 5) Inwieweit unterscheidet sich die Software-Entwicklung für mobile Geräte von „normaler“ Software-Entwicklung? 6) Wann würden Sie eher eine mobile Website gegenüber einer nativen App einsetzen? Was sind die Unterschiede? Web und Internet 1 Seite 55 von 62 Marina Tubic Web und Internet 1 Seite 56 von 62

WEB1 Zusammenfassung WS 2024 PDF

Document Details

Tags

Related

Summary

Full Transcript

Upgrade to continue