A user interface must adapt to different screen sizes. Elements should be large enough and spaced correctly for both mobile and desktop views. A design that works well on a small screen may look empty or too small on a large screen.
By Pawan Nayar · from the LLOS AI Learning record
A user interface must adapt to different screen sizes.
Elements should be large enough and spaced correctly for both mobile and desktop views. A design that works well on a small screen may look empty or too small on a large screen.
A user interface needs different rules for different screen sizes. Elements that are compact for mobile can look too small on desktop. A developer must use specific sizes for desktop elements. A developer must also use specific sizes for mobile elements. This makes sure the page feels full and easy to use on any device.
A developer creates a learning game. The game looks good on a phone. The shapes and buttons are easy to tap. When a student opens the game on a desktop computer, the shapes are tiny. The buttons are small. There is a lot of empty space around them. The student finds the game hard to use because the elements are too small for the large screen.
Resolved from this lesson's own record — real definitions, not invented for this page.
More from the same record, pulled by shared topic — not written new for this page.
The code viewer must be hidden by default. A user clicks a 'View Code' button to see it.
A user asking for "no scrollbar" means all content should be visible. The layout must fit everything in the given height.
The difference between desktop and mobile views should be handled by CSS, not by having separate files. Desktop rules go inside `@media (min-width:901px)`.
Each visual element must have a specific reason for its placement. Do not scatter the same decorative items everywhere.
A user interface must adapt to different screen sizes. Elements should be large enough and spaced correctly for both mobile and desktop views. A design that works well on a small screen may look empty or too small on a large screen.