{"id":260,"date":"2020-08-28T12:51:16","date_gmt":"2020-08-28T11:51:16","guid":{"rendered":"http:\/\/www.friezedesign.co.uk\/blog\/?p=260"},"modified":"2026-02-22T16:27:00","modified_gmt":"2026-02-22T16:27:00","slug":"website-usability","status":"publish","type":"post","link":"https:\/\/www.friezedesign.co.uk\/blog\/website-usability\/","title":{"rendered":"Website Usability"},"content":{"rendered":"<style>.wp-block-kadence-advancedheading.kt-adv-heading260_a9e98e-17, .wp-block-kadence-advancedheading.kt-adv-heading260_a9e98e-17[data-kb-block=\"kb-adv-heading260_a9e98e-17\"]{text-align:center;font-weight:400;font-style:normal;font-family:Georgia, serif;text-transform:capitalize;color:#ea024d;}.wp-block-kadence-advancedheading.kt-adv-heading260_a9e98e-17 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading260_a9e98e-17[data-kb-block=\"kb-adv-heading260_a9e98e-17\"] mark.kt-highlight{font-weight:normal;font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading260_a9e98e-17 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading260_a9e98e-17[data-kb-block=\"kb-adv-heading260_a9e98e-17\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h4 class=\"kt-adv-heading260_a9e98e-17 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading260_a9e98e-17\">&#8220;What it is and why it is so important&#8221;<\/h4>\n\n\n\n<p>When we design websites, usability is always our top priority, above all else. But it&#8217;s shocking how many websites we see, where usability hasn&#8217;t been given a second thought. <\/p>\n\n\n\n<p>Usability is intrinsic to good web design. If your website&#8217;s usability is poor &#8211; your website has been poorly designed.<\/p>\n\n\n\n<!--more-->\n\n\n\n<p>All websites, regardless of their complexity, need to be usable for even the most technophobic and non-savvy of visitors.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Website Usability <strong>Principles<\/strong><\/h3>\n\n\n\n<p>Much of what ensures a website&#8217;s design will be usable on completion, is discovered as part of the &#8216;<a href=\"https:\/\/www.friezedesign.co.uk\/blog\/web-design-planning\/\" data-type=\"post\" data-id=\"111\">design planning phase<\/a>&#8216;. Each website will have unique aims and requirements, so usability will need to be tailored to fit. However, there are some <strong>essential usability principles that can be applied to any website<\/strong>:<\/p>\n\n\n<style>.wp-block-kadence-column.kb-section-dir-horizontal > .kt-inside-inner-col > .kt-info-box260_dfd6bc-2c .kt-blocks-info-box-link-wrap{max-width:unset;}.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-link-wrap{border-top:1px solid #eeeeee;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;background:#ffffff;padding-top:26px;padding-right:26px;padding-bottom:26px;padding-left:26px;margin-top:66px;}.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-link-wrap:hover{background:#ffffff;}.kt-info-box260_dfd6bc-2c .kadence-info-box-icon-container .kt-info-svg-icon, .kt-info-box260_dfd6bc-2c .kt-info-svg-icon-flip, .kt-info-box260_dfd6bc-2c .kt-blocks-info-box-number{font-size:32px;}.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-media{color:#ffffff;background:#cd2653;border-color:#eeeeee;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;padding-top:12px;padding-right:12px;padding-bottom:12px;padding-left:12px;}.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-media-container{margin-top:-59px;margin-right:0px;margin-bottom:20px;margin-left:0px;}.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-link-wrap:hover .kt-blocks-info-box-media{color:#ffffff;background:#cd2653;border-color:#eeeeee;}.kt-info-box260_dfd6bc-2c .kt-infobox-textcontent h4.kt-blocks-info-box-title{color:#000000;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;margin-top:5px;margin-right:0px;margin-bottom:10px;margin-left:0px;}.kt-info-box260_dfd6bc-2c .kt-infobox-textcontent .kt-blocks-info-box-text{color:#555555;}.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-learnmore{background:transparent;border-color:#555555;border-width:0px 0px 0px 0px;padding-top:4px;padding-right:8px;padding-bottom:4px;padding-left:8px;margin-top:10px;margin-right:0px;margin-bottom:10px;margin-left:0px;}.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-link-wrap:hover .kt-blocks-info-box-learnmore,.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-link-wrap .kt-blocks-info-box-learnmore:focus{color:#ffffff;background:#444444;border-color:#444444;}@media all and (max-width: 1024px){.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-link-wrap{border-top:1px solid #eeeeee;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;}}@media all and (max-width: 767px){.kt-info-box260_dfd6bc-2c .kt-blocks-info-box-link-wrap{border-top:1px solid #eeeeee;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;}}<\/style>\n<div class=\"wp-block-kadence-infobox kt-info-box260_dfd6bc-2c\"><a class=\"kt-blocks-info-box-link-wrap info-box-link kt-blocks-info-box-media-align-top kt-info-halign-left\" href=\"W\"><div class=\"kt-blocks-info-box-media-container\"><div class=\"kt-blocks-info-box-media kt-info-media-animate-none\"><div class=\"kadence-info-box-icon-container kt-info-icon-animate-none\"><div class=\"kadence-info-box-icon-inner-container\"><span class=\"kb-svg-icon-wrap kb-svg-icon-fe_arrowDownCircle kt-info-svg-icon\"><svg viewBox=\"0 0 24 24\"  fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><polyline points=\"8 12 12 16 16 12\"\/><line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"16\"\/><\/svg><\/span><\/div><\/div><\/div><\/div><div class=\"kt-infobox-textcontent\"><h4 class=\"kt-blocks-info-box-title\">Intuitive<\/h4><p class=\"kt-blocks-info-box-text\">Visitors to your website should know what to do without thinking. Methods we employ to help achieve this include:<br\/><br\/><em><strong> Well Structured Content<\/strong><\/em><br\/><strong><em>Site-Wide Consistency<\/em><\/strong><br\/><strong><em>Strong Cues and Labeling<\/em><\/strong><br\/><strong><em>Dynamic Feedback<\/em><\/strong> (what a user should do next)<br\/><strong><em>L<\/em><\/strong><em><strong>ogical Website Navigation<\/strong><\/em><br\/><strong><em>Good, Clear Typographic Style<\/em><\/strong><br\/><strong><em>Adopt <\/em><\/strong><em><strong>Suitable <\/strong><\/em><strong><em>Conventions<\/em><\/strong><\/p><\/div><\/a><\/div>\n\n\n<style>.wp-block-kadence-column.kb-section-dir-horizontal > .kt-inside-inner-col > .kt-info-box260_218b17-40 .kt-blocks-info-box-link-wrap{max-width:unset;}.kt-info-box260_218b17-40 .kt-blocks-info-box-link-wrap{border-top:1px solid #eeeeee;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;background:#ffffff;padding-top:26px;padding-right:26px;padding-bottom:26px;padding-left:26px;margin-top:66px;}.kt-info-box260_218b17-40 .kt-blocks-info-box-link-wrap:hover{background:#ffffff;}.kt-info-box260_218b17-40 .kadence-info-box-icon-container .kt-info-svg-icon, .kt-info-box260_218b17-40 .kt-info-svg-icon-flip, .kt-info-box260_218b17-40 .kt-blocks-info-box-number{font-size:32px;}.kt-info-box260_218b17-40 .kt-blocks-info-box-media{color:#ffffff;background:#cd2653;border-color:#eeeeee;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;padding-top:12px;padding-right:12px;padding-bottom:12px;padding-left:12px;}.kt-info-box260_218b17-40 .kt-blocks-info-box-media-container{margin-top:-59px;margin-right:0px;margin-bottom:20px;margin-left:0px;}.kt-info-box260_218b17-40 .kt-blocks-info-box-link-wrap:hover .kt-blocks-info-box-media{color:#ffffff;background:#cd2653;border-color:#eeeeee;}.kt-info-box260_218b17-40 .kt-infobox-textcontent h4.kt-blocks-info-box-title{color:#000000;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;margin-top:5px;margin-right:0px;margin-bottom:10px;margin-left:0px;}.kt-info-box260_218b17-40 .kt-infobox-textcontent .kt-blocks-info-box-text{color:#555555;}.kt-info-box260_218b17-40 .kt-blocks-info-box-learnmore{background:transparent;border-color:#555555;border-width:0px 0px 0px 0px;padding-top:4px;padding-right:8px;padding-bottom:4px;padding-left:8px;margin-top:10px;margin-right:0px;margin-bottom:10px;margin-left:0px;}.kt-info-box260_218b17-40 .kt-blocks-info-box-link-wrap:hover .kt-blocks-info-box-learnmore,.kt-info-box260_218b17-40 .kt-blocks-info-box-link-wrap .kt-blocks-info-box-learnmore:focus{color:#ffffff;background:#444444;border-color:#444444;}@media all and (max-width: 1024px){.kt-info-box260_218b17-40 .kt-blocks-info-box-link-wrap{border-top:1px solid #eeeeee;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;}}@media all and (max-width: 767px){.kt-info-box260_218b17-40 .kt-blocks-info-box-link-wrap{border-top:1px solid #eeeeee;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;}}<\/style>\n<div class=\"wp-block-kadence-infobox kt-info-box260_218b17-40\"><a class=\"kt-blocks-info-box-link-wrap info-box-link kt-blocks-info-box-media-align-top kt-info-halign-left\" href=\"Wlanging\"><div class=\"kt-blocks-info-box-media-container\"><div class=\"kt-blocks-info-box-media kt-info-media-animate-none\"><div class=\"kadence-info-box-icon-container kt-info-icon-animate-none\"><div class=\"kadence-info-box-icon-inner-container\"><span class=\"kb-svg-icon-wrap kb-svg-icon-fe_arrowDownCircle kt-info-svg-icon\"><svg viewBox=\"0 0 24 24\"  fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><polyline points=\"8 12 12 16 16 12\"\/><line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"16\"\/><\/svg><\/span><\/div><\/div><\/div><\/div><div class=\"kt-infobox-textcontent\"><h4 class=\"kt-blocks-info-box-title\">Inclusive<\/h4><p class=\"kt-blocks-info-box-text\">Different people, on different devices,  in all kinds of different situations &#8211; your website needs to be available to them all. Unlike other media (print, TV), a website needs to be extremely flexible. Methods we employ to help achieve this include:<br\/><br\/><strong><em>Use Device Independent Coding Techniques<\/em><\/strong><br\/><strong><em>Awareness of Device Properties<\/em><\/strong> (ex: touch\/cursor)<br\/><strong><em>Device Usage Scenarios<\/em><\/strong> (ex: outdoors\/indoors) <br\/><strong><em>Follow Recognised Accessibility Rules<\/em><\/strong><br\/><strong><em>Optimise For Speed and Response Times<\/em><\/strong> (see below)<em><br\/><strong>Multi Device, Platform and Browser Testing<\/strong><\/em><br\/><strong><em>Test Multiple Connection Speeds<\/em><\/strong> (WiFi\/3G\/4G\/5G)<\/p><\/div><\/a><\/div>\n\n\n<style>.wp-block-kadence-column.kb-section-dir-horizontal > .kt-inside-inner-col > .kt-info-box260_ec8c1c-6d .kt-blocks-info-box-link-wrap{max-width:unset;}.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-link-wrap{border-top:1px solid #eeeeee;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;background:#ffffff;padding-top:26px;padding-right:26px;padding-bottom:26px;padding-left:26px;margin-top:66px;}.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-link-wrap:hover{background:#ffffff;}.kt-info-box260_ec8c1c-6d .kadence-info-box-icon-container .kt-info-svg-icon, .kt-info-box260_ec8c1c-6d .kt-info-svg-icon-flip, .kt-info-box260_ec8c1c-6d .kt-blocks-info-box-number{font-size:32px;}.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-media{color:#ffffff;background:#cd2653;border-color:#eeeeee;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;padding-top:12px;padding-right:12px;padding-bottom:12px;padding-left:12px;}.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-media-container{margin-top:-59px;margin-right:0px;margin-bottom:20px;margin-left:0px;}.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-link-wrap:hover .kt-blocks-info-box-media{color:#ffffff;background:#cd2653;border-color:#eeeeee;}.kt-info-box260_ec8c1c-6d .kt-infobox-textcontent h4.kt-blocks-info-box-title{color:#000000;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;margin-top:5px;margin-right:0px;margin-bottom:10px;margin-left:0px;}.kt-info-box260_ec8c1c-6d .kt-infobox-textcontent .kt-blocks-info-box-text{color:#555555;}.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-learnmore{background:transparent;border-color:#555555;border-width:0px 0px 0px 0px;padding-top:4px;padding-right:8px;padding-bottom:4px;padding-left:8px;margin-top:10px;margin-right:0px;margin-bottom:10px;margin-left:0px;}.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-link-wrap:hover .kt-blocks-info-box-learnmore,.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-link-wrap .kt-blocks-info-box-learnmore:focus{color:#ffffff;background:#444444;border-color:#444444;}@media all and (max-width: 1024px){.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-link-wrap{border-top:1px solid #eeeeee;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;}}@media all and (max-width: 767px){.kt-info-box260_ec8c1c-6d .kt-blocks-info-box-link-wrap{border-top:1px solid #eeeeee;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;}}<\/style>\n<div class=\"wp-block-kadence-infobox kt-info-box260_ec8c1c-6d\"><a class=\"kt-blocks-info-box-link-wrap info-box-link kt-blocks-info-box-media-align-top kt-info-halign-left\" href=\"Wlanging\"><div class=\"kt-blocks-info-box-media-container\"><div class=\"kt-blocks-info-box-media kt-info-media-animate-none\"><div class=\"kadence-info-box-icon-container kt-info-icon-animate-none\"><div class=\"kadence-info-box-icon-inner-container\"><span class=\"kb-svg-icon-wrap kb-svg-icon-fe_arrowDownCircle kt-info-svg-icon\"><svg viewBox=\"0 0 24 24\"  fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><polyline points=\"8 12 12 16 16 12\"\/><line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"16\"\/><\/svg><\/span><\/div><\/div><\/div><\/div><div class=\"kt-infobox-textcontent\"><h4 class=\"kt-blocks-info-box-title\">Responsive &amp; Nimble<\/h4><p class=\"kt-blocks-info-box-text\">Your website needs to be optimised so it loads quickly and instantly responds to the user&#8217;s interactions. Methods we employ to help achieve this include:<br\/><br\/><em><strong> Optimise Media For Fast Loading <\/strong><\/em>(Images, Video, etc.)<em><br\/><\/em><strong><em>Minimise Server Requests<\/em><\/strong> (Merge files where possible)<br\/><strong><em>Remove Unnecessary Animations<\/em><\/strong> (Slow, lagging, clunky UI)<br\/><strong><em>Avoid Resource Hungry &#8216;Wow Factor&#8217; Design<\/em><\/strong><br\/><strong><em>Consider Overall Page Load<\/em><\/strong> (Combined file sizes)<\/p><\/div><\/a><\/div>\n\n\n\n<p>Interested in seeing <a href=\"https:\/\/www.friezedesign.co.uk\/fse-test\/\">Usability\/UX in practice &#8211; Client Prototype<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&#8220;What it is and why it is so important&#8221; When we design websites, usability is always our top priority, above all else. But it&#8217;s shocking how many websites we see, where usability hasn&#8217;t been given a second thought. Usability is intrinsic to good web design. If your website&#8217;s usability is poor &#8211; your website has [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[33,34,35,17,32,19,18,9],"class_list":["post-260","post","type-post","status-publish","format-standard","hentry","category-web-design","tag-multi-device-web-design","tag-optimised","tag-responsive","tag-usability","tag-usability-principles","tag-user-experience","tag-ux","tag-website-design"],"_links":{"self":[{"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/posts\/260","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/comments?post=260"}],"version-history":[{"count":66,"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/posts\/260\/revisions"}],"predecessor-version":[{"id":1057,"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/posts\/260\/revisions\/1057"}],"wp:attachment":[{"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/media?parent=260"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/categories?post=260"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.friezedesign.co.uk\/blog\/wp-json\/wp\/v2\/tags?post=260"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}