Design Principles and Advantages
What is Section Design?
In the Site Editor, you start building your site by selecting a suitable template. All our templates come with sample text, images, forms, and videos parted by sections.
This approach focuses on designing individual page segments rather than entire pages or templates. With section design, you can create multiple unique pages that maintain a consistent brand identity using elements, colors, and other design aspects.
Sections: Building Blocks for Your Website
Sections are your website's "Lego bricks" that streamline layout creation. They are ready-made templates for common website components like headers, footers, pricing tables, and contact forms. Using sections saves time and effort compared to building such components individually. Each section comes with a pre-design set of elements.
Elements: Components within Sections
Elements are pre-designed layout components, such as text, images, buttons, videos, etc., that you can add to each section to create custom, professional-looking website pages. Refer to the Elements Management article for more information about available actions.
Why is Section Design Better?
- Minimal Effort: Add various elements to existing sections to create different page layouts, reducing design work.
- Cost and Time Efficiency: Section design is more efficient than traditional one, which requires significant time and resources for similar pages with minor variations.
- Flexibility: Break down the design into independent parts that can be combined into customizable pages.
- Adaptability: Your website can evolve with your business by customizing layouts and designs using separate sections.
Benefits of Section Design:
- Design Symmetry and Consistency: Sections help create symmetrical and consistent websites that look professional.
- Proportion: Section design makes it easier to create proportional websites where all elements appear harmonious.
- Balance: Arrange elements to create balanced page layouts that harmonize with other components.
- Site Aesthetics and Architecture: Aesthetics refers to the engaging qualities of design, including lines, colors, and spacing. The website's appearance affects brand perception, credibility, and user attitudes toward content and products.
- Visual Hierarchy: Use hierarchy to show the connection between content sections and guide user attention. A successful hierarchy supports your website's goals, such as awareness, education, or conversion.
Understanding Website Structure
A website typically consists of three main elements:
- Header: The top of the webpage containing the logo, site navigation menu, contact information, social networks, buttons, and potentially a shopping cart (for eCommerce sites). The header is a global component, appearing on every page.
- Body: The central area contains unique content, such as engaging text, photo galleries, products, or articles. Body area varies from page to page. Customize the layout by combining different sections and elements.
- Footer: The bottom of the webpage contains additional information like copyright notices, quick access links, social buttons, and contact information. The footer is also a global component appearing on every page.
