Canadian Federation of Agriculture: Website Layouts
This redesign of the Canadian Federation of Agriculture (CFA) website introduces a simplified design approach that aims to offer visitors an improved navigation, an updated visual aesthetic and a streamlined approach to organizing content.
The following designs are a representation of how web pages will appear on a standard size desktop computer with a 1920×1280 screen resolution. These standard page layouts, which include specific positioning of elements such as the site header, navigation menu, box elements and site footer will also reflect how the site will display on smaller computer and tablets in landscape orientation.
The website will be developed using responsive styling, meaning that the page will be displayed proportionally with respect to the shape and size of the user’s device screen size, including mobile devices and tablets.
Homepage
The new CFA homepage includes a top ‘hero’ section which features a background video of selected scenes from the ‘Who We Are’ CFA video currently featured on the existing CFA website. An automated slide carousel will be used to display featured articles and sections as shown, with a method to navigate slides manually. Following the Hero section is the Policy & Advocacy section which displays all policy topics and recent submissions, with links to view all content on either the key issues or submissions pages. The next sections feature the atest CFA news, Upcoming events and links to CFA social media channels.
A ‘Partnership Opportunites’ section promotes sponsorship and corporate leadership opportunities, showcasing current partners with a background of scenic imagery from Canadian agriculture. The CFA Members are featured at the bottom of the page.
Homepage – Alternate Feature slide
This homepage layout illustrates an alternate feature slide (Canada-US Relations and Trade in Focus). A content manager will be incorporated in the website admin area to manage content and graphics for these slides.
Homepage – Header with notification banner
The top navigation header will include the ability to display sitewide notifications for important messages, updates or information related to news, upcoming events or current initiatives. A content manager will be incorporated in the website admin area to manage content for this section.
A language selector is also incorporated to switch the site from English to French.
Typical Content Page
This image displays the standard look and feel of interior content pages for the website. With the inclusion of different types of content, such as images, videos, illustrations, tables and pdfs, the layout will vary from page to page.
