Tables can't be imported directly. Please insert an image of your table which can be found here.
Topics discussed in this article:
Header Image Size Requirements
The header image is crucial for making a strong first impression on your Real Geeks website. Recommended sizes vary by template, and choosing the correct dimensions prevents cropping or distortion, ensuring a professional and visually appealing look.
File Format and Size Requirements
Use JPG or PNG files for the best results.
Recommended Dimensions (By Website Template):
| Template | Recommended Dimensions (Pixels) |
| Miranda | 2200 x 720 px |
| Miranda Thin | 2200 x 550 px |
| Molly | 1100 x 720 px |
| Anna | 2200 x 600 px |
| Anna-Modern | 2560 x 1440 px |
Tips for Choosing the Perfect Header Image
- Avoid Faces or Text: Some templates feature tools like the property search bar that overlay the header image. Including faces or text in your image may result in these elements being obstructed, diminishing their impact.
- Use Landscape-Oriented Images: Header images are typically displayed in a wide, horizontal format. Ensure your image is appropriately framed to avoid key parts being cropped out.
- Focus on Simplicity: Choose images with clean, uncluttered designs that enhance the look of your website without overwhelming it. Scenic views, architectural shots, or subtle textures work well.
- High Resolution is Key: Blurry or pixelated images can damage the professional appearance of your website. Use high-resolution images that maintain clarity across devices.
Finding the perfect header image doesn’t have to be expensive or time-consuming. Websites like Unsplash.com and Pexels.com offer a vast library of free, high-quality images that you can use on your Real Geeks website.
Header Video Size Requirements
In addition to header images, Real Geeks templates also allow you to use videos as dynamic background elements to make your website more engaging. To ensure smooth performance and compatibility, it’s important to follow these file requirements and recommendations:
- File Format: The video file must be in .MP4 format to function properly within the Real Geeks platform.
- Maximum File Size: Videos should not exceed 8 MB. Optimizing your video file ensures faster loading times and prevents performance issues for your website visitors.
- Frames Per Second (FPS): It is recommended to use videos with at least 30 FPS for better quality. While videos with lower FPS will still work, higher frame rates create smoother motion and a more polished appearance.
- No Maximum Length: There is no specific length restriction, but the file size must remain within the 8 MB limit. To achieve this, keep the video concise and compress it effectively without sacrificing visual quality.
Best Practices for Header Videos
- Keep it Simple: Like header images, videos should enhance your website’s design without overwhelming the visitor. Opt for subtle, professional visuals, such as a slow pan of a scenic property or a cityscape.
- Avoid Distracting Elements: Avoid videos with text, heavy motion, or complex animations that might distract viewers or clash with other design elements like the property search bar.
- Optimize for Performance: Compress your video to ensure it meets the size requirement while maintaining quality. Tools like HandBrake or Adobe Media Encoder can help with this process.
- Test Across Devices: Preview your video on desktop and mobile devices to ensure it displays and performs as intended.
By following these guidelines, you can create an eye-catching header video that enhances the professionalism and visual appeal of your Real Geeks website while delivering a seamless experience for your audience.
Logo Size
Your brand’s logo is a key element of your website, helping to establish identity and build trust with visitors. On Real Geeks websites, logos can be added to various locations, including the primary top navigation menu. While logos can technically be uploaded in any size, adhering to specific recommendations ensures a consistent and professional appearance across devices.
Primary Logo in the Top Navigation
The primary logo displayed in the top navigation is a focal point of your website’s design. Here are the key details for optimizing this placement:
Recommended Dimensions
400 x 86 pixels*
Other Logo Placements
In addition to the top navigation, logos can be uploaded in other areas of your website for added branding opportunities. For a complete list of secondary logo placement options and recommendations, refer to our Secondary Logo Locations guide.
Best Practices for Logos
- Ensure Readability: If your logo includes text, make sure it remains legible when scaled down to smaller sizes. Opt for simple fonts and avoid overly intricate designs.
- Use Transparent Backgrounds: Save your logo as a .PNG file with a transparent background. This ensures your logo integrates seamlessly with the website’s design, regardless of background color.
- Test for Mobile: Preview your logo across devices to confirm it displays correctly on both desktop and mobile versions of your website.
- Match Your Branding: Ensure your logo aligns with your brand’s color scheme and style to reinforce consistency and professionalism.
By following these guidelines, you can effectively showcase your brand on your Real Geeks website, enhancing your online presence and delivering a polished user experience.