--- version: alpha name: Hochschule Merseburg description: "Corporate Design und digitale Gestaltungsregeln der Hochschule Merseburg, Regelwerksversion 1.0.1" omitted: - section: spacing reason: "Verbindliche Abstände und Rasterwerte werden im produktiven TYPO3-Sitepackage gepflegt." - section: rounded reason: "Es sind keine eigenständigen, allgemein verbindlichen Radius-Tokens veröffentlicht." - section: components reason: "Verbindliche Komponentenwerte werden im produktiven TYPO3-Sitepackage gepflegt." colors: primary: "#003c64" faculty-inw: "#0082c8" faculty-smk: "#d71419" faculty-wiw: "#009b82" neutral: "#d2d2d2" faculty-inw-pastel: "#a5d7dc" faculty-smk-pastel: "#f5e6c8" faculty-wiw-pastel: "#e6eba5" medium-blue: "#0e558c" accent-orange: "#f59100" accent-yellow: "#f9b000" accent-green: "#96c31e" dark-blue: "#14283c" typography: primary: fontFamily: "Fira Sans" office-fallback: fontFamily: "Verdana" monospace-addition: fontFamily: "Fira Mono" --- # Hochschule Merseburg DESIGN.md **Regelwerksversion:** 1.0.1 **Status:** durch Hochschulmarketing und Kommunikation freigegeben **Verantwortung:** Hochschulmarketing und Kommunikation **Sprache:** Deutsch Der Wert `version: alpha` im YAML-Block bezeichnet die verwendete Version des DESIGN.md-Formats. Die fachliche Version dieses HoMe-Regelwerks bleibt 1.0.1. ## Overview Das visuelle Erscheinungsbild der Hochschule Merseburg soll sachlich, zugänglich, wiedererkennbar, lebendig und vielfältig wirken. Die drei Kernelemente sind: 1. das Hochschul-Logo 2. die Hausfarbe HoMe-Blau 3. die Hausschrift Fira Sans Akzentfarben, definierte Formen und eine authentische Bildsprache ergänzen diese Grundlage. ### Logo Das HoMe-Minilogo ist die bevorzugte Logoform. Es steht einzeilig und zweizeilig sowie in HoMe-Blau und Weiß zur Verfügung. Bevorzugt werden die bereitgestellten Dateien mit integriertem Schutzraum. Die ursprüngliche Grundform des HoMe-Logos bleibt zulässig, tritt aber wegen ihrer eingeschränkten Lesbarkeit und der früheren Hausschrift Fago Pro gegenüber dem HoMe-Minilogo in den Hintergrund. Logo-Dateien dürfen nicht: - verzerrt - gedreht - umgefärbt - beschnitten - mit Effekten versehen - in Einzelteile zerlegt - nachgebaut - durch KI verändert oder neu erzeugt werden. Es dürfen ausschließlich freigegebene Originaldateien verwendet werden. Schutzraum und Größe müssen so gewählt werden, dass das Logo jederzeit eigenständig und vollständig lesbar bleibt. Es werden keine abweichenden Zahlenwerte erfunden. ### Bildsprache Die Bildsprache soll: - authentisch - lebendig - vielfältig - praxisnah - konsistent - diskriminierungsarm sein. Bevorzugt werden reale Situationen aus Studium, Lehre, Forschung, Transfer, Laboren, Werkstätten und dem Campusleben. Menschen, Zusammenarbeit und Engagement stehen im Mittelpunkt. Stereotype und klischeehafte Rollenbilder sind zu vermeiden. Fotos sollen einen eindeutigen Bildfokus besitzen und möglichst für unterschiedliche Formate und Ausschnitte geeignet sein. Grafische Text- und Farbfelder sollen nicht bereits in das Ausgangsfoto eingebaut werden. ## Colors HoMe-Blau `#003c64` ist die zentrale Markenfarbe und der normative digitale Farbwert. ### Fachbereichsfarben - Ingenieur- und Naturwissenschaften: `#0082c8` - Soziale Arbeit. Medien. Kultur: `#d71419` - Wirtschaftswissenschaften und Informationswissenschaften: `#009b82` Fachbereichsfarben dürfen nur bei eindeutiger fachlicher Zuordnung eingesetzt werden. Sie ersetzen nicht die zentrale Hochschulmarke. ### Weitere veröffentlichte Farben - HoMe-Grau: `#d2d2d2` - INW-Pastellblau: `#a5d7dc` - SMK-Pastellrot: `#f5e6c8` - WIW-Pastellgrün: `#e6eba5` - HoMe-Mittelblau: `#0e558c` - HoMe-Akzent-Orange: `#f59100` - HoMe-Akzent-Gelb: `#f9b000` - HoMe-Akzent-Grün: `#96c31e` - HoMe-Dunkelblau: `#14283c` Akzentfarben sollen gezielt und sparsam eingesetzt werden. Für Druck- und Sonderanwendungen gelten die von der Hochschule veröffentlichten CMYK-, Pantone-, RAL- und Folienwerte. Farben müssen so eingesetzt werden, dass Texte und Bedienelemente die geltenden Kontrastanforderungen erfüllen. Informationen dürfen nicht ausschließlich durch Farbe vermittelt werden. ## Typography Fira Sans ist die verbindliche Hausschrift für neue Anwendungen. Verdana ist die alternative Hausschrift für Office-Anwendungen und technische Umgebungen, in denen Fira Sans nicht verfügbar ist. Fira Mono ist eine ergänzend bereitgestellte Monospace-Schrift. Sie ist keine allgemeine Hausschrift und ersetzt Fira Sans nicht. FF Fago ist Altbestand. Sie darf in bestehenden, noch nicht migrierten Materialien vorkommen. Für neue Materialien wird sie nicht verwendet. Aptos, Calibri und andere nicht freigegebene Standardschriften sollen vermieden werden. Dieses Dokument definiert keine parallelen Schriftgrößen, Zeilenhöhen oder Abstände für die Hochschulwebsite. Dort gelten ausschließlich die Werte des produktiven TYPO3-Sitepackages. ## Layout Für die Hochschulwebsite gelten ausschließlich die im produktiven TYPO3-Sitepackage hinterlegten Raster, Abstände, Breakpoints, Inhaltsbreiten und responsiven Regeln. Externe Personen oder KI-Werkzeuge dürfen keine vermeintlich passenden Werte ergänzen oder aus Einzelansichten verallgemeinern. Layouts sollen: - Inhalte klar priorisieren - ausreichend Weißraum bieten - auf unterschiedlichen Bildschirmgrößen funktionieren - verständliche Leserichtungen unterstützen - keine rein dekorativen Elemente über die Nutzbarkeit stellen ## Elevation & Depth Dieses Regelwerk definiert keine eigenständigen Schatten- oder Tiefen-Tokens. Auf der Hochschulwebsite entsteht visuelle Hierarchie durch die vorhandene TYPO3-Komponentenstruktur, Typografie, Abstände, Flächen und Kontraste. Zusätzliche Schatten, Verläufe oder räumliche Effekte dürfen nicht ohne fachliche und technische Freigabe ergänzt werden. ## Shapes Die wichtigste Grundform des Corporate Designs ist das Quadrat. Weitere zulässige Formen sind: - Würfel in isometrischer Darstellung - Pfeile zur Hervorhebung und Strukturierung - Störer für besondere, gezielte Aufmerksamkeitslenkung Formen dürfen Inhalte, Orientierung, Lesbarkeit und Bedienbarkeit nicht beeinträchtigen. ## Components Die verbindlichen Webkomponenten werden im produktiven TYPO3-Sitepackage gepflegt. Dieses Dokument erfindet deshalb keine zusätzlichen Komponenten, Zustände, Abstände, Radien oder Interaktionsmuster. Bei der Umsetzung bestehender TYPO3-Seiten sind die vorhandenen Inhaltselemente und deren definierte Darstellung zu verwenden. Neue Komponenten benötigen eine fachliche Freigabe durch Hochschulmarketing und Kommunikation sowie eine technische Abstimmung mit den zuständigen Stellen. ## Do's and Don'ts ### Do - HoMe-Minilogo bevorzugt verwenden - ausschließlich freigegebene Logo-Dateien einsetzen - HoMe-Blau als zentrale Markenfarbe verwenden - für neue Anwendungen Fira Sans einsetzen - Fachbereichsfarben nur bei klarer Zuordnung nutzen - Kontraste und Tastaturbedienbarkeit prüfen - aussagekräftige Alternativtexte und verständliche Linktexte verwenden - reale, authentische und vielfältige Bildmotive bevorzugen - bestehende TYPO3-Komponenten und Sitepackage-Werte übernehmen - bei Unsicherheit Hochschulmarketing und Kommunikation einbeziehen ### Don't - Logos verändern, nachbauen oder durch KI erzeugen - FF Fago für neue Materialien verwenden - nicht freigegebene Schriftarten als Ersatz wählen - Farben ohne funktionale oder fachliche Begründung mischen - Informationen ausschließlich über Farbe vermitteln - Stereotype oder klischeehafte Rollenbilder verwenden - Abstände, Breakpoints, Radien oder Komponentenwerte erfinden - eine KI-Ausgabe ohne fachliche Prüfung veröffentlichen ### Verbindliche Quelle Aktuelle Corporate-Design-Seite: `https://www.hs-merseburg.de/hochschule/ueber-die-hochschule/corporate-communication/corporate-design/` Digitale Gestaltungs- und Redaktionsgrundsätze: `https://www.hs-merseburg.de/hochschule/ueber-die-hochschule/corporate-communication/digitale-gestaltungs-und-redaktionsgrundsaetze/` Bei widersprüchlichen älteren Webseiten gilt die aktuelle zentrale Corporate-Design-Seite in Verbindung mit diesem freigegebenen Regelwerk.