BEAUTIFUL WEBSITE DESIGN TEMPLATES MADE IN COLLABORATION WITH THE BEST DESIGNERS IN AUSTRALIA
A WEB BUILDER FOR DESIGN
An all in one web design tool kit. Design in the editor without code, or get under the hood to write HTML, CSS & JS. Be the designer every business loves and make beautiful drag and drop layouts for your clients to enjoy.
A CMS FOR BUSINESS
Watch as 1000's of Drag and Drop layouts are instantly tailored to your Brand. Manage content in moments with a beautiful visual editor, supported by powerful dynamic widgets to serve news, galleries, media, docs and more.
FINANCIAL FREEDOM FOR PARTNERS
Grow a recurring revenue stream by submitted a design to MOBLE. Track the success of your designs and monthly revenue. Manage your website clients and even share Layouts with your Team members.
With the Frame Tools you can create any combination of content types that you desire. Once you have layouts that you like you can save them to reuse them on any page in the future. Just click the Layouts tab at the top left of this page to view your saved Custom Layouts.
Paul Davenport | 3 min read | 5 min video
NEW VIDEO IN PRODUCTION. STAY TUNED VIA YOUR INBOX OR SIGN UP NOW
In Episodes 2 and 3 of this Series, we learned how to choose a Header and customise it with the elements that were right for your business.
In Episode 5, you decided upon your primary colours, and if you used the Sync palette button our AI had a play at picking your entire colour palette for you in a logical way that worked with those colours. Now in Episode 6, we'll take a look at how you tweak your colours, and after this session, your website will really start to come alive and feel like the end product.
In Episode 5 you decided upon your primary colours, and if you used the 'Sync Palette' Button our AI had a play at picking your entire colour palette for you in a logical way that worked with your colours. However, the AI is still very much a baby and no doubt you'll want to customise it some more.
In the colours area, scroll down to 'Header Colours' and you will see all of the elements of your Header that you can play with.
The House Rules here are again 'keep it simple', especially if you're not a seasoned designer. Less is more.
Let's articulate this with an example of some of the horrible things that you can do with a Header. In the example below, you can see DESIGN A and DESIGN B.
In Design A, the designer got a little carried away with trying to use any colours of the Fictico brand. If the objective was to get people to take action by clicking the Call-to-Action button, then this Header will most likely fail, since the pick and mix style of colours is perhaps creating too much noise and distraction.
In Design B, our AI was programmed to keep it simple. It didn't sway from the Primary colours and used them with White so that there was no conflict, the Call-to-Action was prominent. The Designer then simply customised the Header (as you learned in Episode 3) to make the buttons more inviting.
Notice that both the Search and Menu buttons didn't even have a background colour. There is often a temptation to complete every element of the colour palette, though this is really not required. If you don't need a colour, then don't use it, always remember to keep it simple and less is more.
DESIGN A: Trying too hard
DESIGN B: Keeping it simple
Now let's use the Colour Key below to understand what each colour element does.
The main background colour.
The Header Menu Text.
The mouseover text.
The text or accent line that indicates you're on a particular page.
When you scroll down a page your Header background can change colour.
When you scroll down a page your Header Text can change colour.
You can also change the Background, Text, Hover, and Active colours for your Dropdown Menus.
The Menu Button Background and Text colours.
The Menu Drawer Background and Text colours.
The Action Button Background and Text colours.
The Link Button Background and Text colours.
The Search Button Background and Text colours.
The Top Bar replicates utilises of the elements above and adds new options for the Top Bar Colours.
Do it yourself or Hire a Pro! We serve all businesses from SME's to Enterprise. Talk with us for custom website design and website development, ecommerce websites, directories, intranets and social networks.
Learn how to design and manage your website