responsive layout, seo und navigation...

[umwelt]

hallo,

ich arbeite an einer seite am responsive layout und bin grad an der navi.
die soll auf dem pc horizontal laufen und auf dem handy vertikal untereinander aufgelistet werden, hier allerdings erst nach klick auf den button "Navi" erscheinen.

Nun gibt es ja den schönen Ansatz, erst für Mobile Browser zu optimieren und dann erst für PC... ich müsste demzufolge in der responsive-ansicht den "Navi"-Button aus visible anzeigen und auf dem PC per display:none ausblenden. aber das kann doch nicht die Lösung sein, denn display:none sollte ist ja der falsche ansatz...

wie setzt ihr sowas um?

wie bekomme ich die liste

Code: Alles auswählen

<ul>
<li><a href="#">erster</a></li>
<li><a href="#">zweiter</a></li>
<li><a href="#">dritter</a></li>
</ul>

zur oben geschilderten navi hingebogen?
welche konzepte für responsive navis nutzt ihr?

am liebsten natürlich auch noch js-unabhängig und browserkompatibel

entsprechend hin?
viele grüße!

[dein_opi]

such mal nach jquery mobile menu

es gibt da ein Script, was aus deiner <ul> nen <select> macht.. auch verschachtelt..

[MonikaTS]

js unabhängig ist auf sehr vielen Geräten nicht nutzbar..

ich nutz schon auch mal display none, weil Google nicht ganz doof ist und das erkennt

[Vegas]

js unabhängig ist auf sehr vielen Geräten nicht nutzbar...

Je nach Statikstik die man bemüht sind aktuell etwa 5% aller Nutzer ohne JS unterwegs, wobei dieser Wert mindestens dreimal so hoch ist wie das was ich in eigenen Statistiken sehe. Ganz so dramatisch ist das also nicht.

[Wojciech]

um auf nummer sicher zu gehen kannst du zuerst die navigation mit css gestalten und via @media auf die unterstützen Auflösungen anpassen. Wenn JS unterstütz wird, kannst du z.B. via javascript die gewüschten Klassen oder ID's hinzufügen.

[MonikaTS]

js unabhängig ist auf sehr vielen Geräten nicht nutzbar...

Je nach Statikstik die man bemüht sind aktuell etwa 5% aller Nutzer ohne JS unterwegs, wobei dieser Wert mindestens dreimal so hoch ist wie das was ich in eigenen Statistiken sehe. Ganz so dramatisch ist das also nicht.

ich vermut ich habe mich falsch ausgedrückt:
reine CSS Lösungen sind sehr oft eine Qual, entweder für den Desktop oder für den mobilen Nutzer,
daher sind js Lösungen derzeit fast Pflicht

[chio]

Nun gibt es ja den schönen Ansatz, erst für Mobile Browser zu optimieren und dann erst für PC...

Das sollte man nicht allzu genau einhalten..

Mach die Seite so, dass sie ohne Voraussetzungenauf dem Desktop läuft und mit Voraussetzungen auf dem Handy gut funktioniert.

Auf dem Desktop hast du alle möglichen alten Browser, viele können mit Media Queries nix anfangen, manche nicht mit JS.

Auf dem Handy gibt es keine Browser (mehr), die das nicht können und js ausgeschaltet haben. (wo schaltet man das am Handy überhaupt aus?)