CSS responsives Design

[Auge]

Hallo

ich möchte meine Desktop-Seite mit responsiven Design anpassen.

Auf welche Breite würde ich hier nun idealerweise optimieren, um damit die meisten Smartphones anzusprechen? Ich möchte nicht noch für die verschiedensten Smartphones auch nicht unterschiedliche Versionen machen.

Wegen des Pixeldichtenheckmecks ist es sinnvoll, die Breakpoints über die Einheit em statt px festzulegen. Wo der Breakpoint hingehört oder nicht hingehört, kannst du mit dem/den eigenen Gerät(en) testen. Bei einem Gerät hast du schon auf zwei Größen Zugriff (Hoch- und Querformat).

/* Mobilregeln */

@media (min-width: XXem) {
	/* Desktopregeln */
}

Es kann auch sinnvoll sein, das grundsätzliche Layout über ein oder zwei Breakpoints zu regeln, gewisse Teile des Layouts aber an andere Breakpoints zu binden.

Tschö, Auge