...auf unserer Homepage Wir sind Studenten der Angewandten Medienwissenschaft an der Technischen Universität Ilmenau und eine Projektgruppe, die sich im Fach Elektronische Dokumentemit Protopage beschäftigt, wir sind: Christian Kowitz, Elisabeth Weber, Franziska Niedermeir und Lu Yang. Wenn Sie möchten stellen wir uns auch noch einmal genauer vor....
Ankündigung...
Für das nächste Semester ist ein Webprojekt vorgesehen, bei dem wir eine Konzeption für den Webauftritt des "Fördervereins Kinderkrippe Studentenflöhe e.V." erstellen werden.
Photos
Christian
Ich komme ursprünglich aus Jena (original Jenenser), darf mich aber seit etwa drei Jahren Ilmenauer Bürger nennen. Ich bin recht sportlich, habe aktiv Feldhockey gespielt. Mittlerweile spiele ich mehr Unihoc (von Universal-Hockey). Ich schreibe gern Beiträge für die Zeitung oder auch News im Netz oder mache in PR :), fahre gerne Fahrrad (mehr im Gelände), klettere ab und zu (mit Klettergurt und so) halte mich gern im herrlichen Thüringer Wald draußen auf und habe eine Schwäche für PC-Spiele. Ich interessiere mich für Sicherheitspolitik und bin einer der Staatsbürger in Uniform, wie man manchmal uns Reservisten bezeichnet. Ich bin im Naturschutzbund und in einer Hochschulgruppe von Amnesty International. Zudem bin ich Journalist und freier Mitarbeiter in der Lokalredaktion Ilmenau der Thüringer Allgemeinen. Auch wenn es manche(r) kaum glauben mag, in Ilmenau kann man positiv sehr viel Zeit verschwenden und es kann schonmal das Herz dran hängen bleiben und manchmal ist sogar der Himmel blau. Man muss nur Augen und Herz dafür öffnen ;)
IlmWebCastZwopunktNull
Lu
Ich komme aus China, bin 20 Jahre alt. Ich interessiere mich für Deutsche Kultur.
Elisabeth
Ilmenau ist nicht nur die Stadt in der ich studiere, sondern auch meine Heimatstadt. Auch wenn Ilmenau sehr klein ist, weiß ich die Umgebung und die frische Luft des Waldes sehr zu schätzen. :-) Ilmenau ist eben das was man draus macht. Ich bin sehr unternehmungslustig und fahre zum Ausgleich gerne Fahrrad.
Franzi
Ich komme aus der Nähe von München. Ich tanze gern und höre viel Musik. Ich reise gerne, verbringe soviel Zeit wie möglich mit meinen Freunden und beschäftige mich oft mit sinnlosen Dingen im Internet :)
Tutorials in Word und html/CSS
Rich sticky notes
Kleines Motivationsvideo
Wir präsentieren...
Unsere Aufgabe bei diesem Projekt war es, Tipps und Kniffe im Umgang mit Microsoft Word, dem html-Code und den Cascading Style Sheets (CSS), anwenderfreundlich auf einer Protopage-Homepage zu präsentieren. Sie sind herzlich eingeladen, sich umzuschauen oder über einen Link darunter eines dieser unserer Tutorials auszuprobieren. Oder schauen Sie sich doch einmal über den letzten Link hierunter an, was wir sonst noch großes vorhaben.
...im Umgang mit Word: Wir zeigen Ihnen in unseren „10 Geboten für den korrekten Umgang mit Word“ die üblichsten No-Goes und wie Sie es besser machen können. Wenn Sie dieses Tutorial abgeschlossen haben, sollten Sie in der Lage sein, eine eigene Dokumentenvorlage für Ihre wissenschaftlichen Arbeiten zu erstellen und zu verwenden. Mit einer vernünftigen Vorlage können Sie sich viel Ärger mit Word ersparen. Wir wünschen viel Erfolg!
Du sollst nicht mit einem Druck auf „Tab“ oder die „Leertaste“ einrücken!
So wird’s gemacht:
-> benutzen Sie für die Einstellung von Einzügen die Option „Absatz“ (Format > Absatz…).
2. Gebot
Du sollst einzelne Zeilen nicht durch einen Druck auf „Enter | Return“ beenden, nicht am Ende jeder Zeile einen Abschnittswechsel machen!
s o n i c h t !
So wird’s gemacht:
-> Schreiben sie ohne Druck auf die Entertaste Ihren Absatz weiter! Den Zeilenumbruch erledigt Word automatisch. Manuelle Zeilenumbrüche innerhalb eines Absatzes können mit „Shift+Enter“ realisiert werden. .
3. Gebot
Du sollst Seitenumbrüche nicht durch mehrfaches drücken auf „Enter | Return“ erzeugen.
s o n i c h t !
So wird’s gemacht:
-> Word stellt Ihnen verschiedene Arten von „Manuellen Umbrüchen“ zur Verfügung (Einfügen > Manueller Umbruch...). Schreiben Sie normal Ihren Absatz zu Ende! Dann können Sie einen manuellen Seitenumbruch z.B. mit „Strg + Enter“ erzeugen.
4. Gebot
Du sollst Trennstriche nicht mit einem Druck auf die Bindestrichtaste einfügen!
s o n i c h t !
So wird’s gemacht:
-> Trennstriche können Sie mit „Strg“ + „Bindestriche“ erzeugen. Nur diese Trennstriche verschwinden zwischen zwei Silben, wenn sich der Zeilenfall ändert. Sie können die Silbentrennung auch Word überlassen (Extras > Sprache > Silbentrennung).
5. Gebot
Du sollst nicht wild im Text herumformatieren, nicht direkt formatieren!
So wird’s gemacht:
-> Die Textformatierung sollte überwiegend mit Textformatvorlagen erfolgen. Dazu ist es nicht unbedingt notwendig benutzerdefinierte Textformatvorlagen zu erstellen. Sie können ebenso die Einstellungen der systemseitigen Formatvorlagen (z.B. „Standard“ oder „Überschrift 1“) nach Belieben angepassen (Format > Formatvorlagen und Formatierungen...). Der gleichnamige Aufgabenbereich wird rechts eingeblendet. Bei Bedarf können „Alle Formatvorlagen“ unter Anzeigen eingeblendet werden. Eigenschaften können über das Kontextmenü „Ändern...“ angepasst werden.
6. Gebot
Du sollst Kommentare und Änderungen nicht durch manuelle Formatierung (z.B. durch Farbänderung von Text) erstellen!
s o n i c h t !
So wird’s gemacht:
-> Word bietet hierfür den Überarbeitungsmodus (Ansicht > Symbolleisten > Überarbeiten). Mit diesem sind, beispielsweise bei einer Gruppenarbeit mit einem Dokument, andere Bearbeiter in der Lage Ihre Änderungen genau nachzuvollziehen und Kommentare einzufügen. Word markiert jede Änderung und merkt sich gelöschten Text sobald sie den Änderungen-Nachverfolgen-Button aktiviert haben.
Änderungen Nachverfolgen in Word
7. Gebot
Du sollst Dein Dokument nicht rein visuell mit römischen oder arabischen Ziffern gliedern!
So wird’s gemacht:
-> Zur strukturierten Gliederung eines Dokuments sollten Sie Gliederungsebenen verwenden (Ansicht > Gliederung. Die Gliederungsansicht dient zur Kontrolle und Korrektur von Ebenen oder zum Konvertieren von Textkörper in Ebenen. Den systemseitig mitgelieferten Textformatvorlagen wie z.B. „Überschrift 1“ sind schon Ebenen zugewiesen. Es bietet sich also an, diese zu verwenden bzw. anzupassen.
8. Gebot
Du sollst Kopf- und Fußzeilen nicht durch Copy&Paste auf jede Seite einzeln einfügen!
So wird’s gemacht:
-> Besser ist es, die Kopf- und Fußzeilenbereiche zu verwenden. Sie finden sie unter dem Reiter Ansicht im Dialogfeld „Kopf- und Fußzeile“ (Ansicht > Kopf- und Fußzeile). Hier erhalten Sie eine Symbolleiste mit welcher Sie Seitenzahlen, Datum aber auch Grafiken in diesen Bereich einfügen können.Vorschläge erhalten Sie unter „AutoText einfügen“.
9. Gebot
Du sollst Listen nicht manuell z.B. „Sonderzeichen“ oder Bindestrichtaste erstellen!
So wird’s gemacht:
-> Word bietet Ihnen zur Erstellung von Listen und zur Gliederung Ihres Textes zahlreiche Möglichkeiten im Dialogfeld „Nummerierung und Aufzählungszeichen“ (Format > Nummerierung und Aufzählungszeichen...). Darin können Sie einfache Aufzählungen, Nummerierungen oder Gliederungen anfordern. Unter dem Reiter Listenformatvorlagen können und sollten Sie diese selbst an Ihre Bedürfnisse anpassen.
10. Gebot
Du sollst Inhaltsverzeichnisse weder manuell erstellen noch in ein seperates Dokument auslagern!
So wird’s gemacht:
-> Haben Sie eine entsprechende Gliederung zu Ihren Abschnitten und Textfomatvorlagen ihren Überschriften, sowie Ebenen zugeordnet (wie im 5.Gebot erwähnt), können Sie nun von Word ein Inhaltsverzeichnis über eine Feldfunktion, an der Stelle wo sich Ihr Cursor befindet, automatisch erstellen lassen (Einfügen > Referenz > Index und Verzeichnisse). Dieses können Sie im sich öffnenden Dialogfeld anpassen, z.B. das Aussehen des Verzeichnisses und die Erscheinung der Seitenzahlen etc.
Inhaltsverzeichnisse automatisch erstellen lassen
So Erstellen Sie eine eigene Hausarbeitsvorlage...
Wir wollen Ihnen hier nun wichtige Punkte zum Erstellen einer Hausarbeitsvorlage geben. Eine Wordvorlage hat den Vorteil, dass Sie nicht jedesmal auf's Neue eine Wissenschaftliche Arbeit von vorne bis hinten formatieren müssen. Dadurch sparen sie sich in Zukunft beispielsweise Aktionen wie Seitenränder Einstellen und Inhaltsverzeichnis erstellen :) Wir erklären nun kurz wie wir unsere Vorlage erstellt haben, die wir Ihnen auch hier auf dieser Website bereitstellen.
1. Seitenränder einstellen Als erstes wollen wir die Seitenränder einstellen (Datei > Seite einrichten). Wir können hier einfach die gewünschten Seitenabstände eingeben. Seitenränder haben bei uns formal-praktische Gründe. Bei unserer Vorlage stellen wir links 4cm, rechts 3cm, oben&unten 2,5cm ein.
2. Zeilenabstand einstellen Der Zeilenabstand erleichtert dem Korrektor der Arbeit, das Einfügen von Notizen/Kommentaren an bestimmten Textpassagen.Wir stellen hierzu den Zeilenabstand auf 1,5 (Format > Absatz).
3. Deckblatt erstellen Auf unserem Deckblatt steht dann Institut, Fachbereich, Fachbetreuer (linke obere Ecke, Thema und Untertitel der Arbeit (etwa auf Höhe einer gedachten Drittellinie und zentriert), Autor mit Adresse (darunter, ebenfalls zentriert). Wir haben uns für den Titel eine Textformatvorlage erstellt (Format > Formatvorlagen und Formatierung, siehe auch 5. Gebot).
4. Kapitelüberschriften Erstellen und mit Formatvorlagen belegen Nun formatieren wir unsere Kapitelüberschriften („Einleitung“, „Hauptteil“, „Fazit“,„Quellenverzeichnis“ und „Anhang“) mit der Textformatierungsfunktion (Format > Formatvorlagen und Formatierung). Anschließend weisen wir Ihnen in der Gliederungsansicht die richtigen Gliederungsebenen zu (bei uns Ebene 1) und verpassen Ihnen eine entsprechende Nummerierung (Format > Nummerierung und Aufzählungszeichen > Gliederung). Wir verwenden die Nummerierungsvariante der reinen Ziffernnnumerierung ohne Punkt (z.B. "1" verknüpft mit Ebene 1 und Überschrift 1, und "1.1" verknüpft mit Ebene 2 und Überschrift 2 usw.).
5. Kopf- und Fußzeilen einfügen Um die Seitenzahlen einzufügen arbeiten wir mit Fußzeilen (siehe 8.Gebot). Die Seitenzahlen stehen bei uns rechtsbündig könnten aber auch zentriert stehen. Die Seitennummerierung sollte erst mit der Seite nach dem Inhaltsverzeichnis (also bei uns ab Seite 3) beginnen.
...Fortsetzung
6. Inhaltsverzeichnis erstellen Zum Schluss haben wir das Feld für das Inhaltsverzeichnis (Einfügen > Referenz > Inhaltsverzeichnis, siehe 9.Gebot ) erstellt. Es steht, wie normalerweise üblich, auf der Seite 2.
7. ...und fertig! Somit haben wir eine Dokumentenvorlage mit den wichtigsten Punkten erstellt. Also kann es nun an den Inhaltlichen Teil der Hausarbeit gehen! :)
Auf dieser Seite zeigen wir 10 Gebote die den Umgang mit html und CSS erleichtern. Wenn Sie dieses Tutorial abgeschlossen haben, sollten Sie in der Lage sein, weitestgehend problemfrei Informationen auf Ihrer Website zu organisieren. Sollten Sie Abkürzungen und Begriffe nicht kennen, können Sie gerne unser Wikizu Rate ziehen. Wir wünschen viel Erfolg!
Achte auf eine gute Struktur! → "well- formed HTML"!
Wichtig ist, dass Sie auf richtige Grundgerüst einer HTML Seite und die korrekte Schachtelung (Hierarchische Struktur) der HTML Elemente achten. Bedenken Sie, dass die Abarbeitung der Befehle chronologisch, Schritt für Schritt erfolgt. Deswegen sollten Elemente an der richtigen Stelle eingesetzt werden, da auch nur dann das korrekte Ausführen der Befehle klappt.
Beispiel
So sieht's aus:
<h1><i>HTML</i> - die Sprache des Web</h1>
das i - Element steht für italic (=kursiver Text). Der Text zwischen <i> und </i> wird als kursiv interpretiert, abhängig von der eingestellten Schriftart und Schriftgröße für die Überschrift 1.
2. Gebot
Achte auf den richtigen Umgang mit HTML Tags!→ "well- formed HTML"!
Start- Tags werden immer mit dem dazugehörigem End- Tag geschlossen
aus Kompatibilitätsgründen zu XHTML wird empfohlen :
auch Elemente ohne Inhalt wie z.B. <br>, <img> immer zu schließen: <br />, <img />
">< Element- und Attributnamen immer klein zu schreiben (z.B. <a href = http://www.ifmk.de> Das ist ein Link</a>)
setzen Sie Attributwerte immerin Anführungsstriche(z.B. src=“blume.jpg“ oder alt = „Das Photo zeigt eine Sonnenblume“
verwenden Sieimmer Entitäten (z.B. für „ä“ → „ä“)
Sonderzeichen
ä → ä
Ä → Ä
ö → ö
Ö → Ö
ü → ü
Ü → Ü
ß → &szllg;
€ → €
Spezialzeichen
& → & ("Ampersand")
< → < ("lower than")
> → > ("greater than")
" → " ("Quote")
3. Gebot
Setzen von korrekten Hyperlinks! → "well- formed HTML"
Achten Sie bei der Verlinkung von elektronischen Dokumenten auf die korrekte Pfadangabe!
Man unterscheidet absolute und relative Pfade.
Absolute Pfade werden bei Links zu externen Webseiten gesetzt.
Relative Pfade dagegen werden bei der Darstellung von eingebundenen Bildern benutzt, damit diese bei der Darstellung der HTML Seiten auch auf jedem System offline angezeigt werden können. Dies gilt auch für interne Unterseiten eines HTML- Projektes.
Ganz wichtig: Achten Sie auf Groß- und Kleinschreibung!
4. Gebot
Du sollst die strikte Trennung von Inhalt und Layout beachten!
HTML strukturiert eine Seite und sollte nicht beschreiben wie sie aussieht. CSS dient zur Gestaltung der Seite. Beachten Sie dies schon mit Beginn der Erstellung, eine nachträgliche Anpassung ist oft unnötig und zeitaufwändig.
5. Gebot
Du sollst nicht mit Attributen oder Elementen formatieren, die den Status „deprecated“ haben!
Viele Formatierungselemente und Attribute in HTML verstoßen gegen die strikte Trennung von Inhalt und Layout. Demnach sollten sie nicht mehr verwendet werden und erhalten den Status „deprecated“ (z.B. „font-Tag“). Verwenden Sie deshalb ausschließlich Logische Auszeichnungen (z.B. „em-Tag“ oder „strong-Tag“) anstatt Physikalischen Auszeichnung bzw. Visuellen Auszeichnung (z.B. „i-Tag“ oder „b-Tag“).
6. Gebot
Du sollst eine HTML-Seite nicht mit Layouttabellen gestalten!
Die Verwendung von Layouttabellen verstößt gegen die strikte Trennung von Inhalt und Layout. Inzwischen ist es ohne Probleme möglich tabellenfreie Layouts mit CSS zu erstellen.
7. Gebot
Du sollst auf zu viele Animationen, unterschiedliche Textfarben und Schriftarten verzichten!
Zu viele verschiedene Formatierungen und blinkende Layoutelemente können leicht Verwirrung schaffen, den Nutzer stressen, sind nicht immer lesbar und lenken vom Inhalt ab.
8. Gebot
Du sollst für z.B. Grafiken und Formularelemente immer auch eine Beschreibung mittels „alt-Attribut“ hinzufügen!
Verwenden Sie stets das „alt-Attribut“ um Grafiken, Bilder, Formularelemente, Applets etc. zu beschreiben. So geben Sie jedem Nutzer (z.B. auch Blinden die sich Seiten elektronisch vorlesen lassen) die Chance, die Inhalte zu erfassen.
9. Gebot
Du sollst Nutzergruppen nicht durch Aussagen wie: „optimiert für Internet Explorer 4.1, SeaMonkey 5.0, etc.“ oder die Verwendung von horizontalen Scrollleisten ausschließen!
Nicht alle HTML-Eigenschaften und CSS-Regeln funktionieren in jedem Browser. Es handelt sich dabei meist um zusätzliche Layouteffekte. Versuchen Sie sich auf die gängigen CSS-Regeln zu beschränken, die auf allen Browsern funktionieren. Die ggf. ein wenig abweichende Darstellung einer Seite auf unterschiedlichen Browsern ist dabei nicht gemeint. (In den meisten Werken zu HTML & CSS sind CSS Referenzkarten enthalten, die anzeigen welche CSS-Regeln von den gängigen Browsern unterstützt werden).
Horizontale Scrollleisten sind nicht benutzerfreundlich. Hierbei kann nicht ausgeschlossen werden, dass der Inhalt teilweise oder gar nicht wahrgenommen wird. Abhilfe schafft eine feste horizontale Seitenbeschränkung und die automatische Verwendung von vertikalen Scrollleisten in CSS.
10. Gebot
Du sollst Metainformationen sinnvoll einsetzen!
Erweitern Sie Ihre HTML-Seite mit sinnvollen Zusatzinformationen und vermeiden Sie überflüssige Informationen bzw. Wiederholungen. Vermeiden Sie den Missbrauch von Metainformationen zum eigenen Vorteil (z.B. Werbung, gezieltes Ranking z.B. bei Suchmaschinen, Spam).
Glückwunsch! Sie kennen nun wichtige Tips zum Erstellen von HTML Seiten!
Wir sind ein Team aus Studenten der Angewandten Medienwissenschaft des Matrikels 2007 an der Technischen Universität Ilmenau. Wir stammen alle aus unterschiedlichen Regionen und ein Mitglied kommt sogar aus dem fernen China.
Christian : Korrektur/Amendment Elisabeth : Contentmanagement Franziska : Design/Layout Lu : Realization/Skript coder
Im ersten Semester haben wir eine Protopage erstellt, auf der wir den korrekten Umgang mit Word, HTML und Cascading Style Sheets erläutern. Besuchen Sie uns: Klick hier
In Zukunft wollen wir uns mit der Erstellung einer Webvisitenkarte für den Förderverein Kinderkrippe Studentenflöhe” e. V. der TU Ilmenau beschäftigen. Das Ziel des Projektes ist die Vorstellung der Kinderkrippe und ihres Angebotes. Außerdem soll die Seite gestressten Eltern die Informationsbeschaffung erleichtern. Dies wollen wir beispielsweise durch ein Portal in dem die Eltern sich online mit Fragen an die Krippe wenden können, erreichen.
Formatvorlagen: Dateien oder auch programminterne Funktionen, die Ihnen erlauben bestimmte Sachen wie Schriftarten, Größen, Erscheinungsbild zunächst einmalig anzupassen und im weiteren öfter für verschiedene Dokumente zu verwenden. Word liefert schon zahlreiche Formatvorlagen ohne ihr Zutun. HTML : HyperText Markup Language. Die beliebteste Auszeichnungssprache. HTML beruht auf SGML und konzentriert sich somit auf die logische und strutkturelle Auszeichnung von Texten. CSS: Cascading Style Sheets (engl.) kaskadierender, also in Reihe (öfter) verwendbarer html-ähnlicher Quellcode der das Erscheinungsbild des Darzustellenden organisiert.
The whole website is assembled for screen resolution 1280 x 1024 pixels
Lu
I’m originally from the middle of China. I am interested in German culture, people an history and try to meet and get to know many people here. I also like to travel a lot and have been to many different countries. I learned to speak German in Munich, because I lived there for one and a half years when I was twelve years old.
Elisabeth
Ilmenau not only represents the city where I study, it’s my hometown too. In spite of the fact, that Ilmenau is a small town, I’m getting joy in its beautiful landscape setting and the fresh, clean air by the woods. :-) Ilmenau is just the thing you work out. I am very enterprising and ride bike for getting distance from studying - of course in our Thuringian Forest.
Franzi
I’m originally from near Munich. I like dancing and I often listen to Music. I like travelling. I spend lots of time meeting my friends and doing things together. Or I spend time with surfing the internet aimlessly.
Christian
I originally come from the city Jena, and have got the privilege of calling me a citizen of Ilmenau since three years. I am a rather sporty type and played field hockey actively. In present I play Unihoc (from Universal Hockey). I like writing articles for a newspaper or news in the internet or doing in PR. :), riding bike (preferred off road), or climbing sometimes (with belt a.s.o.). I like to be outside in the Thuringian Forest and I have a penchant for PC-Games. I’m interested in security policy and I am one of the so called uniformed state-citizen, how members of the army reserve are titled sometimes. I am member in the club “Naturschutzbund” and in one of the college-groups of Amnesty International. If many a can’t imagine too, but in Ilmenau you can positively spend very much time and you can loose your soul on it and sometimes even the sky is blue. You only have to open your eyes and mind for it.
Rich sticky notes
Welcome...
...to our homepage We are Students in applied media science at the german college Technical University of Ilmenau and further a projects group for the subject eletronic documentswhich is occupied with Protopage, we are:Christian Kowitz, Elisabeth Weber, Franziska Niedermeir und Lu Yang. If you like to find out more about us, read further....
Our task in this project was giving hints and secrets in using Microsoft Word, html-code and Cascading Style Sheets (CSS) in a userfriendly way by using Protopage. You are invited cincerly to take a look around or follow the link in the down under to try one of these, our tutorials.