Projektdokumentation SharePoint Homepage

Transkript

1 Projektdokumentation SharePoint Homepage Sommersemester 2012 Tubis I Betreuer: Teammitglieder: Prof. Dr. Rehfeldt Herr Fauler Bücheler, Uwe Dieterle, Daniel 1

2 Eidesstattliche Erklärung Ich erkläre hiermit an Eides statt, dass ich die vorliegende Arbeit selbstständig und ohne unerlaubte Hilfsmittel angefertigt habe; die aus fremden Quellen direkt oder indirekt übernommenen Gedanken sind als solche kenntlich gemacht. Die Arbeit wurde bisher keiner Prüfungsbehörde vorgelegt und auch noch nicht veröffentlicht. Ich bin mir bewusst, dass eine unwahre Erklärung rechtliche Folgen haben wird. Bücheler, Uwe Punkt 3 Webdesign Punkt 5 Aufbau der Homepage Punkt 7 Leitfaden Ort, Datum.. Unterschrift Dieterle, Daniel Punkt 1 Projektbeschreibung Punkt 2 SharePoint Punkt 4 Urheberrechte Punkt 6 Datenflussplan zur Einpflege der Daten Ort, Datum.. Unterschrift 2

3 Inhaltsverzeichnis Inhaltsverzeichnis Projektbeschreibung SharePoint Beschreibung Anwendung Webdesign Die Drittelregel Symmetrie und Asymmetrie Farbauswahl Urheberrechte Allgemein Website Aufbau der Homepage Datenflussplan zur Einpflege der Daten Leitfaden Formatvorgaben Anlegen von neuen Seiten Hochladen von Bildern, Dokumenten und Videos Aufbau einer Projektseite Erstellen von Tabellen Einbinden von Bildern Verlinken Einbinden von Videos Kontaktdaten hinzufügen Abbildungs- und Tabellenverzeichnis Quellenverzeichnis

4 1. Projektbeschreibung Im Rahmen der Vorlesung Tubis 1 Technische und Betriebliche Informationssysteme 1 hat die Projektgruppe T6 SharePoint Homepage die Aufgabe eine Projektplattform zu erstellen. Dort soll es möglich sein, sämtliche Projekte der anderen Gruppen, welche während des Sommersemesters 2012 bearbeitet werden, als auch sämtliche dokumentierten Tubis 1 Roboterprojekte vergangener Semester, darzustellen. Zum Aufbau der Plattform soll von dem Projektteam das Content Management System SharePoint von Microsoft verwendet werden. Die damit erstellte Website soll als Teil des Internet Auftritts der Hochschule in dessen vorhandene Systemarchitektur eingebunden werden. Unter einem besonders wichtigen Gesichtspunkt steht dabei die ansehnliche Darstellung der verschiedenen SharePoint Seiten, um diese in naher Zukunft der Öffentlichkeit zur Verfügung zu stellen und damit den Standort Albstadt- Sigmaringen noch attraktiver darstellen zu können und außenstehenden Personen einen besseren Einblick in die Tätigkeiten der Hochschule zu ermöglichen. Bei der Erstellung der neuen Tubis 1 Projektseite muss daher penibel auf die Richtigkeit und Fehlerlosigkeit der darzustellenden Daten geachtet werden. Außerdem wird parallel zu dieser Projektseite eine englische Version ausgearbeitet, um die Ergebnisse der Vorlesung Tubis 1 auch ausländischen Besuchern der Homepage präsentieren zu können. Ein weiterer wichtiger Aspekt des Projektes SharePoint Homepage betrifft die Koordination der anderen Projekte. So ist es Aufgabe des Projektteams, die vorgegebenen Daten sämtlicher anderer Gruppen zusammenzutragen und in die zu erstellende Website einzupflegen. Des Weiteren wird den Projektgruppen ein Musterlayout für ein Übersichtsplakat, welche als Poster zusammengefasst und zur Illustration ausgehängt werden sollen, zur Verfügung gestellt. 4

5 2. SharePoint 2.1. Beschreibung Das Content Management System SharePoint ist eine Software von Microsoft und dient im Allgemeinen zur Erstellung von Websites bzw. genauer gesagt von Plattformen, auf denen Informationen ausgetauscht werden können. So kann SharePoint als Business Plattform für die Zusammenarbeit im Unternehmen, als auch im Web, genutzt werden. Dabei ergeben sich verschiedenste Anwendungsmöglichkeiten; vom Intranet, Extranet bis zur Erstellung einer gesamten Internet Homepage. (Microsoft, 2012) An der Hochschule findet SharePoint in der Gestaltung des Hochschulauftritts Anwendung. So wurde die komplette Internetseite der Hochschule Albstadt- Sigmaringen mit SharePoint 2007 erstellt und eine einheitliche System-Architektur in einem übersichtlichen Layout geschaffen. Die einzelnen SharePoint Seiten mit den diversen Daten sind dabei über eine feste Navigation miteinander verknüpft und lassen sich über einen handelsüblichen Web-Browser betrachten. Die Pflege der verschiedenen Seiten mit den Inhalten der Website, sowie das Erstellen neuer Seiten, die innerhalb der Website aufgerufen werden können, finden ebenso mit SharePoint statt Anwendung Die Arbeit mit SharePoint erfordert eine gewisse Eingewöhnungszeit ist aber doch relativ selbsterklärend und benutzerfreundlich. Die Website der Hochschule Albstadt-Sigmaringen ist dabei wie bei SharePoint üblich in verschiedene Ansichten unterteilt. Neben der dargestellten Seite (Abb.1: Hochschulseite Darstellung), wie man sie im Webbrowser sieht, kann man so in andere Bereiche wechseln um sich sämtliche Websiteinhalte und hinterlegten Daten der jeweiligen Seite anzeigen lassen. 5

6 Headerbereich Hauptnavigation Metanavigation Subnavigation Inhaltsbereich Footerzeile (Anschrift, etc.) Abb. 1: Hochschulseite Darstellung (eigene Darstellung) Die Datenpflege der verschiedenen Seiten erfolgt ausschließlich über den Internet Explorer ab Version 6.0 und nur innerhalb des Web-Browsers. Bei der Pflege der Daten und dem Erstellen neuer Seiten werden die Benutzer nach Art der Rechte in verschiedene Kategorien eingeteilt. So gibt es Administratoren, Besitzer und Editoren. Dem Administrator obliegt die zentrale Steuerung der Homepage. Er kann auf sämtliche Bereiche zugreifen, neue Benutzer anlegen bzw. auch die erforderlichen Berechtigungen vergeben. Die Rechte der Besitzer dagegen sind eingeschränkter. Neben der Datenpflege können diese neue Seiten erstellen bzw. die Navigation bearbeiten. Editoren, zu welcher Gruppe auch das Projektteam SharePoint Homepage zählt, haben nur grundlegende Rechte. Wie bereits erwähnt gibt es auf den Hochschulseiten ein unveränderbares Layout und eine feste Navigation. Durch diese vorhandene System-Architektur der Hochschulseite ist es den Editoren nur bedingt möglich, Änderungen vorzunehmen. Dazu gehören 6

7 etwa das Verändern bestimmter Inhalte ( Inhaltsbereich) sowie die Erstellung neuer Seiten. Gerade diese Funktion erlaubt es aber dem Projektteam SharePoint die von der Aufgabenstellung geforderte Plattform zur Darstellung der gesamten Projekte von Tubis I aufzubauen. So können sämtliche Projekte als separate neue Seite erstellt und letztendlich über die diversen Funktionen bei SharePoint miteinander verknüpft werden. Damit können die einzelnen erstellten Projektseiten in die vorhandene Systemarchitektur eingebunden und in einem ansehnlichen Layout veröffentlicht werden. Bei der Erstellung einer neuen Seite innerhalb eines Bereiches ergeben sich dem Editor verschiedene vorgegebenen Templates, umso ein einheitliches Layout sicherzustellen. 7

8 3. Webdesign Eine gute Internetseite soll auf schnelle Art und Weise viele Informationen liefern. Eine Webseite sollte ebenso ansprechend und harmonisch auf den Nutzer wirken. In diesem Kapitel werden die Grundprinzipien des modernen Webdesigns gezeigt und erklärt Die Drittelregel Die Drittelregel wird angewendet, wenn Elemente besondere Aufmerksamkeit anregen sollen. Diese Regel wird nicht nur im Webdesign angewendet. Jeder Grafiker, Fotograph oder Designer verwendet diese Regel zum Erstellen von Grafiken. Will man also Elemente richtig in den Mittelpunkt setzen, muss das Sichtfeld in drei horizontale und 3 vertikale Felder eingeteilt werden. Die größte Aufmerksamkeit ist zu erzielen, wenn die Elemente an den Ecken des in der Mitte stehenden Feldes platziert werden. Sollen Elemente nicht die größte Aufmerksamkeit besitzen, so sind sie in den äußeren Feldern zu platzieren. Abb. 2: Die Drittelregel (Quelle: Manuela Hoffmann Modernes Webdesign(2009)) 8

9 3.2. Symmetrie und Asymmetrie Eine andere Art die Aufmerksamkeit des Betrachters zu erzielen ist der Aufbau der Webseite. Dabei gibt es zwei grundsätzliche Möglichkeiten. Symmetrie Bei der symmetrischen Anordnung soll eine harmonische Balance erreicht werden. Dabei werden Elemente gleichmäßig in Zeilen und Spalten aufgeteilt. Diese Einteilung ist an einem Beispiel einer Webseite eines Shops (Abb. 3) zu erkennen. Außerdem wurde bei dieser Webseite die Drittelregel angewendet. Dies ist an den Buttons Lampen und Leuchten zu erkennen. Hier macht diese Anwendung auch Sinn, da ein Shop sofort die Aufmerksamkeit auf die Produkte legen muss. Die anderen Buttons wurden nach der Drittelregel in den äußeren Feldern platziert Abb. 3: Symmetrische Webseite (Quelle: Manuela Hoffmann Modernes Webdesign(2009)) 9

10 Asymmetrie Bei der Asymmetrie hingegen werden keine Vorgaben zur Einteilung gemacht. Dabei kann frei gewählt werden an welchen Stellen die Elemente platziert werden sollen (Abb. 4). Aus diesem Grunde wird bei dieser Art die Drittelregel nicht angewendet. Asymmetrische Webseiten sollen den Nutzer auffordern sich aktiver mit der Seite zu beschäftigen. Abb. 4: Asymmetrische Webseite (Quelle: Manuela Hoffmann - Modernes Webdesign (2009)) 3.3. Farbauswahl Die Auswahl der Farben für die Webseite spielt eine ganz große Rolle. Dabei steht vor allem die Farbpsychologie im Mittelpunkt. Diese besagt, dass jede Farbe eine andere Wirkung hat. So steht z.b. die Farbe Blau für Harmonie, Treue, Vertrauen Sachlichkeit, aber auch Distanz und Kälte. Deshalb ist es sehr wichtig die richtige Farbauswahl zu treffen, die auch mit der Gestaltung, Umgebung oder mit möglichen Logos zusammenpassen. 10

11 Aber auch die Farbkontraste spielen eine ganz wichtige Rolle. Darunter versteht man die Wahrnehmung von Farben in ihrem Umfeld. Als Beispiel können die folgenden Beispiele herangezogen werden. Abb. 5: Farbkontraste (Quelle: Manuela Hoffmann - Modernes Webdesign (2009)) Auf allen 3 Bildern wird der Kontrast und somit die Wirkung der Farben deutlich. So heben sich im linken Bild die Farben Dunkelblau und Gelb deutlich voneinander ab. Bei den Quadraten unterhalb und dem mittleren Bild ist dies aufgrund des ähnlichen Farbtons nicht der Fall. Im rechten Bild sticht der rote Fleck in nahezu allen Quadraten heraus. Grund dafür ist der Farbtonunterschied, der deutlich zu erkennen ist. Der Einsatz von Farben spielt deshalb eine wichtige Rolle. Einerseits regen Farben zu mehr Freude beim Lesen oder Erkennen bestimmter Sachen auf, andererseits können Farben gewisse Dinge bekräftigen, betonen oder hervorheben. Um den gewünschten Effekt zu erzielen, muss deshalb die Farbauswahl richtig getroffen. 11

12 4. Urheberrechte 4.1. Allgemein Ein weiterer wichtiger Aspekt den man bei der Erstellung und Bearbeitung von Websites beachten muss, ist der Umgang mit den Urheberrechten. Das Urheberrecht wird dabei als das ausschließliche Recht eines Urhebers an seinem Werk definiert. So gehört nur dem Schaffer eines Werkes, ob Bilder, Texte, Filme, Audioaufnahmen oder sonstiges, das alleinige Eigentum. Wird dieses Eigentum von einem Dritten genutzt, so muss dieser die ausdrückliche Genehmigung, z.b. in Form von Lizenzen, vom Urheber einholen. Nur dieser hat laut dem Urheberpersönlichkeitsrecht für folgende Punkte die alleinige Entscheidungsgewalt: (Petra Steude, infoquelle.de, 2012) Die Veröffentlichung seiner Werke Die Art und Weise der Veröffentlichung Der Zeitpunkt der Veröffentlichung Die Verwendung des Namen des Urhebers bei der Veröffentlichung Dies ist aber oftmals nicht der Fall und es wird ständig das Eigentum von Kreativen gestohlen. Durch verschiedene Gesetze und Richtlinien versucht man daher das geistige Eigentum eines Jeden vor dem nachahmen, bzw. kopieren und vervielfältigen zu schützen. Aktuell gerät das Urheberrecht immer mehr in den Fokus der Öffentlichkeit und es werden ständig neue, schärfere Gesetze und härtere Sanktionen gegen Urheberrechtsstraftäter gefordert. Ein Beispiel hierfür ist etwa das, im Moment auf Eis gelegte, ACTA (Anti Counterfeiting Trade Agreement, also Anti-Produktpiraterie-Handelsabkommen), bei dem zwar ein deutlich besserer Schutz geistigen Eigentums ermöglicht werden soll, dies aber zur Umsetzung massiv in die Privatrechte der Internetnutzer eingreifen soll und eine regelrechte Überwachung befürchtet wird. (Spiegel.de, 2012) Ein weiteres Beispiel sind die im Moment geforderten Reformen der deutschen GEMA der Gesellschaft für musikalische Aufführungs- und mechanische Vervielfältigungsrechte, dessen Änderungen besonders in der deutschen Clubszene zu dramatisch erhöhten Kosten zur Musiknutzung in Diskotheken führen würde. (Joachim Fahrun und Thomas Vizthum, 2012) 12

13 Aber auch die immer mehr auftretenden Abmahnungen oder Strafverfahren gegen Urheberrechtsstraftäter rücken das Urheberrecht in den Fokus der Justiz und zeigen wie brisant dieses Thema aktuell ist und welch wirtschaftlicher Schaden dahinter steckt, bzw. welch großes Interesse die Urheber an der Einhaltung der Gesetze haben. Besonders durch die Digitalisierung der heutigen Gesellschaft entstand eine riesige Gefahr für die Besitzer geistigen Eigentums, da es immer einfacher wird Kopien anzufertigen und übers Netz zu verbreiten, was gleichzeitig aber immer mehr zu einer Verschärfung der Gesetze in diesem Bereich führt und in Zukunft noch weiter voranschreiten wird: Abb. 6: Modelle Internet Urheberrecht (Quelle: 13

14 Gerade für diesen Bereich des Internets stehen sich aber diese zwei unterschiedlichen Modelle gegenüber, um mit den Problemen und Herausforderungen des Urheberschutzes umzugehen. Dazu zählt zum einen die ständige Verbesserung und Kontrolle des Kopierschutzes und zum anderen die Einführung von Open-Source Modellen bei dem die Verbreitung geistigen Eigentums um Vordergrund steht und finanzieller Ausgleich durch andere Geschäftsmodelle wie etwa Werbung ermöglicht werden soll. (siehe Abb. 6) 4.2. Website Für die Erstellung einer eigenen Homepage, bzw., wie in dem Fall des Projektes SharePoint Homepage, der Bearbeitung und Anpassung der Hochschulseite muss also der korrekte Umgang mit den Urheberrechten und seinen Gesetzen gewährleistet werden. Dies bedeutet für das Projektteam SharePoint Homepage, dass streng auf die Einhaltung der Urheberrechte geachtet werden muss, um nicht in irgendeiner Art und Weise in Haftung genommen werden zu können oder die Hochschule Albstadt-Sigmaringen in Misskredit zu bringen. Im Detail sieht dies bei der Nutzung von Daten folgendermaßen aus. Die Texte, die in die veröffentlichte Homepage einfließen, müssen auf jeden Fall selbst erstellt werden und dürfen nicht von Dritten kopiert oder abgekupfert werden. Sämtliche Bilder, Grafiken oder Videos die auf die neue Tubis I Plattform hochgeladen werden, müssen unbedingt selbst erstellt werden. Gerade bei der Nutzung externer Grafiken oder Bilder, ohne die ausdrückliche Erlaubnis des Urhebers, kann es zu schwerwiegenden Folgen und empfindlichen Strafen kommen. Wie weit die Richtlinien gerade in diesem Bereich gehen lässt sich anhand des folgenden Beispiels sehr gut darstellen. Will ein Kunde Passbilder, die er von einem Fotostudio aufnehmen lies, für seine Website verwenden, so droht ihm eventuell eine Abmahnung des Fotostudios. Das Fotostudio ist aufgrund der Aufnahme der Bilder Eigentümer und kann dem Kunden verbieten diese ins Netz zu stellen. Der Kunde braucht also die ausdrückliche Genehmigung des Fotostudios um rechtlich auf der sicheren Seite zu sein. (Verivox.de, 2012) 14

15 Für die Projektwebsite Tubis 1 bedeutet dies, dass nur Gruppenbilder hochgeladen werden, die von den jeweiligen Gruppen selbst fotografiert wurden und deren alleinige Rechteinhaber die Projektteilnehmer sind. Auch jegliche Grafiken die für die Darstellung der Projekte erstellt werden müssen ausdrücklich von den Projektgruppen selbst erstellt werden und dürfen nicht von Dritten kopiert werden. Auch wenn eine eventuelle Quelle des Eigentümers angegeben wird, gibt dies den Projektteams keinesfalls das Recht Grafiken ohne ausdrückliche Genehmigung des Eigentümers auf der erstellten Website zu veröffentlichen. Sollte es dennoch der Fall sein, dass eine externe Grafik in die Website eingebunden wird und auch eine entsprechende Genehmigung des Eigentümers vorhanden sein, so muss auf der entsprechenden Seite unbedingt ein Bildnachweis eingefügt werden. 15

16 5. Aufbau der Homepage Beim Aufbau einer Homepage spielen viele Faktoren eine wichtige Rolle. So ist die Übersicht und das Zurechtfinden wohl der bedeutendste Punkt. Der User will seine Informationen sehr schnell und ohne großen Aufwand erreichen. Die Auswahl der Sprachen ist ein weiterer Punkt, den es zu beachten gilt. Da die Vorlesung TUBIS 1 regelmäßig von ausländischen Studenten besucht wird, wurde entschieden, dass die Homepage sowohl auf Deutsch, als auch auf Englisch dargestellt werden soll. Abbildung 7 bzw. Abbildung 8 zeigen den gewählten Aufbau der neuen Homepage. Abb. 7 zeigt dabei den Erstentwurf, während in Abb. 8 die endgültige Umsetzung dargestellt wird. Die Startseite enthält 4 Optionen. Erstens hat der User die Möglichkeit, die aktuellen Projekte aufzurufen, zweitens kann er sich im Archiv ältere Projekte anschauen und drittens sind unter Informationen etliche Auskünfte z.b. über den Roboter etc. enthalten. Weiterhin kann die Auswahl der Sprache getroffen werden. Um sich auf den einzelnen Seiten gut zurechtzufinden, ist es möglich jederzeit wieder auf die Startseite zurück zu kommen. Die Darstellung der Projekte ist der Hauptteil der Homepage. Ein Projekt wird auf der Homepage folgendermaßen dargestellt. 1. Kurze, aber aussagekräftige Informationen über das Projekt a. Aufgabenstellung b. Bearbeiter c. Benötigte Hilfsmittel d. Lerninhalte 2. Gruppenbild des Projektteams 3. Kurz beschriebener Projektablauf 4. Plakatentwurf des Projektes 5. Ergebnis des Projektes (Video) Hierbei wurde gezielt darauf geachtet, dass zu Beginn viele Informationen auf einen Blick zu sehen sind. Weiterhin war es für den Überblick wichtig die Reihenfolge Informationen Bild Informationen Bild Video zu wählen. Dies hat den Vorteil, dass die Seiten abwechslungsreich und dadurch lebendig auf den 16

17 User wirken sollen. Kommen womöglich zu viele Informationen auf einmal in den Blick des Users, kann dies eventuell abschreckend wirken und dem Leser die Lust auf das Weiterlesen zu nehmen. Bei dem Vergleich vom Erstentwurf zur endgültigen Darstellung der Homepage, gibt es 2 Veränderungen. So wurde in der fertigen Homepage außerdem eine Seite Weitere Informationen eingefügt, auf der weitere Informationen über die Projekte, oder die verwendeten Hilfsmittel aufgelistet werden. Eine größere Änderung gab es, im Vergleich zum Erstentwurf, bei der Auflistung der älteren Projekte im Archiv. So werden die verschiedenen älteren Projekte dort direkt aufgelistet anstatt zusätzlich über ihr jeweiliges Semester verlinkt zu werden. Dabei werden nun außerdem alle Projekte als alt angenommen, die vor dem SS 2012 bearbeitet wurden, was wiederum dazu führt, dass es bei der Auflistung der aktuellen Projekte nur Projekte des SS 2012 gibt. Diese Änderung wurde durchgeführt, da es im Moment einfach zu wenige Projekte gibt, die sich direkt in ein bestimmtes früheres Semester einteilen lassen. 17

18 Abb. 7: Aufbau der Homepage - Erstentwurf (eigene Darstellung) 18

19 Abb. 8: Aufbau der Homepage - Umsetzung (eigene Darstellung) 19

20 6. Datenflussplan zur Einpflege der Daten Das Einpflegen der verschiedenen Daten, wie den Bildern, den Projektbeschreibungen oder den Projektergebnissen, ist eine große Herausforderung für das Projektteam SharePoint Homepage. Durch die Veröffentlichung der diversen Projektseiten ist es von immenser Wichtigkeit, dass der Wahrheitsgehalt der verwendeten Daten sichergestellt werden kann. Daher wird bei der Kontrolle und Einpflege der Daten ein Datenflussplan angewendet, umso eine fehlerfreie Überprüfung der Daten zu gewährleisten. Der Aufbau (siehe Abb. 8) des Datenflussplans ist dabei recht simpel, erfordert aber bei der Umsetzung ein hohes Maß an Genauigkeit und Konzentration. Der Ablauf ist chronologisch und es wird von oben nach unten Schritt für Schritt vorgegangen. Grundlage des Datenflussplans sind die geforderten Daten der verschiedenen Projektgruppen. Dazu wird den Teams eine Deadline gesetzt, an dem die exakt beschriebenen Daten bei dem Projektteam SharePoint Homepage abzugeben sind. Die Vorgaben an die verschiedenen Projektgruppen sind dabei folgendermaßen: Projektbeschreibung: o Aufgabenstellung, o Verwendete Hilfsmittel, o Lerninhalte in Stichworten o Beschreibung was Schritt für Schritt zur Bearbeitung des Themas gemacht wurde Bilder sowie Gruppenbild des Projektteams (mit Angabe der Namen) o Querformat o Format: 400 Pixel Breite o Als JPG-Datei Plakat: o Vorgabe des Hintergrundes und des Layouts durch das Projektteam SharePoint Homepage o Format: 1000 Pixel (Querformat) + Din A3 Format 20

21 Projektergebnis: o Individuelle Darstellung der Ergebnisse o Video, Abstract Deadlines: o Projektbeschreibung + Gruppenbild: o Plakatentwurf + Projektergebnis: Zu beachten ist dabei, dass sämtliche Daten sowohl in deutscher, als auch in englischer Sprache verfasst werden müssen, da die einzelnen Seiten der neuen Tubis Plattform in Deutsch als auch in Englisch zur Verfügung gestellt werden. Bei der Verwendung von Bildern ist es notwendig die offiziellen Richtlinien einzuhalten, da eine Formatierung der Bilder in SharePoint nicht automatisch eingestellt werden kann. So ist es auch wichtig die Vorgaben zu beachten, um eine eventuelle Überlastung der Server zu vermeiden, da Bilder in Originalgröße zu längeren Ladezeiten führen würden. Ein weiterer Grund für die genaue Vorgabe der Bilder und der Projektbeschreibung liegt in der Gleichheit und Wiedererkennbarkeit der verschiedenen Projektseiten begründet. So soll durch einheitliche Vorgaben eine ansehnliche Darstellung der Projekte ermöglicht werden. Nach dem Erhalt der Daten von den Projektgruppen wird nun, strickt nach dem Datenflussplan, die Kontrolle der Daten durchgeführt. Diese werden dabei zum einen auf die Vollständigkeit und Formatvorgaben als auch auf die Richtigkeit überprüft. Gibt es keinerlei Probleme mit den erhaltenen Daten, so werden diese als richtig befunden und auf die entsprechende SharePoint-Seite der Gruppe eingepflegt. Werden aber ein oder mehrere Fehler festgestellt, so findet von dem Projektteam SharePoint Homepage eine Einteilung nach Art des Fehlers statt. Handelt es sich dabei nur um geringfügige Fehler, wie etwa Rechtschreibfehler oder Grammatikfehler, so werden die Daten von dem Projektteam SharePoint Homepage sofort verbessert und entsprechend eingepflegt. Handelt es sich aber um gravierendere Fehler, wie etwa groben Formatfehler oder auch Inhaltsfehler, so werden die Daten an die verantwortliche Projektgruppe zurückgegeben um eine Verbesserung der Daten zu veranlassen. Bei erneuter Vorlage der 21

22 verbesserten Daten wird wiederum die Kontrolle der Daten nach dem Datenflussplan durchgeführt. Abb. 9: Datenflussplan zur Einpflege der Daten (eigene Darstellung) 22

23 7. Leitfaden 7.1. Formatvorgaben Um ein neues Projekt anzulegen werden folgende Daten benötigt: a. Projektbeschreibung Aufgabenstellung (1 Satz) Verwendete Hilfsmittel Lerninhalte in Stichworten Es soll in Stichworten beschrieben werden, was zur Bearbeitung des Themas gemacht wurde b. Gruppenbild Dateiformat: jpg Größe : c. Plakatentwurf 400 Pixel Breite (Querformat) Dateiformat: jpg Größe: 1000 Pixel Breite (Querformat) d. Ergebnis Video (mp4 Format) wenn möglich Da die Homepage zweisprachig geführt wird, werden alle Texte auch in englischer Sprache benötigt. 23

24 7.2. Anlegen von neuen Seiten Zum Darstellen eines neuen Projektes, müssen 4 neue Seiten erstellt werden. Ein neues Projekt beinhaltet demnach die folgenden Seiten: 1 Projektseite (Deutsch) 1 Projektseite (Englisch) 1 Plakatseite (Deutsch) 1 Plakatseite (Englisch) Um die in Kapitel 7.1 genannten Daten hochzuladen, müssen die folgenden Schritte durchgeführt werden. Zu Beginn ist in den Websiteinhalt zu wechseln. Dazu sind die Buttons Websiteaktionen (1) und Inhalt und Struktur verwalten (2) zu betätigen (siehe Abb.10). 2 1 Abb. 10: Startseite (eigene Darstellung) 24

25 Anschließend öffnet sich folgendes Fenster (Abb.11) 2 1 Abb. 11: Webseiteninhalt und Webseitenstruktur (eigene Darstellung) Um eine neue Seiten zu erstellen muss in der linken Spalte auf Seiten (1) geklickt werden. Nun sind in der rechten Spalte alle aktuellen Seiten der Homepage zu sehen. Will man nun eine neue Seite anlegen, so ist in der Symbolleiste der rechten Spalte auf Neu Seite (2) zu klicken. 25

26 Es öffnet sich folgendes Fenster (Abb.12) Abb. 12: Seite erstellen (eigene Darstellung) Bei Titel ist der Name des Projektes einzugeben, z.b: E-Commerce Der Titel wird als Überschrift in der neuen Seite angezeigt. Nach automatischem ausfüllen des Feldes URL-Name sollte noch ein Kürzel für die Sprache hinzugefügt werden, z.b. _de für Deutsch oder _en für Englisch. Das Template für das Seitenlayout wird mit (!!HSASIG Seite) Template nur Text gewählt. Über den Button Erstellen wird die neue Seite gespeichert. Diese ist nun in der rechten Spalte der Webseitenstruktur (Abb.11) zu sehen. Nach diesem Schritt ist nun eine Seite mit Template nur Text unter dem Namen E-Commerce_de oder E-Commerce_en angelegt worden. Dieser Vorgang ist für jede benötigte Seite zu wiederholen. 26

27 7.3. Hochladen von Bildern, Dokumenten und Videos Um Bilder, Dokumente oder Videos hochzuladen, ist in der linken Spalte der Webseitenstruktur die gewünschte Liste zu wählen. Für Bilder Button 1 Für Dokumente Button 2 Für Videos Button 3 In der rechten Spalte sind nun wieder alle Bilder, Dokumente oder Videos aufgelistet Abb. 13: Auswahl der Struktur Bilder, Videos, Dokumenten (eigene Darstellung) 27

28 Anschließend gelangt der User wieder über Neu Element in den Dokumentenupload. Danach öffnet sich folgendes Fenster(Abb.14). Abb. 14: Dokumentupload (eigene Darstellung) Durch einen Klick auf Durchsuchen ist das gewohnte PC bzw. Netzwerk zu sehen und es kann nun aus dem gewünschten Ordner ein Bild ausgewählt werden. Mit einem Klick auf Öffnen und danach mit Klick auf OK wird das Bild übernommen. Hinweis: Der Upload von Dokumenten und Videos erfolgt genau gleich. 28

29 7.4. Aufbau einer Projektseite Wenn alle Bilder, Videos und Dokumente hochgeladen sind, kann das gestalten der Projektseite beginnen. In diesem Kapitel wird beschrieben, wie die Seiten aufgebaut und zu bearbeiten sind. Um auf die Seiten zu kommen muss in der linken Spalte des Webseiteninhalts (Abb.11) Seiten ausgewählt werden, sodass auf der rechten Spalte alle aktuellen Seiten angezeigt werden. Anschließend wird mit einem Klick auf die entsprechende Seite (z.b. E-Commerce_de ), die Seite geöffnet. Abb. 15: Auswahl der Seite (eigene Darstellung) Die neue Seite stellt sich folgendermaßen da (Abb. 16) Abb. 16: Neue Projektseite (eigene Darstellung) 29

30 Mit einem Klick auf Seite bearbeiten öffnen sich nun alle Felder, die bearbeitet werden können (Abb.17). In dem ausgewählten Template können der Titel, der Seiteninhalt, die Kontaktangabe, sowie ein Webpart bearbeitet werden. Abb. 17: Seiteninhalt (eigene Darstellung) Eine Projektseite ist in der folgenden Reihenfolge aufgebaut: 1. Tabelle a.) Aufgabenstellung b.) Bearbeiter c.) Verwendete Hilfsmittel d.) Lerninhalte 2. Gruppenbild 3. Informationen zum Projektablauf 4. Plakatentwurf des Projektes 5. Kontakte und Ergebnis Auf der nächsten Seite ist der Aufbau einer Projektseite dargestellt (Abb.18). 30

31 Aufgabenstellung Bearbeiter Kurze Beschreibung der Aufgabe Namen der Bearbeiter Hilfsmittel Hilfsmittel 1 Hilfsmittel 2 Lerninhalte Lerninhalt 1 Lerninhalt 2 Lerninhalt 3 Gruppenbild Folgendes musste zur Bearbeitung des Projektes gemacht werden: Video Folgendes musste zur Bearbeitung des Projektes gemacht werden: Plakatentwurf Abb. 18: Aufbau der Projektseite (eigene Darstellung) 31

32 7.5. Erstellen von Tabellen Der erste Teil der neuen Seite ist die Tabelle mit 4 Zeilen und 2 Spalten, die die Informationen Aufgabenstellung, Bearbeiter, verwendete Hilfsmittel und Lerninhalte enthält. Um eine neue Tabelle zu erstellen, klickt der User auf den Button Tabelle einfügen (Abb. 19). Abb. 19: Symbolleiste Verlinken (eigene Darstellung) Anschließend öffnet sich das nachstehende Fenster (Abb.20) Abb. 20: Tabelleneigenschaften bearbeiten (eigene Darstellung) Zu beachten ist, das das Tabellenformat 3 (3) ausgewählt wird und die Haken bei Sonderformate anwenden auf (4) richtig gesetzt sind. 32

33 7.6. Einbinden von Bildern Nachdem die Tabelle erstellt worden ist, muss nun das Gruppenbild und das Plakat eingefügt werden. Hierzu ist der Button Bild einfügen zu betätigen. Abb. 21: Symbolleiste Bild einbinden (eigene Darstellung) Es öffnet sich folgendes Fenster (Abb.22). 2 1 Abb. 22: Bildeigenschaften bearbeiten (eigene Darstellung) Durch einen Klick auf Durchsuchen ist das gewohnte PC bzw. Netzwerk zu sehen und es kann nun ein Bild ausgewählt werden. Mit einem Klick auf Öffnen und danach mit Klick auf OK wird das Bild übernommen. Das Gruppenbild wird, welches eine Größe von 400 Pixel Breite besitzt, wird mit der Auswahl Standartgröße verwenden (1) mit einem Klick auf Ok in die aktuelle Seite eingebunden. 33

34 Das Plakat hingegen soll sowohl auf der Projektseite, als auch auf der eigenen Plakatseite eingebunden werden. Hierbei ist die unterschiedliche Größe auf beiden Seiten zu beachten. Auf der Projektseite muss das Plakat mit einer Breite von 500 Pixel eingebunden werden. Hierzu muss unter Größe, Größe angeben und Seitenverhältnis beibehalten aktiviert sein (2). Weiterhin ist im Feld Breite (Pixel) 500 einzugeben. Dadurch wird das Plakat auf eine Breite von 500 Pixel komprimiert. Mit einem Klick auf Ok wird das Plakat in die aktuelle Seite eingebunden. Wird das Plakat auf der eigenen Plakatseite eingebunden, so ist das Bild mit der Auswahl Standartgröße verwenden einzubinden, was dann einer Größe von 1000 Pixel Breite entspricht. Zusammenfassung: Die Projektseite enthält das Gruppenbild in 400 Pixel Breite und soll zentriert werden. Die Projektseite enthält das Plakat in 500 Pixel Breite. Die Zentrierung ist nicht nötig, da das Plakat die komplette Breite in Anspruch nimmt. Die Plakatseite enthält das Plakat in 1000 Pixel Breite. 34

35 7.7. Verlinken Wenn mehrere Wörter bzw. ein Bild mit einer anderen Seite oder einem Dokument verlinkt werden soll, so sind die entsprechenden Wörter oder das entsprechende Bild zu markieren. Mit einem Klick auf Verlinken (Abb.23) öffnet sich dann das untenstehende Fenster (Abb.24) Abb. 23: Symbolleiste Verlinken (eigene Darstellung) Abb. 24: Auswahl des Links (eigene Darstellung) In der linken Spalte kann nun ausgewählt werden, ob die markierte Stelle zu einem Dokument oder einer Seite verlinkt werden soll. Ist die Auswahl getroffen, werden in der rechten Spalte alle Dokumente oder Seiten angezeigt, auf die das Verlinken möglich ist. Mit einem Klick auf OK wird der Link gesetzt. 35

36 7.8. Einbinden von Videos Um Videos auf die Projektseite einzubinden, müssen die nächsten Schritte befolgt werden. Ein Video wird immer auf der rechten Seite platziert. Dazu ist auf den Button Webpart hinzufügen (Abb. 25) zu klicken. Abb. 25: Webpart hinzufügen (eigene Darstellung) Im sich nun geöffneten Fenster (Abb. 26) muss unter Alle Webparts Amrein Engineering die Auswahl AE Media Player ausgewählt und mit OK bestätigt werden. Abb. 26: Auswahl des Webparts (eigene Darstellung) 36

37 Der Projektseite ist nun ein Media Player hinzugefügt worden. Im nächsten Schritt muss dem Media Player das gewünschte Video zugewiesen werden. Abb. 27: Webpart bearbeiten (eigene Darstellung) Mit einem Klick auf bearbeiten Freigegebenes Webpart bearbeiten (Abb.27) öffnet sich ein neues Fenster. In diesem Fenster müssen folgende Felder wie folgt ausgefüllt werden: Feld Titel Ergebnis Dadurch wird auf der Projektseite über dem Video Ergebnis angezeigt. Unter Verschiedene im Feld list name Video Dadurch wird die Liste mit den hochgeladenen Videos ausgewählt. Unter Verschiedene im Feld Media file muss der komplette Name des hochgeladenen Videos inklusive Dateinendung eingegeben werden. Hierbei muss auch auf Groß- und Kleinschreibung geachtet werden. z.b. Ergebnis_E-Commerce.mp4 Bei der letzten Auswahl, darf der Haken nur bei Use FLV player sein. 37

38 7.9. Kontaktdaten hinzufügen Jede Projektseite enthält die Kontaktdaten von Prof. Dr. Rehfeldt und Herrn Fauler. Diese Daten werden in die rechte Spalte der Seite bei Kontakt HSASIG geschrieben. Abb. 28: Kontaktdaten hinzufügen (eigene Darstellung) Nach einem Klick auf Inhalt bearbeiten können die Kontaktdaten eingegeben werden. In Abbildung 29 ist das deutsche und englische Format der Kontaktdaten zu sehen. Abb. 29: Kontaktdaten (eigene Darstellung) 38