UX Update: New Race Website Template

Hello Everyone!

As you have heard, we’ve made some big updates to our race websites.

We wanted to discuss the thought process behind the design.

Our goal was to create a modern and responsive design that will provide you with the best tools to present your event to your participants.

Let’s explore the design in detail:

Header section

The new header utilizes a horizontal navigation with new dropdown menus. If you have lots of navigation items we have you covered. When you navigation goes over five items we create a “More” menu that holds the remaining navigation items.

In addition the header houses the Sign Up and Donation buttons. The location and size of the buttons provide clear paths to your registration and donation pages.

Not crazy about your header background color? No problem, you can change your header background color to any of your theme colors in our new options section on the race theme page.

Fixed Header

What is a fixed header? You know when you scroll down a webpage and see that small header appear at the top of the browser window with important info? That is the fixed header. Your website comes with this cool new feature built in.

It provides your participants the opportunity to easily access the Sign Up and Donation buttons anywhere on your webpages.

This feature can be turned off on the race theme page.

Featured Image

The feature image section gives you the opportunity to personalize your website.

Use one of our cool banner images or upload your own. In the default mode we nicely present your race title, location, date, and directions over the image.

If this is not your favorite we have another layout option that moves the race title and race details above and below the image. This layout gives priority to the image by removing the dark gradient. Perfect for images that use text or logos.

Event Tiles

The event tiles might look familiar. They look very similar to the event tiles in the registration path. This was no mistake, we want your website and registration to look consistent and professional. No matter how many events you have they will stack neatly in the events section. If you have more than 8 events they will be hidden and can be revealed with a view more button.

You have two layout options for the event tiles: Grid and List. This can be changed on the race theme page.

Interior pages

Your interior pages now have their own header!

A simplified version of the homepage header, it is smaller and features your theme colors. This new header lets your content take priority and has a professional look and feel.

Footer

The new footer is designed to reflect and re-enforce your brand. It is themed with your colors and features your logo.

Mobile Experience

The experience on a mobile device is just as important as desktop.

We have designed the new race website to look great on all mobile devices. Your content will scale and reposition on mobile devices for the best user experience.

Notice the menu icon in the upper left? Click it and you will discover our new mobile navigation menu! Built specifically for mobile devices, it gives your participants easy access to all your content.