{"id":9504,"date":"2022-09-16T09:43:00","date_gmt":"2022-09-16T07:43:00","guid":{"rendered":"https:\/\/www.antartika.it\/news\/web-design-inadeguato-cause-effetti\/"},"modified":"2022-09-16T16:40:00","modified_gmt":"2022-09-16T14:40:00","slug":"inadequate-web-design-causes-effects","status":"publish","type":"post","link":"https:\/\/www.antartika.it\/en\/web-development\/inadequate-web-design-causes-effects\/","title":{"rendered":"Bad Web Design: Causes and Effects of Inadequate Web Design"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><strong>TLDR<\/strong><br>Similarly to a house, a <strong>website <\/strong>must rest on <strong>solid and functional foundations.<\/strong> Just as in construction, the <strong>web design choices<\/strong> made during <strong>website planning<\/strong> will affect its <strong>performance <\/strong>and, consequently, your <strong>business<\/strong>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"importanza-progettazione-sito-web\">The Importance of Good Web Design<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">We&#8217;ve already discussed <a href=\"https:\/\/www.antartika.it\/en\/seo\/importance-fast-website\/\" data-type=\"post\" data-id=\"9142\">how important having a fast website is<\/a>, how loading performance has become a <a href=\"https:\/\/www.antartika.it\/en\/seo\/guide-google-page-experience-core-web-vitals\/\" data-type=\"post\" data-id=\"9315\">ranking factor with Core Web Vitals<\/a>, and how our site achieved a <a href=\"https:\/\/www.antartika.it\/en\/web-development\/4x100-perfect-score-according-to-google\/\" data-type=\"post\" data-id=\"9331\">perfect score of 4\u00d7100 according to Google<\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">However, we haven&#8217;t highlighted yet <strong>the main elements affecting website speed<\/strong> and how they do so. Let&#8217;s compare a website to a house for a moment: in the event of an earthquake (or more precisely, a Google algorithm update), if both suffer &#8220;sudden damage,&#8221; <strong>it&#8217;s wise to analyze their infrastructure<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>It all begins with <a href=\"https:\/\/www.antartika.it\/en\/web-presence\/\" data-type=\"page\" data-id=\"6248\">web design<\/a>: <\/strong>the design choices of a website can <strong>impact the site&#8217;s performance<\/strong> and a <strong>business&#8217;s performance<\/strong>. Considering the constant changes in algorithms and user behavior,<strong> it&#8217;s essential to make these choices carefully,<\/strong> going beyond personal preferences.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>But what impact are we talking about?<\/strong> According to Google, <a href=\"https:\/\/www.thinkwithgoogle.com\/marketing-strategies\/app-and-mobile\/page-load-time-statistics\/\" target=\"_blank\" data-type=\"URL\" data-id=\"https:\/\/www.thinkwithgoogle.com\/marketing-strategies\/app-and-mobile\/page-load-time-statistics\/\" rel=\"noreferrer noopener\">32% of users abandon navigation when a page takes 1 to 3 seconds to load<\/a>, and the percentage increases significantly beyond 3 seconds.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1000\" height=\"698\" src=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/0imgthinkwithgoogle-1.png\" alt=\"page load speed mobile google soasta research\" class=\"wp-image-5237\" srcset=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/0imgthinkwithgoogle-1.png 1000w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/0imgthinkwithgoogle-1-300x209.png 300w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/0imgthinkwithgoogle-1-768x536.png 768w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><figcaption class=\"wp-element-caption\"><em><sub>Results from the Google\/SOASTA research published in 2017.<\/sub><\/em><\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Search engines aim to provide the best answers to their users in a few clicks.<br><strong>Designing a website that offers easy and fast-to-navigate content <\/strong>not only aids organic search ranking but also improves User Experience and advertising.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The <strong>negative impact <\/strong>of a slow website on <strong><a href=\"https:\/\/www.antartika.it\/en\/ppc-campaign-management\/\" data-type=\"page\" data-id=\"6249\">PPC campaigns<\/a><\/strong> should not be underestimated: if the page loading time is excessive, users are likely to abandon the site and access a competitor&#8217;s. The result? <strong>You paid for the user&#8217;s click <\/strong>on the ad but <strong>didn&#8217;t get any conversions.<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">A <a href=\"https:\/\/neilpatel.com\/blog\/loading-time\/\" data-type=\"URL\" data-id=\"https:\/\/neilpatel.com\/blog\/loading-time\/\" target=\"_blank\" rel=\"noreferrer noopener\">study by KissMetrics<\/a> has highlighted that a 1-second delay in page response can lead to a <strong>7% reduction in conversions<\/strong>. This means that if an e-commerce generates \u20ac100,000 per day, a 1-second delay in page responses would cost <strong>\u20ac2.5 million in lost sales annually.<\/strong><\/p>\n\n\n<style>\n:root{\n    --primary:      #008B95;\n    --secondary:    #363534;\n    --grey:         #F9F9F9;\n    --gr-dark:      #B6B6B5;\n    --anta-grey:    #6D6C6B;\n}\n\n\n\n\/************   Cf7 **************************+*\/\n.blocco-newsletter-articoli-blog.sfondo-a-righe {\n    background-image: linear-gradient(135deg,#e9e9e9 10%,#fff 10%,#fff 50%,#e9e9e9 50%,#e9e9e9 60%,#fff 60%,#fff 100%);\n    background-size: 7.07px 7.07px;\n    border: 1px solid #e9e9e9;\n}\n\n.blocco-newsletter-articoli-blog .titolo-cta {\n    font-family: var(--font-fam-body);\n    color: var(--bs-primary);\n}\n\n.blocco-newsletter-articoli-blog form p.h4 {\n    display: none;\n}\n\n.blocco-newsletter-articoli-blog form .row  {\n    margin-top: 1.5rem;\n}\n\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"]{\n    margin-bottom: 0;\n    margin-top:0;\n\n}\n.blocco-newsletter-articoli-blog .wpcf7 label {\n    margin-top: 0;\n}\n.blocco-newsletter-articoli-blog .wpcf7 p.h4{\n    color:var(--anta-grey);\n}\n\n.blocco-newsletter-articoli-blog form [type=checkbox]+.wpcf7-list-item-label::before {\n    background-color: white;\n}\n\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"] {\n    background-color: white !important;\n    font-size: calc(var(--fsz-p) * 1.15);\n    \/* content: 'per 1.15 mantiene fluidit\u00e0 e arriva a 24px che \u00e8 il risultato desiderato su desktop'; *\/\n}\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"]:autofill,\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"]:-webkit-autofill {\n    background-color: white !important;\n    box-shadow: 0 0 0 40px white inset!important;\n}\n\n.blocco-newsletter-articoli-blog .wpcf7 .wpcf7-submit {\n    background-color: white;\n}\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"]::placeholder{\n    color:var(--gr-dark);\n    font-weight: 300;\n    font-size: var(--fsz-h5);\n    padding-left: 0.5rem;\n}\n.blocco-newsletter-articoli-blog .wpcf7 .wpcf7-spinner{\n    position: absolute;\n    bottom: 5rem;\n    right: 3rem;\n}\n\n.blocco-newsletter-articoli-blog .wpcf7 .wpcf7-submit:hover{\n    border: 2px solid var(--primary);\n    background-color: var(--primary);\n    color: white;\n}\n.blocco-newsletter-articoli-blog .wpcf7 .wpcf7-submit:disabled{\n    opacity: 1;\n}\n.blocco-newsletter-articoli-blog .wpcf7 form.sent .wpcf7-response-output{\n    border-color: var(--primary);\n}\n@media screen and (max-width:575px){\n    .blocco-newsletter-articoli-blog .wpcf7 .wpcf7-submit{\n        position: absolute;\n        bottom: 0rem;\n    }\n}\n@media screen and (min-width:1400px){\n\n\n    .blocco-newsletter-articoli-blog .wpcf7 .wpcf7-acceptance label{\n        margin-top:0;\n    }\n}\n<\/style>\n\n\n<div  class=\"anta-block blocco-newsletter-articoli-blog sfondo-a-righe py-4 mt-5\">\n\n    <div class=\"container-fluid\">\n        <div class=\"row\">\n            <div class=\"col-12\">\n                <p class=\"h2 mb-3 mt-0 titolo-cta\"><span class=\"green\">Subscribe to our newsletter<\/span><\/p>\n            <\/div>\n        <\/div>\n\n        <div class=\"row align-items-start\">\n            <div class=\"col-12\">\n                <p class=\"p-lg\">And receive news, tips, and strategies to enhance your online presence.<\/p>\n            <\/div>\n\n            <div class=\"col-12 position-relative\">\n                \n<div class=\"wpcf7 no-js\" id=\"wpcf7-f12032-o1\" lang=\"en-US\" dir=\"ltr\" data-wpcf7-id=\"12032\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/en\/wp-json\/wp\/v2\/posts\/9504#wpcf7-f12032-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Contact form\" novalidate=\"novalidate\" data-status=\"init\">\n<fieldset class=\"hidden-fields-container\"><input type=\"hidden\" name=\"_wpcf7\" value=\"12032\" \/><input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.1.5\" \/><input type=\"hidden\" name=\"_wpcf7_locale\" value=\"en_US\" \/><input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f12032-o1\" \/><input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/><input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<\/fieldset>\n<div class=\"wpcf7-turnstile cf-turnstile\" data-sitekey=\"0x4AAAAAADKz9X03-_9CBiDr\" data-response-field-name=\"_wpcf7_turnstile_response\"><\/div>\n\n<div class=\"row align-items-end\">\n<div class=\"col-sm-9 pe-sm-0\">\n<label for=\"your-email-blog\" class=\"mb-0\">\n<h4 class=\"h4\">Enter your email address:<\/h4>\n\n    <span class=\"wpcf7-form-control-wrap\" data-name=\"your-email-blog\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email\" id=\"your-email-blog\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"yourmail@mail.ext\" value=\"\" type=\"email\" name=\"your-email-blog\" \/><\/span><\/label>\n<\/div>\n<div class=\"col-sm-3 ps-sm-0\">\n<input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"Send\" \/>\n<\/div>\n<div class=\"privacy d-flex mt-3\">\n <fieldset class=\"m-0 p-0 border-0\">\n      <legend class=\"visually-hidden\">Consenso al trattamento dei dati personali<\/legend>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"acceptance-516\"><span class=\"wpcf7-form-control wpcf7-acceptance\"><span class=\"wpcf7-list-item\"><label><input type=\"checkbox\" name=\"acceptance-516\" value=\"1\" class=\"acceptance\" aria-invalid=\"false\" \/><span class=\"wpcf7-list-item-label\">I consent to the processing of my data in accordance with your <a href=\"https:\/\/www.iubenda.com\/privacy-policy\/82033330\" class=\"iubenda-nostyle no-brand iubenda-embed \" title=\"Privacy Policy\" target=\"_blank\" rel=\"noopener\">privacy policy<\/a><span class=\"ms-1\">*<\/span><\/span><\/label><\/span><\/span><\/span>\n  <legend class=\"visually-hidden\">Newsletter subscription<\/legend>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"checkbox-newsletter\"><span class=\"wpcf7-form-control wpcf7-checkbox\"><span class=\"wpcf7-list-item first last\"><label><input type=\"checkbox\" name=\"checkbox-newsletter[]\" value=\"I would like to subscribe to the newsletter to receive updates on Digital Marketing\" \/><span class=\"wpcf7-list-item-label\">I would like to subscribe to the newsletter to receive updates on Digital Marketing<\/span><\/label><\/span><\/span><\/span> \n<\/fieldset>\n<\/div>\n<\/div>\n<div class=\"spacing-l d-sm-none\"><\/div><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n            <\/div>\n        <\/div><!-- end row -->\n    <\/div><!-- end container-fluid -->\n\n<\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"elementi-web-design-inefficace\">Elements of Ineffective Web Design<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Among the main elements affecting <strong>user experience, conversion optimization<\/strong>, and <strong>accessibility standards<\/strong> in website design, we find:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Hero banners, images, and carousels<\/strong> that push content far below the above-the-fold area (the immediately visible area before scrolling);<\/li>\n\n\n\n<li><strong>Large videos<\/strong> with autoplay and sometimes audio;<\/li>\n\n\n\n<li><strong>Customized fonts<\/strong> from third parties not present on all devices;<\/li>\n\n\n\n<li><strong>Graphic elements<\/strong> with inappropriate sizes, shapes, and colors for user accessibility;<\/li>\n\n\n\n<li><strong>Layout not consistently formatted<\/strong> across devices (images, fonts, CTA buttons);<\/li>\n\n\n\n<li>Non-compliant or misconfigured <strong>cookie banners <\/strong>according to GDPR regulations.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/imgartanta-1024x523.png\" alt=\"ineffective web design example desktop and mobile\" class=\"wp-image-5238\" srcset=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/imgartanta-1024x523.png 1024w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/imgartanta-300x153.png 300w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/imgartanta-768x392.png 768w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/imgartanta-1536x784.png 1536w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/imgartanta-2048x1046.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\"><em><sub>Points 1, 2, and 3 are visible in the desktop example; points 4, 5, and 6 are visible in the mobile example.<\/sub><\/em><\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">However, this doesn&#8217;t mean it&#8217;s entirely <a href=\"https:\/\/www.antartika.it\/en\/web-development\/homepage-carousels-yes-or-no\/\" data-type=\"post\" data-id=\"9183\">wrong to have a slider on the homepage<\/a> or that it&#8217;s never possible to use non-web-safe fonts; <strong>these are just a few of the countless recommended best practices<\/strong> for improving web performance.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Let&#8217;s take some domains as examples to understand <strong>which web design choices they&#8217;ve made <\/strong>and how they impact the site&#8217;s performance.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">We&#8217;ve tested loading times and loading sequences of their homepages using well-known and frequently used tools: <a href=\"https:\/\/www.webpagetest.org\/\" target=\"_blank\" data-type=\"URL\" data-id=\"https:\/\/www.webpagetest.org\/\" rel=\"noreferrer noopener\">webpagetest.org<\/a> and <a href=\"https:\/\/web.dev\/measure\/\" target=\"_blank\" data-type=\"URL\" data-id=\"https:\/\/web.dev\/measure\/\" rel=\"noreferrer noopener\">web.dev\/measure<\/a>. The test was conducted simulating an iPhone 6\/7\/8 with an LTE connection in Milan via Chrome.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"case-study-1-brand\">Case Study #1: Fashion Brand<\/h3>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"339\" src=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/1fashionbrand-1024x339.png\" alt=\"case study webpage load time fashion brand\" class=\"wp-image-5239\" srcset=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/1fashionbrand-1024x339.png 1024w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/1fashionbrand-300x99.png 300w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/1fashionbrand-768x254.png 768w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/1fashionbrand-1536x508.png 1536w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/1fashionbrand-2048x677.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\"><em><sub>Case Study 1. Total Homepage Loading Time: 12 seconds<\/sub><\/em><\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Visual appearance is crucial for a <strong>fashion e-commerce:<\/strong> in this case, using an <strong>image carousel <\/strong>is practically mandatory when compared to competitors. However, the loading time for the first slide is <strong>4.5 seconds<\/strong>, exceeding the recommended 2.5 seconds for the Largest Contentful Paint (the largest element on the page).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In the first <strong>3 seconds of loading<\/strong>, the only visible elements are the logo (with alt text), hamburger menu, cart icon, text for the search bar, and slider selector. However, these<strong> elements are difficult to see<\/strong> as they are black on a dark background.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">A <strong>Call To Action pop-up<\/strong> to download the app is quickly covered by the <strong>cookie acceptance banner,<\/strong> which, however, causes a layout shift (CLS). The <strong>images in the slider<\/strong> also contribute to the low CLS score: the browser can&#8217;t determine image size until they&#8217;ve fully loaded.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"case-study-1-ong\">Case Study #2: International NGO<\/h3>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"339\" src=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/2charityorg-1024x339.png\" alt=\"case study homepage loading times NGO\" class=\"wp-image-5240\" srcset=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/2charityorg-1024x339.png 1024w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/2charityorg-300x99.png 300w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/2charityorg-768x254.png 768w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/2charityorg-1536x508.png 1536w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/2charityorg-2048x677.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\"><em><sub>Case Study 2. Total Homepage Loading Time: 7 seconds<\/sub><\/em><\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">In this example, the <strong>total page loading time<\/strong> is better, although we can highlight some elements affecting <strong>download performance.<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In addition to an image carousel that exceeds the <strong>recommended LCP limit, <\/strong>the website uses a custom font that must be downloaded before the page displays. The font alone takes about <strong>4.5 seconds<\/strong> to download, limiting the loading of text content.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Some elements lack <strong>sufficient color contrast<\/strong>, and images don&#8217;t include <strong>alt text<\/strong>\u2014both are <strong>accessibility <\/strong>drawbacks.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>The cookie banner isn&#8217;t configured correctly:<\/strong> it still allows scrolling and doesn&#8217;t provide user choices, contradicting the <a href=\"https:\/\/www.antartika.it\/en\/news\/new-guidelines-cookie-usage-italy\/\" data-type=\"post\" data-id=\"9382\">new GDPR and ePrivacy directives<\/a> that require cookie installation only with <strong>explicit user consent.<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"case-study-1-agenzia\">Case Study #3: Communication Agency<\/h3>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"339\" src=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/3martkagency-1024x339.png\" alt=\"case study website performance agency\" class=\"wp-image-5241\" srcset=\"https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/3martkagency-1024x339.png 1024w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/3martkagency-300x99.png 300w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/3martkagency-768x254.png 768w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/3martkagency-1536x508.png 1536w, https:\/\/www.antartika.it\/wp-content\/uploads\/2022\/08\/3martkagency-2048x677.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\"><em><sub>Case Study 3. Total Homepage Loading Time: 23.5 seconds<\/sub><\/em><\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The last example demonstrates how even <strong>those &#8220;in the field&#8221;<\/strong> can make ineffective web design choices.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>No elements<\/strong> appeared <strong>before the 3-second loading mark.<\/strong> The <strong>slider <\/strong>represents the Largest Contentful Paint and takes <strong>over 7 seconds<\/strong> to display the first image. Additionally, the images lack the <strong>lazy-load attribute<\/strong> for background downloading, thus consuming resources useful for page loading.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Four custom fonts<\/strong> are installed on the page, preventing text display until the resources are fully loaded. Consequently, <strong>the browser hides the text entirely for 14 seconds<\/strong> instead of showing a fallback character. Lastly,<strong> the cookie banner is not GDPR-compliant <\/strong>in this case as well.<\/p>\n\n\n<style>\n:root{\n    --primary:      #008B95;\n    --secondary:    #363534;\n    --grey:         #F9F9F9;\n    --gr-dark:      #B6B6B5;\n    --anta-grey:    #6D6C6B;\n}\n\n\n\n\/************   Cf7 **************************+*\/\n.blocco-newsletter-articoli-blog.sfondo-a-righe {\n    background-image: linear-gradient(135deg,#e9e9e9 10%,#fff 10%,#fff 50%,#e9e9e9 50%,#e9e9e9 60%,#fff 60%,#fff 100%);\n    background-size: 7.07px 7.07px;\n    border: 1px solid #e9e9e9;\n}\n\n.blocco-newsletter-articoli-blog .titolo-cta {\n    font-family: var(--font-fam-body);\n    color: var(--bs-primary);\n}\n\n.blocco-newsletter-articoli-blog form p.h4 {\n    display: none;\n}\n\n.blocco-newsletter-articoli-blog form .row  {\n    margin-top: 1.5rem;\n}\n\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"]{\n    margin-bottom: 0;\n    margin-top:0;\n\n}\n.blocco-newsletter-articoli-blog .wpcf7 label {\n    margin-top: 0;\n}\n.blocco-newsletter-articoli-blog .wpcf7 p.h4{\n    color:var(--anta-grey);\n}\n\n.blocco-newsletter-articoli-blog form [type=checkbox]+.wpcf7-list-item-label::before {\n    background-color: white;\n}\n\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"] {\n    background-color: white !important;\n    font-size: calc(var(--fsz-p) * 1.15);\n    \/* content: 'per 1.15 mantiene fluidit\u00e0 e arriva a 24px che \u00e8 il risultato desiderato su desktop'; *\/\n}\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"]:autofill,\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"]:-webkit-autofill {\n    background-color: white !important;\n    box-shadow: 0 0 0 40px white inset!important;\n}\n\n.blocco-newsletter-articoli-blog .wpcf7 .wpcf7-submit {\n    background-color: white;\n}\n.blocco-newsletter-articoli-blog .wpcf7 input[type=\"email\"]::placeholder{\n    color:var(--gr-dark);\n    font-weight: 300;\n    font-size: var(--fsz-h5);\n    padding-left: 0.5rem;\n}\n.blocco-newsletter-articoli-blog .wpcf7 .wpcf7-spinner{\n    position: absolute;\n    bottom: 5rem;\n    right: 3rem;\n}\n\n.blocco-newsletter-articoli-blog .wpcf7 .wpcf7-submit:hover{\n    border: 2px solid var(--primary);\n    background-color: var(--primary);\n    color: white;\n}\n.blocco-newsletter-articoli-blog .wpcf7 .wpcf7-submit:disabled{\n    opacity: 1;\n}\n.blocco-newsletter-articoli-blog .wpcf7 form.sent .wpcf7-response-output{\n    border-color: var(--primary);\n}\n@media screen and (max-width:575px){\n    .blocco-newsletter-articoli-blog .wpcf7 .wpcf7-submit{\n        position: absolute;\n        bottom: 0rem;\n    }\n}\n@media screen and (min-width:1400px){\n\n\n    .blocco-newsletter-articoli-blog .wpcf7 .wpcf7-acceptance label{\n        margin-top:0;\n    }\n}\n<\/style>\n\n\n<div  class=\"anta-block blocco-newsletter-articoli-blog sfondo-a-righe py-4 mt-5\">\n\n    <div class=\"container-fluid\">\n        <div class=\"row\">\n            <div class=\"col-12\">\n                <p class=\"h2 mb-3 mt-0 titolo-cta\"><span class=\"green\">Subscribe to our newsletter<\/span><\/p>\n            <\/div>\n        <\/div>\n\n        <div class=\"row align-items-start\">\n            <div class=\"col-12\">\n                <p class=\"p-lg\">And receive news, tips, and strategies to enhance your online presence.<\/p>\n            <\/div>\n\n            <div class=\"col-12 position-relative\">\n                \n<div class=\"wpcf7 no-js\" id=\"wpcf7-f12032-o2\" lang=\"en-US\" dir=\"ltr\" data-wpcf7-id=\"12032\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/en\/wp-json\/wp\/v2\/posts\/9504#wpcf7-f12032-o2\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Contact form\" novalidate=\"novalidate\" data-status=\"init\">\n<fieldset class=\"hidden-fields-container\"><input type=\"hidden\" name=\"_wpcf7\" value=\"12032\" \/><input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.1.5\" \/><input type=\"hidden\" name=\"_wpcf7_locale\" value=\"en_US\" \/><input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f12032-o2\" \/><input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/><input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<\/fieldset>\n<div class=\"wpcf7-turnstile cf-turnstile\" data-sitekey=\"0x4AAAAAADKz9X03-_9CBiDr\" data-response-field-name=\"_wpcf7_turnstile_response\"><\/div>\n\n<div class=\"row align-items-end\">\n<div class=\"col-sm-9 pe-sm-0\">\n<label for=\"your-email-blog\" class=\"mb-0\">\n<h4 class=\"h4\">Enter your email address:<\/h4>\n\n    <span class=\"wpcf7-form-control-wrap\" data-name=\"your-email-blog\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"yourmail@mail.ext\" value=\"\" type=\"email\" name=\"your-email-blog\" \/><\/span><\/label>\n<\/div>\n<div class=\"col-sm-3 ps-sm-0\">\n<input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"Send\" \/>\n<\/div>\n<div class=\"privacy d-flex mt-3\">\n <fieldset class=\"m-0 p-0 border-0\">\n      <legend class=\"visually-hidden\">Consenso al trattamento dei dati personali<\/legend>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"acceptance-516\"><span class=\"wpcf7-form-control wpcf7-acceptance\"><span class=\"wpcf7-list-item\"><label><input type=\"checkbox\" name=\"acceptance-516\" value=\"1\" class=\"acceptance\" aria-invalid=\"false\" \/><span class=\"wpcf7-list-item-label\">I consent to the processing of my data in accordance with your <a href=\"https:\/\/www.iubenda.com\/privacy-policy\/82033330\" class=\"iubenda-nostyle no-brand iubenda-embed \" title=\"Privacy Policy\" target=\"_blank\" rel=\"noopener\">privacy policy<\/a><span class=\"ms-1\">*<\/span><\/span><\/label><\/span><\/span><\/span>\n  <legend class=\"visually-hidden\">Newsletter subscription<\/legend>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"checkbox-newsletter\"><span class=\"wpcf7-form-control wpcf7-checkbox\"><span class=\"wpcf7-list-item first last\"><label><input type=\"checkbox\" name=\"checkbox-newsletter[]\" value=\"I would like to subscribe to the newsletter to receive updates on Digital Marketing\" \/><span class=\"wpcf7-list-item-label\">I would like to subscribe to the newsletter to receive updates on Digital Marketing<\/span><\/label><\/span><\/span><\/span> \n<\/fieldset>\n<\/div>\n<\/div>\n<div class=\"spacing-l d-sm-none\"><\/div><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n            <\/div>\n        <\/div><!-- end row -->\n    <\/div><!-- end container-fluid -->\n\n<\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"conclusione-strategia-winwin\">Conclusion: Reaching a Win-Win Strategy<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">There can be countless reasons why a company or organization makes <strong>non-performance-friendly web design choices.<\/strong> Competition comparison, use of unreliable test tools, or fear of compromising the brand&#8217;s image.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">However, it&#8217;s always possible to avoid some of these choices, for example:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Opt for a static and optimized image <\/strong>for web navigation, using it as a background for the first <strong>content visible above the fold<\/strong> instead of videos or carousels;<\/li>\n\n\n\n<li><strong>Use a web-safe font <\/strong>to avoid invoking too many resources from third parties;<\/li>\n\n\n\n<li><strong>Favor a web design with a mobile-first and accessibility perspective<\/strong> to prevent <strong>layout shifts <\/strong>across devices and use <strong>graphics suitable for all <\/strong>users;<\/li>\n\n\n\n<li><strong>Configure and update<\/strong> the <strong>cookie acceptance banner<\/strong> correctly.<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">As professionals, it&#8217;s our duty to <strong>help clients design websites with excellent loading performance<\/strong> that <strong>meet user expectations<\/strong> while maintaining an <strong>appealing and aesthetically pleasing design.<\/strong> A win-win strategy that allows the business to gain importance in the eyes of both users and search engines.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Discover our <a href=\"https:\/\/www.antartika.it\/en\/case-studies\/\" data-type=\"page\" data-id=\"6085\">Case Studies<\/a> and contact us at <a href=\"mailto:web@antartika.it\" target=\"_blank\" rel=\"noreferrer noopener\">web@antartika.it<\/a> for any information.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ineffective website design significantly impacts not only loading performance but also SEO, UX, and advertising. Discover the main web design choices to pay attention to in relation to web performance. <span class=\"excerpt-link\"><a class=\"ms-1 understrap-read-more-link\" href=\"https:\/\/www.antartika.it\/en\/web-development\/inadequate-web-design-causes-effects\/\">Read more &raquo;<span class=\"screen-reader-text\"> from Bad Web Design: Causes and Effects of Inadequate Web Design<\/span><\/a><\/span><\/p>\n","protected":false},"author":2,"featured_media":7586,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"_lmt_disableupdate":"yes","_lmt_disable":"","footnotes":""},"categories":[194],"tags":[197,225,280],"class_list":["post-9504","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-development","tag-design-en","tag-seo-en","tag-sitoweb-en"],"acf":[],"modified_by":"AntaUser3","_links":{"self":[{"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/posts\/9504","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/comments?post=9504"}],"version-history":[{"count":0,"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/posts\/9504\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/media\/7586"}],"wp:attachment":[{"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/media?parent=9504"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/categories?post=9504"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.antartika.it\/en\/wp-json\/wp\/v2\/tags?post=9504"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}