20
www.uni-stuttgart.de 25.01.2011 RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit Zuständigkeiten Fazit

Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

Embed Size (px)

Citation preview

Page 1: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

25.01.2011 RUS/HKOM

Relaunch Uni-Homepage 2011

Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit Zuständigkeiten Fazit

Page 2: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Drei-Säulen-Modell

Management: CMS Layout/Design Informationsdesign

– Seitentypen– Interaktivität– Priorisierte Informationen

Page 3: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Neues Layout & Design: Gestaltungs-Grundsätze

Nur Cascading Style Sheets (CSS): Layout und Inhalt getrennt Kein Farbschema Neutrale Seitenelemente (grau) Farbe in Kopfgrafik Verbesserte Typografie: 10pt, relativ und BITV-konform Festes Layout (vs. fließende Layouts) Keine Seitenzentrierung

25.01.2011 RUS/HKOM

Page 4: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Neues Layout & Design

Datum Referent

12

34

57

8

9

10

11

6

Page 5: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Neues Layout & Design : Globalnavigation (1)

25.01.2011 RUS/HKOM

Globale Elemente:

• Links zu übergeordneten Organisationseinheiten• Anpassbar• Gekoppelt an gewünschte URLs (suche/, sitemap/,

kontakt/)

Homepage Orga Sprachversion

Druck

Page 6: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Neues Layout & Design: Kopfgrafik (2)

25.01.2011 RUS/HKOM

„Visualisierung der Einrichtung“• Leitthema „Überschneidung“• Vollfarbgrafik• Eingebettete Logos• Transparenzen• Panorama, Collage, …• Photoshop-Vorlage• Unterstützung durch das RUS

möglich

Uni-Logo (3)

Einrichtungs-Logo (4)

Einrichtungs-Name (Text)

Page 7: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Neues Layout & Design: Navigationsmenü (6)

25.01.2011 RUS/HKOM

„Menü“:• Konsolidiert diverse, verstreute Elemente der

Vergangenheit• Beliebige Tiefe (sinnvoll 2-3)• Bildet direkt die Hierarchie ab• Interaktiv• Home ist Navigationselement der Ebene 0!

Home

Page 8: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Neues Layout & Design: Klickpfad (7)

25.01.2011 RUS/HKOM

Breadcrumb:• Zeigt aktuelle Hierarchie-Ebenen• Praktisch für Deeplinks• Ebenen sind Hyperlinks

Breadcrumb

Page 9: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Neues Layout & Design: linke Spalte (8,9)

25.01.2011 RUS/HKOM

Rubriken:• Zielgruppen (zusätzl. Navigationssicht

zu tendenziell funktionaler Sicht der Hauptnavigation)

• „Direkt-Zu“-Links

Page 10: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Neues Layout & Design: Rechte Spalte

25.01.2011 RUS/HKOM

Rubriken:• Artikel• News• Veranstaltungen• Termine

Mehrwerte:• Automatische Einbettung• Programmatische Ausgabe• RSS-Feeds

Page 11: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Umsetzung

1. OpenCms: Für Kunden: nach Auftrag Für Neukunden: Migrationsunterstützung, Schulungen

2. Downloadvorlagen http://www.rus.uni-stuttgart.de/dienste/internet/uniwww/

Eigenanpassung für Skriptlösungen, eigene CMS, ..

Zeithorizont: 6 Monate

25.01.2011 RUS/HKOM

Page 12: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Demo-Sites: Expo

Datum Referent

Page 13: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Demo-Sites: ITV

Datum Referent

Page 14: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Demo-Sites: Zentrale Studienberatung

Datum Referent

Page 15: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Demo-Sites: Exzellenzinitiative

Datum Referent

Page 16: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Demo-Sites: Eigenumsetzung der Informatik

25.01.2011 RUS/HKOM

Page 17: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Verbesserte Suche (5)

Suchfeld auf jeder SeiteSuchtechnologie von GoogleEigene Hardware (Appliance) Index mit aktuell 150T ElementenVolltextKonfigurierbar über SchlüsselwörterVerbesserte Qualität der Suchergebnisse

25.01.2011 RUS/HKOM

http://www.uni-stuttgart.de/suche/

Page 18: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Barrierefreiheit

„Die Hochschulen sind grundsätzlich verpflichtet, ihre Internetauftritte barrierefrei zu gestalten.“ (BITV und LBGG)

Template ist barrierefrei Bei der Erstellung der Inhalte muss auf Barrierefreiheit geachtet

werden Qualitätssicherung durch RUS (Validität, Link-Integrität, ..)

http://www.rus.uni-stuttgart.de/barrierefrei/

25.01.2011 RUS/HKOM

Page 19: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Zuständigkeiten

Rechenzentrum(RUS) Technik, CMS Funktionalität

opencms-support@rus.

www-support@rus.

Hochschulkommunikation (HKOM) Online Redaktion (Homepage,

News, Veranstaltungen) Corporate Design

[email protected]

25.01.2011 RUS/HKOM

Page 20: Www.uni-stuttgart.de 25.01.2011RUS/HKOM Relaunch Uni-Homepage 2011 Drei-Säulen-Modell Neues Layout & Design Umsetzung Demo-Sites Suche Barrierefreiheit

ww

w.u

ni-

stu

ttg

art.

de

Fazit: Vorteile OpenCms

Template und automatische Aktualisierung (stetige Weiterentwicklung) Automatisierte Ausgaben: Navigation, News, Veranstaltungen,

Mitarbeiterlisten, Sitemap, .. Kooperative Arbeit (wohlgeordnete Publikationsprozesse), sichere Arbeit

(Versionierung, Wiederherstellung), getrennte Offline-, Online-Bereiche

Hilfe bei der Migration

www.rus.uni-stuttgart.de/dienste/internet/opencms/

Danke für Ihre Aufmerksamkeit!