In a responsible design, a website will be displayed differently depending on the size of the screen and / or the type of device, in order to guarantee ease of use. It applies specifically to small display screens of mobile devices, where a different representation of the page is required.
Background
The usual design of a web page is based on the PC screens, just as they are in a workplace. In recent years, however, mobile devices have been developed that feature significantly smaller screens, for example netbooks, tablets, and smartphones. On a small screen, web pages have a different appearance than large screens and the ease of use (Usability) is considerably reduced. Responsible design reacts flexibly to the corresponding device. A good user experience on mobile devices can be guaranteed with a separate layout for small screens. This is called Cell phone user experience. In the "Mobile First" concept, the cell phone web is first created and then extensions are made for larger screens.
Motivation
The number of mobile devices is growing and the number of Internet users accessing the Internet on those devices is also increasing. Responsive designs would be needed to provide these visitors with a good web experience. The lack of a good user experience with common websites on devices with small screens will result in conversion losses. The use of responsible design look towards the future, since the offer is enabled for all users in an easy-to-use design. Communication between the web operator and its visitors is not affected by the type of device used.
Implementation
Responsible designs can be done with HTML5 and CSS3. Inquiries are provided to the media, with which information can be requested from the device in question. This includes features like screen size, resolution, and format, as well as capabilities like keyboard, fingerprint, language, etc.). The content and the layout of a page must be strictly separated for the responsive layout to work properly.
Media Query
Other properties are available at the same time as the distinction between "screen" and "print"[1].
This example shows the link from the HTML document to the style sheet. At the same time as the "screen" specification, the media query, or Media Query, also contains another restriction, specifically that it must be a vertical format. The respective paragraph in the CSS file "example.css" looks like this:
@media all and (orientation: portrait) {…}
Appearance
Through the use of responsive designs, the same content is provided in a slightly modified format for different devices. Decreasing items may be appropriate for small screen sizes. In essence, the existing items appear structurally different. An example is the switch between portrait and landscape format. The modified page proportions require a restructuring of the items, but their function remains the same. The HTML code remains unchanged, only a different style sheet is used.
The prioritization of existing items plays an important role in restructuring the website. A full consideration of which items will slide down the page and which can be removed due to their lesser importance is important. This development is time consuming and provides room for SEO measures.
Relevance for SEO
The development of a responsible design is very complex depending on the size of the web. But once developed, it is very easy to maintain, because the content only has to be created once and is enabled in each design. The development effort can be worthwhile from an SEO perspective, as it improves the user experience for people connecting to the internet with their cell phone device. This increases your time spent on the web, which will have a positive effect on the positioning of the page. Apart from this, the bounce rate will decrease, because an easy-to-use web portal is received positively. A responsible design will not limit the use of the web to conventional devices either. The relaunch of a website is a good possibility to offer it with a responsive design in the future.
Another response to the growing number of mobile devices is to create a separate web portal for mobile users, which is not recommended from an SEO perspective. This autonomous domain will need to be optimized and maintained separately. It will barely be linked, you will barely get link juice, and it will usually contain duplicate content. In this way, the cell phone site will not be found by visitors through search engines and thus rarely used.
Responsible design concept leads to more advanced ideas for keyword optimization. Search terms entered on a cell phone device tend to be shorter and formulated differently than on a physical keyboard. Thus, the difference in user devices could also lead to a change in keywords.
Google supports and recommends a responsive design. An advantage is that the Googlebot saves resources and can index more content from a website. As a prior requirement, the crawler will need unlimited access to external files such as CSS and JavaScript.
[Category: Mobile Marketing]]
