Nautical Chart: The 4 Golden Tips of Web Navigation

Nautical Chart_The 4 Commandments of Web Navigation-ywf

In today’s world, the term universal design refers to a design philosophy in which a product is usable by anyone with a disability. It began though, as a school of thought that represents a concept of designing a product or an environment that is universally acceptable. Take for example, car door handles.

Whether it’s a Lamborghini or a Corolla, you know instinctively how to open the door even if the door itself opens in a different way. Every car manufacturer from America’s Ford, Sweden’s Volvo, Japan’s Toyota etc follows the same design principle with their door. Sure, there are a few of stylistic digressions here and there but the basic design still persists even now, a century after the first Model T rolled out of a factory in Detroit. This very same principle applies to modern web navigation.

The unequivocal rules of web navigation.

The details of how your website should look like or what kind of functionality you’d like to add is up to you and your web developers but when it comes to web navigation, there are several ground rules you are required to abide by. Most of these rules are strictly non-negotiable, they’re as elementary as eating your steak at medium or below. One in particular is meant to be followed only if it’s applicable to your website. Those 4 rules are as follows:

  • Your logo or your company title should always link to your homepage

The golden rule of any website. Clicking on your company’s logo should always, and I mean always redirect your visitors to your homepage. I have yet to find a website that diverge from this rule but do let me know if you do. I am oddly interested in finding an exception to this rule.

  • Consistent and direct navigation

It doesn’t matter if your website navigation bar is placed on top, on the side, on the bottom, accessed from a dropdown menu or any combination of the three, what you need to make sure is that it stays consistent across every page within your website. I’m not talking just about the placement. The design, the size, the typeface and the color palette used should also be standardized for consistency.

Additionally, keep your navigation bar simple. If your website has lots of different sections, use a dropdown menu instead of listing each and every section in your navigation bar. In fact, you could use what is called a mega dropdown menu to handle your all of your sections, leaving the navigation bar for the bare essentials such as your company’s logo, a search box and links to social media channels.

  • Be clear with your language and symbols

In literature, there is a term known as a purple prose. A purple prose is a prose that is so ornately obscure which serve little to no purpose other than to underline the fact that the writer in question knows a bunch of big words, or know how to use a thesaurus. This is pretty much an unforgivable sin in literature. In navigation, it is even more so. I get the inclination to stand out with your web design but navigation is the one place you shouldn’t mess with.

The company Juicero, even though they sell juice and have juice right there in its name describe what they sell as “raw, plant-based nutrition” and that is a big no-no. There are industry standards that are already at place. A magnifying glass signifies a search box. Three horizontal lines in parallel (the famous hamburger icon) is the universally accepted icon for dropdown menus. About is used for your company’s history and mission statements. Contact is used for your company’s contact information and address. Those things are the standard for a reason; leave your disruption on things that actually need disrupting.

  • Use sticky navigation in conjuction with excessive scrolling

One of the trends most widely used in today’s web design is the use of infinite scrolling. Instead of separating contents into several different pages, infinite scrolling automatically load more contents once the user has reached the bottom of the page, like what you’d find on Buzzfeed. There is an alternative to infinite scrolling, in which a prompt is added to the bottom of the page and the page will only load more content when it is clicked, like on the tech blog TechCrunch, but the basic principle remains the same. Infinite scrolling gives off a seamless experience compared to the traditional pagination experience that is still in use over at pop-culture blog AVClub.

It’s not an approach that would work indiscriminately and I’m not advocating for or against that technique but if you do decide to use it, remember to use a sticky navigation bar as well. A sticky navigation bar is a navigation bar that stays in place as you scroll down. Buzzfeed uses a top sticky navigation bar while TechCrunch uses a side sticky navigation bar. Now, the topic of sticky navigation bar is a pretty hot-button issue in itself since it takes away screen space that could be used for content, especially on a mobile device, which is a fair complaint. The idea is to make your sticky navigation bar as minimal as possible by using a dynamic navigation bar.

Instead of keeping your standard navigation bar on top at all time, use a specialized navigation bar that will only come into view when your visitor decides to scroll down. Keep this special navigation bar as minimal as it can possibly be to keep it from being intrusive. For an example, take at look at the tech blog Engadget. Notice how the simplicity of the sticky navigation bar compared to the actual header of the website is helped by using a dropdown menu? Ideally, the sticky navigation bar should be shorter in height compared to the one at Engadget but the principle is on point. Keep in mind that even if you use pagination, a sticky navigation bar might still be useful if your page is as content-heavy as Engadget.

This only scratch the basic rules of web navigation, there are a lot of things you could do regarding layout and animation but there are wide-ranging opinions on those subject that it’d be better for you to find out which would work in your specific case. The 4 golden rules I defined above are the universal designs. They’re there so that if any visitor went to visit your website for the first time, they’d already know what to look for. A website is a globally accessible forum and making sure that everyone, no matter how little their experience with the internet is, wouldn’t get lost navigating your website is key to good navigation.

Stop Using These Used-to-Be Web Design Trends If You Want to Attract More Customers in 2018

Stop Using These Used-to-Be Web Design Trends If You Want to Attract More Customers in 2018

In a world where everything is constantly changing as time goes by, we are expected to adjust to the changes, especially business owners. Why? Before answering that question, first let’s define what exactly a business is. Business is the act of selling goods or services and earning profits through satisfying human needs. Basically, a business owner earns money for a living through fulfilling people’s needs especially those who need what the business owner has in store. With that knowledge in mind, a business owner has to do what it takes to make those people stay. Well, it is always possible to do that in this era, where everything is almost digital and can be reached anywhere and anytime they want.

One of the ways you can do to reach your target audience in this era is by having a website. A website is one of the important elements in communicating with your target audience and providing information about your business so that they can find reasons to trust your business. However, building a website sometimes is not easy. You have to harmonise and combine every components needed in building a grandiose website for your target audience to see. One of the very crucial components in building a website is a web design. If SEO is the component that can boost your online visibility, let’s just say; “introducing your website” to search engines and web development is one component that brings your website to life, then web design is one important component that makes your website “feel alive.” Want to know more? Well, if you are a business owner, especially if you are just starting out, this article is perfect for you!

Just like fashion, interior design, or even cosmetics, web design is also changing with time, because of the trends. Trends are always coming in the future, whether you like it or not. If business owners want their business to run smoothly, they need to pay attention to the trends. Pay attention, not immediately change to the trends. Just because something is on trend, that doesn’t mean you have to follow every one of them. While trends have to be adjusted to your business too, there are trends that are just not right no matter what kind of business you have is. Below we have provided you with web design trends that are not cool anymore.

Bevel and Emboss

Have you ever worn a skinny jeans when it was the “it” in its time? Then suddenly now when you look at a photo when you wore it, you’re like “what was I thinking?” Yes, that is also what happens when you see bevel and emboss now.

Web 2.0 Gloss

The bevel and emboss trend wasn’t suddenly left behind one day in favour of minimalism. Instead, it had to evolve into something even more ornate before we decided to run in the completely opposite direction. Can you imagine a button glossier than your lip gloss? Ugh. No. Sure you can add a glow or two to a button, but overdoing this is not right and will just hurt your audience’s eyes.

Too much cursive text is a curse!

We admit that cursive text is beautiful. Only if you use it for a display on your home’s wall. But for a website? Do you expect that to attract your target audience? One of the crucial parts in a websites is the readable text. Cursive text is beautiful, but it is not readable on a website, especially if you are trying to explain about your business in a bit longer sentence.

Yes, those are the trends that “had their time” but their time is done. Now that with more website design trends coming, more websites are beautifully designed and even provide simpler navigation with “good looks.”  But we never know what the future holds. Maybe designers will work on new things or just patch up the old designs to make them even better in the future. Well, let’s wait for new trends and keep paying attention.

Asymmetrical Design for Your Website: Whimsical Beauty Added in the Trends

Asymmetrical Design for Your Website Whimsical Beauty Added in the Trends

One of the crucial parts in building a website is its web design. A website without its web design is like wearing a fancy dress without putting on some make up; your website could go live, but the website would seem lifeless. If you have a business website without having it designed, this could be a lost cause to your business. Why? That is because with web design, it could also determine how long your web visitors will stay interested in your website. With so many designs out there, business owners compete with each other to impress their visitors with their website, so that they could get more potential customers turned into real paying customers through keeping up with the trends. Are you one of the business owners who feels challenged with the trends? Or do you want to be the trend and want to have a better website look? Then, this article is especially made for you!

As time goes by, there are more and more web design trends coming. One of the popular designs that never seem to be out-dated is asymmetrical design. In asymmetrical design, there are designs containing elements that don’t create a mirror image. Although just like the name “asymmetrical”, these asymmetrical designs are, in fact, balanced, but just not through perfectly similar halves. It may be difficult to design it and to achieve the look, but once finished, the result is whimsically so stunning and beautiful. Not only does this design give you perfect harmony or balance, but it can also represent modern and class. The concepts of asymmetrical design are very influential because it has attention-grabbing techniques and imagination-provoking elements in it.

You can ask your designer to mix and match symmetrical and asymmetrical concepts within a design project. If they divide the design into smaller sections there will be parts that contain different types of balance. (Think of panels in parallax scrolling sites or the design of an image within the canvas).

Using space

The concept of minimalism design trend that is good for this design is using so much space for an easier balance of a simple object or image against a larger white or dark background. If there is a balance between white, or negative space, and elements in the design, it should create contrast. This will direct the eye’s movement across the design.

Emphasize motion

Imagine you see a wedding ring falling to the ground. You can already sense the motion. This also applies to the motion you can “feel” in an asymmetrical design. Your eyes will move from the larger, heavier part of the screen to the lighter part, naturally. Overall, this design brings more imagination for you.

You can add focus with colour

Good asymmetrical colour patterns are usually the ones that are high in contrast and colour combinations. You can add bright hues against black or a toned photograph that has bold white typography on top. High colour contrast will be the focus and visual weight to specific parts of the design.

You can create asymmetrical colour combinations by using the colour wheel. Choose the colour combinations that fall outside traditional colour rules for a sense of asymmetry. You can use colour to highlight and emphasize other elements in the asymmetrical outline. Colour “gets along” well with elements such as geometric shapes, typography or even in the background to get the balance.

Creating asymmetrical design may be tough for your designer at first, but if it is done properly with well-planned strategy, the result will be much more beautiful than you can imagine. Your visitors might not even leave your website! If you are interested in using asymmetrical design for your website but haven’t found the designer yet, you can contact us and our team will be ready to help you.