Meine erste Website

Wie ich euch in meinem letzten Blogbeitrag schon erzählt habe, stehen die Zwischenprüfungen vor der Tür. Um auch für den praktischen Prüfungsbereich optimal vorbereitet zu sein, darf ich den Internetauftritt der Metzgerei Vogel vom Screendesign bis zur Onlinestellung realisieren. Die Metzgerei Vogel kennt ihr bestimmt noch aus meinen ersten Beiträgen. Seitdem ist einige Zeit vergangen, in der ich mein Wissen über das Programmieren von Internetauftritten stetig erweitert und verbessert habe.

Der Internetauftritt der Metzgerei Vogel steht nun kurz vor dem Abschluss. Statt wie geplant eine Single-Page zu programmieren, ist nun eine Portalseite entstanden. Eine Portalseite ist ein Webauftritt, der statt aus einer HTML-Datei aus mehreren HTML-Dateien besteht. Diese werden mit jeweils unterschiedlichen Inhalten gefüllt und untereinander verlinkt.

Das Grundgerüst für die HTML-Seiten haben wir genau auf unsere Zielgruppe angepasst. Kunden, die schnell und unkompliziert Informationen wie Öffnungszeiten, Angebote oder die Adresse finden möchten. Daher fangen die Seiten mit der Navigation (Startseite, Über uns, Party-Service und Kontakt), der Telefonnummer der Metzgerei Vogel und dem Logo an. Die Telefonnummer haben wir im Header platziert, um den Benutzern die lediglich eine Kontaktmöglichkeit suchen, diese schnell und einfach bieten zu können.

Zwischen der Navigation und dem eigentlichen Inhaltsbereich befindet sich eine Slideshow. Sie dient in diesem Fall rein zu optischen Zwecken und um einen kurzen Einblick in die Angebote der Metzgerei zu ermöglichen.

In den Inhaltsbereichen befinden sich, je nach Thema, Informationen die den Kunden von der Metzgerei überzeugen sollen. Die Startseite beginnt mit einem kurzen Einleitungstext, der den Benutzer willkommen heißt. Weiter folgt das wöchentlich wechselnde Angebot. Auf der „Über uns“ Seite können Benutzer die Philosophie der Metzgerei nachlesen. Ebenfalls befindet sich hier eine mit Java-Script programmierte Timeline, in der alle wichtigen Eckpfeiler der Entwicklungsgeschichte der Metzgerei vermerkt sind. Die „Party-Service“ Seite informiert die Benutzer über das breite Angebot an Party- und Veranstaltungscatering, welche die Metzgerei bietet. Der Menüpunkt „Kontakt“ beinhaltet ein Kontaktformular und damit die Möglichkeit direkt mit der Metzgerei Vogel Kontakt aufzunehmen.

Ebenfalls auf jeder Seite vorhanden ist eine Sidebar die die wichtigsten Informationen enthält. Auf der Startseite befinden sich in dieser Sidebar die Öffnungszeiten, Kontaktdaten und aktuelle Neuigkeiten, wie zum Beispiel Urlaubszeiten oder Veranstaltungen. Auf den Unterseiten haben wir den Bereich „Kontakt“ ausgelassen, da hier bereits die Inhaltsseiten darauf ausgelegt wurden, den Benutzer direkt zum Kontaktformular zu leiten.

Zudem stehen die Kontaktdaten auch im Footer, genauso wie die Öffnungszeiten und eine kleine Sidebar-Navigation die es ermöglicht, auch aus dem unteren Bereich der Website zu agieren, ohne die Seite wieder hoch scrollen zu müssen. Auch das Copyright und die Menüpunkte „Datenschutz“ und „Impressum“ befinden sich im Footer. Als optisch wiederkehrendes Element befindet sich über dem Footer eine abstrahierte Kuh und ein abstrahiertes Schwein in einem hellen Grauton. Sie sollen noch einmal die Verbindung zwischen den schriftlichen Informationen und der Metzgerei an sich herstellen. Diese beiden Tiere sind ein oft verwendetes und assoziiertes Zeichen für den Fleischereiberuf.

Bei dem kompletten Programmierungsprozess haben wir darauf geachtet, das Layout sowie den Inhalt optimal benutzerfreundlich zu gestalten. Der letzte Schritt wird nun sein, die Website an alle Bildschirmgrößen anzupassen, sie also responsive zu programmieren. Schließlich soll meine erste Website auch auf dem Handy und Tablet so gut aussehen wie auf den großen Computerbildschirmen.

Ich freue mich schon euch in meinem nächsten Beitrag die Website präsentieren zu dürfen.

Viel Spaß beim Lesen!