Mobile Site parallel zu Desktop Site?

[pepe]

... ich bin kein Germanist

[update]

Internetsites zu winzigen Portioshäppchen atomisiere

Wir werden alle Mäuse bleiben und nie zu Adlern werden. Wird Zeit, dem gephonten Essen auf Rädern zuzurufen: "Du kannst mich mal", danach die Treppe im Ofen zu verheizen und ans Fenster zu schreiben: "Nur für Adler".
Sorry, aber von Zeit zu Zeit kommt mir die Internetbrühe aber so was von hoch

[kukki]

Während Ihr hier nett plaudert, habe ich eine erste Erkenntnis zum Test mobile Seiten:
Es ist zwar auf die Schnelle lt. Santscho ganz nett und bestimmt einfacher, eine solche zweite Seite aufzubauen, aber der Wartungsaufwand wird trotz der einen Datenbank schnell ansteigen, spätenstens dann, wenn man neue Upgrades drüberbügeln muß.
Sinn ist es eine Website wie bisher aus dem Ärmel zu schütteln und diese gleichzeitig für mobile Geräte lesbar/ anzeigbar und bedienbar zu machen. Darin sehe ich die ganze Testerei!
Daher habe ich mich gleich mit ein und derselben Installation angelegt und für die mobilen Ausgabemedien, die auch recht "intelligent" sind, eine CSS-Testdatei umgebaut.
Die wichtigste Erkenntnis dabei:
1. Mehrspaltenlayouts sind im Moment nicht zu gebrauchen, da die Kontrolle kaum bei den verschiedensten Browsern im Netz möglich ist. Die Bedienbarkeit (neudenglish: Usability) leidet darunter, Inhalte werden nicht 100% abgebildet, verschwinden im Nirmwana. Der Aufwand dafür neue Template zu erstellen ist mir einfach noch zu aufwendig, solange wie die Entwicklung von HTML5 und CSS3 noch in den Kinderschuhen steckt. (Problem: alle Internetexplodierer <=9 !)
2. Die Benutzung von EIGENEN BLÖCKEN dagegen ist ein Kinderspielt und gut zu nutzen, ohne Probleme mit der Darstellung. Sogar mein "personengebundenen Overflow" funktioniert sehr gut, hier zeigt sich dann der Vorteil eines schmalen Headers und Footers, und die einfache Bedienung des Scrollvorganges! (Ipod und iPad) haben gut abgeschnitten dabei. Andere habe ich noch nicht getestet.

Überhaupt noch kein jQuerie ist dabei zum Einsatz gekommen.
Die Bildvergrößerung (Zoom-JVscript) funktioniert nicht,zumindest beim Emulator iPod/iPad nicht!

[Oliver Georgi]

Also HTML5 und CSS3 sind auf allen gängigen mobilen Devices Standard und selbst auf den meisten modernen Browsern verfügbar.

HTML5 ist aus meiner Sicht nur ein etwas entrümpeltes und etwas stärker semantisch angereichertes HTML, letztlich reden wir über ganz wenige Änderungen, die aktuell Relevanz haben: Video/Audio ohne Flash. Ansonsten ändert sich der DOCTYPE und das war es auch schon fast. Sachen wie <header> etc. kann man getrost nicht beachten.

Mehrspaltige Layout sind ebenfalls absolut einfach zu handhaben. Wichtig ist, die Elemente der Seite inhaltlich zu gewichten.

[kukki]

Dagegen spielt OPERA mobil (Android/ Windows mobile) nicht mit, es ist alles zu sehen, aber eben nicht ordentlich bedienbar
Dafür funktioniert aber das ZoomScript

Da ich erst angefangen habe rumzuprobieren, kann ich auch nur das wiedergeben, was mit meinen Test gelaufen ist oder nicht. Da oben erwähnte Website benutzt das fliesende Mehrpslatenlayout ja auch - und es funktioniert in Opera mobile - wird aber etwas dauern, bis ich sowiet bin.
Und .... es handelt sich dabei um eine statische Demoseite, nicht eine CMS-Seite!

[EDIT:]
Soooooo, nun funktioniert die richtige Darstellung in Opera mobile auch, der Header steht still und ist oben, der Fuß steht still und unten, nur der mainBlock ist scrollbar. Die Bildervergrößerungen funktionieren halt auf dem Emulator auch, ein Freund von mir hats ausprobiert mit meiner MOTAG.de, da ließen sich die Bilder gut vergößern ( )
Klar, kein Doppelklick, sondern nur eine einfache Berührung und schon klappts mit der Nachbarin Die Breitenberechnung funktioniert noch nicht 100%ig, dass finde ich auch noch.
Und gerade bei den mobilen Geräten erscheint diese Darstellung sinnvoll, sonst kommt man aus dem Scrollen gar nicht mehr raus. Zumindestens sollten hier die wichtigsten Menüpunkte immer im Blickfeld bleiben (z.Bsp: Anfahrt/ Standort, Telefonnummern, Wegbeschreibung ...)

PROBLEM: Die definierte Höhe der Endgeräte (hauptsächlich Telefone) bereitet im Moment Kopfzerbrechen, da die unterschiedlichen Typen die Darstellung der Statusleisten unten/ oben nicht einheitlich haben. Hier ist eine gute notwendig.
[/EDIT]

[kukki]

Meinen Test habe ich ein wenig ausgeweitet und mich auch mit Ratschlägen und der Gleichen ausgestattet.

Eins ist erst einmal wichtig, das Handy, das iPad etc sind keine Desktop-PCs. Ergo - ist die Datenübermittlung teurer, unter umständen muß eine weitere mobile Website gepflegt werden. Die ersten Feedbacks auf meine Versuche mit Bekannten, Freunden und einigen Kunden hat gezeigt, dass niemand eine Einkauf, schon gar nicht stundenlanges Surfen durchführt. Man ist vielmehr darauf bedacht: Wo sitzt der Jenige (Standortermittlung), wann hat er geöffnet, Wie kann man mit ihm kommunizieren, dann das Impressum ... und schon hat man eine eigene mobile Seite.

Und jetzt wird es interessant, mit der Website in der Website. Das habe ich bereits in Aktion. Hier nun eine mobile Website zu intergrien erscheint sinnvoller, als eine weitere Website mit neuer Datenbank etc anzulegen.

Das Problem für mich scheint da die Planung zu sein, wie steuert sich die normale Website (mit frontend.css) und wie die mobile Seite (mit mobile-frontend.css)
Funktionieren alle Templates und Scripte, braucht man hier noch jQuerry-mobile ....

[pepe]

Ich meine trotzdem, es sollte mit einer Installation gehen.

Da muss natürlich genau selektiert werden, was ist wichtig und was weniger... und der eher schmückende Firlefanz wird eben grundsätzlich weggelassen... interessiert eher nur 5% der Besucher und macht viel Arbeit, ohne Nutzen... weg damit.

Ich gebe zu, dass ich anfangs auch möglichst VIEL haben wollte.
Wenn man sich aber die Seitenbesuche ansieht, bekommt man schnell mit, was gefragt ist... und das, genau das muss überall rein!

Pers. find ich's "z.u.m K.o.t.z.e.n", dass wir wieder bei der Bildschirmgröße von Nintendo angekommen sind... und schreiben die Programme dazu auf 30 Zöllern... lächerlich. Aber so ist die Welt!

[nameless1]

hallo,

um mark zuckerberg zu zitieren: "the (i)pad isnt a mobile device".

das sehe ich auch so. wie kann man das aus der <!--if:mobile--> ausschließen?

nml1

[nameless1]

das

Code: Select all

      <!--!if:Tablet-->
      <!--if:mobile-->

kann doch nicht in og sinne sein. wie hast du dir das gedacht og? ich bin mir sicher das ist durchdachter als ich es verstehe.

vor allem kann ich so zwar die mobile ausgabe hinbekommen, für desktop müßte ich die if clause allerdings kombinieren. falls das geht?

nml1

[Oliver Georgi]

Code: Select all

<!--if:device:smartphone-->
Mobile
<!--/if-->
<!--!if:device:smartphone-->
Tablet, Desktop
<!--/!if-->

[nameless1]

ich wußte es, dass da mehr dahinter steckt. danke!

[nameless1]

#1:
OBACHT! im system muß es heißen

Code: Select all

<!--if:device:smartphone-->
Mobile
<!--/if-->
<!--!if:device:smartphone-->
Tablet, Desktop
<!--/!if-->

d.h. <!--/if--> wird zum <!--/!if-->


#2:
Ist es ein Bug oder so gewollt? Wenn vor der Negation <!--!if:device:smartphone--> keine umgekehrte Abfrage erfolgt liefert er mir diese auch auf dem Smartphone aus.

Diese kann sogar leer sein, muß aber zwingend im Template sein:

Code: Select all

<!--if:device:smartphone--><!--/if-->
<!--!if:device:smartphone-->
Tablet, Desktop
<!--/!if-->

gruß

nml1

[flip-flop]

Hier grob zusammengefasst mit einem Hilfsscript: User Agent

[Oliver Georgi]

#2: Ist es ein Bug oder so gewollt? Wenn vor der Negation <!--!if:device:smartphone--> keine umgekehrte Abfrage erfolgt liefert er mir diese auch auf dem Smartphone aus.

Das war so gewollt und kein Bug. Denn üblicherweise gibt es das eine nicht ohne das andere. Die Detection erfolgte nur auf den nicht negierten Teil. Ich habe es erweitert und auch Tablet werden nun nicht mehr als Mobile Device markiert.

Leider habe ich noch keine Möglichkeit gefunden, auf Retina Displays zu testen. Gibt nichts zuverlässiges derzeit außer Kombination aus JavaScript, Cookie, Session und und und…

[nameless1]

ich habe es heute auf einem iphone testen können und (das neue?) <!---if:mobile--> greift dort nicht.