Here at Pumpkin Web Design Manchester, we build websites specifically tailored to the requirements of companies and businesses across Manchester and the North West, including Blackburn and Chorley. We provide the perfect web design solutions for clients in all areas of business and industry. As a result, we have produced this guide to everything you should know about using ribbon headers in web design.
What is a ribbon header in web design?
A ribbon header is a thin header that runs along the top of the page. This is not very deep and takes up only a little of the room, so that the main bulk of your above the fold content can grab the attention visually. For such a thin header you might not think this is worthwhile, but actually this can bring a number of key benefits to your website.
What are the advantages of ribbon headers in web design?
There are a number of advantages and benefits to using ribbon headers in web design. These advantages include:
- Space for contact details
- Contrasting background colour
- Space for company logo
A ribbon header allows space for contact details
Using a ribbon header across the very top of your page allows you to add contact details to the very front of your website where it cannot be missed. These contact details could include:
- The company phone number- adding a company phone number to the the top of your landing page is a good way to build immediate trust with your potential customers. It can be very beneficial for the user experience if you add your contact phone number as a direct link for mobile users. This means that they can simply click on the mobile phone icon or number, and have this open immediately to dial.
- Social media links- If your company uses social media platforms for social media marketing and engaging with your customers or clients it can be a good idea to include your social media icons in the ribbon header. This gives your potential customers or clients an immediate link to check out your company presents online and builds trust.
A ribbon header can be a contrasting background colour
Using a ribbon header with a contrasting background colour, usually the accent colour used on the rest of your website, can be an effective artistic touch. This helps to create a slight border between the very top of your above the fold content and the address bar at the top of the screen. This visual barrier draws the eye down the page and can make your website look more professional.
A ribbon header can add space for a company logo
Making sure the company logo is one of the first things that your potential customers or clients see when your website loads is an important design consideration. However, when using design techniques such as minimalist design and large stunning hero images, adding your company logo on top of this content can be a design issue. A ribbon header can remove this problem altogether by providing space for your company logo or company name to be displayed immediately, without obstructing the design of the rest of the space.
For more information, or professional web design support, get in touch with the experts today, here at Pumpkin Web Design Manchester.