Kann jemand einige echte Beispiele für die Verwendung von 'HTML5' in freier Wildbahn auflisten?


8

Ich benutze HTML5 auf die gleiche Weise, wie es heutzutage jeder zu verwenden scheint, was bedeutet: HTML5-Tags, Canvas / 3D / Javascript und CSS3.

Ich habe Probleme, Beispiele für Websites zu finden, die diese Technologien praktisch verwenden und nicht nur eine Demo von etwas Coolem sind, das jemand mit Canvas- oder CSS3-Transformationen oder -Formen geschafft hat.

Ich suche nach Websites, die ein schönes visuelles Erscheinungsbild haben, aber auch Dinge wie Animation, Scrollen und Offset à la Silverback oder die Leinwand nutzen, um eine interaktive und ich denke, Flash-aussehende Website zu erstellen.

Dies sind einige Beispiele, die ich gefunden habe:

Scrollen

Animation

Andere

Ich benutze HTML5 locker und ich hasse es, es zu benutzen. Ich würde mich freuen, wenn Sie eine wirklich visuell ansprechende Javascript-basierte Site auflisten würden, die jedoch nicht den HTML5-Doctype enthält.


Pirates war sehr gut, aber warum hat es so ein großes Speicherleck? Ich habe es gespielt, aber es wurde träge. Ich habe in meinem Task-Manager festgestellt, dass es sich um bis zu 1,6 GB RAM handelt! Wer es gemacht hat, muss entweder den Speicher aufgeben oder ihn recyceln. Es sollte nicht annähernd 1,6 GB erreichen. = /
Michael

@ Michael Vielleicht ist es ein Browser-Problem. Ich habe es ungefähr 2 Stunden lang ohne Verzögerung in Chrome gespielt.
Evan Plaice

Antworten:



3

Das Stack Exchange-Netzwerk (zu dem diese Site gehört) verwendet HTML5 zur Authentifizierung . Aus diesem Grund können Sie jede Site im Netzwerk besuchen. Sobald Sie sich mindestens einmal manuell angemeldet haben, werden Sie später automatisch automatisch angemeldet .

Probieren Sie es aus - wenn Sie Mitglied auf mehr als einer Site sind (z. B. hier und Stack Overflow), löschen Sie alle Ihre Cookies und temporären Dateien. Melden Sie sich dann hier an, gehen Sie zu Stack Overflow und melden Sie sich nicht an. Geben Sie ihm ein paar Sekunden Zeit, und Sie werden automatisch angemeldet, obwohl die Domänen völlig unterschiedlich sind.


1

Ja, tatsächlich habe ich es vor langer Zeit getan ... vor 2-3 Jahren, würde ich vermuten. Ich habe eine Website erstellt, auf der die Leute im Grunde genommen Dinge auf einem Grundriss bewegen können, um zu sehen, ob ihre Möbel passen. Es wurde mit JavaScript gemacht, aber das Problem war, dass JavaScript keine sehr gute Möglichkeit hatte, die Möbel zu drehen.

Damals, als der IE das Canvas-Tag nicht unterstützte, bedeutete dies, ein anderes Bild für Umdrehungen von 0,5,10 ... 85 Grad zu verwenden, und diese Bilder dann um 0, 90, 180 oder 270 Grad zu drehen um Drehungen von 90 bis 355 Grad abzudecken. Es war nicht nur ärgerlich zu erstellen, sondern es war auch ziemlich langsam in der Ausführung. FF, das das Canvas-Tag unterstützte, konnte die Möbel so ziemlich in Echtzeit drehen, aber die Rotation des IE war ziemlich schrecklich. Der IE brauchte zwischen 0,75 und 1,00 Sekunden, um zu antworten, und es war furchtbar ärgerlich, dies in Schritten von 5 Grad zu tun.


1

Hier ist eine raffinierte Flash-ähnliche Website von Chris Coyier von CSS-Tricks.com: http://chris-mcgarry.com

Chris verwendet hier hauptsächlich JQuery mit dem Ziel, dass ein Besucher die Musiktitel abspielen und zu jeder Seite navigieren kann, ohne dass die Musik stoppt.

Chris ist ein starker Befürworter der Verwendung von HTML5. In diesem Beispiel werden nicht wirklich so viele HTML5-Elemente verwendet, aber es fängt wirklich den Geist einer blitzfreien Zukunft ein.


1

Unsere Website ( We, the Pixels ) basiert auf der Verwendung des HTML5-Canvas. Wir verwenden es auf eine Art und Weise, wie Flash normalerweise verwendet wird, und mussten Flash tatsächlich für den Internet Explorer verwenden, da Excanvas es einfach nicht für das schnitten, was wir brauchten.

Die Site ist nicht nur Canvas, sondern die Hauptanwendungskomponente.



0

Ich bin mir nicht sicher, warum Sie nach Beispielen für HTML5-basierte Seiten ohne den einfachen HTML5-Doctype fragen sollten - ich möchte den eindeutigen Schalter für diesen Modus. Auf dieser Website wird das Prinzip der einzelnen Seiten mit kontextbezogenen Grafiken unter Verwendung von HTML5- und CSS3-Techniken ziemlich ausführlich verwendet: https://www.airbnb.com/annual/

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.