IG Metall Bremen im Internet NetKey 3.0 - Projekt 462

Inhaltsfolie 1 Pflichtenhefte Inhalte MUSS-Architektur Information Allgemein Seitenaufbau Seitenmanagement Information Inhalte das MUSS das KANN MUSS-Architektur Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 2

Inhaltsfolie (2) Die Navigation: Umsetzung Kontakt Presse Aktuelles Unser Team Service Umsetzung Maßnahmen 1 Maßnahmen 2 Wer kümmert sich? Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 3

Inhaltsfolie (3) Anhang 1 Html allgemein Html-Syntax gebräuchlichste html-Befehle 1 gebräuchlichste html-Befehle 2 gebräuchlichste html-Befehle 3 gebräuchlichste html-Befehle 4 Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 4

Inhaltsfolie (4) Anhänge 2 Erzeugung einer freien Liste html-Sequenzen Befehlssammlung Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 5

Allgemein - Pflichtenheft Information an Presse Information ins Internet Überlegung, ob populäre Adresse möglich Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 6

Seitenaufbau - Pflichtenheft Transparente Struktur Klare Navigation Kurze Ladezeiten Kein graphischer Schnickschnack (anim. Gif) Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 7

Seitenmanagement - Pflichtenheft Aktualitätsgrad bestimmen (z.B. wöchentl.) Abgesicherte Aktualisierung Verantwortlichkeiten festlegen Wer gibt Informationen? Wer verarbeitet die Informationen (Red.)? Wer hat Authorisation zur Änderung (Red.)? „Dienstweg“ festlegen: z.B. Kontrolle 1.BV Darf jemand informationell tiefer gehen? Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 8

Information - Pflichtenheft Schnellinformation (Schlagzeilen) Keine „Bleiwüsten“ Weitere Infos nur optional (Link) Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 9

Inhalte – das MUSS Das Willkommen (Opener) Adresse Wer macht was? Wann macht wer was ? Was liegt aktuell an (Schwerpunktthema) Presse Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 10

Inhalte – das KANN Arbeitsinhalte der Fachgebiete Termine Darstellung der Personengruppen Offene und / oder geschlossenes Forum Offener und / oder geschlossener Dialog Online-Services (z.B. Beitritt) Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 11

MUSS-Architektur Willkommen Unser Team Kontakt Aktuelles Presse Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 12

Die Navigation: Kontakt Aktuelles Presse Kontakt Aktualisiert am 01.01.01 von Nicole Schomaker Unser Team Hier kommt die Adresse hin Service Das hier ist die Tabelle mit den Öffnungszeiten Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 13

Die Navigation: Presse Aktuelles Presse Kontakt Aktualisiert am 01.01.01 von Nicole Schomaker Unser Team Hier kommen die Überschriften der Mitteilungen hin (interne Sprungbefehle) Service Hier kommen die Mitteilungen hin Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 14

Die Navigation: Aktuelles Presse Kontakt Aktualisiert am 01.01.01 von Nicole Schomaker Unser Team Überschriften von max. 3 Schwerpunktthemen (interne Sprungbefehle) Service Hier kommen die Themen hin Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 15

Die Navigation: Unser Team Aktuelles Presse Kontakt Aktualisiert am 01.01.01 von Nicole Schomaker Name, Tel.-Nr., E-Mail, Funktion, Aufgabenbeschreibung, unterstützt von: (Name, Tel.-Nr. + Fax, E-Mail) Unser Team Service Name, Tel.-Nr., E-Mail, Funktion, Aufgabenbeschreibung, unterstützt von: (Name, Tel.-Nr. + Fax, E-Mail) Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 16

Die Navigation: Service Aktuelles Presse Kontakt Aktualisiert am 01.01.01 von Nicole Schomaker Unser Team Service Name, Tel.-Nr., E-Mail, Aufgabenbeschreibung Dies betrifft nur Kasse und Mitglieder (auch im Gruppenbild) Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 17

Maßnahmen 1 Fotos Mitteilung an Porträtfotos der SekretärInnen (ident. Hintergrund) Gruppenfoto der Bürokolleginnen (alle) Gruppenfoto Service Gruppenfoto Bürokolleginnen ohne Service Foto des Gewerkschaftshaus Mitteilung an Presse Internetredaktion der IG Metall Bremer Stadtserver Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 18

Maßnahmen 2 Klärung populärer Web-Adresse (D. Wesp) Aufgabenbeschreibung Sekretäre / Service Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 19

Wer kümmert sich? Was? Wer? Bis wann? Fotos Web-Adresse Mitteilungen Aufg-Beschreib. Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 20

Anhang / html Für die Formatierung können neben den vorgegebenen Modulen auch Befehle aus der Programmiersprache Hypertext Markup Language (html) verwendet werden. In den vorgegebenen NetKey-Grund-Layouts besteht zusätzlich die Möglichkeit, eine Seite komplett nur mit html zu erstellen und die Einzelmodule nicht zu verwenden. Ebenso ist eine Mischform möglich, bei der in den Einzelmodulen html-Befehle integriert werden. Mit html lassen sich Befehlsketten (Sequenzen) erzeugen, welche einmal erstellt, mit ihrem Namen verwendet werden können und den Eingabeprozess erleichtern. Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 21

Anhang / Html-Syntax Kleinschreibung und englisch jeder Befehl begínnt mit < (Bsp: <b>) jeder Befehl endet mit /> (Bsp: </b>) Befehlskombinationen sind möglich; (Bsp: <b><i>) müssen aber einzeln wieder beendet werden, (Bsp: </b></i>) Farben werden als Wort oder Zahl definiert Bsp: dunkelblau ist darkblue oder 003366. Die Farbe Schwarz ist voreingestellt. Formatbefehle gelten i.d.R. bis zu ihrer Aufhebung (Ausnahme u.a.: <br> <p>) Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 22

Anhang / gebräuchlichste html-Befehle 1 <br> Zeilenumbruch (break) <p> Zeilenumbruch mit Leerzeile <b> fett (bold)</b> <font color=blue>blau</font> <center>zentriert</center> <p align=right>rechtsbündig</p align=right> <i>kursiv (italic)</i> Die Befehlskombination <b><i><font color=red>satzsatzsatzsatz</b></i></font><p> ergibt folgendes: Der satzsatzsatz wird fett, kursiv, rot dargestellt. Nach Satzende erfolgt ein Umbruch mit Leerzeile. Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 23

Anhang / gebräuchlichste html-Befehle 2 Aktivierung von Text (link im Text) Beispiel: Harald hat eine eigene Homepage. Befehl: Harald hat eine eigene <a href=http://www.harald-esker.de>Homepage</a>. Mit <a href (=high reference) wird der Beginn einer Adresse angekündigt, nach der Adresse wird durch >Homepage der Name der Adresse bezeichnet und anschließend wird mit </a> der Befehl geschlossen. Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 24

Anhang / gebräuchlichste html-Befehle 3 Aktivierte Personennamen (E-Mail) Mail-Adressen sind bei Eingabe automatisch aktiv (Antje.Edel@igmetall.de) In Fließtexten kann diese Art jedoch störend wirken. Besser ist: Für Nachfragen steht die Kollegin Antje Edel zur Verfügung. Der Befehl lautet: <a href=mailto:Antje.Edel@igmetall.de>Antje Edel</a> Mit mailto: wird das Folgen einer Mail-Adresse angekündigt; die anderen Befehlsbestandteile sind analog zu denen bei „link im Text“. Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 25

Anhang / gebräuchlichste html-Befehle 4 Interne Sprungbefehle werden zur schnellen Navigation innerhalb einer Seite benutzt, z.B. bei Teilüberschriften in langen Fließtexten Beispiel: <a href=#1>Zu Punkt 1<a/> <a href=#2>Zu Punkt 2<a/> <a href=#3>Zu Punkt 3<a/> <a name=1>Punkt 1. FließtextFließtext Fließtext Fließtext FließtextFließtext Fließtext <a name=2>Punkt 2. Fließtext FließtextFließtext Fließtext Fließtext FließtextFließtext Fließtext <a name=3>Punkt 3. Fließtext FließtextFließtext Fließtext Fließtext FließtextFließtext Fließtext Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 26

Anhang / Erzeugung einer freien Liste Ich will •die Namen •die Adressen •die Bilder in einer einfachen, freien Liste im Fließtext darstellen. Der Befehl lautet: Ich will <ol><li>die Namen</li><li>die Adressen</li><li>die Bilder</li></ol>in einer usw usw. <ol> = order list <li> = list Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 27

Anhang / html-Sequenzen Sequenzen dienen der Erleichterung In NetKey werden u.a. folgende Sequenzen für die Schriftformatierung eingesetzt: H1 { font-weight: bold; font-size: 22px; font-family: "Arial"; } Nicole H2 { font-weight: bold; font-size: 20px; font-family: "Arial"; } Nicole H3 { font-weight: bold; font-size: 18px; font-family: "Arial"; } Nicole H4 { font-weight: bold; font-size: 16px; font-family: "Arial"; } H5 { font-weight: bold; font-size: 14px; font-family: "Arial"; } So sieht <h2><i><u>Nicole</i></u></h2>aus. Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 28

Anhang / Befehlssammlung <b> fett <i> kursiv <u>unterstrichen <font color =blue> blau <br> Zeilenumbruch <p> Umbruch mit Leerzeile <p align=right> rechtsbündig <center> zentriert <h1> bis <h5 > Formatsequenz   (o. <>) geschützt. Leer- zeichen Bsp: IG&nbspMetall Harald Esker; IG Metall, Projekt HiT, 07/2001 Seite 29