Real Geeks websites have very deliberate designs that have proven to lead to high conversions. Because of this, the pages have been constructed to optimize and highlight the most important information per page that will lead to a Call to Action for the site user, thus converting them to leads. For these reasons, the landscape image appears differently across a variety of page types depending on the design template. Please follow the instructions below for best results when utilizing the landscape image.
Use this design guide when sizing your landscape images for your site. Notice that each design varies in size and scales according to the device it is being viewed on.
|Template Design||Landscape Image Size||Header Logo Image Size|
|Molly||1100×720 px||400 x 86 px*|
|Miranda||2200×720 px||400 x 86 px*|
|Miranda Thin||2200×550 px||400 x 86 px*|
*Any logo will shrink to fit in a 200×43px container while keeping its aspect ratio
The Molly design template will maintain the same header dimensions across all page layout types. This is a great option for those who prefer to standardize their sites as it will require less customization. It is an appealing template for those who may not have a team member available to focus on website layout and maintenance.
Please see below for header image display variations across the Miranda and Miranda Thin templates.
Homepage and Content Page with Search: The most important feature of these pages is the Call to Action. To focus on conversions, the header image will appear larger on these page types with search to accommodate the quick search Call to Action. The height will be fixed and the image may zoom, slightly cropping the sides of the image. Please see the bullet points above for best practices in selecting images to optimize this lead-converting feature.
Content Page without Search: These pages will not have a fixed height and will attempt to fit more of the width without zooming or cropping. This is optimized to display the content of the page as the main focus without being distracting to the potential lead. The content itself should work towards driving the user to convert to a lead and this design helps expedite that process.
About Page: This page features a full size landscape header image that captures the site user’s attention before listing the agents’ details. This is a great opportunity to showcase a visually powerful image that highlights the agency’s specialties.
Blog: The blog page for these templates will feature a slightly shorter header image than the Homepage. This adjustment is designed to focus the view of the user onto the content of the blog. Depending on the header landscape image you choose for your blog, you may choose to alter the image size to further adjust to this layout. This option is for more advanced site users who choose to use custom images. However, this user-friendly lead-converting page can also be optimized by adhering to the image recommendations above.
To see more about the different templates, click here.
The provided gallery images are optimized for viewing on a laptop screen. They all work well with the Molly template, which is offers standardized header landscape images. However, for the Miranda and Miranda Thin templates, not all of the images will be displayed in their entirety across all pages due to the variances in layout design. Please be sure to test the images on your specific template choice and adjust your image selection accordingly.
The video background file should be in a .mp4 file and has an 8 MBs file limit. It is recommended that the video should have at least 30 Frames Per Second (FPS). While lower FPS rates are supported, keep in mind that a higher FPS will result in a better quality video. There is no recommended length but only a maximum file size of 8 MBs.