Responsive Web design [chiuso]

Oct 15 2020

Sono un designer autodidatta e oggi sto imparando da IDF. Ho qualche dubbio sul design reattivo.

  1. In qualità di designer, mentre progetto schermi da regalare agli sviluppatori, per quali dimensioni dovrei progettare schermi? Sto valutando tutti i dispositivi e tutte le possibili risoluzioni ... mobile, laptop (windows, mac), tablet ecc.

  2. Una buona risorsa o collegamento per capire come utilizzare le colonne per la creazione di schermate.

  3. Come definire i caratteri per dimensioni diverse? Sto usando la guida al Material Design per gli schermi mobili, ma come per il web? Ad esempio, se utilizzo 16 px per un paragrafo in uno schermo 1366 * 768, quanto dovrebbe essere grande il carattere per 1440, 1920, 3072 (MacBook Pro 16 ")? Sono completamente confuso nel dire agli sviluppatori le dimensioni dei caratteri per le varie dimensioni dello schermo .

Ci sono altre cose importanti che possono aiutarmi a comprendere il responsive design?

Risposte

LoreleiHeckmann Oct 15 2020 at 14:44
  1. dipende dagli sviluppatori e dai punti di rottura che stanno utilizzando, ad es. se il lavoro con bootstrap i punti di rottura saranno: // Dispositivi extra piccoli (telefoni verticali, meno di 576px) // Nessuna media query poiché questa è l'impostazione predefinita in Bootstrap

// Piccoli dispositivi (telefoni orizzontali, 576 px e oltre) @media (larghezza minima: 576 px) {...}

// Dispositivi medi (tablet, 768 px e versioni successive) @media (larghezza minima: 768 px) {...}

// Dispositivi di grandi dimensioni (desktop, da 992 px) @media (larghezza minima: 992 px) {...}

// Dispositivi extra large (desktop di grandi dimensioni, 1200 px e oltre) @media (larghezza minima: 1200 px) {...}

  1. https://www.smashingmagazine.com/2017/12/building-better-ui-designs-layout-grids/

  2. Personalmente durante la progettazione della tipografia utilizzo la scala modulare: https://www.modularscale.com/?18&px&1.5di solito per la versione desktop un buon testo del corpo è compreso tra 16 e 20 px. La dimensione dipende dal contenuto del sito web. Cioè. se si tratta di molti contenuti scritti come i giornali, considererei una dimensione maggiore. Se si tratta di una dashboard / piattaforma basata sui dati, prenderei in considerazione una tipografia più piccola.