winelady
Themenersteller
Kauffrau
Content Halbgott (862 Beiträge)

Onlineshop für mobile Geräte

am 21.03.2012, 09:33 Uhr eröffnete winelady folgenden Thread
HTML5 & CSS    1376 mal gelesen    8 Antwort(en).

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

joerg
Avatar joerg
Fachinformatiker Anwendungsentwicklung
Content Gott (1941 Beiträge)
am 21.03.2012, 11:26 Uhr schrieb joerg

Hallo 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


Zufällige Umleitung zu der Startseite einer meiner Domains
Meine ungewöhnlichen Tools

winelady
Kauffrau
Content Halbgott (862 Beiträge)
am 21.03.2012, 11:32 Uhr schrieb winelady

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

joerg
Avatar joerg
Fachinformatiker Anwendungsentwicklung
Content Gott (1941 Beiträge)
am 21.03.2012, 12:36 Uhr schrieb joerg

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


Zufällige Umleitung zu der Startseite einer meiner Domains
Meine ungewöhnlichen Tools

winelady
Kauffrau
Content Halbgott (862 Beiträge)
am 21.03.2012, 14:51 Uhr schrieb winelady

Danke Jörg, ich werde das ausprobieren.


Weinvielfalt aus dem Weingut Fuchs
Fremdsprachensatz

hansen
Foren Moderator
Content Gott (1886 Beiträge)
am 21.03.2012, 15:03 Uhr schrieb hansen

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

winelady
Kauffrau
Content Halbgott (862 Beiträge)
am 21.03.2012, 17:22 Uhr schrieb winelady

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

hansen
Foren Moderator
Content Gott (1886 Beiträge)
am 21.03.2012, 17:46 Uhr schrieb hansen

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

winelady
Kauffrau
Content Halbgott (862 Beiträge)
am 21.03.2012, 18:06 Uhr schrieb winelady

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 für die Aufklärung :klatschen:. Ich hatte mich schon gewundert…

Gruß
winelady


Weinvielfalt aus dem Weingut Fuchs
Fremdsprachensatz

  • 1


« zurück zu: HTML5 & CSS

Das Seitenreport Forum hat aktuell 5275 Themen und 36110 Beiträge.
Insgesamt sind 48360 Mitglieder registriert.