Onlineshop für mobile Geräte
Redaktionelle Einordnung
Diese archivierte Diskussion behandelt Onlineshop für mobile Geräte aus Sicht der Rubrik HTML5 & CSS.
Die Diskussion bleibt als Archiv nutzbar. Für die aktuelle Bewertung empfehlen sich ergänzend neuere Artikel, Tools oder eine konkrete Analyse.
Sinnvoll nutzbar bleibt der Thread vor allem als historischer Kontext, für typische Fragestellungen und zur Einordnung älterer Empfehlungen.
Einige im historischen Thread genannte Tools, Dienste oder externe Links könnten heute nicht mehr verfügbar oder inhaltlich überholt sein. Nutzen Sie sie bitte nur mit zusätzlicher Prüfung.
Startbeitrag
Archivierter Thread aus dem Seitenreport-Forum.
Hallo zusammen,
seit einiger Zeit arbeite ich an einer Mobil-Version unseres Onlineshops. Der Prototyp (http://www.weingut-fuchs.de/m/shop/) ist zur Zeit weder vollständig noch fehlerfrei; auch die graphische Gestaltung ist noch in der Rohfassung.
Im Moment geht es vorrangig um Bedienerführung und Bedienbarkeit. Aktuelles Problem sind die Checkboxen in den Formularen, die auf Smartphones so winzig sind, daß man eigentlich keine Chance hat, sie zu treffen.
Als CSS-Formatierung verwende ich
input.bigcheck{height:50px;width:50px}.
Mein Nokia zeigt die runden Radio-Buttons richtig vergrößert an, nicht aber die eckigen Checkboxen. Für sie zeigt das Gerät eine größere freie Fläche mit Checkbox in Originalgröße am oberen Rand der Freifläche, was ziemlich seltsam aussieht.
Es wäre sehr hilfreich, wenn einige von Euch mal nach der Anzeige schauen könnten:
entweder die Seite ../create_account.php direkt ansteuern, oder
-> Startseite -> Ihr Konto -> Bestellung mit Kundenkonto, Button "weiter".
Falls jemand weitere Ideen oder Anregungen hat, insbesondere zur Bedienbarkeit der Formulare, bin ich für alle konstruktiven Hinweise dankbar.
Gruß
winelady
Weinvielfalt aus dem Weingut Fuchs
Fremdsprachensatz
Antworten
8 BeiträgeHallo Hildegard
Wie sieht das aus wenn du die Checkboxen über
[css][type="checkbox"]{height:50px;width:50px}[/css]
ansprechen würdest?
Persönlich fehlt mir in deinem Formular die Verwendung des label Elementes.
Gruß
Jörg
joerg schrieb:
[css][type="checkbox"]{height:50px;width:50px}[/css]
Hallo Jörg,
diese Syntax kenne ich nicht ist das nicht dasselbe?
Auf was für einem Gerät hast Du denn geguckt, und wie sehen Radio Buttons und Checkboxen dort aus?
Die Labels kommen später wieder rein, wenn ich mit den grundlegenden Dingen fertig bin.
Gruß
Hildegard
Weinvielfalt aus dem Weingut Fuchs
Fremdsprachensatz
Hallo Hildegard
So spricht man halt eben über bereits vorhandene Attribute bestimmte Elemente an per CSS.
www.css4you.de/wscss/css03.html
Hat den Vorteil das man den HTML Quellcode noch weiter reduzieren kann.
Von der Spezifität ist es zwar einem Klassen Selektor gleichgestellt.
Hat aber für mich eindeutig den Voteil das man alle Elemente mit dem Attribut anspricht.
Aber man könnte auch diese Methode anwenden um mit dieser Syntax deine Anweisung
[css]input.bigcheck{height:50px;width:50px}[/css]
etwas anders darstellen um dasselbe zu erreichen.
[css]input[class="bigcheck"]{height:50px;width:50px}[/css]
Der einzige Untersachied ist das Klassen Selektoren bereits etwas länger von den Browsern unterstützt werden als attributabhängige Selektoren.
Ich habe mir die Seite nur auf meinem normalen Rechner angeschaut.
Gruß
Jörg
Hallo winelady,
bitte beim nächsten Mal die URL zu Deiner Seite so angeben, dass man die auch anklicken kann. Ist mit dem Smartphone ein rechtes gepfriemel.
Beim Samsung Galaxy S Plus sieht die Seite sowohl im Mobile-Operea, als auch im Mobile-IE praktisch identisch aus - wie auf dem PC.
Die Seite lädt sehr schnell und die Radioboxen reagieren trotz der geringen Größe sofort auf antippen, sollte also kein Problem sein.
Einzig das Suchfeld unter Deinem Logo würde ich etwas weiter nach unten setzen, da man beim Anklicken auch das Logo erwischen kann.
Gruß
hansen
Nepal Rundreisen
hansen schrieb:
bitte beim nächsten Mal die URL zu Deiner Seite so angeben, dass man die auch anklicken kann. Ist mit dem Smartphone ein rechtes gepfriemel.
Hallo hansen,
sorry, das war mir nicht bewußt, daß das so schwierig ist. Wie müßte ich den Link denn angeben, damit es besser klappt?
hansen schrieb:
Beim Samsung Galaxy S Plus sieht die Seite sowohl im Mobile-Operea, als auch im Mobile-IE praktisch identisch aus - wie auf dem PC.
Die Seite lädt sehr schnell und die Radioboxen reagieren trotz der geringen Größe sofort auf antippen, sollte also kein Problem sein.
Das ist erfreulich, da die Geschwindigkeit gut ist, danke. Die Radioboxen sind also klein schade, aber zumindest scheint es zu helfen, da ich sie quasi freigestellt habe.
hansen schrieb:
Einzig das Suchfeld unter Deinem Logo würde ich etwas weiter nach unten setzen, da man beim Anklicken auch das Logo erwischen kann.
Im Kopfbereich werde ich sicher noch ein bißchen schieben müssen. Ich bin noch nicht so ganz entschlossen, was dort noch hin muß.
Grundsätzlich finde ich Suche oben jedenfalls nicht verkehrt, auch wenn die Eingabe des Suchbegriffs am Smartphone nicht gerade komfortabel ist. Alternativ könnte ich eine eigene Suche-Seite einrichten, und oben im Kopf nur einen Link dahin unterbringen.
Gruß
winelady
Weinvielfalt aus dem Weingut Fuchs
Fremdsprachensatz
winelady schrieb:
sorry, das war mir nicht bewußt, daß das so schwierig ist. Wie müßte ich den Link denn angeben, damit es besser klappt?
Hallo winelady,
bitte ohne Klammern. :lol:
(http://www.weingut-fuchs.de/m/shop/) www.weingut-fuchs.de/m/shop/
Sonst muss man den Link als Text kopieren und dann in der Browserzeile einfügen,
das ist nicht mal mit kleinen Fingern ein Vergnügen.
Gruß
hansen
Nepal Rundreisen
hansen schrieb:
bitte ohne Klammern. :lol:(http://www.weingut-fuchs.de/m/shop/) www.weingut-fuchs.de/m/shop/
Hallo hansen,
wieder was gelernt, danke fr die Aufklrung :klatschen:. Ich hatte mich schon gewundert
Gruß
winelady
Weinvielfalt aus dem Weingut Fuchs
Fremdsprachensatz