Beitrag zur Merkliste hinzufügen
Hier kann eine Notiz zum Merk-Eintrag hinzugefügt werden (optional)
ilch Forum » Allgemein » HTML, PHP, SQL,... » parallax scrolling
| Geschlossen | ||
-
So. 12.04.2015
06:11 Uhr
#1
- Registriert seit
- 17.11.2005
- Beiträge
- 4.606
- Beitragswertungen
Hi Zusammen hat schon jemand eine parallax scrolling seite mit ilch umgesetezt? würde mich über beispiele und bestpractices freuen -
So. 12.04.2015
11:14 Uhr
#2
- Registriert seit
- 17.12.2007
- Beiträge
- 2.368
- Beitragswertungen
Ja würde mich auch interessieren.
-
So. 12.04.2015
14:43 Uhr
#3
- Registriert seit
- 28.02.2007
- Beiträge
- 3.414
- Beitragswertungen
Sieht sehr aufwendig aus, viel Grafik spiel :/ -
So. 12.04.2015
14:45 Uhr
#4
- Registriert seit
- 17.12.2007
- Beiträge
- 2.368
- Beitragswertungen
Naja je nach dem... im Grunde ist es nur die verschiebung von Elementen bzw. das mitscrollen - das muss nicht unbedingt eine Grafik sein.
-
So. 12.04.2015
14:50 Uhr
#5
- Registriert seit
- 28.02.2007
- Beiträge
- 3.414
- Beitragswertungen
Sieht zumindest sehr Interessant aus irgendwann versuch ich mal sowas hinzubekomen. -
So. 12.04.2015
19:09 Uhr
#6
- Registriert seit
- 17.11.2005
- Beiträge
- 4.606
- Beitragswertungen
an sich ist es ja nicht komplex ... mich interessiert eher die verbindung mit ilch -
Naja was heißt Verbindung, letztendlich könnte das eine große HTML Seite sein, bei der nix nachgeladen wird. Sinnvoller ist wohl aber erst beim Scrollen was nachzuladen, wie das geht hat mit ilch ja nicht wirklich viel zu tun, wie jeder andere Ajax Request auch.Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
-
Mo. 13.04.2015
08:39 Uhr
#8
- Registriert seit
- 17.11.2005
- Beiträge
- 4.606
- Beitragswertungen
ja das ist soweit klar
aber wie würde ich sinnvoll die ilch navigation weiternutzen? das ganze soll ja weiterhin übers backend gepflegt werden können.
und wenn ich da zu viel hard coded nachlade aktionen per ajax mach wird das ja schon deutlich eingeschränkt -
Du willst die Sachen, die Nachgeladen werden über die Navigation steuern oder wie?
Dann könntest du zwar die Reihenfolge konfigurieren, aber nur eine einzige.
Ich kann mir irgendwie keinen sinnvollen Anwendungsfall dafür vorstellen.Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite -
Mo. 13.04.2015
09:38 Uhr
#10
- Registriert seit
- 17.12.2007
- Beiträge
- 2.368
- Beitragswertungen
Naja also so als Konzept in Gedanken würde ich mich entscheiden, mache ich eine One Page oder ein Portfolio mit mehreren Seiten.
Dementsprechend kommt dann die Funktion des parallax scrolling hinzu, soll es Nutzerführend sein oder nur zu Dekorationszwecken?
Wenn es Nutzerführend sein soll, also von Seitenanfang bis Seitenende durchscrollt und an verschiedenen Haltepunkte, verschiedene Informationen optisch hervorhebt (Beispiel) würde ich es ausschließlich bei einer One Page einsetzen.
Ansonsten würde ich es sehr dezent in Produktbeschreibungen oder Dienstleistungen einsetzen wie es z.B. Apple sehr gut umsetzt.
Wenn es nur zu Dekorationszwecken eingesetzt wird, dann würde ich es nur an bestimmten Stellen einsetzen (Beispiel Slider, wobei zu viel für mein Geschmack).
Zur ilch Umsetzung.
One Page: Da sich alles auf einer einzelnen Seite abspielt werden grundsätzlich keine Romane und große Bilder ausgegeben, der Ladegeschwindigkeit zur Liebe - und um den Besucher nicht zu langweilen.
Daher muss hier viel mit Boxen gearbeitet werden, SelfBoxes mit dynamischen Inhalt oder anderweitige Boxen die weitgehendst im Layout fest verankert sind.
Die einzelnen Seitenabschnitte kann man dann z.B. mit einem On Scroll Header annavigieren.
Portfolio: Hier kann man wie gewohnt alle Elemente von ilch im vollen Funktionsumfang einsetzen, muss sich aber entscheiden ob man parallax z.B. nur auf der Startseite im großen Stil einsetzt oder auf mehrere Unterseiten dezent (z.B. als Deko) einsetzt.
Wenn ich parallax einsetze, würde ich es Anfangs ausschließlich zu Dekorationszwecke einsetzen damit der Fokus auf dem Seiteninhalt bleibt und nicht vom wesentlichen ablenkt.
-
Mo. 13.04.2015
20:16 Uhr
#11
- Registriert seit
- 05.03.2009
- Beiträge
- 259
- Beitragswertungen
Irgedwie vermischt Ihr hier 2 verschiedene Sachen die zwar auf der selben Technik beruhen können, aber vom aufwand her emenz auseinander gehen.
Wenn man es mal genauer betrachtet, brauch beim Parallax scrolling nichts nachgeladen zu werden. Die Technik ist aus den anfängen der JumpNrun spielen bekannt. man hat mehrere hintergrund ebenen die man in unterschiedlichen geschwindigkeiten sich verschieben lässt. Einfachstes beispiel zb. einen Wolken oder Sternenhimmel.
Was gerade bei Portfolios oder auch Firmenseiten gerne gemacht wird sind die bildwechsel auserhalb von kleinen sichtfenstern.
Wo wir dann schon wieder bei Seiten sind, die im Onepage Design erstellt sind. Aber auch da begrenzt man bei anderen CMS die anzahl an Daten die auf einer Seite dargestellt werden.
Das was hier aber schon teilweise fällt geht schon ehr in die richtung storylelling. Hier kommt zwar auch Parallax zum ensatz denoch ist der Aufwand dabei schon etwas ernormer.
Dafür ist das endresultat aber, bei einer schicken geschichte und guter Umsetzung, richtig genial.
Greetz Wizz -
Mo. 27.04.2015
13:14 Uhr
#12
- Registriert seit
- 23.03.2007
- Beiträge
- 2.425
- Beitragswertungen
mobile-autowaesche-luebeck.de/
Das dürfte solch eine Seite sein.
Im prinzip habe ich eine start.php, das ist der Inhalt der großen HTML-Datei, die als Startseite oder OnePage-Design benutzt wird. Alle anderen Seiten lassen sich wie gewohnt über die im content-ordner zur Verfügung stehenden Dateien abrufen.Nichts ist so sicher, wie die Änderung. -
Mo. 27.04.2015
15:09 Uhr
#13
- Registriert seit
- 17.12.2007
- Beiträge
- 2.368
- Beitragswertungen
Habe mich zufällig gerade in Richtung Elektrofahrzeuge erkundigt und ein echt super Parallax/Storytelling Beispiel dabei gefunden vom Hersteller Tesla.
Gefällt mir echt gut.
Zuletzt modifiziert von Ahrtas am 27.04.2015 - 15:12:13 -
Mo. 27.04.2015
16:05 Uhr
#14
- Registriert seit
- 23.03.2007
- Beiträge
- 2.425
- Beitragswertungen
Wers mag...
ich bin kein so großer Fan von OnePage Templates, deswegen setze ich sowas auch nur für Kunden um.
Was mir aber an der Parallex-Technologie reizt ist der Slider, mit dem kann man was anfangen:
externer LinkNichts ist so sicher, wie die Änderung. -
Mo. 27.04.2015
17:19 Uhr
#15
- Registriert seit
- 07.08.2008
- Beiträge
- 3.003
- Beitragswertungen
Ich finde die Seite von Tesla sehr geil.
-
Mo. 27.04.2015
19:18 Uhr
#16
- Registriert seit
- 05.03.2009
- Beiträge
- 259
- Beitragswertungen
Hier mal eine Seite die gleich mehrere themen abdeckt, der ein oder andere kennt sie bestimmt.
Flat Design / Real Design Storytelling Kombiniert mit Parallax
externer Link
und hier noch ein wenig Parallax gepaart mit animation
externer Link
| Geschlossen | ||
 |
Zurück zu HTML, PHP, SQL,... | |
Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten