Eight misunderstandings to be avoided in web-responsive design

Developing a Web site with responsive interaction design makes sense because it can run on different devices, so you can save on the cost of developing different sites for different platforms. However, in order to maximize the corresponding web design, there are some misconceptions you should avoid.

don't give priority to desktop design

One common mistake developers often make is that they prioritize the desktop when designing a site, because it's a breeze to turn desktop-based Web sites into responsive web designs for other devices in the worst case. However, this error, which occurs in the planning phase itself, can become a very big problem. It can even cause rework, and of course, a lot of bugs will spread out.

However, mobile-based development sites may take some time and will be difficult at first. This is because it forces you to make a choice on what is contained and to think in a way that you are not accustomed to. However, doing so will make the content and design as a whole more excellent. Roughly speaking, you can first try on a smaller device. Once you've made a good design on your phone, it's easy to fit on a larger screen.

the trouble with the navigation bar menu

When designing for the mobile side, the problem with the navigation bar design can be a curse for you, so you have to avoid having trouble. Rather than a fixed-width design, responsive design navigation should be determined based on the device type (so the smartphone's navigation menu may differ from the tablet and, of course, the desktop version of the navigation menu).

Many designers will find themselves devastated by such a task-trying to design a navigation menu that adapts to all screens. In many cases, the designer struggled to convert the horizontal list menu to a vertical list menu, especially when the smaller phone screen was adapted. However, because the navigation bar is not designed to be based on the screen, this can lead to a poor user experience.

content should not be hidden

Responsive design often has less room to display pictures and content, but that doesn't mean your content should be ignored. You have to take a way to rearrange the content so that it is easy to read. This is easier to implement by creating navigation links and using anchors, which users can see on a page that they have been looking for. Those that control the content through CSS layouts should understand that the content will still be loaded, so it's no big deal to give the user a complete viewing experience. Simply put, users should not be "punished" by developers for the devices they use.

separate mobile website address

Assigning an address to a mobile website individually the whole thing is a disaster, which destroys the purpose of our interaction design at first, and is arguably. When users are redirected to a mobile version when they visit a website, the result is that they have to waste a lot of valuable time. In addition, this can have a very serious impact on your search rankings. But, of course, there are many advantages to using different URLs. It ensures that you can architect mobile websites with lighter pages and perform better on smart devices. The site can also take care of performance and performance on a specific platform. Unfortunately, the negative impact of having a separate mobile website address is far greater than the positive impact.

a bad user experience

You can't simply compress desktop content into a mobile version, and doing so will affect your users ' experience, and users may abandon your product. It is important to create a friendly interface within the limited space of your phone. You can take steps such as using a drop-down menu instead of the navigation bar on your desktop, which saves you space. This is usually not a headache if you design the mobile side first.

don't neglect the cross-scenario Convention

When you're doing a responsive design, you can't just consider desktop and mobile devices, you should also consider other types of devices. People may access your website through an embedded browser's smart TV or set-top box. Now, even handheld computers have different types. However, this does not mean that you can create the same user interface for all your devices, and you might want to create different sites for different devices. All you need to do is create a responsive navigation and a design that users can easily understand. This navigation is created to clearly preserve the context of the device.

do not neglect the load time of the page

With the popularity of broadband, Web developers began to get used to the large number of pages on the use of relatively large resources. However, when we use mobile phones, our users are using slower 2G and 3G networks. Similarly, users who keep Minf international, they pay for the amount of bandwidth they use.

A page is loaded quickly on the desktop, but loading a page on the phone can take a long time or use extra, expensive bandwidth. Even worse, when users are forced to wait for the page to load, they will leave the page for a few seconds, and you will lose your traffic.

do not develop for touch screen devices

Most handheld devices today use touch screens, and even a lot of laptops start using the touchscreen. So, when you design responsive design, it's important not to ignore the importance of dealing with touch. There are two reasons: first, clickable items, such as the button to take into account the size of the user's finger (do not let the user zoom click). Second, you have to handle the touch events correctly. This can be done to overcome the 300ms click event Latency.

Featured Web Development tools Webstorm (latest sale, lowest 35 percent), and bootstrap framework Chinese version for Web design!