Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- fortbildungen:webdesign:2013-07-17 [17.07.2013 (06:54)] – [Übung: Plaintext-Dokument auszeichnen] kalt
+++ fortbildungen:webdesign:2013-07-17 [01.09.2025 (10:04)] (aktuell) – Externe Bearbeitung 127.0.0.1
@@ Zeile 5: / Zeile 5: @@
 ===== Input: Überblick =====
-Zunächst solltest Du Dir einen Überblick verschaffen, welche Arbeitsbereiche beim Veröffentlichen von Inhalten im Web (//web publishing//) wichtig sind. **[[fortbildungen:webdesign:ueberblick|]]**
+Zunächst solltest Du Dir einen Überblick verschaffen, welche Arbeitsbereiche beim Veröffentlichen von Inhalten im Web (//web publishing//) wichtig sind. **[[fortbildungen:webdesign-lernen:websites-erstellen|]]**
 ===== Input: Grundlagen HTML =====
-Nun kannst Du die Grundlagen von HTML (und später CSS) lernen.
+Nun kannst Du die Grundlagen von HTML (und später CSS) lernen. Hierzu habe ich als roten Faden eine Präsentation erstellt: [[http://download.herr-kalt.de/webdesign/|Erste Schritte ins Webdesign]]
 ===== Übung: Plaintext-Dokument auszeichnen =====
 Wende nun das Gelernte an.
@@ Zeile 15: / Zeile 14: @@
 <note>
 **AUFGABE**
-Formatiere den Inhalt der Datei ''{{:fortbildungen:webdesign:india-unformatiert.txt|}}'' so, dass die Struktur und die Darstellung im Browser der Datei ''{{:fortbildungen:webdesign:india-formatiert.pdf|}}'' entsprechen.
-</note>
-Du kannst den {{:fortbildungen:webdesign:html-spickzettel.pdf|HTML-Spickzettel als Hilfe benutzen.}}
+  - Speichere die Datei ''{{:fortbildungen:webdesign:india-unformatiert.txt|}}'' lokal auf Deinem Rechner und benenne sie in ''india-formatiert.html'' um.
+  - Formatiere den Inhalt der neuen HTML-Datei so, dass die Struktur und die Darstellung im Browser der Datei ''{{:fortbildungen:webdesign:india-formatiert.pdf|}}'' entsprechen.
+  - Öffne die Datei lokal im Browser, um das Ergebnis beständig zu überprüfen. Wenn Du Änderungen durchführst, muss Du die Darstellung im Browser jeweils neu laden (z.B. durch Drücken von <key>F5</key> (Windows) oder <key>⌘</key> <key>R</key> (Mac).
+<hidden onHidden="Lösungsdatei anzeigen" onVisible="Lösungsdatei verbergen">Hier kannst Du die korrekt formatierte HTML-Datei herunterladen, um Deine eigene Version zu prüfen. Entferne nach dem Download die Dateieindung ''.txt''.  ''{{:fortbildungen:webdesign:india-formatiert.html.txt|}}''</hidden>
+</note>
+Du kannst den **{{:fortbildungen:webdesign:html-spickzettel.pdf|HTML-Spickzettel}}** als Hilfe benutzen.
 ===== Übung: Weitere Elemente =====
 Erarbeite Dir weitere HTML-Elemente und vertiefe Dein Grundlagenwissen. Lies Dich dazu in das folgende Material ein:
@@ Zeile 29: / Zeile 32: @@
 Wende das neue Wissen an indem Du ein HTML-Dokument erstellst, das verschiedene HTML-Elemente (Text, Überschriften, Bilder, Videos etc.) enthält. Verwende hierfür z.B. Material aus der Wikipedia als Materialpool.
-===== Input/Erarbeitung: Creative Commons =====
+==== Tools ====
+  * [[http://www.loremipsum.de/|Blindtext-Generator]]
+==== Vorschau: Cascading Stylesheets (CSS) ====
+Wenn Du eine HTML-Datei entsprechend den Vorgaben erstellt hast, kannst Du Dir mit der folgenden CSS-Datei schon einmal einen Eindruck machen, wie das Ganze später aussehen könnte.
+''{{:fortbildungen:webdesign:webdesign.css|}}''
+Füge folgendes Markup zwischen ''<head>'' und ''</head>'' ein.
+    <link rel="stylesheet" type="text/css" href="webdesign.css" media="screen,projection" />
+===== Input/Erarbeitung: Creative Commons und digitale Abbildungen =====
+Ein erster Aspekt der Beschäftigung mit dem Urheberrecht ist das Wissen um Lizenzen. Hierbei sind Creative Commons-Lizenzen besonders vielversprechend.
+Außerdem solltest Du verstehen, wie digitale Abbildungen funktionieren.
+<note>
+**AUFGABE**
+  - Erarbeite Dir die [[arbeitsmethoden:creative-commons|Grundlagen von Creative Commons]].
+  - Lies Dich in die Grundlagen digitaler Abbildungen ein: [[arbeitsmethoden:digitale-abb|]].
+  - [Optional]: Außerdem kannst Du schon mal [[http://www.htmldog.com/guides/css/|in die Cascading Stylesheets reinschnuppern]].
+</note>
+<fs x-large>[[fortbildungen:webdesign:2013-07-18|Weiter zu Tag 2 »]]</fs>