Menu on the top or on the left side năm 2024

The hamburger menu icon is one of the most ubiquitous icons on the web. It is usually used to indicate a menu bar, and it is often placed in the top-left corner of the screen. But there is some debate over whether the hamburger menu icon should be on the left or right side of the screen.

Brief History

The hamburger menu icon was first introduced in the early days of the web (when we did not design for mobile screens), and it was usually placed in the top-left corner of the screen. This was because the top-left corner was the traditional location for the menu bar. But over time, the hamburger menu icon has been used in other locations, including the top-right corner of the screen.

There are several arguments for why the hamburger menu icon should be placed on the right side of the screen. The first argument is that the right side is the traditional location for the main navigation menu. The second argument is that the right side is the location of the main action buttons, such as the “submit” button – although I personally do not like it. The third argument is that the right side is the location of the global navigation menu.

There are also several arguments for why the hamburger menu icon should be placed on the left side of the screen. The first argument is that the left side is the traditional location for the menu bar. The second argument is that the left side is the location of the primary content area.

So, which side is the best location for the hamburger menu icon? There is no definitive answer, and it depends on the specific website or app. However, the general consensus seems to be that the hamburger menu icon should be placed on the right side of the screen for most websites and apps.

Menu on the top or on the left side năm 2024

Mobile Screens

On mobile screens, you must put it on the top-right if the menu icon must go on top. Otherwise, the best alternative is to not have it on the top at all. This is because the top part of the screen is not reachable by the thumb on most devices, making it difficult or impossible for users to access the menu.

Test with Users

The best way to decide where to place the hamburger menu icon is to test it with users. Try out different locations and see which one is the most user-friendly. You may also want to test different icon designs, as users may have different opinions on which design is the most user-friendly.

In this article, we will explain what main menus consist of and why they are usually located at the top of the web page. We will also share some tips for designing a horizontal main menu so you can maximise its benefits.

What Do Main Menus Consist Of?

A simple website main menu (which is also called a navigation menu or navigation bar) may have five to seven items. These typically include About Us, Products, Services, Contact, and FAQs. Within these main menu items, you may also find sub-menu items that are typically displayed in a drop-down fashion.

For example, the “Products” main menu item may include a sub-menu for each product category (e.g., Men, Women, or Kids). The user simply has to click or bring their cursor over the main menu item to reveal the hidden sub-menu options.

In a nutshell, the main menu or navigation menu is where users find the links to your site’s most important pages or sections. An effective main menu is crucial to the success of your website as well as to the satisfaction of your users.

Read more: What is Usability in Web Design?

Five Reasons Why Main Menus are at the Top of Web Pages

Main menus come in two types: horizontal and vertical/left menu. Of the two, the horizontal type is more commonly used because of its high visibility as well as its enhanced usability. A properly designed horizontal main menu can positively affect your traffic and conversions.

The truth is, the majority of website visitors expect to find the main menus across the top part of any website. Thus, putting it in this standard position and orientation (i.e., horizontal) can make your website easier to use, especially for beginner-level users. Aside from this, most main menus are intentionally placed at the top of web pages because:

  1. They fulfil user expectations. Your website visitors are already accustomed to reading from left to right. Putting your horizontal main menu at the top of your page will give them what they expect and thus, make it easier for them to navigate through your website. A radical menu placement that they may have never seen before may just confuse them.
  2. They offer a faster way for users to find what they are searching for. Main menus placed at the top of the page are more visible than their left/vertical counterparts because they are always above the fold, meaning, they are placed just below the logo and header and right above the main content of the web page, both of which are visually dominant interface elements. When a user lands on a website or any webpage with a main menu at the top, they can quickly see which menu item to click right off the bat.
  3. They don’t take up a lot of space. A horizontal main menu only occupies a sliver of space on your webpage. With this type of menu, you will never have to worry about running out of space for the rest of your content. This type of menu placement leaves you with enough space to display large text and images, as well as interactive elements and creative layouts without making your web pages look and feel crowded.
  4. They allow for more attention-grabbing visuals. A major trend in web design is to fill the whole screen with text and graphic elements, also known as the full bleed layout. This can be an effective way to incorporate high-quality images, videos, or animations into your web page. And you can make better use of larger screens with a horizontal navigation bar as it allows you to take up the entire row for your menu items.
  5. They effectively direct users to information that matters most. This specifically applies to niche sites, where the content is geared towards an audience with a specific set of interests, such as handicraft, consulting, parenting, and tutorials. Since the audience’s field of interest is very specific, every menu item can be considered a high priority. Thus, the ability to scan multiple items hidden in drop-down menus, which the left/vertical main menu provides, is not exactly needed here. What you need is a navigation bar that lets people spot high priority menu items right away. This is why a top menu makes more sense in this context, as it allows users to find the content they’re looking for faster.

Tips for Creating Your Horizontal Main Menu

  • Include clear and descriptive menu labels. Avoid generic labels such as “Services” and “Products” that don’t tell users and search engine sites about what you exactly offer. It’s best to incorporate descriptive words or even key phrases in your main menu to clearly communicate your message so that people will know they’re in the right place.
  • Keep your number of menu items at a minimum. Seven is an ideal number to work with: users who have short-term memory can only remember up to seven items. You don’t want to overwhelm your users with hundreds of links to click on when they see your main menu. What you want is to make it easy for them to locate the page they want to visit. Limiting your menu from five to seven items will help improve its usability and user-friendly score.
  • Arrange your sub-menu items according to priority. When creating the sub-menu for your main menu item (i.e., products section), put the items that are most important to your users at the top of the list, as this is where user attention and retention are at its highest.
  • Optimise your site’s navigation. Take advantage of your site’s analytics to understand how your visitors use the main menu. Find out which items are working and not working, then make the necessary adjustments to deliver a better user experience.

For Improved Usability

Majority of main menus are placed at the top of the page because this position helps fulfil user expectations, offers users a faster way to explore your site, conserves vertical space, allows you to maximise your page’s width, and directs users’ attention to the most important items straight away.

All these benefits result in improved usability and better user experience, which are instrumental to the success of any website.

Should menu be on the left or right?

Those who first learned to read and write a left to right language will perform faster with left justified menus. Handedness will influence menu placement preference. Left-handed users will perform faster with right justified menus.

Should the menu icon be on the left or right?

Placing the menu on the left side is good for people who read from left to right. But sometimes, the menu has less important stuff, so it could make sense to put it on the right. This is easier for right-handed people who use their thumb to navigate.

Why is the menu on the left side?

Sidebars that are mainly navigation should go on the left because it feels more natural to look for navigation there. If you have a lot of navigational links, it might be a good idea to put them in a sidebar.

What is the menu on the left called?

The sidebar menu is the set of links on the left-hand side of the page. The purpose of the sidebar is to show users the available information within a section of pages and provide a way for them to view it. Sidebar menus can be applied to pages from the back-end editor.