Smartphone-Version: Wie geht's per Klick zurück in einen Layoutbereich/Register

[aurora]

Teste gerade die Smartphone-Version von NOF für meine Website. Da der Platz innerhalb der "Klappregister" (Layoutbereiche) doch recht knapp bemessen ist für Fotos, habe ich ab der 3. "Klappleiste" jeweils einen Link zu einer einspaltigen Fotoseite gesetzt ("...mehr > ") :
mobil.fincas-lanzarote.de

Um von dort aus zurück zu kommen ins jeweilige Register, habe ich einen history.go(-1)-Button gesetzt.

Auf meinem Laptop werde ich leider nicht ins jeweilige Register zurückgeleitet beim Klicken auf diesen Button. Deshalb habe ich es mit dem Setzen eines Ankers innerhalb eines "Klappregisters" versucht; aber auch das funktioniert nicht. Jedenfalls nicht auf meinem PC (leider habe ich weder Smart- noch iPhone zum Testen). Die Variante mit Anker ist die 4. "Klappleiste" von oben.

Wie kann ich es bewerkstelligen, dass der Betrachter zurück ins Ausgangsregister gelangt? Funktioniert das sowohl bei Smart- als auch bei iPhones, oder sind noch spezifische Unterschiede zu beachten?

Grüße

claudia

PS: Funktioniert es evtl mit dem Zurück-Button, das sich auf den Geräten befindet? D.h. könnte ich vielleicht sogar auf eigene "Zurück"-Buttons verzichten?

[mia]

Hallo Claudia,

es gab in letzter Zeit einige Threads zum Thema Mobile Website mit NOF hier im Forum.
Z.B. diese hier:
https://www.nof-community.de/index.php/topic,257.msg3438.html#msg3438
https://www.nof-community.de/index.php/topic,628.0.html

Der Assistent von NOF (mit dem ich mich eigentlich noch nie näher befasst habe...) erstellt dir eine so schmale Website, die auf den meisten Smartphones auch nur so schmal dargestellt wird.
Unten mal die Ansicht von einem iPhone. Auf meinem Nokia sieht das genauso aus.
Klar, kann ich das vergrössern, das ist aber nicht der Sinn der Sache.

Wie in dem einen Thread zu lesen, hat sich nettesekel mal darüber Gedanken gemacht, welche Größe man am Besten für Smartphones verwenden sollte, damit die Bedienbarkeit noch gegeben ist. Und da kommt auch demnächst mehr Info dazu.......

Wenn man deine Fincas aufruft und auf Mehr drückt, und dann von der Foto Seite auf Zurück geht, dann zeigt das iPhone und auch mein iPad wieder die entsprechende Finca an. Aber der Mehr Button ist dann verschwunden....
Mein Nokia Smartphone landet beim Zurück Button wieder auf der Startseite.

Gruss
Mia

[aurora]

Hallo Mia,

vielen Dank für's Testen. Komme mir ein wenig wie ein blindes Huhn vor, da ich ja kein solches Gerät habe, aber halt feststelle, dass immer mehr Gäste von einem mobilen Teil aus anfragen (scheint ein extrem beliebtes Weihnachtsgeschenk gewesen zu sein ..).

Schade, dass nur eine winzige Seite angezeigt wird. Und schade auch, dass per Zurück-Navigation nur Apple-User ins jeweilige Register zurück geleitet werden. Hatte mir das irgendwie anders vorgestellt.

Die "mehr .."-Buttons hatte ich als NOF-Navi-Button eingefügt. Das scheint also nicht zu funktionieren. Habe das eben durch ein Bild mit entsprechender Verlinkung ersetzt. Vielleicht hilft das schon mal.

Einfach nach dem Motto "NOF-Template auf - Inhalt rein - rasch hochladen" geht also leider doch nicht. Werde gespannt auf weitere Infos hier im Forum warten.

Vielleicht ist dann auch zu erfahren, wie sich meine quasi ausgelagerten "mehr.."-Seiten bzw. insbesondere die dort zu findenden Fotos automatisch an die jeweilige Bildschirmgröße anpassen.

claudia

[mia]

... insbesondere die dort zu findenden Fotos automatisch an die jeweilige Bildschirmgröße anpassen.

Ne, dafür wirst du keine Anleitung bekommen (können).

Wenn du die anderen Threads gelesen hast, dann geht es ja eigentlich nur darum, beim Erstellen für mobile Geräte eine Lösung/Größe zu finden, die eine leichte Bedienbarkeit möglich macht.
Denn wie ich schon in einem Post sagte, jedes gängige Smartphone ist heute in der Lage, deine ganz normale Website anzuzeigen. In voller Größe. Und die ist auch bedienbar, wenn man die Vergrößerungsfunktionen nutzt.

Wenn man eine extra Mobil-Version zur Verfügung stellt, dann sollte diese eben einen goldenen Weg finden, Bedienbarkeit zum Einen und ausreichenden Content zum Anderen.

[aurora]

jedes gängige Smartphone ist heute in der Lage, deine ganz normale Website anzuzeigen. In voller Größe. Und die ist auch bedienbar, wenn man die Vergrößerungsfunktionen nutzt.

Das mag so sein, ... nur leider werden nach meiner Erfahrung zumindest die vielen Texte dort nicht mehr besonders gründlich gelesen bzw. verarbeitet: Viele Smartphone-User stellen Fragen, die auf der Website sehr ausführlich beantwortert werden. Deshalb möchte ich gerne auf die neuen Anforderungen, ein Angebot im Web so simpel wie möglich darzustellen, reagieren. Zumindest als Option zur herkömmlichen Website.

Mir schwebt letztendlich als Smartphone-Version so eine Art selbsterklärendes Mini-Bilderbuch für Lesefaule vor. 

claudia

[mia]

Hab mir eben nochmal deine normale Website mit dem Smartphone angeguckt.

Die Bilder kommen gut, da muss man erstmal wenig vergrößern um einen Überblick zu bekommen.
Nur bei den Texten und den Navi Buttons da hapert´s. Das muss man doch stark vergrößern, um lesen zu können.
(deswegen wahrscheinlich auch die Nachfragen)

Also, du weisst, wo du bei der Bedienbarkeit ansetzen musst.
Größere Texte und besser angeordnete, lesbare Buttons....

Aber alles in allem, was ich eigentlich sagen wollte, dieser Assistent für "Mobile Seiten" , der taugt eigentlich für moderne Geräte nicht viel, darauf kann man verzichten.

[joya]

Die extra Seite für deine faulen  mobilen Leser kannst du dann so  "zwischen den Head" Tags deiner normalen Website einbauen.

<script type="text/javascript">
if (screen.width<600)
window.location = "./mobile/index.html";
</script>

[aurora]

Wenn man eine extra Mobil-Version zur Verfügung stellt, dann sollte diese eben einen goldenen Weg finden, Bedienbarkeit zum Einen und ausreichenden Content zum Anderen.

Das ist sozusagen mein derzeitiges Problem - auf den Punkt gebracht. Das mit der Bedienbarkeit hapert nun leider noch. Ist ja nicht so eilig; beizeiten wird sich schon eine Lösung finden. Das war bei NOF eigentlich schon immer so.

Werde nach wie vor daran festhalten, eine separate Version für Smartphone-User anzubieten, anstatt eine "es-allen-Recht-zu-machen" Zwitter-Version zu erstellen und dadurch möglicherweise Google zu ärgern. Da bleibe ich solange stur, wie Google meine Website heiß und innig liebt. Die Smartphone-Version betrachte ich zur Zeit noch als 'Spielzeug'-Variante für jene, die über unsere Hauptseite gekommen sind, und also noch nicht als separate Website. Das wird sich in Zukunft vermutlich ändern, je mehr Smartphone-Varianten es geben wird; und je mehr sich die Suchmaschinen darauf spezialisieren werden.

Die extra Seite für deine faulen  mobilen Leser kannst du dann so  "zwischen den Head" Tags deiner normalen Website einbauen. ...

Vielen Dank für die Info. Ist das der Tag, den man einfügen muss, damit Smartphone-User automatisch auf die Smartphone-Variante weiter geleitet werden?

Wenn ja: Ich persönlich halte von Navigations-Diktaturen recht wenig, sondern setze darauf, dass der User selber entscheiden möge, wo, wie und was er liest. (seshalb ist das noch verwaist aussehende Rechteck oben links auf meiner normalen Website, dafür gedacht, eines hoffentlich baldigen Tages ein Smartphone-Symbol mit entsprechendem Link dort zu setzen).

Sollte es in Zukunft allerdings Norm werden, das so zu handhaben, werde ich mich dem nicht entziehen. Schauen wir mal. Man soll ja nie Nie sagen..

Noch eine Frage zum Tag: Meine Smartphone-Variante liegt auf einer separaten Domain, und nicht unter einem Verzeichnis "mobil", so wie die Subdomain mobil.DOMAIN.de vermuten lässt. Wie müsste der Tag lauten, um auf eine andere Domain automatisch zu leiten, in meinem Fall eine .....com-Domain  und dort im Unterverzeichnis  "mobil-D"?

claudia

[joya]

./mobile/index.html

der Punkt steht für die Hauptdomain, dann kommt dein Unterverzeichnis hinter den Backslash/ und da kommt dann die index.html rein.

[aurora]

Bräuchte noch einmal Eure Unterstützung:

Habe nun eine neue Testversion erstellt; allerdings nicht mit Hilfe vom NOF-Template, sondern ziemlich klassisch. Dabei werden die Aufklappregister nur vorgetäuscht.

Diese Testversion liegt zur Zeit hier:

http://www.fincas-lanzarote.de/test/

Eine Freundin sagte mir nun, dass auch diese Version sich auf ihrem iPhone als Mini-Bild präsentiert. Auf Smartphones ebenfalls?

Da es sich letztendlich um nichts anderes als um eine Tabelle handelt, in die ich Navibuttons eingefügt habe, frage ich mich nun, ob und wie es sich hier bewerkstelligen lässt, dass die Seite eine Mindestgröße von 300 px hat, wenn sie aufgerufen wird.

Habt Ihr einen Rat?

Vielen Dank im voraus

claudia

[mia]

Klar, deine Freundin mit ihrem iPhone sieht deine Seite immer noch als Minibild.
Denn deine Seite hat ja immer noch eine Breite von ca. 300 px.

Wir hatten doch im Thread bisher ( und auch in den weiterführenden Links) schon jede Menge Hinweise auf die Auflösungen der mobilen Geräte gegeben.
Selbst wenn du kein iPhone oder Smartphone besitzt, so kannst du dich doch mal im Netz schlau machen, welche Auflösungen diese Geräte haben.

Hat deine Freundin ein iPhone 4, so hat das eine Display Auflösung von 960 x 640px. Die neuen iPhones 5 haben 1136 x 640 px.
Die Smartphone haben heute auch schon 1280 x 720 px. Und die neueren Modelle sogar 1920 x 1080 px.
(Das ist eine Auflösung, die ein guter Monitor heutzutage auch vorzuweisen hat.)

Und diese Pixelanzahl wird dann auf dem Phone Display von ca. 10 x 5 cm Grösse dargestellt.

Kannst du dir vorstellen, dass also deine 300px breite Seite aussieht wie eine Schiessscharte. Erkennen kann man gar nichts. ( ohne Vergrösserung).

Also mach die Seite breiter, 600 px sollte sie schon haben, kann auch 700 sein.
Mach die Buttons gross, und die Schrift darauf auch ( Deine letzte Idee ist garnicht schlecht).

Und um dir das ganze auch noch anschaulich vorzustellen:
Ich weiss zwar nicht, wie gross dein Monitor zuhause ist, aber wenn er in der Auflösung  den neueren Smartphones entspricht, dann erstell eine Seite in den vorgeschlagenen Massen, publiziere mal lokal.
Dann stehts du auf, gehst 2 Meter zurück und wenn du dann noch was erkennen kannst, dann bist du auf dem richtigen Weg.... 

Gruss
Mia

[aurora]

Hallo Mia,

ach so; so langsam dämmert's bei mir. War immer davon ausgegangen, dass Einstellung auf px - im Gegensatz zu pt - die Größe sozusagen festbrennt, ganz unabhängig von der Bildschirmauflösung.

Werde mal weiterbasteln und meine Tabellen auf 700 px breit ziehen. Melde mich sodann wieder.

claudia

[aurora]

Sooodale, habe heute Abend mal probehalber die Seite auf 700 px Breite gezogen, was ja in meinem Tabelleformat recht flott geht. Auch die Fotos der ersten 3 Häuser (die anderen sind noch auf 305 px Breite) habe ich größer gezogen (was allerdings nicht sehr flott geht..);

> wobei sich mir dann sogleich die Frage gestellt hat, ob ich für eine User-taugliche Version tatsächlich jedes Foto nun in bester Qualität auf 700 px hochzuladen habe, oder ob meine "gedehnten" Fotos passabel aussehen auf den multifunktionalen, komprimierungsfreudigen Mini-Geräten à la Smart- und iPhone (..ich habe übrigens noch nicht einmal ein Handy  - vielleicht erklärt das ja meine seltsamen Fragen).

Beim Umgestalten habe ich - wie angeraten - ziemlich große Buttons erstellt; und die Schrift auf eine Größe, die meinen kleinen Laptop hier schon fast an seine Darstellungsgrenzen treibt.

Im Internet habe ich einige Websites gefunden, auf denen das Ausshen angeblich geprüft wird. Nur welcher Website soll ich trauen? Mal sieht es viel zu groß aus, mal ok, mal ist gar nichts zu sehen usw.

> Ist die iWelt überhaupt annähernd darstellungskompatibel mit anderen Smart-Produkten?

Die meisten Anfragen über unsere Website stammen allerdings von Apple-Usern, dicht gefolgt von Samsung-Usern (in den Welt der grenzenlosen Wohlfühldiktaturen bleibt ja nichts geheim..).

claudia

[mia]

Das sieht ja schon mal gar nicht schlecht aus.
Jedenfalls wesentlich benutzerfreundlicher auf dem Phone.

Deine normale Schrift wird allerdings von verschiedenen Browsern unterschiedlich interpretiert. Auf meinem Nokia mit dem IE ist deine Standardschrift sehr gut lesbar und etwas grösser als die Schrift deiner Buttons.
Der Safari vom iPhone und iPad interpretiert die Standard Schrift etwas kleiner, etwa in der Grösse der Navi Schrift.
Ist aber auch noch lesbar.
Nur die Erstinfo unter den einzelnen Fincas über m2 usw. erscheint etwas klein.

Die grösser gezogenen Bilder sind nicht superscharf, es geht aber, Note 3 minus.

Nur der blaue Email  Button in Kontakt ist sehr klein geraten, nicht lesbar wirklich.

Und von selbsternannten Testseiten halte ich eigentlich nicht viel.
Über deren Seriosität kann man bestimmt streiten.
Da gab es z.B. mal eine Seite, nannte sich iPad peek oder so. Dort sollte man testen können, wie die eigene Site auf dem iPad aussieht.
Dort wurde allerdings nur ein Bild eines iPad gezeigt, das Display war ein iFrame und in dem wurde dann die Website so dargestellt, wie man sie auf jedem normalen Rechner sieht. Also absoluter Humbug....

Was man nicht selbst getestet hat, sollte man auch nicht glauben.
Also wirst du deine Freundin mit dem iPhone engagieren, dir Feedback über deine Site zu geben. Und vielleicht findest du ja noch jemanden, der auch mal mit anderen Phones gucken kann.

Gruss
Mia

[aurora]

Vielen lieben Dank. Auch das hilft mir sehr.

Habe jetzt mal meine Testversion unter:
http://www.fincas-lanzarote.de/test/

vom Netz genommen, da ich erst nächstes Wochenende wieder weiterbasteln kann.

Mein Ausgangsproblem mobil.fincas-lanzarote.de lasse ich aber noch online; es könnte ja sein, dass andere User dasselbe Problem mit dem NOF-Template haben.

Grüße aus der Sonne

claudia