Rozdzielczości dla RWD

Cześć,
jakich najpopularniejszych rozdzielczości(szerokości) używać przy tworzeniu stron responsywnych?
Obecnie korzystam z takich:

568px
375px
667px
414px
736px
384px
600px
768px
1024px

To znaczy, że masz aż tyle breakpointów? Lista nie jest poukładana kolejnością, ale jakoś nie chce mi się wierzyć, że robisz breakpoint w 375px i potem w 384px o.O

Zrobiłem dokładnie takie szerokości jak podane na stronie: responsinator.com, nie wiem zatem czy dobrze.

Możesz pokazać stronę złożoną przez Ciebie?

Masakra. Zrób wersję dla komórek - media query dla szerokości poniżej ~500px, wersję dla tabletów i co cieńszych laptopów (do około 1366px), i wersję HD.

Zrobiłem dokładnie takie szerokości jak podane na stronie: responsinator.com, nie wiem zatem czy dobrze.

Lepiej jest robić inaczej. Zrobić mniej break pointów (od 0 do 2 powiedzmy), a potem testować na różnych rozdzielczościach i sprawdzać czy jest dobrze. Testować możesz różnie - na fizycznych urządzeniach, albo w przeglądarce pomniejszając szerokość ekranu myszą, możesz też użyć wbudowanej emulacji ekranów mobilnych w narzędziach developerskich przeglądarki https://developer.chrome.com/devtools/docs/device-mode
etc.

A nie lepiej pisać mobile first? Praktycznie 1 breakpoint czy 2 wystarczą.

Ciekaw jestem, jak taki "mobile first" będzie wyglądać na 1366x768 oraz 1920x1080.

A co jeśli dam brakpoint na 800px i 1024px(przykładowo) a ktoś wejdzie z mniejszą, to co wtedy? Wszystko od nowa ustawiać? Szczególnie to się dotyczy obrazków, które w wersji na PC są ułożone w bloku. W wersji mobilnej się rozchodzą na boki lub tworzą się niepotrzebne wcięcia.

trzeba wziąć też pod uwagę, że czasem wystarczy zrobić pewne elementy strony (albo wszystkie, jak komuś się uda), na procentach, żeby zapewnić responsywność (wtedy taki element miałby identyczne style dla każdej rozdzielczości). Albo zrobić pewne elementy na floatach czy flexie w ten sposób, że będą się zawijać jak będzie mała szerokość etc.
media queries to tylko jeden sposób na responsywność... niektóre rzeczy udaje się stylować resposywnie bez żadnych break pointów.

ŁF napisał(a):

Ciekaw jestem, jak taki "mobile first" będzie wyglądać na 1366x768 oraz 1920x1080.

No a ile chcesz wciskać breakpointów? 1, 2 są wystarczające, można 3 dorzucić dla width >=1200. Strony powinno się budować metodą mobile first niż 4k to mobile - więcej się narobisz.

A w jaki sposób miałbym np. ustawić dla wszystkich rozdzielczości taki kod:

#services-desc{
        font-size: 15px;
        letter-spacing: normal;
        margin-top: 380px;
        width: 100%;
    }

Jak widać jest ustawiony górny margines na 350px. I w teraz muszę w każdym breakpoincie stopniowo obniżać lub podwyższać tą wartość aby się dostosowała. Jak lepiej jest taki efekt uzyskać?
margin:auto; - odpada, bo nie działa takie rozwiązanie.

@Edit:
Problem rozwiązałem. Wystarczyło dodać:

clear: both;

i problem zniknął.