Willkommen auf der Protopage von Los Wossis!

Alles was ihr schon immer mal über MS Word und HTML& CSS wissen wolltet, findet ihr hier.

Zum Beispiel wie ihr typische Fehler vermeiden könnt, und dabei jede Menge Zeit und Nerven spart.
Probiert es aus! Probieren geht über Studieren!

Unter Word findet ihr:

1. Anleitung zur Erstellung von Dokumentenvorlagen und  Formatvorlagen
2. Eine Dokumentenvorlage für Hausarbeiten
3. Die 10 Todsünden im Umgang mit MS Word

4. Hilfreiche Links zum Thema MS Word

Unter HTML&CSS findet ihr:

1. Anleitung zur Erstellung eines HTML-Dokuments

2. Die 10 Gebote im Umgang mit HTML/CSS

3. Hilfreiche Links zum Thema HTML/CSS

Ey Carramba und viel Spaß!                                       

Los Wossis

E-Portfolio von Antonia

E-Portfolio von Frederike

E-Portfolio von Petra
E-Portfolio von Luisa

• Thu November 15 - Lunchtime: Buy a new beanie hat

• Fri November 16 - 6pm: Go rollerblading

Projektauftrag

Eine “Wissenscollage” zur Strukturierung von Dokumenten in “MS Word” unter Benutzung von Dokumentvorlagen erstellen.

Den vollständigen Prozess zur Erstellung eines strukturierten und wohl formatierten Word-Dokuments vermitteln und in diesem Zusammenhang auf die Erstellung und Verwendung einer Dokumentenvorlage (.dot-Datei) eingehen.

Allgemeines Wissen für den Umgang mit Word-Dokumenten, insbesondere hinsichtlich typischer Fehler und deren Vermeidung darstellen.

1. Dokumentenvorlage

• Eine Vorlage ist ein Dokumententyp, der bereits bestimmte Vorgaben bezüglich einiger Elemente wie z.B. Text, Formatvorlagen und Formatierungen, Seitenlayout, (z. B. Ränder und Zeilenabstände), und Designelemente, (z. B. spezielle Farben, Ränder, Akzente) enthält.
• Mit einer Dokumentenvorlage könnt ihr viel Zeit sparen und sie direkt an eure Anforderungen, beispielsweise an eine Hausarbeit, anpassen.
  Word stellt eine Vielzahl von Vorlagen zur Verfügung, ihr könnt euch allerdings auch eigene Vorlagen je nach Bedarf erstellen.
• Speichert die Vorlage als "Wordvorlage", die ihr im Dateityp auswählen könnt.  (Datei>Speichern unter>Word-Vorlage) Die Erweiterung des dateinamens lautet .dotx (Office 2007).
• Erstellt das Deckblatt, das Inhaltsverzeichnis und eventuell das Literaturverzeichnis mithilfe von Formatvorlagen (siehe Todsünde 5 und 9). Bei dem Inhaltsverzeichnis sollte auf eine hierarchische Durchnummerierung der Kapitelüberschriften geachtet werden.

·         Seite einrichten (Datei > Seite einrichten):
Ränder:

      links 4 cm (für den Heftrand)
rechts 3 cm
oben 2, 5 cm
unten 2, 5 cm
Abweichungen hiervon nur, wenn die Einbindung von Tabellen/Grafiken erforderlich ist

·         Achtung: Die erste Seite einer Hausarbeit ist meistens unterschiedlich zum Rest der Arbeit gestaltet.

·         Deshalb: Datei > Seite einrichten > Layout > „Erste Seite anders“ (Haken setzen)

2. Formatvorlage einrichten

• Jetzt werden Formate für Überschriften, Absätze und sonstige anfallende Formatunterschiede eingerichtet.
•  Lasst euch die Formatierung anzeigen: nun können die systemeigenen Formate nach Bedarf eingerichtet werden.
• Häufig verwendet: das „Standard“ Format = Basis aller Formate.
• Alternative: eine eigene Formatvorlage erstellen.
• Für eine Hausarbeit relevante Formatierungen sind: Überschriften verschiedener Ordnungen, der Textkörper der Hausarbeit, externer Text (z.B. Deckblatt)
• Dieses Format sollte nun noch mit den wichtigsten Details gerüstet werden (nach den IfMK-Richtlinien)
• Zeilenabstand: 1,5
• Schriftart:Times New Roman, Bookman Old Style, Garamond
• Schriftgröße: 12
• Paginierung/Seitennummerierung: Die Seitenzählung beginnt mit der Einleitung mit Seite 1. Sie erfolgt dann fortlaufend mit arabischen Ziffern auf jeder Seite unten rechts oder in der Mitte.
• Achtung: Deckblatt und Inhaltsverzeichnis erhalten keine Seitenzahlen
• Literaturverzeichnis und Anhang werden ebenfalls paginiert.

Diese Dokumentenvorlage dient zur Erstellung einer Hausarbeit.

Deckblatt Dokumentenvorlage

Dokumentenvorlage

Fehlerhafte Hausarbeiten:

Fehlerhafte Hausarbeit Teil 1
Fehlerhafte Hausarbeit Teil2

Fehlerhafte Hausarbeit Teil3

Fehlerhafte Hausarbeit Teil4

Korrigierte Hausarbeiten:

korrigierte Hausarbeit Teil 1

korrigierte Hausarbeit Teil 2

korrigierte Hausarbeit Teil3

korrigierte Hausarbeit Teil 4

Das Deckblatt

Die folgenden Links sind hilfreich im Umgang mit MS Word.

Microsoft Office 2007 Homepage
Erstellung von Formatvorlagen
Tips zu MS Word
Arbeiten mit einer Word-Dokumentenvorlage

Du sollst Zeichen nicht mit einem Druck auf "Tab" oder die "Leertaste" einrücken.

• Die Verwendung von "Tab" oder der "Leertaste" führt z.B. bei einer Änderung der Schriftgröße zu erheblichen Problemen.
• Deshalb: einfach Cursor vor das einzurückende Zeichen setzen
• Dann: unter Format das Menü Absatz wählen und dort den Einzug des Zeichens /der Zeile vornehmen
• FORMAT ► ABSATZ

Du sollst einzelne Zeilen nicht durch einen Druck auf "Enter/Return" beenden (Abschnittswechsel am Ende jeder Zeile).

·         Die "Enter/Return"-Taste ist NUR für das Ende eines Absatzes notwendig!!!

·         MS Word erledigt den Zeilenumbruch automatisch.

·         Aber es kann natürlich auch innerhalb eines Absatzes ein Manueller Zeilenumbruch erzeugt werden,

·         dies geschieht mit der Tastenkombination "Shift + Enter

Du sollst (Seiten)-Umbrüche nicht durch mehrfaches Drücken auf "Enter/Return" erzeugen.

In MS Word gibt es 2 Varianten um Seitenumbrüche korrekt zu erzeugen

entweder

1. in der Menüleiste auf "Einfügen" klicken und dann den "Manuellen Umbruch" auswählen  

oder

2. mit der Tastenkombination "Strg + Enter"
(EINFÜGEN ► MANUELLER UMBRUCH/ Strg+Enter)

Du sollst Trennstriche nicht mit einem Druck auf auf die Bindestrichtaste einfügen.

Du sollst nicht wild im Text herumformatieren (Direkte Formatierung).

• Zur Textformatierung Formatvorlagen verwenden
• Entweder es werden eigene benutzerdefinierte Formatvorlagen erstellt:

FORMAT ► FORMATVORLAGEN UND FORMATIERUNG ► NEUE FORMATVORLAGE

• Oder die systemseitigen Formatvorlagen werden je nach Bedarf angepasst:

FORMAT ► FORMATVORLAGEN UND FORMAT► KONTEXTMENÜ: „ÄNDERN…“ 

• Unter „Anzeigen“ können „Alle Formatvorlagen“ eingeblendet werden. 

 Du sollst Listen nicht manuell mit z.B. „Sonderzeichen“ oder der Bindestrichtaste erstellen.

• Zur Erstellung von Listen und Gliederungen (wie z.B.: Aufzählungslisten und Nummerierungen) systemvorgegebene Vorlagen verwenden:

FORMAT ► NUMMERIERUNGS- UND AUFZÄHLUNGSZEICHEN

• oder eigene Listenformatvorlagen erstellen:

FORMAT ► NUMMERIERUNGS- UND AUFZÄHLUNGSZEICHEN ► LISTENFORMATVORLAGEN

Du sollst dein Dokument nicht rein visuell mit römischen oder arabischen Ziffern gliedern.

•  Wenn ihr ein Dokument strukturiert gliedern wollt, verwendet einfach die von Word vorgegebenen Gliederungsebenen: ANSICHT ► GLIEDERUNG
• Die Gliederungsansicht hilft euch bei der Kontrolle und Korrektur von Ebenen oder beim Übertragen von Daten zwischen Textkörper und Ebenen.
• Kleiner Tipp: Benutzt doch einfach die systemseitige Formatvorlagen „Überschrift 1...n“

FORMAT ► NUMMERIERUNGS- UND AUFZÄHLUNGSZEICHEN

• Dann suchst du dir unter dem Menüpunkt Gliederung eine passende Nummerierungsform aus 

GLIEDERUNG ► ANPASSEN

• Vorteil: Diesen Formatvorlagen sind schon systemseitig verschiedenen Gliederungsebenen zugewiesen

Du sollst Kopf- und Fußzeilen nicht manuell durch „Copy & Paste“ auf jeder Seite neu erstellen.

• Zum Positionieren von Elementen, die auf jeder Seite eines Abschnittes angezeigt werden sollen, verwendet Ihr die Ansicht „Kopf- und Fußzeile“

Du sollst Inhaltsverzeichnisse weder manuell erstellen noch in ein separates Dokument ausgliedern.

•  bei Word gibt es die Möglichkeit, verschiedene Formatvorlagen zu verwenden
• zum Beispiel Inhaltsverzeichnisse, Literaturverzeichnisse
• Diese können nach Belieben angepasst werden:

• Über den „Überarbeitungsmodus“ können Kommentare und Änderungen (insbesondere hilfreich bei Gruppenarbeiten) sehr einfach in das Dokument eingefügt werden

Entweder: ANSICHT ► SYMBOLLEISTEN ► ÜBERARBEITEN

Oder:        EINFÜGEN ► KOMMENTAR

• Außerdem können Änderungen von bestimmten Textabschnitten nachverfolgt werden
• EXTRAS ► ÄNDERUNG NACHVERFOLGEN
• Kleiner Tipp: Achtet darauf, dass die Funktion „Änderung nachverfolgen“ aktiviert ist

HTML - Hypertext Markup Language

• Eine Beschreibungssprache, die dazu dient, die Website bzw. deren Inhalte zu strukturieren und formatieren.

CSS - Cascading Stylesheets

• Ergänzungssprache für HTML zur Formatierung von HTML-Elementen

• CSS Funktionen (Bsp.): Festlegung der Schriftgröße und -farbe von Überschriften, Hintergrundfarben und Rahmen, Abstände definieren, Positionierung von Elementen im Anzeigefenster des www-Browers

Gruppenwebvisitenkarte Los Wossis

HTML:

PlanetHTML
SelfHTML
Exine.de
HTML World
HTML Seminar
HTML Einführung

Viedo Tutorial Teil 1

Video Tutorial Teil 2

CSS:

CSS4you

Fractatulum.net

Teachmetheweb.de

• Der Inhalt von HTML-Dateien steht in HTML-Elementen

• HTML- Elemente werden durch ein einleitendes (< ... >) und -zumeist- durch ein abschließendes (</ ... >) Tag markiert

• zum Erstellen einer HTML - Datei wird ein Editor benötigt

• Durch Verweise auf andere Hypertexte im Hypertext entsteht eine Vernetzung von Texteinheiten.

• Zum Planen von Websites ist ein genaues Konzept erforderlich.

• Hypertext enthält hierarchische Strukturen (Kapitel und Unterkapitel), verbindende Elemente (Querverweise), sowie unterschiedliche Informationszugänge (Inhaltsverzeichnisse, Stichwortverzeichnisse).

• Im Hypertext navigiert man, er beschreibt so z.B. an welcher Stelle ein Bild oder Text zu finden ist und wie eine Tabelle strukturiert ist.

• ein CSS - Stylesheet wird gekennzeichnet durch ein einleitendes <style type="text/css"> und ein abschließendes </style>

• ein CSS - Stylesheet kann entweder im Head-Bereich der HTML-Datei, oder aber in einer separaten Datei erstellt werden

• So ist es z.B. möglich mit einem Dokument 100 oder mehr Webseiten zu formatieren, ohne diese mit dem kompletten StyleSheet zu füllen. Dies bringt zum einen Platzersparnis (Speicherplatz) und zum anderen auch die Möglichkeit diese Formatierungen schnell zentral ändern zu können, ohne in jeder dieser 100 oder mehr Webseiten eingreifen zu müssen.

Eine gewöhnliche HTML - Datei besteht aus den folgenden Elementen:

• Dokumenttyp-Deklaration (Angabe der HTML-Version)
• Head-Bereich (Angaben zum Inhalt der Seite)
• Body-Bereich (anzuzeigender Inhalt der Seite)

Die HTML - Datei wird gekennzeichnet durch ein einleitendes <html> und ein abschließendes </html>

Eine Stylesheet - Angabe besteht immer aus der Eingabe und dem Wert, getrennt durch einen Doppelpunkt.

• die Eingabe ist hierbei das, was formatiert werden soll (z.B. Farbe - color),

• der Wert ist somit die Angabe, die Eigenschaft des zu formatierenden Aspekts (z.B. Farbcode)

 

Dokumententyp - Deklaration

Beispiel:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

• DOCTYPE HTML PUBLIC.: Bezug auf die öffentlich verfügbare HTML-DTD

• W3C: Herausgeber der DTD, also das W3-Konsortium

• DTD HTML 4.01 Transitional: Verwendung des Doukumenttyps HTML in der Sprachversion 4.01 und der Variante Transitional

• EN: Sprachenkürzel und steht für die Sprache, in diesem Fall Englisch

• DTD: Die Dokumenttyp-Deklaration enthält die Web-Adresse der Dokumenttyp-Definition (DTD). Die Angabe dieser Adresse ist nicht zwingend nötig.

Head - Bereich

• gekennzeichnet durch ein einleitendes <head> und ein abschließendes </head>

Der 'Kopf' der Datei ist meist der Teil im Hintergrund, den man kaum zu sehen bekommt. Hier werden die Dinge festgelegt, welche nicht so sehr das Aussehen und/oder die Struktur des Dokuments behandeln. Im head-Element sind folgende weitere Elemente möglich:

• Seitentitel/-name
• Skripte
• StyleSheets
• Meta-Angaben
• Bezüge zu anderen Seiten
• Basiseigenschaften

Die Reihenfolge der Elemente im head kann dabei beliebig sein. Die einzelnen Bestandteile werden im späteren Verlauf noch näher beschrieben. Beispiel:

<html>
<head>
 ... Angaben im HEAD ...
</head>
...
</html>

Body - Bereich

• gekennzeichnet durch ein einleitendes <body> und ein abschließendes </body>

Im 'Body-Bereich' der Datei befindet sich der Textkörper, das heißt der letztendlich anzuzeigende Inhalt der Website.

• um eine Grafik einzufügen, wird das Tag <img> verwendet

• 'src' steht für source, und gibt immer die Quelle des Bildes an

Beispiele

• aus Datei: <img src="beispielbild.gif">
• von anderer Website: <img src=http://www.beispiel.de/beispielbild.gif>

• zum Erstellen von Links werden die Tags <a href> und </a> verwendet

Beispiele

• <a href=http://www.beispiel.de/></a>
• Textlink: <a href=http://www.beispiel.de/>TitelDesLinks</a>