Am Laden …

Konsequente Umsetzung des Kommu­nika­tions­konzepts

Bild Nr. 2
Bild Nr. 2
Bild Nr. 3
Bild Nr. 3
Bild Nr. 4
Bild Nr. 4

Ein Kreativworkshop brachte eine neue Leitidee, die bereits für den Website-Relaunch umgesetzt werden sollte. „Wir schaffen gute Zahlen“ zieht sich nun durch den kompletten Webauftritt. Das zeitlose Flat-Design bestimmt den neuen, klaren Look der Website. Dadurch reduziert sich die Optik auf das Wesentliche und kommt so ohne plastische Spielereien wie Schatten, Rundungen oder Verläufe aus. Verschiedene Layout-Elemente spiegeln sich in den Firmenfarben Orange, Dunkel- und Hellgrau wieder.
Durch den insgesamt reduzierten Einsatz von Grafiken rücken die typografischen Elemente in den Vordergrund.

Hier präsentiert sich die moderne, serifenlose „Titillium Web“ im Light- und Bold-Schnitt von ihrer besten Seite. Der von einem Kurs der Kunsthochschule in Urbino entwickelte Open-Source-Font ist bestens für die Darstellung am Bildschirm geeignet und mit vielen weiteren Schrift-Schnitten gut ausgebaut. Die zeitgemäße, sehr elegante Formensprache passt bestens zum klaren Design der Website.

Layout & Front-end:
Auf allen Einzelseiten kommt ein klassisches zweispaltiges Layout zum Einsatz, mit einem frei gestaltbaren Content-Bereich und der Subnavigation mit Kontaktdaten in der Seitenspalte. Eingeleitet wird dies durch den großzügigen Header mit einer großformatigen Kopfgrafik, immer zum Seitenthema leitend. Logo, Navigation und Such-Eingabe sind dabei fixiert und „kleben“ beim Scrollen am oberen Rand des Viewports, dem sichtbaren Website-Bereich. Der Footer mit News-Teaser-Abschnitt und rechtlich notwendigen Angaben bildet einen ansprechenden Abschluss, der durch die schwere Farbgebung dem Web-Auftritt eine solide Basis gibt.

Auf der Startseite kommt zusätzlich als besonderes Layout-Element oberhalb des Content-Bereichs eine Fullscreen-Slideshow zum Einsatz, die gekonnt in das Zahlen-Thema einführt, die Zielgruppe mittels Branchenpräsentation anspricht sowie die Leistungsbereiche in kurzer Ausführung anteasert.
Zur technischen Umsetzung der Slideshow stützten wir uns auf den BX-Slider. Das Skript wurde individuell an die Kundenwünsche angepasst, sodass beispielsweise der erste Slide länger stehen bleibt oder die Paginierung am rechten Rand steht. Um eine möglichst gute Performance zu erzielen, werden die Hintergrundbilder der Slides erst beim Aufruf selektiv nachgeladen und die Slide-Funktion läuft nur ab, wenn dieser auch im Viewport zu sehen ist.
Losgelöst vom eigentlichen Slide-Skript haben wir eine Funktion programmiert, die auf dem ersten Slide Ziffern hochzählen lässt und diese so bestens präsentiert.

Das Layout zielt insgesamt auf breitformatige Desktop-Bildschirme (Stichwort Full-HD-Monitore), da diese mit einem Anteil von über 85 % die größte Zielgruppe bilden. Natürlich ist aber auch sonst der neue Web-Auftritt für verschiedene Ausgabegrößen und -medien, wie z. B. Smartphone oder Tablet optimiert. Erreicht wird dies v. a. durch den Aufbau des HTML-Grundgerüsts mit dem Boilerplate „Skeleton“ in Verbindung mit CSS3-Media-Queries, welche eine schnelle Umsetzung eines reaktiven Layouts ermöglichen.

Auch sonst setzen wir im Front-end auf modernes HTML5, CSS3 und diverse JavaScript-Funktionen, die hauptsächlich mit dem JS-Framework jQuery aufgebaut sind. Hierzu zählt neben der Slideshow z. B. die Echtzeit-Validierung von Formulareingaben oder das Togglen des Menüs bei kleineren Display-Größen. Dezente Hover-Effekte von Links, wie beispielsweise bei den Leistungs-Boxen der Startseite oder den News-Artikeln im Footer, wurden auf moderne Weise mittels CSS3-Transitions umgesetzt.

Ein weiteres besonderes Augenmerk lag auf der Realisierung des Stellenmarktes mit einer Kategorie-Auswahl und Suchfunktion, die mittels JavaScript clientseitig die Jobangebote filtert. Zur Einführung in das Thema ist auf der Job-Übersichtsseite ein kleines Quiz integriert, dass ebenfalls mittels JS umgesetzt wurde.
Für die einzelnen Stellenangebote haben wir zudem ein Drucklayout umgesetzt, das speziell für den tonerschonenden Ausdruck angedacht ist. Ein Zurück-Link lässt Interessenten auf die Übersichtsseite an genau die Stelle zurückspringen, von der sie zuvor auf das Stellenangebot geklickt haben. So ist immer eine perfekte Übersicht gegeben.

Back-End & Administration:
Im Back-End kommt unser Haus-CMS „webEdition“ zum Einsatz, mit dem wir schnell und flexibel individuelle Funktionen umsetzen und somit bestens alle Kundenwünsche realisieren können. Dadurch, und durch die Art unserer Programmierung, ist die Website auch weiterhin jederzeit ausbaubar und so stellen individuelle Features keine Hürden dar.

Neben den typischen Standard-Inhaltsseiten und zwei umfangreichen Formularen bildet der Stellenmarkt das Highlight der Website. Die Inhalte der einzelnen Jobangebote kommen dabei direkt aus der Datenbank und sind dank der SEO-URL-Funktion vom Content-Management-System sowie der automatisierten Meta- und OG-Tags-Generierung bestens für die Suchmaschinenindexierung konzipiert.
Auch sonst sind alle Seiten, u. a. durch die Meta-Angaben, die sprechenden URLs und natürlich den Content bestens für die Auffindbarkeit in Google & Co. optimiert. Im Zuge der Online-Stellung waren zudem in unserem Weiterleitungskonzept diverse 301er-Weiterleitungen mittels HTAccess angedacht, sodass die bereits in Suchmaschinen indexierten Seiten nicht ins Leere laufen und dadurch das positive Ranking riskiert wird.

Sicherheit stand aufgrund der sensiblen Bewerberdaten an erster Stelle. So übernahmen wir das Handling der SSL-Zertifikate, um eine verschlüsselte Verbindung zwischen Client und Server zu ermöglichen. Der Versand der Formulare von der Website zu Schmitt Engineering findet mittels einer TLS-verschlüsselten SMTP-Verbindung statt.
Des Weiteren kümmerten wir um das Domain-Handling sowie das Hosting der Website auf unserem leistungsstarken Server.

Zu guter Letzt haben wir noch eine globale Suchfunktion integriert, die in jeder Seite präsent in den Kopfbereich integriert ist. Sie durchsucht den gesamten Dokumentenstamm sowie die Stellenangebote und listet diese separat in einer übersichtlichen Form auf. Dies wurde weitestgehend mit den Bordmitteln unseres CMS auf individuelle Art und Weise realisiert.

Integration von Google Analytics und Google Search Console (ehemals Google Webmaster Tools), ausführliche Bildrecherche und -bearbeitung, Redigieren von Texten sowie deren Erstellung, Abhalten einer Schulung zur Bedienung des CMS und Analytics runden unsere Full-Service-Leistung zum Webrelaunch unseres Kunden ab.


Schmitt Engineering

Seit 1993 Partner im Engineering, setzt das Unternehmen aus Erlangen Tennenlohe vor allem auf hochqualifiziertes Personal. 100 Mitarbeiter, davon 90 % Ingenieure bringen ihr Know-how in die Entwicklungsteams der Auftraggeber vor Ort ein. Immer aktuell qualifiziert und mit innovativen Markttrends versorgt.

Seit Unternehmensgründung wurden mehr als 5.000 Projekte erfolgreich abgewickelt. Dabei hilft die Erfahrung und Praxisnähe bei der Entwicklung kundenoptimierter Lösungen in den 4 Kernbranchen Fahrzeugtechnik, Medizintechnik, Maschinen- und Anlagenbau sowie Hausgerätetechnik.