Workshop:
Die "Rückseite" des Internet
kennenlernen
sk stiftung jugend und medien, 10.10.2009
Workshop: Die „Rückseite“ des Internets kennenlernen

Kurzvorstellung Referent.



Wer ich bin ...
   Alexander Stelter
...
Workshop: Die „Rückseite“ des Internets kennenlernen

Kurzvorstellung snoopmedia.



Geschäftsform:            Inhabergefü...
Workshop: Die „Rückseite“ des Internets kennenlernen

Kurzvorstellung snoopmedia – Referenzen.




                       ...
Workshop: Die „Rückseite“ des Internets kennenlernen

.. eine kurze Frage.




                    Wer seid Ihr??!



    ...
Workshop: Die „Rückseite“ des Internets kennenlernen

Fahrplan.
   A. Woraus besteht eine Webseite?
      Quelltext
    ...
A. Woraus besteht eine
   Webseite?
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten




Komponenten




...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten




Komponenten
   ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten




Komponenten
   ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / HTML

...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / HTML

...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / HTML

...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten




Komponenten
   ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / CSS


...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / CSS


...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / CSS


...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten




Komponenten
   ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / JavaSc...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / JavaSc...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / JavaSc...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Quelltext / JavaSc...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten




Komponenten
   ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Grafiken




     ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Grafiken
         ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?                                    ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?                                    ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?                                    ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?                                    ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten




Komponenten
   ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Plugins / Flash


...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Plugins / Flash


...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten




Komponenten
   ...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Komponenten / Plugins / Weitere ...
B. Wie kommt Interaktion
   zustande?
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

A. Woraus besteht eine Webseite?
// Kommunikation / Browser -> Serve...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Browser -> Ser...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation




Kommunikatio...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
Workshop: Die „Rückseite“ des Internets kennenlernen

B. Wie kommt Interaktion zustande?
// Kommunikation / Speichern von ...
C. Wie kann ich eine
   Webseite bauen?
Workshop: Die „Rückseite“ des Internets kennenlernen

C. Wie kann ich eine Webseite bauen?
// Demo Time!!




Demo Time!!
...
Workshop: Die „Rückseite“ des Internets kennenlernen

C. Wie kann ich eine Webseite bauen?
// Demo Time!!




Wichtige Lin...
Workshop: Die „Rückseite“ des Internets kennenlernen

Vielen Dank für Euer Interesse.




                               I...
Upcoming SlideShare
Loading in...5
×

Die "Rueckseite" des Internets

1,176

Published on

Vortrag für Jugendliche in der SK Stiftung Köln/Bonn

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,176
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Die "Rueckseite" des Internets"

  1. 1. Workshop: Die "Rückseite" des Internet kennenlernen sk stiftung jugend und medien, 10.10.2009
  2. 2. Workshop: Die „Rückseite“ des Internets kennenlernen Kurzvorstellung Referent. Wer ich bin ...  Alexander Stelter  Jahrgang 1982  Fachinformatiker / Anwendungsentwicklung  Senior Software Developer  Web-Entwicklung seit 7 Jahren  Passionierter PHP Programmierer  Aktiver Blogger / Twitterer  Überzeugter Open Source User Alexander Stelter - snoopmedia GmbH 10.10.2009 2
  3. 3. Workshop: Die „Rückseite“ des Internets kennenlernen Kurzvorstellung snoopmedia. Geschäftsform: Inhabergeführte GmbH Geschäftsführer: Gerald Neu, Holger Zimmermann Gründungsdatum: 03. April 2000 Mitarbeiter: 18 feste Mitarbeiter snoopmedia realisiert seit mehr als neun Jahren konzeptionell kreative und aufmerksamkeitsstarke Projekte für Entwicklung, Umsetzung und Betrieb von erfolgreichen Unternehmensstrategien im Internet. Zur Zeit suchen wir wieder Auszubildende:  Kaufmann/-frau für Bürokommunikation  Fachinformatiker/-in Fachr. Anwendungsentwicklung  Mediengestalter/-in Digital und Print Alexander Stelter - snoopmedia GmbH 10.10.2009 3
  4. 4. Workshop: Die „Rückseite“ des Internets kennenlernen Kurzvorstellung snoopmedia – Referenzen. Alexander Stelter - snoopmedia GmbH 10.10.2009 4
  5. 5. Workshop: Die „Rückseite“ des Internets kennenlernen .. eine kurze Frage. Wer seid Ihr??! Alexander Stelter - snoopmedia GmbH 10.10.2009 5
  6. 6. Workshop: Die „Rückseite“ des Internets kennenlernen Fahrplan.  A. Woraus besteht eine Webseite?  Quelltext  Bilder  Plugins  B. Wie kommt Interaktion zustande?  Formulare  PHP: Hypertext Preprocessor  Datenbanken  Formular -> PHP -> Datenbank  Asynchronous JavaScript and XML (AJAX)  C. Wie kann ich eine Webseite bauen?  Demonstration von FireBug  Web-Baukasten Jimdo.com Alexander Stelter - snoopmedia GmbH 10.10.2009 6
  7. 7. A. Woraus besteht eine Webseite?
  8. 8. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten Komponenten Alexander Stelter - snoopmedia GmbH 10.10.2009 8
  9. 9. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten Komponenten  Quelltext Alexander Stelter - snoopmedia GmbH 10.10.2009 9
  10. 10. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten Komponenten  Quelltext  HyperText Markup Language (HTML) Alexander Stelter - snoopmedia GmbH 10.10.2009 10
  11. 11. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / HTML Was ist HTML?  „Auszeichnungssprache“  Wird nicht „programmiert“  Definiert durch das World Wide Web Consortium (W3C)  Gebräuchliche Versionen: HTML 4.01 / XHTML 1.x Alexander Stelter - snoopmedia GmbH 10.10.2009 11
  12. 12. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / HTML Alexander Stelter - snoopmedia GmbH 10.10.2009 12
  13. 13. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / HTML Alexander Stelter - snoopmedia GmbH 10.10.2009 13
  14. 14. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten Komponenten  Quelltext  HyperText Markup Language (HTML)  Cascading Style Sheets (CSS) Alexander Stelter - snoopmedia GmbH 10.10.2009 14
  15. 15. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / CSS Was ist CSS?  „deklarative Stylesheet Sprache“  Findet bei HTML und XML Verwendung  Versionen: CSS1, CSS2  Verwendung direkt im HTML oder separater Datei  Kann medienspezifisch eingesetzt werden (print, screen) Alexander Stelter - snoopmedia GmbH 10.10.2009 15
  16. 16. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / CSS Alexander Stelter - snoopmedia GmbH 10.10.2009 16
  17. 17. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / CSS Alexander Stelter - snoopmedia GmbH 10.10.2009 17
  18. 18. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten Komponenten  Quelltext  HyperText Markup Language (HTML)  Cascading Style Sheets (CSS)  JavaScript (JS) Alexander Stelter - snoopmedia GmbH 10.10.2009 18
  19. 19. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / JavaScript Was ist JavaScript?  Scriptsprache  Arbeitet auf dem Document Object Model (DOM)  Ermöglicht Interaktivität zwischen Webseite und Benutzer  Ist im Browser deaktivierbar  Ist bei falscher Anwendung sicherheitskritisch Alexander Stelter - snoopmedia GmbH 10.10.2009 19
  20. 20. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / JavaScript Alexander Stelter - snoopmedia GmbH 10.10.2009 20
  21. 21. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / JavaScript Alexander Stelter - snoopmedia GmbH 10.10.2009 21
  22. 22. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Quelltext / JavaScript Alexander Stelter - snoopmedia GmbH 10.10.2009 22
  23. 23. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten Komponenten  Quelltext  HyperText Markup Language (HTML)  Cascading Style Sheets (CSS)  JavaScript (JS)  Grafiken Alexander Stelter - snoopmedia GmbH 10.10.2009 23
  24. 24. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Grafiken Alexander Stelter - snoopmedia GmbH 10.10.2009 24
  25. 25. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Grafiken Buttons Alexander Stelter - snoopmedia GmbH 10.10.2009 25
  26. 26. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? Icons // Komponenten / Grafiken Buttons Alexander Stelter - snoopmedia GmbH 10.10.2009 26
  27. 27. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? Icons // Komponenten / Grafiken Buttons Illustrationen Alexander Stelter - snoopmedia GmbH 10.10.2009 27
  28. 28. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? Icons // Komponenten / Grafiken Buttons Illustrationen Fotos Alexander Stelter - snoopmedia GmbH 10.10.2009 28
  29. 29. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? Icons // Komponenten / Grafiken Buttons Illustrationen Fotos Hintergründe Alexander Stelter - snoopmedia GmbH 10.10.2009 29
  30. 30. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten Komponenten  Quelltext  HyperText Markup Language (HTML)  Cascading Style Sheets (CSS)  JavaScript (JS)  Grafiken  Plugins  Flash Alexander Stelter - snoopmedia GmbH 10.10.2009 30
  31. 31. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Plugins / Flash Was ist Flash?  Browser Plugin  Erstellung / Einbettung von Animationen / Filmen  Senden von Daten an den Server ohne Seitenreload  Kann (eingeschränkt) auf Daten auf dem Computer zugreifen  Programmierung von Spielen, Datei-Uploads, etc.  Sehr weite Verbreitung Alexander Stelter - snoopmedia GmbH 10.10.2009 31
  32. 32. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Plugins / Flash Alexander Stelter - snoopmedia GmbH 10.10.2009 32
  33. 33. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten Komponenten  Quelltext  HyperText Markup Language (HTML)  Cascading Style Sheets (CSS)  JavaScript (JS)  Grafiken  Plugins  Flash  Weitere Plugins Alexander Stelter - snoopmedia GmbH 10.10.2009 33
  34. 34. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Komponenten / Plugins / Weitere Plugins Weitere Plugins  Java Applets  Einbetten von Java-Programme in den Browser  Plattform unabhängig (Java Virtual Maschine vorausgesetzt)  Silverlight  Einbettung von 3D-Effekten, Drag and Drop, Videos etc.  Nur für Windows/Apple (Linux-Adaption: Moonlight) Alexander Stelter - snoopmedia GmbH 10.10.2009 34
  35. 35. B. Wie kommt Interaktion zustande?
  36. 36. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation Alexander Stelter - snoopmedia GmbH 10.10.2009 36
  37. 37. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation  Browser -> Server -> Browser Alexander Stelter - snoopmedia GmbH 10.10.2009 37
  38. 38. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation  Browser -> Server -> Browser  Was ist ein Server? Alexander Stelter - snoopmedia GmbH 10.10.2009 38
  39. 39. Workshop: Die „Rückseite“ des Internets kennenlernen A. Woraus besteht eine Webseite? // Kommunikation / Browser -> Server -> Browser / Was ist ein Server? Was ist ein Server?  Leistungsstarker Rechner  Spezielle Hardware  Öffentlich im Web zugänglich  Software und Betriebssystem sind speziell abgestimmt  Besonders geschützt durch eine Firewall Alexander Stelter - snoopmedia GmbH 10.10.2009 39
  40. 40. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation  Browser -> Server -> Browser  Was ist ein Server?  Ablauf eines Webseitenaufrufs Alexander Stelter - snoopmedia GmbH 10.10.2009 40
  41. 41. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Browser A n Webserver w e n d u n g Internet Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 41
  42. 42. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs z.B. Webblog Browser A n Webserver w e n d u n g Internet Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 42
  43. 43. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Browser A n Webserver w e n d u n g Internet Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 43
  44. 44. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Browser A n Webserver w e n d u n g Internet Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 44
  45. 45. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Browser A n Webserver w e n d u n g Internet Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 45
  46. 46. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Browser PHP A n Webserver w e n d u n g Internet Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 46
  47. 47. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Browser PHP A n Webserver w e n d DB u n g Internet Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 47
  48. 48. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Browser PHP A n Webserver w e n d DB u n g Internet Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 48
  49. 49. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Fertiges HTML Browser PHP A n Webserver w e n d DB u n g Internet Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 49
  50. 50. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Browser PHP A n Webserver w e n d DB u n g Internet Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 50
  51. 51. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Browser -> Server -> Browser / Ablauf eines Webseiten Aufrufs Browser PHP A n Webserver w e n d DB u n g Internet Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 51
  52. 52. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation  Browser -> Server -> Browser  Was ist ein Server?  Ablauf eines Webseitenaufrufs  Speichern von Daten Alexander Stelter - snoopmedia GmbH 10.10.2009 52
  53. 53. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation  Browser -> Server -> Browser  Was ist ein Server?  Ablauf eines Webseitenaufrufs  Speichern von Daten  Formulare Alexander Stelter - snoopmedia GmbH 10.10.2009 53
  54. 54. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Formulare Was ist ein Formular?  Ein Set an HTML Elementen  Definition von verschiedenen Feldern / Feldtypen / Buttons  Verfügt über zwei Übertragunsmodi (GET / POST)  Grundlage für den Großteil der User-Interaktion Alexander Stelter - snoopmedia GmbH 10.10.2009 54
  55. 55. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Formulare Alexander Stelter - snoopmedia GmbH 10.10.2009 55
  56. 56. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Formulare Alexander Stelter - snoopmedia GmbH 10.10.2009 56
  57. 57. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation  Browser -> Server -> Browser  Was ist ein Server?  Ablauf eines Webseitenaufrufs  Speichern von Daten  Formulare  PHP: Hypertext Preprocessor Alexander Stelter - snoopmedia GmbH 10.10.2009 57
  58. 58. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor Was ist PHP?  Scriptsprache (wird interpretiert, nicht compiliert)  Syntaktisch eine Mischung aus Perl, Java, C++  Open Source  Kernfeatures  Datenbankanbindung  Datei-Handling  Session-Handling (Logins etc.) Alexander Stelter - snoopmedia GmbH 10.10.2009 58
  59. 59. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Was ist PHP? Alexander Stelter - snoopmedia GmbH 10.10.2009 59
  60. 60. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor Alexander Stelter - snoopmedia GmbH 10.10.2009 60
  61. 61. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor Browser PHP A n Webserver w e n d DB u n g Internet Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 61
  62. 62. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor PHP A n w e n d DB u n g Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 62
  63. 63. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor PHP Interpreter PHP A n w e n d DB u n g Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 63
  64. 64. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor PHP Interpreter PHP Syntaxprüfung A n w e n d DB u n g Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 64
  65. 65. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor PHP Interpreter PHP Syntaxprüfung A n w e Ausführen n d DB u n g Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 65
  66. 66. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor PHP Interpreter PHP Syntaxprüfung A n w e Ausführen n d DB u n g Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 66
  67. 67. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor PHP Interpreter PHP Syntaxprüfung A n w e Ausführen n d DB u n g Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 67
  68. 68. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / PHP: Hypertext Preprocessor PHP Interpreter PHP Syntaxprüfung A n w e Ausführen n d DB u n HTML / Ausgabe g erzeugen Fest- platte Anfrage Antwort Alexander Stelter - snoopmedia GmbH 10.10.2009 68
  69. 69. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation  Browser -> Server -> Browser  Was ist ein Server?  Ablauf eines Webseitenaufrufs  Speichern von Daten  Formulare  PHP: Hypertext Preprocessor  Datenbanken Alexander Stelter - snoopmedia GmbH 10.10.2009 69
  70. 70. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Datenbanken z.B.: Was ist eine Datenbank?  Programm zur strukturierten Speicherung von Daten  Aufsplittung der Daten in Tabellen (Relationen)  „Benutzer“ sind eine Relation  „a.stelter“ ist ein Datensatz der Relation „Benutzer“  Lesen und Schreiben via Simple Query Language (SQL) z.B.: SELECT * FROM users; Alexander Stelter - snoopmedia GmbH 10.10.2009 70
  71. 71. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Datenbanken Alexander Stelter - snoopmedia GmbH 10.10.2009 71
  72. 72. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation  Browser -> Server -> Browser  Was ist ein Server?  Ablauf eines Webseitenaufrufs  Speichern von Daten  Formulare  PHP: Hypertext Preprocessor  Datenbanken  Formular -> PHP -> Datenbank Alexander Stelter - snoopmedia GmbH 10.10.2009 72
  73. 73. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Formular -> PHP -> Datenbank Alexander Stelter - snoopmedia GmbH 10.10.2009 73
  74. 74. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Formular -> PHP -> Datenbank Alexander Stelter - snoopmedia GmbH 10.10.2009 74
  75. 75. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Formular -> PHP -> Datenbank Alexander Stelter - snoopmedia GmbH 10.10.2009 75
  76. 76. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / Formular -> PHP -> Datenbank Alexander Stelter - snoopmedia GmbH 10.10.2009 76
  77. 77. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation Kommunikation  Browser -> Server -> Browser  Was ist ein Server?  Ablauf eines Webseitenaufrufs  Speichern von Daten  Formulare  PHP: Hypertext Preprocessor  Datenbanken  Formular -> PHP -> Datenbank  Asynchronous JavaScript and XML (AJAX) Alexander Stelter - snoopmedia GmbH 10.10.2009 77
  78. 78. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / AJAX Was ist AJAX?  JavaScript basierte Technik  Asynchrone Datenübertragung  Speichern / Bearbeiten von Daten ohne Reload der Seite  Dynamisches Verändern der Webseite aufgrund von Server Kommandos  Beispiele  Facebook Status Updates  Twitter Suche Alexander Stelter - snoopmedia GmbH 10.10.2009 78
  79. 79. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / AJAX Alexander Stelter - snoopmedia GmbH 10.10.2009 79
  80. 80. Workshop: Die „Rückseite“ des Internets kennenlernen B. Wie kommt Interaktion zustande? // Kommunikation / Speichern von Daten / AJAX Alexander Stelter - snoopmedia GmbH 10.10.2009 80
  81. 81. C. Wie kann ich eine Webseite bauen?
  82. 82. Workshop: Die „Rückseite“ des Internets kennenlernen C. Wie kann ich eine Webseite bauen? // Demo Time!! Demo Time!!  Was kann ich mit FireBug alles machen?  Web-Baukasten Jimdo.com  Einführung  Ausprobieren!! Alexander Stelter - snoopmedia GmbH 10.10.2009 82
  83. 83. Workshop: Die „Rückseite“ des Internets kennenlernen C. Wie kann ich eine Webseite bauen? // Demo Time!! Wichtige Links  http://de.selfhtml.org  http://www.jimdo.com  http://de.php.net Alexander Stelter - snoopmedia GmbH 10.10.2009 83
  84. 84. Workshop: Die „Rückseite“ des Internets kennenlernen Vielen Dank für Euer Interesse. Ihr findet uns online unter snoopmedia.com und bei Twitter twitter.com/snoopmedia! Alexander Stelter - snoopmedia GmbH 10.10.2009 84
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×