Standard Website Design Tips
Gameday provides a number of tools to help you design a professional website.
Follow these tips to create an engaging and user-friendly experience for your members and fans.
Note: Website Template changes are not available for Football/Soccer Websites.
1. Association/Club Logos and Page Headers
Logos and banners are important visual indicators that tell your audience they are visiting the right website.
By following a few simple steps, can make sure that first impressions count!
1.1 Logos
Your logo is an important connection your audience will have with your website.
Below are some steps to consider when adding your logo:
Ensure your logo is the right size (200 pixels x 200 pixels)
Make sure your whole logo fits into this size dimension (i.e. Resize your logo rather than cropping it to fit the size requirement)
Use a high resolution image
If you have recently changed your logo, ensure that latest version is uploaded to your website as soon as possible
Make sure your club or association name within your logo. If not, you can add your logo in the page header section (See 1.2 Page Headers).
Avoid using a logo that isn’t identifiable with your club or association. For example, using an association logo instead of your club logo might confuse visitors and drive them away from the site. If this is unavoidable, ensure the correct club or association name sits alongside the logo.
To add or update your logo:
Login to Passport
Go to ‘websites’ and select the relevant site
Click the logo icon to the left of your website name (If you have already uploaded a logo, it will display your existing logo)
Upload your logo from the gallery or from your computer
Select ‘Update’
1.2 Choosing Themes
Ga provides a number of default themes that can help you get up and running quickly, but to really strengthen the branding of your website we recommend using the advanced colour palate tools.
You can set colours for headings, page titles, backgrounds, menus and tag lines.
To do this, find out the colour codes of your primary and any secondary colours, associated with your club or association.
Then follow the below steps:
Login to Passport
Select ‘Colours’ under the Manage Display section
Enter the colour codes in the field provided. You can customise where you can feature your primary and secondary colours on menus, headings and backgrounds.
Check the ‘Preview Colours’ section. This will preview how the colour themes will display on your site.
Click ‘Update’
If you’re unsure of your club or association colour codes, you can select the colour box next to the code field. This will bring up a number of colours. Select which options give you as close to your desired colour scheme as possible.
Some other things to note regarding colours and themes:
It’s very important that text is easily readable for users. When previewing your websites theme, consider that visitors to your site will be trying to easily navigate to the page(s) they want, and may be reading a lot of text.
Try and stick to your primary and secondary colours where possible, and use neutral colours such as black, grey or white to compliment these. Using a large number of colours that are not related to your club or association will confuse and disorientate visitors to the site.
1.3 Club and Team Logos – Fixtures & Results
Associations and Leagues can elect to display the logos of their teams and clubs within their competition pages, providing the teams and clubs have uploaded their logos.
We recommend displaying logos on your competition pages as it is more engaging for visitors and it helps uses to find the information they are looking for.
Instructions on how to do this can be found here.
1.4 Custom background image
If you would like to have a custom image appearing as the background on your standard website you will need to submit a support request to get this added for your website: support@sportstg.com
The correct dimensions that this image needs to be is: 2560px wide with a 996px wide gap in the middle (as this is where the content of the website sits), while the height of the image should roughly be between 900-1000px.