DEV Community

Supriya J
Supriya J

Posted on

Layout Basics for Absolute Beginners

#css #beginners #frontend #webdesign

What Is Layout in Web Design?
Layout is simply how you arrange things on a page — header, text, images, buttons.
Good layout = clean + easy to read + comfortable spacing.

3 Simple Layout Rules:

  1. Use sections
  2. Give space between elements
  3. Make one thing the main focus (usually the heading or image) 
<header>Header</header>
<section>Hero Section</section>
<section>Features</section>
<footer>Footer</footer>
Enter fullscreen mode Exit fullscreen mode

Spacing Tip
section {
padding: 40px 20px;
}

What layout do you want to learn next?

  • Hero section?
  • Product cards?
  • Landing page structure?

Top comments (0)