{"id":18836,"date":"2023-05-01T00:00:00","date_gmt":"2023-04-30T23:00:00","guid":{"rendered":"https:\/\/techforgood.cymru\/resource\/website-design-critique-5-catalyst\/"},"modified":"2024-09-24T08:14:10","modified_gmt":"2024-09-24T07:14:10","slug":"website-design-critique-5-catalyst","status":"publish","type":"resource","link":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/","title":{"rendered":"Website design critique #5: Catalyst"},"content":{"rendered":"<p id=\"\">This resource is for:<\/p>\n<ul id=\"\">\n<li id=\"\">Website managers and their managers<\/li>\n<li id=\"\">Anyone interested in improving their website\u2019s content and interface design&nbsp;<\/li>\n<\/ul>\n<p id=\"\">This is the 5th in an irregular series of articles critiquing charity websites. By showing you examples of good and bad design you learn more than if we just told you.&nbsp;<\/p>\n<p id=\"\">This time we\u2019re critiquing the Catalyst website! The crit covers two overlapping types of design:<\/p>\n<ul id=\"\">\n<li id=\"\">Content design &#8211; how words, pictures, media, data are used<\/li>\n<li id=\"\">User experience design &#8211; interface, visual elements, information organisation<\/li>\n<\/ul>\n<p id=\"\">Credit to <a href=\"https:\/\/lapope.com\/\" target=\"_blank\" id=\"\" rel=\"noopener\">Lauren Pope<\/a> (content designer working with charities) and <a href=\"https:\/\/beckycolley.co.uk\/\" target=\"_blank\" id=\"\" rel=\"noopener\">Becky Colley<\/a> (product designer at BUPA) for their independent critiques of the site.&nbsp;<\/p>\n<h2 id=\"\"><strong id=\"\">Site goals<\/strong><\/h2>\n<p id=\"\">Becky and Lauren critiqued the site as it was in late February 2023. At that time the main site goal was:<\/p>\n<ul id=\"\">\n<li id=\"\">Help people in non-profit organisations to build their capacity and knowledge in using digital, design and data in their work.&nbsp;<\/li>\n<\/ul>\n<p id=\"\">The site also had two secondary goals:<\/p>\n<ul id=\"\">\n<li id=\"\">Help organisations supporting charities to get better at using digital in their work &#8211; including funders and umbrella organisations<\/li>\n<li id=\"\">Support digital agencies and freelancers to participate in the ecosystem of charity digital work.<\/li>\n<\/ul>\n<h1 id=\"\"><strong id=\"\">The crit<\/strong><\/h1>\n<p id=\"\">We critiqued 3 pages &#8211; <a href=\"https:\/\/www.thecatalyst.org.uk\/\" target=\"_blank\" id=\"\" rel=\"noopener\">home<\/a>, the <a href=\"https:\/\/www.thecatalyst.org.uk\/services\" target=\"_blank\" id=\"\" rel=\"noopener\">services landing page<\/a>, and the <a href=\"https:\/\/www.thecatalyst.org.uk\/resources\" target=\"_blank\" id=\"\" rel=\"noopener\">resources landing page<\/a>.&nbsp;<\/p>\n<p id=\"\">The crit uses an \u2018advice-first\u2019 format to make each point. Underneath each point you can read about the problem with the page and details of the recommended solution. <\/p>\n<p id=\"\">See which advice points might apply to your own site!<\/p>\n<h2 id=\"\"><strong id=\"\">I. Homepage<\/strong><\/h2>\n<p id=\"\">Goal: help people understand Catalyst, how it can help them and quickly find something useful (whether services, resources or something else).<\/p>\n<figure id=\"\" class=\"w-richtext-figure-type-image w-richtext-align-fullwidth\" style=\"max-width:1200px\" data-rt-type=\"image\" data-rt-align=\"fullwidth\" data-rt-max-width=\"1200px\">\n<div id=\"\"><img decoding=\"async\" src=\"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182d41cb77a4d65647d609_Cat-home-annotated.png\" loading=\"lazy\" alt=\"A screenshot of the homepage with numbers showing where improvements can be made. \" id=\"\" width=\"auto\" height=\"auto\"><\/div><figcaption id=\"\">Homepage, with annotations showing where improvements can be made.<\/figcaption><\/figure>\n<h3 id=\"\"><strong id=\"\">1. Use common words that people understand<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> \u201ccivil society\u201d is an uncommon way of describing the non-profit sector.&nbsp;<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cThe term \u2018civil society\u2019 made me pause &#8211; it\u2019s not familiar to me at all, I had to Google it. Is this the most familiar term people use to describe your sector?\u201d &#8211; Lauren<\/em><\/p><\/blockquote>\n<p id=\"\">\u200d<strong id=\"\">Solution:<\/strong> use a more common term. The site uses \u2018charities\u2019 elsewhere. It could use \u2018third sector\u2019 or another term that\u2019s in more common use. Note: in 2020 Catalyst canvased <a href=\"https:\/\/twitter.com\/daveainsworth4\/status\/1316685945866014721\" target=\"_blank\" id=\"\" rel=\"noopener\">views on how best to describe civil society<\/a> organisations. We found that there is no easy answer.<\/p>\n<h3 id=\"\"><strong id=\"\">2. Talk to people directly through your copy<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> there\u2019s not much \u2018you\u2019 copy, which makes it feel like you\u2019re talking about people, not to them<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> use &#8216;you&#8217; instead of the third person more consistently.<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cUsing \u2018you\u2019 a bit more could help to draw people in and make a connection for example \u2018Free resources from across our network, curated to support charities &nbsp;you at every step of their your digital journey\u2019\u201d &#8211; Lauren<\/em><\/p><\/blockquote>\n<h3 id=\"\"><strong id=\"\">3. Make link text descriptive<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> the \u2018Support &amp; services\u2019 button text doesn\u2019t make it clear what you\u2019ll get if you click it.<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> make it more descriptive. Use a full sentence as the link text, for example &#8216;find out more about the services and support we offer&#8217;.<\/p>\n<h3 id=\"\"><strong id=\"\">4. Avoid ampersands<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> &#8216;Support &amp; services&#8217; uses an ampersand. Ampersands are not accessible.<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> use the word &#8216;and&#8217; instead.<\/p>\n<h3 id=\"\"><strong id=\"\">5. Space words out on your main menu<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Opportunity:<\/strong> there is room to space out the words more. Spread them out so they\u2019re easier to scan and space is utilised better.<\/p>\n<h3 id=\"\"><strong id=\"\">6. Beware of magnifying glass icons<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> magnifying glass icons can be confused for zoom icons, especially for users with access needs who struggle with icons.&nbsp;<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> replace with the word \u201csearch\u201d.<\/p>\n<h3 id=\"\"><strong id=\"\">7. Remove repetitive content<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem: <\/strong>the \u2018Resource\u2019 tag is a bit redundant as it\u2019s under a resource header. Ditto for \u2018News\u2019.<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> get rid of the tag, or replace it with something more meaningful from the taxonomy.<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cIs there a need for these on this page? The section heading makes it clear, so I\u2019d hide the purple \u201cresource\u201d and \u201cnews\u201d labels to remove visual clutter and save space.\u201d &#8211; Becky<\/em><\/p><\/blockquote>\n<h3 id=\"\"><strong id=\"\">8. Start names of resources with keywords<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem: <\/strong>the resource names don\u2019t start with the keyword, which makes them a bit slow to scan.<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> start all resource names with the keyword e.g. \u2018Focus groups: how to get useful user research insights\u2019 not \u2018How to get useful user research insights from focus groups\u2019.<\/p>\n<h3 id=\"\"><strong id=\"\">9. Test with a screen reader<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> screen readers struggle at a few points (note: not shown on screenshot).<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> test with a screen reader and apply fixes.<\/p>\n<h3 id=\"\"><strong id=\"\">10. Use descriptors for news items<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> news item titles the same and don&#8217;t show a descriptor. This makes it difficult to know which are relevant or what to expect if you click them.<\/p>\n<p id=\"\"><strong id=\"\">Solution: <\/strong>add a sub-title or descriptor like the resource items have.&nbsp;<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cThe sub-titles on the resource items help me understand what I\u2019m clicking through to \u2014 it would be useful to include this for news items.\u201d &#8211; Becky<\/em><\/p><\/blockquote>\n<h3 id=\"\"><strong id=\"\">11. Avoid excessive content and options<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem: <\/strong>potentially bloated page.<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cDo users scroll this far down? Is this section necessary? Is it necessary on all 3 of these pages (or all website pages)?\u201d &#8211; Becky<\/em><\/p><\/blockquote>\n<p id=\"\">\u200d<strong id=\"\">Solution:<\/strong> test whether the strip \u2018Offer your services \/ Join a network \/ Stay in the loop\u2019 has value to site visitors.<\/p>\n<h3 id=\"\"><strong id=\"\">12: Remove non-essential info<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> &#8216;Catalyst is evolving&#8217; banner is a bit hard to spot<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cI completely missed this until the very end due to banner blindness. Is this info vital?\u201d &#8211; Becky<\/em><\/p><\/blockquote>\n<p id=\"\">\u200d<strong id=\"\">Solution: <\/strong>move to somewhere more visible, or use a more contrasting colour, or remove if not needed.<\/p>\n<h3 id=\"\"><strong id=\"\">13. Reconsider the popup sign up form<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> popup sign up forms can annoy visitors (note: not shown on screenshot)<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> let users find it within the site if they want to sign up for the newsletter.<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cThey can cause friction. But I can see it\u2019s a key driver of site traffic. Maybe only show every few visits, rather than every time? Especially for returning users.\u201d &#8211; Becky<\/em><\/p><\/blockquote>\n<h2 id=\"\"><strong id=\"\">II. Support and services landing page<\/strong><\/h2>\n<p id=\"\">Page goal: help people find a useful service, or decide if there isn\u2019t one for them.<\/p>\n<figure id=\"\" class=\"w-richtext-figure-type-image w-richtext-align-fullwidth\" style=\"max-width:1200px\" data-rt-type=\"image\" data-rt-align=\"fullwidth\" data-rt-max-width=\"1200px\">\n<div id=\"\"><img decoding=\"async\" src=\"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182da65ca18532f7d44e30_Cat-service-annotated2.png\" loading=\"lazy\" alt=\"A screenshot of the services page with numbers showing where improvements can be made. \" id=\"\" width=\"auto\" height=\"auto\"><\/div><figcaption id=\"\">Services page, with annotations showing where improvements can be made.<\/figcaption><\/figure>\n<h3 id=\"\"><strong id=\"\">14. Use sentence case rather than title case, and avoid ampersands<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> the page header \u2018Support &amp; Services\u2019 uses title case and an ampersand. Both make it harder to read.&nbsp;<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> use sentence case. Write \u2018and\u2019 in full both here and in the breadcrumbs.<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cAmpersands are not accessible \u2014 use the word &#8216;and&#8217; instead\u201d &#8211; Becky<\/em><\/p><\/blockquote>\n<h3 id=\"\"><strong id=\"\">15. Group similar services together<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> the 9 service cards are laid out in one big block. This makes skimming harder. Finding what\u2019s relevant to you takes longer.&nbsp;&nbsp;<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> consider grouping the services under sub-headings. For example: Peer support, Expert advice, Research, Training, etc<\/p>\n<h3 id=\"\"><strong id=\"\">16. Make service names easy to see<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem: <\/strong>putting the service name in the card\u2019s tag makes it easier to ignore. And writing it in all caps makes it harder to read.<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> make the service name more visually impactful. This will also help people looking for things by name.<\/p>\n<h3 id=\"\"><strong id=\"\">17. Make cards clickable rather than only the text<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> you have to click on the service&#8217;s title to get to the service&#8217;s page. This is ok but could be made easier for the user.<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> make the whole box clickable.<\/p>\n<h3 id=\"\"><strong id=\"\">18. Consider floating rather than fixed menu bars<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Opportunity:<\/strong> add a floating menu bar. This type of menu bar stays at the top of the screen while a user scrolls the page. It makes it easier to navigate to other sections, or use search, without scrolling back up to the page top.<\/p>\n<h2 id=\"\"><strong id=\"\">III. Resources landing page<\/strong><\/h2>\n<p id=\"\">Page goal: help people find a resource they need or quickly see if it\u2019s not there.<\/p>\n<figure id=\"\" class=\"w-richtext-figure-type-image w-richtext-align-fullwidth\" style=\"max-width:1200px\" data-rt-type=\"image\" data-rt-align=\"fullwidth\" data-rt-max-width=\"1200px\">\n<div id=\"\"><img decoding=\"async\" src=\"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182de1bf7f917866951e44_Cat-resources-annotated.png\" loading=\"lazy\" alt=\"A screenshot of the resources page with numbers showing where improvements can be made. \" id=\"\" width=\"auto\" height=\"auto\"><\/div><figcaption id=\"\">Resources page, with annotations showing where improvements can be made. <\/figcaption><\/figure>\n<h3 id=\"\"><strong id=\"\">19. Show the scale of any resources available<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> the intro paragraph doesn\u2019t give an idea of the scale of the resources available. Users don\u2019t know what to expect.<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> say in the intro copy how many resources are available.<\/p>\n<h3 id=\"\"><strong id=\"\">20. Show why resources are relevant and credible<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> the intro paragraph doesn\u2019t let users know who created the resources and why they should trust them. This leaves them less certain about what they will find.<\/p>\n<p id=\"\"><strong id=\"\">Solution: <\/strong>include copy explaining why these are credible resources that people can put their trust in.<\/p>\n<h3 id=\"\"><strong id=\"\">21. Don\u2019t add extra links unless there\u2019s a clear user need<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem: <\/strong>the link in the intro paragraph to \u2018Start by learning what we mean by digital\u2019 doesn\u2019t make its value to the user clear. Also, it probably is not be what most users want from the page.&nbsp;<\/p>\n<p id=\"\"><strong id=\"\">Solution: <\/strong>move the link into a topic category, like the other resources. Write about it in terms that make the value to the user clear.<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cThis link feels a lot like something you want the user to do, rather than something the user would want from a resource page.\u201d &#8211; Lauren<\/em><\/p><\/blockquote>\n<h3 id=\"\"><strong id=\"\">22. Reduce scroll time to get to the useful stuff<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> it\u2019s a bit of a scroll before you actually get to any of the resources.&nbsp;<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> link to the top three resources above the scroll point.<\/p>\n<h3 id=\"\"><strong id=\"\">23. Avoid long drop down menus<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> the topics drop down menu is very long and unwieldy, especially as lots of the terms start with the same word. This will be frustrating for users.<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> make the names easier to scan as a list or remove the menu.<\/p>\n<h3 id=\"\"><strong id=\"\">24. Avoid ambiguous icons<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem: <\/strong>the &#8216;+&#8217; icon could indicate that the button is an accordion.&nbsp;<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> remove or replace with another icon.<\/p>\n<h3 id=\"\"><strong id=\"\">25. Offer search and filter functionality for large amounts of resources<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> too many topics (19), and likely overlap amongst them. Also, users may be expecting a list of all resources rather than a list of topics. (Note: this is not numbered in the screenshot and the screenshot shows only 5\/19 topics)<\/p>\n<p id=\"\"><strong id=\"\">Solution:<\/strong> make this page function more like a search results page, with a full list of all the resources, and pagination. Let the user use the search box or filters to refine the results. This would help them find resources relevant to what they are looking for more quickly.&nbsp;&nbsp;<\/p>\n<h3 id=\"\"><strong id=\"\">26. Make cards clickable rather than only the text<\/strong><\/h3>\n<p id=\"\"><strong id=\"\">Problem:<\/strong> you have to click on the topic card title to get to the topic page. This is ok but could be made easier for the user.<\/p>\n<blockquote id=\"\"><p><em id=\"\">\u201cI suspect if you used Hotjar (or similar) you could see users clicking within the box to navigate to those pages, before then clicking specifically on the topic title\/link\u201d. &#8211; Becky<\/em><\/p><\/blockquote>\n<p id=\"\">\u200d<strong id=\"\">Solution:<\/strong> make the whole box clickable.<\/p>\n<h2 id=\"\"><strong id=\"\">Further information<\/strong><\/h2>\n<p id=\"\">See our resources on <a href=\"https:\/\/www.thecatalyst.org.uk\/resources\/training\" target=\"_blank\" id=\"\" rel=\"noopener\">how to make a good website<\/a>.&nbsp;<\/p>\n<p id=\"\">Read other crits:<\/p>\n<ul>\n<li>\u200d<a href=\"\/resource\/website-crit-1-quaker-social-action\" target=\"_blank\" rel=\"noopener\">#1: Quaker Social Action<\/a><\/li>\n<li>\u200d<a href=\"\/resource\/charity-website-design-critique-2-reach-volunteering\" target=\"_blank\" rel=\"noopener\">#2: Reach Volunteering<\/a><\/li>\n<li>\u200d<a href=\"\/resource\/website-design-critique-3-dementia-uk\" target=\"_blank\" rel=\"noopener\">#3: Dementia UK<\/a><\/li>\n<li>\u200d<a href=\"\/resource\/website-design-critique-4-reach-volunteerings-volunteer-library\" target=\"_blank\" id=\"\" rel=\"noopener\">#4: Reach Volunteering&#8217;s Volunteer Library<\/a><\/li>\n<\/ul>\n","protected":false},"featured_media":18843,"template":"","meta":{"_acf_changed":false,"inline_featured_image":false},"tags":[],"resource-category":[1971],"class_list":["post-18836","resource","type-resource","status-publish","has-post-thumbnail","hentry","resource-category-training"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Website design critique #5: Catalyst - ProMo Cymru<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/\" \/>\n<meta property=\"og:locale\" content=\"cy_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Website design critique #5: Catalyst - ProMo Cymru\" \/>\n<meta property=\"og:description\" content=\"This resource is for: Website managers and their managers Anyone interested in improving their website\u2019s content and interface design&nbsp; This is the 5th in an irregular series of articles critiquing charity websites. By showing you examples of good and bad design you learn more than if we just told you.&nbsp; This time we\u2019re critiquing the [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/\" \/>\n<meta property=\"og:site_name\" content=\"ProMo Cymru\" \/>\n<meta property=\"article:modified_time\" content=\"2024-09-24T07:14:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182f9917a562140ea45f1c_Cat-home-annotated-main-pic.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"697\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"9 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/\",\"url\":\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/\",\"name\":\"Website design critique #5: Catalyst - ProMo Cymru\",\"isPartOf\":{\"@id\":\"https:\/\/promo.cymru\/cy\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182f9917a562140ea45f1c_Cat-home-annotated-main-pic.png\",\"datePublished\":\"2023-04-30T23:00:00+00:00\",\"dateModified\":\"2024-09-24T07:14:10+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#breadcrumb\"},\"inLanguage\":\"cy-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"cy-GB\",\"@id\":\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#primaryimage\",\"url\":\"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182f9917a562140ea45f1c_Cat-home-annotated-main-pic.png\",\"contentUrl\":\"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182f9917a562140ea45f1c_Cat-home-annotated-main-pic.png\",\"width\":1200,\"height\":697},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/promo.cymru\/cy\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Resources\",\"item\":\"https:\/\/promo.cymru\/cy\/resource-articles\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Website design critique #5: Catalyst\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/promo.cymru\/cy\/#website\",\"url\":\"https:\/\/promo.cymru\/cy\/\",\"name\":\"ProMo Cymru\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/promo.cymru\/cy\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/promo.cymru\/cy\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"cy-GB\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/promo.cymru\/cy\/#organization\",\"name\":\"ProMo Cymru\",\"url\":\"https:\/\/promo.cymru\/cy\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"cy-GB\",\"@id\":\"https:\/\/promo.cymru\/cy\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/logo.svg\",\"contentUrl\":\"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/logo.svg\",\"width\":151,\"height\":54,\"caption\":\"ProMo Cymru\"},\"image\":{\"@id\":\"https:\/\/promo.cymru\/cy\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Website design critique #5: Catalyst - ProMo Cymru","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/","og_locale":"cy_GB","og_type":"article","og_title":"Website design critique #5: Catalyst - ProMo Cymru","og_description":"This resource is for: Website managers and their managers Anyone interested in improving their website\u2019s content and interface design&nbsp; This is the 5th in an irregular series of articles critiquing charity websites. By showing you examples of good and bad design you learn more than if we just told you.&nbsp; This time we\u2019re critiquing the [&hellip;]","og_url":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/","og_site_name":"ProMo Cymru","article_modified_time":"2024-09-24T07:14:10+00:00","og_image":[{"width":1200,"height":697,"url":"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182f9917a562140ea45f1c_Cat-home-annotated-main-pic.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/","url":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/","name":"Website design critique #5: Catalyst - ProMo Cymru","isPartOf":{"@id":"https:\/\/promo.cymru\/cy\/#website"},"primaryImageOfPage":{"@id":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#primaryimage"},"image":{"@id":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#primaryimage"},"thumbnailUrl":"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182f9917a562140ea45f1c_Cat-home-annotated-main-pic.png","datePublished":"2023-04-30T23:00:00+00:00","dateModified":"2024-09-24T07:14:10+00:00","breadcrumb":{"@id":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#breadcrumb"},"inLanguage":"cy-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/"]}]},{"@type":"ImageObject","inLanguage":"cy-GB","@id":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#primaryimage","url":"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182f9917a562140ea45f1c_Cat-home-annotated-main-pic.png","contentUrl":"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/64182f9917a562140ea45f1c_Cat-home-annotated-main-pic.png","width":1200,"height":697},{"@type":"BreadcrumbList","@id":"https:\/\/promo.cymru\/cy\/resource-articles\/website-design-critique-5-catalyst\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/promo.cymru\/cy\/"},{"@type":"ListItem","position":2,"name":"Resources","item":"https:\/\/promo.cymru\/cy\/resource-articles\/"},{"@type":"ListItem","position":3,"name":"Website design critique #5: Catalyst"}]},{"@type":"WebSite","@id":"https:\/\/promo.cymru\/cy\/#website","url":"https:\/\/promo.cymru\/cy\/","name":"ProMo Cymru","description":"","publisher":{"@id":"https:\/\/promo.cymru\/cy\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/promo.cymru\/cy\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"cy-GB"},{"@type":"Organization","@id":"https:\/\/promo.cymru\/cy\/#organization","name":"ProMo Cymru","url":"https:\/\/promo.cymru\/cy\/","logo":{"@type":"ImageObject","inLanguage":"cy-GB","@id":"https:\/\/promo.cymru\/cy\/#\/schema\/logo\/image\/","url":"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/logo.svg","contentUrl":"https:\/\/promo.cymru\/wp-content\/uploads\/2024\/07\/logo.svg","width":151,"height":54,"caption":"ProMo Cymru"},"image":{"@id":"https:\/\/promo.cymru\/cy\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/promo.cymru\/cy\/wp-json\/wp\/v2\/resource\/18836","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/promo.cymru\/cy\/wp-json\/wp\/v2\/resource"}],"about":[{"href":"https:\/\/promo.cymru\/cy\/wp-json\/wp\/v2\/types\/resource"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/promo.cymru\/cy\/wp-json\/wp\/v2\/media\/18843"}],"wp:attachment":[{"href":"https:\/\/promo.cymru\/cy\/wp-json\/wp\/v2\/media?parent=18836"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/promo.cymru\/cy\/wp-json\/wp\/v2\/tags?post=18836"},{"taxonomy":"resource-category","embeddable":true,"href":"https:\/\/promo.cymru\/cy\/wp-json\/wp\/v2\/resource-category?post=18836"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}