top of page

Copied

WEBSITE ESSENTIALS

Extravaganza is dead, long live minimalism: Designing a clean layout

Wix Team

Extravaganza is Dead, Long live Minimalism Designing a Clean Layout
“Underwonder”

You might not hang a Piet Mondrian in your living room, but when it comes to web design “less is more” serves a different purpose. I’m not referring to minimalism as a design aesthetic but as the very foundation of your interface. From purveying a clear promotional message to designing effective navigation, minimalism plays an important part in your website’s structure. Plus, if you're looking for a website that proves your in-the-know, minimalist websites are a web design trend that keeps making its way back.



piet-mondrian-nike-dunk-low-sb-3



When it comes to learning how to design a website in a minimalist style, a website layout that embraces minimalism is a useful approach to keep in mind. First build the structure – with clean lines and a good use of white space. Once you have your clearly built interface layout you can then incorporate your personal design concept.

Remember that creating a website isn’t always about fancy techniques, too much sparkle and flashes can create a chaotic messy feeling and distract the eye. To help with this we've prepared some tips to get you started and with them, some great web design inspiration examples and web design statistics too.



Preparing Your Layout

Wix Rulers- A Quick Easy Design Grid

You can build your design grid through Wix. Click on Arrange – Rulers, you can add as many rulers that you like by dragging them out of the main ruler. When you open a new page on your website, the grid will remain consistent with the original plan. It will help you organize your graphic elements as well as keep them aligned. To close the rulers, click on the small arrow on the top right.



A3--Wix-grid

What’s on the Menu – The Navigation Bar

Your site should include a navigation bar. Whether horizontal or vertical it should always appear on the top of the page in your website header, and be easily accessible from each section of the site. Always keep it visible, and if adding sub-menus for more detailed viewing, or even a hamburger menu (which would allow for more space on your homepage), make sure the visitor can find their way home. Check out how Ben Hulse uses the menu bar on his website:



A2_ben hues website

Adding a Menu on Wix:


  • Click on Page Parts – Add Mini page.

  • Click on “Add Menu”. You can choose between horizontal, vertical and thumbnail menus.

  • Under “Menu Settings” you can play with the menu properties.

  • Use the “Manage” and “Format” options to edit the text.



A4--Menues

Fun Tips and Tricks for Keeping an Organized Work Space:


  • The alignment box, Ctrl-k or “Arrange”- alignment options.

  • Grouping – by selecting two or more elements simultaneously a small box will appear on the top left. Clicking it will connect the elements allowing you to edit them together.

  • The transform box – under “Arrange”- the transform box gives you the option to move graphic elements around accurately by the pixel. This makes it easy to design an accurate layout.

  • Locking elements – Once you planned your web layout, locking each element into place will create an easy work flow.

Keeping your work space organized and taking time to plan your layout will allow you to build your own great accessible website. Of course, always update your website in the future to keep it relevant for users, or opt for a website redesign when you feel it is necessary.

And some thinking material for the weekend: “Things should be made as simple as possible, but no simpler.”—Albert Einstein


Learn more about how to make a website with our extensive guide.



Was this article helpful?

bottom of page