Code Organization

Well-organized HTML is easier to read, maintain, and debug. Learn formatting conventions and organizational best practices.

Consistent Indentation

Best practices:

• Use 2 or 4 spaces (pick one, be consistent)
• Indent child elements
• Align closing tags with opening tags

Attribute Formatting

Attribute conventions:

• Single line if short
• Multi-line if many attributes
• Use double quotes
• Boolean attributes don't need values

Logical Grouping

Comments

When to comment:

• Section dividers
• Complex component explanations
• Temporary TODOs
• Non-obvious code reasoning

File Organization

Semantic Structure Recap

DRY Principle (Don't Repeat Yourself)

Exercise: Organize Messy HTML

Clean up and organize this messy HTML:

Well-organized code is professional code!