Einen Augenblick bitte...
Diese Webseite ist vollständig in HTML5 programmiert. Damit entspricht sie dem aktuellen Stand der Entwicklung und hält sämtliche Browserkompatibilitäten vor. Diese prüfe ich vor Online-Stellung mit den derzeit verwendeten und gängigen Browserversionen und -varianten.
Auch die Kompatibilität zu Windows- und Mac-Systemen stehen ebenfalls zur Prüfung an. So gibt es ab und an Abweichungen, die auf Grund einer höheren Versionierung des entsprechenden Browsers ein Nacharbeiten des Quellcodes erfordern.
Besonders umfangreich wird die Programmierung beim Einsatz unterschiedlicher Endgeräte. So können z.B. 3 Textspalten auf kleineren Endgeräten auf Grund der geringeren Auflösung nicht mehr nebeneinander dargestellt werden. Besonders bei Smartphones muss die Webseite in großem Maße angepasst werden. Diese notwendigen Modifikationen werden im sog. "Responsive Design" realisiert, in der Abfragen z.B. bezügl. der Auflösung der Endgeräte, bzw. der Browser die Darstellung und das Verhalten bestimmen.
Die aktuelle Entwicklung lässt den Einsatz sog. "Bootstraps" zu. Diese sind zu vergleichen mit Vorlagen, die bestimmen, wie z.B. Grafiken, Text und anderen Medien behandelt, bzw. dargestellt werden sollen. Genau damit kann man das Verhalten der kompletten Website beeinflussen. Allerdings ist i.d.R. eine starke Anpassung dieser Bootstraps notwending, um ein eigenes Design und Verhalten zu erzeugen.
Der "normale" HTML-Quelltext wird mit sog. CSS-Dateien und Javascript ergänzt. Diese korrespondieren auch auf dieser Webseite im Verbund miteinander.
Gänzlich ausgeschlossen werden mittlerweile JAVA-Applets und Flash-Elemente, auf die ich auch hier vollends verzichtet habe. Zu viele Sicherheitslücken und abweichende Darstellung auf unterschiedlichen Endgeräten, z.T. bedingt durch die verschiedenen Betriebsysteme erschwerten in Vergangenheit immer wieder deren Verwendung.
Animierte Elemente lassen sich mittlerweile auch durch alternative Scripte darstellen, z.B. mit "Hype". Diese arbeiten ebenfalls wie, z.B. Flash mit einer sog. "Timeline" um zeitabhängige Elemente zu steuern.
Spielentwickler machen sich den Effekt der Bewegungsparallaxe bereits seit den Side-Scrollern der 1980er-Jahre zunutze, um mithilfe zweidimensionaler Mittel eine dreidimensionale Wirkung zu erzeugen. So werden in den klassischen Spielkonsolen in den Spielhallen der 80er mehrere Vorder-, Mittel- und Hintergrundebenen verwendet, die in unterschiedlichen Geschwindigkeiten auf dem Bildschirm vorbeiziehen.
Der Spieler schaut von der Seite auf das Spielgeschehen. Der Spielablauf ist strikt linear. Während sich Vorder- und Hintergrund konstant in eine Richtung bewegen, kann der Spieler die Spielfigur im Mittelgrund mehr oder weniger frei bewegen. Dadurch, dass der Vordergrund schneller am Bildschirmausschnitt (Viewport) vorbeizieht als der Hintergrund, entsteht ein Gefühl der Tiefe.
Ein Parallax-Effekt auf einer Webseite kann in HTML5 mit CSS umgesetzt werden. In meinem Fall habe ich die vertikale Parallaxe verwendet, die durch das Scrollen des Bildschirms entsteht. In diesem Beispiel zieht das Bild schneller als der restliche Text in die entsprechende vertikale Scrollrichtung.
Durch herauf- und herunterscrollen (z.B. mit der Maus) ist dieser Effekt gut sichtbar.
Es ist ein schöner Effekt, der aber auf Webseiten nicht zu oft verwendet werden sollte.
Der QR-Code (engl. Quick Response, „schnelle Antwort“, als Markenbegriff „QR-Code“) ist ein zweidimensionaler Strichcode, der von einer japanischen Firma im Jahre 1994 für die Zulieferer der Automobilindustrie entwickelt wurde.
Nutzen Sie den Code um z.B. mit Smartphones sehr schnell die jeweiligen Kontaktdaten oder Produktinformationen von Ihrem Monitor oder aus Printmedien zu scannen. Anschließend können die jeweiligen Angaben schnell in die Adressdatenbank übernommen werden.
Außerdem wird damit dem Nutzer die Eingabe erleichtert, bei der sich andernfalls Übertragungsfehler einschleichen können.
Aktuell wird der QR-Code auch gerne von z.B. Restaurants genutzt um die Speisekarte durch die Gäste mit dem eigenen Smartphone scannen zu lassen.
Im Zeitalter von COVID ist dies eine berührungslose Methode sich gefahrlos entsprechende Inhalte anzeigen zu lassen.
<< Siehe dazu auch einen Auszug aus Wikipedia zum Thema QR-Code >>
Responsive Webdesign beschreibt die Verwendung von programmiertechnischen optischen Anpassungen an das verwendete technische Medium des Betrachters.
Dabei geht es im speziellen um Größenanpassungen der unterschiedlichen verwendeten Inhalte. Somit sieht eine Webseite, die für die Verwendung mit PC's erstellt wurde, auf z.B. einem Smartphone oder E-Book-Reader in ihrer Darstellung anders aus.
Texte, die optische Aufteilungen, die verwendeten Bilder und die Orientierung (Hoch- oder Querformat) werden entsprechend der zur Verfügung stehenden Auflösung angepasst. Das erleichtert das Lesen und die Navigation auf kleineren Geräten.
Für Webdesigner stehen hierzu die sog. Cascading Style Sheets (CSS) zur Verfügung >> Wikipedia.
