{"id":25746,"date":"2021-10-28T20:09:44","date_gmt":"2021-10-28T18:09:44","guid":{"rendered":"https:\/\/www.kodlogy.at\/mobile-friendly-website\/"},"modified":"2021-10-28T20:09:44","modified_gmt":"2021-10-28T18:09:44","slug":"mobile-friendly-website","status":"publish","type":"post","link":"https:\/\/www.kodlogy.at\/en\/mobile-friendly-website\/","title":{"rendered":"Mobile-Friendly Website: Explained Simply \u2013 with a Checklist"},"content":{"rendered":"<div class=\"k-kurz\" style=\"background:#F5F9FF;border:1px solid #dce8f5;border-left:4px solid #0072FF;border-radius:12px;padding:18px 22px;margin:0 0 28px\">\n<p style=\"margin:0 0 6px;font-weight:600;color:#002450\">In brief<\/p>\n<p style=\"margin:0\">A mobile-friendly website automatically adapts to smartphones and tablets: texts are readable without zooming, buttons are easy to tap and the page loads quickly. Because Google indexes websites mobile-first, the mobile version determines your ranking \u2013 even in desktop search.<\/p>\n<\/div>\n<p>A mobile-friendly website is no longer an optional extra today but a basic requirement. A large share of visitors arrive via smartphone \u2013 often on the move, with little time and a clear intention: to find a phone number, check opening hours, compare a product or send an enquiry. If your site does not convince on mobile, you lose these visitors to the competition. In this article you will learn why mobile-friendly websites are so important and how to optimise your website for mobile devices.<\/p>\n<h2>What is a mobile-friendly website?<\/h2>\n<p>Mobile-friendly means that a website works just as well on small screens as on a desktop. Typical characteristics are:<\/p>\n<ul>\n<li>The layout automatically adapts to the screen width (responsive web design).<\/li>\n<li>Texts are readable without zooming, and lines are not too long.<\/li>\n<li>Buttons and links are large enough and have sufficient spacing.<\/li>\n<li>There is no horizontal scrolling.<\/li>\n<li>Navigation is simple, for example via a clear menu.<\/li>\n<li>The page loads quickly even over a mobile connection.<\/li>\n<li>Phone number, enquiry form and contact details can be reached with a single tap.<\/li>\n<\/ul>\n<h2>Reasons why your website should be mobile-friendly<\/h2>\n<h3>More page views and fewer bounces<\/h3>\n<p>A good mobile user experience is key. If your website displays well on small devices without zooming, loads quickly and is easy to navigate, visitors stay longer. They move from page to page, learn more about your business and are more likely to get in touch. Conversely, users quickly leave a page that is hard to use \u2013 and the bounce rate rises.<\/p>\n<h3>Mobile-friendliness strengthens customer loyalty<\/h3>\n<p>People who have good experiences with your website like to come back. A frustrating mobile experience, on the other hand, lingers: even customers who have already bought from you are more likely to turn away if using the site on a smartphone is tedious. A mobile-friendly website helps you win loyal customers \u2013 and regular customers are particularly valuable for most businesses.<\/p>\n<figure class=\"k-img\" style=\"margin:28px 0\"><img loading=\"lazy\" decoding=\"async\" width=\"1600\" height=\"1067\" src=\"https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone.jpg\" alt=\"Responsive website on laptop, tablet and smartphone\" class=\"wp-image-24204\" style=\"width:100%;height:auto;border-radius:16px\" loading=\"lazy\" srcset=\"https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone.jpg 1600w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone-300x200.jpg 300w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone-1024x683.jpg 1024w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone-768x512.jpg 768w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone-1536x1024.jpg 1536w\" sizes=\"auto, (max-width: 1600px) 100vw, 1600px\" \/><\/figure>\n<h3>Google evaluates the mobile version first<\/h3>\n<p>In the past, search engines sometimes showed different results for mobile and desktop searches. In 2016 Google announced the mobile-first index and has since gradually rolled it out to practically all websites. This means that Google primarily uses the mobile version of your website for indexing and ranking. If it is poor, your ranking in desktop search suffers too.<\/p>\n<p>This makes sense, because many people use several devices. Anyone who researches on a computer and later continues on a smartphone expects the same quality on both devices. Google offers a detailed explanation in its <a href=\"https:\/\/developers.google.com\/search\/docs\/crawling-indexing\/mobile\/mobile-sites-mobile-first-indexing\" target=\"_blank\" rel=\"noopener\">documentation on mobile-first indexing<\/a>. For implementation, Google recommends responsive design as the simplest and lowest-maintenance solution.<\/p>\n<h3>Responsive web design attracts more users<\/h3>\n<p>Mobile devices have smaller screens than desktop computers. Your website design should therefore adapt easily to any screen size. Nobody wants to scroll horizontally or zoom in to read content. Dissatisfied users do not recommend a website \u2013 so you lose not only the visit but also the chance of word-of-mouth recommendations.<\/p>\n<p>If you notice that your website does not look good on smartphones and tablets, a responsive relaunch is worthwhile. Professional <a href=\"https:\/\/www.kodlogy.at\/en\/web-design-vienna\/\">web design in Vienna<\/a> plans the mobile display from the very beginning.<\/p>\n<h3>Mobile users and search engines want fast pages<\/h3>\n<p>Besides the display, loading speed on mobile devices is crucial. Nobody likes waiting \u2013 every additional second increases the risk that visitors bounce and switch to a faster competitor. Your effort for good content and an attractive design only pays off if the page actually loads.<\/p>\n<p>Load time is also part of the page experience that Google measures with the Core Web Vitals. In the past, AMP (Accelerated Mobile Pages) was considered the way to fast mobile pages. Today AMP is no longer necessary: optimised images, a lean theme, caching and few scripts achieve the same goal without an additional page version.<\/p>\n<h3>Purchasing decisions start on the smartphone<\/h3>\n<p>Before buying, many people compare offers and prices from different providers \u2013 often on mobile, for example on the go or in the evening on the sofa. Some complete the purchase later on a computer, many buy directly on their smartphone. If your website is not convincing on mobile, you drop out of the selection at this early stage.<\/p>\n<p>This applies especially to online shops: a simple checkout with mobile payment methods such as Apple Pay or Google Pay makes the difference. Find out more on our page <a href=\"https:\/\/www.kodlogy.at\/en\/online-shop-design\/\">Build an online shop<\/a>.<\/p>\n<div class=\"k-cta\" style=\"background:#002450;border-radius:16px;padding:26px 28px;margin:32px 0;color:#fff\">\n<p style=\"margin:0 0 6px;font-size:21px;font-weight:600;color:#fff\">How well does your website work on a smartphone?<\/p>\n<p style=\"margin:0 0 16px;color:#CFE6FF\">We check the display, usability and load time of your website on mobile devices and show you concrete improvements.<\/p>\n<p><a href=\"https:\/\/www.kodlogy.at\/en\/contact\/\" style=\"display:inline-block;background:linear-gradient(to right,#00C6FF,#0072FF);color:#fff;font-weight:600;padding:12px 24px;border-radius:10px;text-decoration:none\">Have your website checked<\/a> &nbsp; <a href=\"tel:+436605403636\" style=\"color:#fff;font-weight:600\">+43 660 540 3636<\/a><\/div>\n<h2>Checklist: how to make your website mobile-friendly<\/h2>\n<ol>\n<li><strong>Use a responsive theme:<\/strong> the layout automatically adapts to any screen size.<\/li>\n<li><strong>Set the viewport tag:<\/strong> the \u201cviewport\u201d meta tag ensures that browsers display the page at the correct width.<\/li>\n<li><strong>Readable font sizes:<\/strong> body text of at least around 16 pixels, sufficient line spacing and contrast.<\/li>\n<li><strong>Large tap targets:<\/strong> buttons and links easy to tap, with spacing between them.<\/li>\n<li><strong>Optimise images:<\/strong> modern formats, suitable sizes and lazy loading for images further down.<\/li>\n<li><strong>Use pop-ups sparingly:<\/strong> overlays that cover the content are particularly annoying on mobile.<\/li>\n<li><strong>Make contact easy:<\/strong> clickable phone number, short form, clearly visible enquiry button.<\/li>\n<li><strong>Same content on mobile and desktop:<\/strong> important texts, images and structured data must not be missing on mobile.<\/li>\n<li><strong>Test regularly:<\/strong> with Lighthouse, PageSpeed Insights and on real devices.<\/li>\n<\/ol>\n<h2>How to test mobile-friendliness<\/h2>\n<p>Google discontinued its former Mobile-Friendly Test at the end of 2023. Today, the best tools for checking are Lighthouse in Chrome, the device mode of the developer tools and PageSpeed Insights. The most meaningful test, however, remains the practical one: open your website on several smartphones, try to send an enquiry and pay attention to where things get stuck.<\/p>\n<figure class=\"k-img\" style=\"margin:28px 0\"><img loading=\"lazy\" decoding=\"async\" width=\"1600\" height=\"1068\" src=\"https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/website-entwickler-wien-programmierung.jpg\" alt=\"Web developer coding a website\" class=\"wp-image-24206\" style=\"width:100%;height:auto;border-radius:16px\" loading=\"lazy\" srcset=\"https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/website-entwickler-wien-programmierung.jpg 1600w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/website-entwickler-wien-programmierung-300x200.jpg 300w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/website-entwickler-wien-programmierung-1024x684.jpg 1024w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/website-entwickler-wien-programmierung-768x513.jpg 768w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/website-entwickler-wien-programmierung-1536x1025.jpg 1536w\" sizes=\"auto, (max-width: 1600px) 100vw, 1600px\" \/><\/figure>\n<h2>How Kodlogy helps with mobile-friendly websites<\/h2>\n<p>Our web experts build every website optimised for mobile \u2013 with responsive design, optimised loading speed and a clean basis for search engine optimisation. If you would like to <a href=\"https:\/\/www.kodlogy.at\/en\/website-creation-vienna\/\">have a website built in Vienna<\/a> or want to modernise your existing site, we will be happy to advise you \u2013 in English or German. For a fast, mobile-strong presence, a <a href=\"https:\/\/www.kodlogy.at\/en\/one-page-website-landing-page-vienna\/\">one-page website<\/a> from \u20ac599 is also a good choice.<\/p>\n<div class=\"k-cta\" style=\"background:#002450;border-radius:16px;padding:26px 28px;margin:32px 0;color:#fff\">\n<p style=\"margin:0 0 6px;font-size:21px;font-weight:600;color:#fff\">Your new mobile-friendly website<\/p>\n<p style=\"margin:0 0 16px;color:#CFE6FF\">Modern, fast and convincing on every device \u2013 we build your website at a fixed price.<\/p>\n<p><a href=\"https:\/\/www.kodlogy.at\/en\/website-creation-vienna\/\" style=\"display:inline-block;background:linear-gradient(to right,#00C6FF,#0072FF);color:#fff;font-weight:600;padding:12px 24px;border-radius:10px;text-decoration:none\">Request a website<\/a> &nbsp; <a href=\"tel:+436605403636\" style=\"color:#fff;font-weight:600\">+43 660 540 3636<\/a><\/div>\n<p><!-- k-faq --><\/p>\n<h2>Frequently asked questions about mobile-friendly websites<\/h2>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>What is a mobile-friendly website?<\/strong><\/summary>\n<p>A mobile-friendly website automatically adapts to smartphones and tablets. Texts are readable without zooming, buttons are easy to tap, there is no sideways scrolling and the page loads quickly even over a mobile connection.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>What does mobile-first indexing mean?<\/strong><\/summary>\n<p>Google primarily uses the mobile version of a website for indexing and ranking \u2013 even for desktop search results. If content is missing from the mobile version or it is difficult to use, this affects your overall visibility.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>How do I test whether my website is mobile-friendly?<\/strong><\/summary>\n<p>Google has discontinued its former Mobile-Friendly Test. Instead, use Lighthouse and device mode in Chrome DevTools, PageSpeed Insights and, above all, real tests on different smartphones. Pay attention to readability, usability and load time.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>Do I still need AMP for a fast mobile website?<\/strong><\/summary>\n<p>No. AMP is no longer a requirement for a good mobile display or for certain search features. A lean, well-optimised responsive website achieves the same goals today without an additional page version.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>What is the difference between responsive design and a mobile version?<\/strong><\/summary>\n<p>Responsive design flexibly adapts the same page to any screen size. A separate mobile version (e.g. m.domain.at) has to be maintained twice and is more prone to errors. Google recommends responsive design as the simplest solution.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>Can I make my existing website mobile-friendly?<\/strong><\/summary>\n<p>Often, yes \u2013 through adjustments to the theme, layout, font sizes and images. If the website is technically outdated, a rebuild is usually more cost-effective. We review your website and recommend the most sensible route.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>How much does a mobile-friendly website cost at Kodlogy?<\/strong><\/summary>\n<p>All our websites are built to be responsive. A one-page website is available from \u20ac599; larger websites receive a fixed price after an analysis. Find out more under <a href=\"https:\/\/www.kodlogy.at\/en\/web-design-prices-vienna\/\">Prices and plans<\/a>.<\/p>\n<\/details>\n<p><!-- \/k-faq --><\/p>\n","protected":false},"excerpt":{"rendered":"<p>In brief A mobile-friendly website automatically adapts to smartphones and tablets: texts are readable without zooming, buttons are easy to tap and the page loads quickly. Because Google indexes websites mobile-first, the mobile version determines your ranking \u2013 even in desktop search. A mobile-friendly website is no longer an optional extra today but a basic [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_joinchat":[],"footnotes":""},"categories":[215],"tags":[],"class_list":["post-25746","post","type-post","status-publish","format-standard","hentry","category-general"],"_links":{"self":[{"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/posts\/25746","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/comments?post=25746"}],"version-history":[{"count":0,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/posts\/25746\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/media?parent=25746"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/categories?post=25746"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/tags?post=25746"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}