Fluid layout
Your content must be visible and accessible on any device size
âī¸ Grids and column help you ratio your content appropriately
Breakpoints
Identify when to change your structure and how it will look
âī¸ Focus on ultra wide, desktop, tablet and mobile
Typography
The size of your text on each device size
âī¸ Scale your headings (a H1 should not be the same size on desktop and mobile)
Change in selection area
The area for a user to select an element e.g. text field or button
âī¸ Mobile devices can afford larger space to select a button or text field as desktop devices typically have a mouse in use with finer accuracy and reach
Scalability
Minimising content and adding to it at the right screen size
âī¸ Keep content and visuals simple and minimal as possible on mobile, with a top down view
âī¸ Desktop and tablet can be more abstract and grander in visuals as more is visible at one time
Vector files for images
An SVG allows any visual to be at 100% resolution at any size. One file fits all device sizes in being perfect in quality.
.jpg){kind=tracking}
