{"id":45045,"date":"2021-03-06T14:36:51","date_gmt":"2021-03-06T14:36:51","guid":{"rendered":"https:\/\/www.glassmountains.co.uk\/?p=45045"},"modified":"2021-08-28T13:46:29","modified_gmt":"2021-08-28T13:46:29","slug":"planning-your-wordpress-website-2-wireframes","status":"publish","type":"post","link":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/","title":{"rendered":"Planning your WordPress website &#8211; 2. Wireframes"},"content":{"rendered":"<p>In the previous, opening article of our &#8216;<em>Planning your WordPress website<\/em>&#8216; series, we looked at <a href=\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-1-visual-sitemap\/\"><em>what<\/em> are visual sitemaps, and <em>how<\/em> they can help<\/a>. In this article, we&#8217;re going to look at what &#8216;<em>wireframes<\/em>&#8216; are how they can help plan our website.<\/p>\n<h2>What is a wireframe?<\/h2>\n<p>A wireframe is a rudimentary sketch of a web page, helping visualise the actual elements that will need to be on the page.<\/p>\n<p>It is NOT a full design mockup (that comes later).<\/p>\n<p>The purpose of the wireframe is to visually account for <em>all<\/em> the elements that you want to occur on your web page. Think of it like cooking a complex meal: the <em>wireframe <\/em>allows us to list out the ingredients that will go into the dish.<\/p>\n<p>Let&#8217;s look at an example wireframe:<\/p>\n<div id=\"attachment_45046\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-45046\" class=\"size-large wp-image-45046\" src=\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/Screenshot-2021-02-24-at-19.40.57-1024x992.png\" alt=\"Fig 1 - example wireframe\" width=\"1024\" height=\"992\" srcset=\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/Screenshot-2021-02-24-at-19.40.57-1024x992.png 1024w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/Screenshot-2021-02-24-at-19.40.57-300x291.png 300w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/Screenshot-2021-02-24-at-19.40.57-768x744.png 768w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/Screenshot-2021-02-24-at-19.40.57-160x156.png 160w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/Screenshot-2021-02-24-at-19.40.57-67x65.png 67w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/Screenshot-2021-02-24-at-19.40.57-1300x1259.png 1300w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/Screenshot-2021-02-24-at-19.40.57.png 1394w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><p id=\"caption-attachment-45046\" class=\"wp-caption-text\">Fig 1 &#8211; example wireframe<\/p><\/div>\n<p>As you can see from the example wireframe above in Fig. 1:<\/p>\n<ul>\n<li>Is <em>not<\/em> a design; a wireframe will often be presented as basic, black &amp; white line drawings<\/li>\n<li>Boxes help indicate the various content areas on the page<\/li>\n<li>The wireframe will typically not contain any finalised text (which is why you see a lot of Lorem Ipsum placeholder text above). If real content is available, it is best to use that though.<\/li>\n<\/ul>\n<h3>Wireframes &#8211; why bother?<\/h3>\n<p>The purpose of the wireframe is to help to agree on the design ingredients for a particular page.<\/p>\n<p>\u201c<em>Why not simply jump in &amp; <span style=\"text-decoration: underline;\">design<\/span> the page?<\/em>\u201d you ask.<\/p>\n<p><strong>Good question!<\/strong><\/p>\n<p>Design can be a <em>very<\/em> intensive process &#8211; one that can quickly burn through a client\u2019s budget. To manage that valuable time effectively, it is best to first sketch out the visual components of a page, agree on that, and only <em>then<\/em> start designing.<\/p>\n<p>There is no hard and fast rule on how to create wireframes aside from you need to agree on a method that makes sense to all parties involved. Some wireframes are more advanced than in Fig. 1, some are more rudimentary &#8211; as long as they help communicate what is on a page, without taking too much effort to create, then they are serving their purpose.<\/p>\n<p>When a client has agreed that the wireframe(s) contains all the elements that the page(s) requires, the designer can then progress to the next stage. Taking the signed off wireframes, and then creating full, detailed visual design mockups that more accurately reflect how your website will look.<\/p>\n<h2>Planning for content<\/h2>\n<p>Below in Fig 2 is a snippet from a made-up sitemap about a fictitious website (<a href=\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-1-visual-sitemap\/\">Need to learn about sitemaps? See the previous article<\/a>).<\/p>\n<p>As you see we have (as ever) the <strong>Homepage<\/strong> at the top of the sitemap. However, we&#8217;re not going to start there. Instead, we&#8217;re going now to fast forward to the <strong>About Us<\/strong> page. This is because the About page will more clearly illustrate some of the key reasons why we need to <em>plan<\/em> for our website content (we can revisit the homepage later).<\/p>\n<p>Let&#8217;s zoom in on the About Us section of a visual sitemap for an imaginary website we are working on:<\/p>\n<div id=\"attachment_45047\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-45047\" class=\"size-large wp-image-45047\" src=\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/sitemap-1024x577.png\" alt=\"Fig 2 - sitemap partial showing 'About Us'\" width=\"1024\" height=\"577\" srcset=\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/sitemap-1024x577.png 1024w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/sitemap-300x169.png 300w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/sitemap-768x432.png 768w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/sitemap-1536x865.png 1536w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/sitemap-2048x1153.png 2048w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/sitemap-115x65.png 115w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/02\/sitemap-1300x732.png 1300w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><p id=\"caption-attachment-45047\" class=\"wp-caption-text\">Fig 2 &#8211; sitemap partial showing &#8216;About Us&#8217;<\/p><\/div>\n<p>In Fig 2, we&#8217;ve drawn a big green box around &#8216;About Us&#8217; and it&#8217;s child page(s), as that is the section we want to focus on here.<\/p>\n<p>Let&#8217;s now consider the wireframe for this &#8216;<em>About Us<\/em>&#8216; page. You can visualise this as <em>zooming in<\/em> to the &#8216;About Us&#8217; box in Fig 2.<\/p>\n<div id=\"attachment_45058\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-45058\" class=\"size-large wp-image-45058\" src=\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.25.10-914x1024.png\" alt=\"Fig 3 - wireframe of About Us\" width=\"914\" height=\"1024\" srcset=\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.25.10-914x1024.png 914w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.25.10-268x300.png 268w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.25.10-768x861.png 768w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.25.10-1371x1536.png 1371w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.25.10-58x65.png 58w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.25.10-1300x1457.png 1300w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.25.10.png 1608w\" sizes=\"(max-width: 914px) 100vw, 914px\" \/><p id=\"caption-attachment-45058\" class=\"wp-caption-text\">Fig 3 &#8211; wireframe of About Us<\/p><\/div>\n<p>We can see from the above wireframe in Fig 3 that our About page will go into detail about the background of the company and then, in this case, it will list out key company personal showing their picture, name, and job title.<\/p>\n<p>Web visitors will be able to click on listed team members, taking them to an individual page about a specific person.<\/p>\n<p>E.g., if the About Us page will have a URL page address of <strong>\/about-us\/<\/strong>, there would also be a specific pages per team member. So an example of a team member child page could be\u00a0 \/<strong>about-us\/joel-hughes<\/strong>.<\/p>\n<p>If you look back at sitemap in Fig 2, notice the drop shadow on the <em>team profile<\/em> box. That is to indicate that there will be multiple pages here, and they will all essentially follow the same design template; a template specifically set up for key company personal profile pages.<\/p>\n<p>By using a drop shadow to indicate these repeating pages, this saves you from crowding your sitemap with what will essentially be pretty much identical pages\u00a0(albeit, in this case, for different team members).<\/p>\n<h2>Team Profile Page<\/h2>\n<p>A wireframe of a team profile page could look like this:<\/p>\n<div id=\"attachment_45060\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-45060\" class=\"size-large wp-image-45060\" src=\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.37.21-898x1024.png\" alt=\"Fig 4 - Wireframe of team member page\" width=\"898\" height=\"1024\" srcset=\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.37.21-898x1024.png 898w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.37.21-263x300.png 263w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.37.21-768x875.png 768w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.37.21-1348x1536.png 1348w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.37.21-57x65.png 57w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.37.21-1300x1482.png 1300w, https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Screenshot-2021-03-06-at-12.37.21.png 1546w\" sizes=\"(max-width: 898px) 100vw, 898px\" \/><p id=\"caption-attachment-45060\" class=\"wp-caption-text\">Fig 4 &#8211; Wireframe of team member page<\/p><\/div>\n<p>As we can see from Fig 4 above; a team member page can be set up to have specific fields:<\/p>\n<ul>\n<li>Team member name<\/li>\n<li>Job title<\/li>\n<li>Profile picture<\/li>\n<li>Bio text<\/li>\n<li>Perhaps a quote from them<\/li>\n<li>Email<\/li>\n<li>Phone<\/li>\n<li>LinkedIn address<\/li>\n<li><em>\u2026.whatever you think is relevant<\/em><\/li>\n<\/ul>\n<h2>Time passes\u2026.<\/h2>\n<p>The wireframes, perhaps after some rounds of changes, will finally be agreed upon. The project can then move on to the <strong>design stage<\/strong>.<\/p>\n<p>Here we would typically create a static design mockup as per the wireframe; safe in the knowledge that we know that all the information to go on the page has been broadly agreed.<\/p>\n<p>Like wireframes, a page design typically goes through a few rounds of feedback before it is ready to be built.<\/p>\n<h3>Building?<\/h3>\n<p>Building is the process of converting the static design mockup into a living, breathing web page. As we specialise in WordPress, and we also specialise in custom designs, this means that we&#8217;ll carve up the design into a <a href=\"https:\/\/www.glassmountains.co.uk\/wordpress-custom-theme-development\/\">custom WordPress theme<\/a>, unique to the client. However, you can potentially use an off the shelf WordPress theme (<a href=\"https:\/\/www.glassmountains.co.uk\/campfire\/off-the-shelf-v-custom-wordpress-themes\/\">not sure what that is?<\/a>), if so, your wireframes can really help guide you as to which themes will be suitable or not.<\/p>\n<p>When enough of the theme has been built, we&#8217;ll place it on a password protected test website for the client to review, and for content to be entered etc.<\/p>\n<h3>The team profile page<\/h3>\n<p>When this team profile page design (from Fig. 4) has been built, it will be built as a <em>template<\/em>. A template is a way of organising WordPress so that the design of a section is fixed &#8211; as it is in the case of a staff profile page; they are all laid out and formatted the same way.<\/p>\n<p>This template approach allows website admin to simple supply the unique details per team member name (job title etc, as listed earlier) and the template will then display everything nicely, in a consistently styled manner. The less fiddling around for your website admin team, the better.<\/p>\n<h2>Next: the template page<\/h2>\n<p>In the next article, we&#8217;re going to talk about how this &#8216;template page is implemented. If I say so myself, this is where things <em>really<\/em> get interesting as we start to see how a website can work with data &amp; information intelligently. And how careful planning can really turn your website from an administration headache to an active, smart, online resource.<\/p>\n<p>If you have any comments or questions about this article, feel free to <a href=\"https:\/\/www.facebook.com\/groups\/GlassMountainsFreeClimbing\">jump onto #TheWPshow Facebook Group<\/a> and ask me about it.<\/p>\n<p>Joel<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In the previous, opening article of our &#8216;Planning your WordPress website&#8216; series, we looked at what are visual sitemaps, and how they can help. In this article, we&#8217;re going to look at what &#8216;wireframes&#8216; are how [&#8230;] <a class=\"post_link inline\" href=\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/\"> Read more <i class=\"fas fa-chevron-right\"><\/i><\/a><\/p>\n","protected":false},"author":2,"featured_media":45063,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[167,135],"tags":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Planning your WordPress website - 2. Wireframes &#8226; Glass Mountains<\/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:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Planning your WordPress website - 2. Wireframes &#8226; Glass Mountains\" \/>\n<meta property=\"og:description\" content=\"In the previous, opening article of our &#8216;Planning your WordPress website&#8216; series, we looked at what are visual sitemaps, and how they can help. In this article, we&#8217;re going to look at what &#8216;wireframes&#8216; are how [...] Read more\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/\" \/>\n<meta property=\"og:site_name\" content=\"Glass Mountains\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/GlassMountainsDigital\" \/>\n<meta property=\"article:published_time\" content=\"2021-03-06T14:36:51+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-08-28T13:46:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1280\" \/>\n\t<meta property=\"og:image:height\" content=\"720\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Joel Hughes\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@glass_mountains\" \/>\n<meta name=\"twitter:site\" content=\"@glass_mountains\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Joel Hughes\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/\"},\"author\":{\"name\":\"Joel Hughes\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/#\/schema\/person\/87d91a87efe31b2a3591c6e41b10a813\"},\"headline\":\"Planning your WordPress website &#8211; 2. Wireframes\",\"datePublished\":\"2021-03-06T14:36:51+00:00\",\"dateModified\":\"2021-08-28T13:46:29+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/\"},\"wordCount\":1250,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png\",\"articleSection\":[\"Planning your website\",\"SEO &amp; Google\"],\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/\",\"url\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/\",\"name\":\"Planning your WordPress website - 2. Wireframes &#8226; Glass Mountains\",\"isPartOf\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png\",\"datePublished\":\"2021-03-06T14:36:51+00:00\",\"dateModified\":\"2021-08-28T13:46:29+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#primaryimage\",\"url\":\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png\",\"contentUrl\":\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png\",\"width\":1280,\"height\":720},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.glassmountains.co.uk\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Planning your WordPress website &#8211; 2. Wireframes\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/#website\",\"url\":\"https:\/\/www.glassmountains.co.uk\/\",\"name\":\"Glass Mountains\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.glassmountains.co.uk\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/#organization\",\"name\":\"Glass Mountains Digital Ltd\",\"url\":\"https:\/\/www.glassmountains.co.uk\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2016\/06\/site_icon.png\",\"contentUrl\":\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2016\/06\/site_icon.png\",\"width\":512,\"height\":512,\"caption\":\"Glass Mountains Digital Ltd\"},\"image\":{\"@id\":\"https:\/\/www.glassmountains.co.uk\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/GlassMountainsDigital\",\"https:\/\/x.com\/glass_mountains\",\"https:\/\/www.linkedin.com\/company\/glass-mountains-digital-ltd\/\",\"https:\/\/www.youtube.com\/channel\/UCZ5VyexeS90kU6b2SYQoWgA\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/#\/schema\/person\/87d91a87efe31b2a3591c6e41b10a813\",\"name\":\"Joel Hughes\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/www.glassmountains.co.uk\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2016\/01\/64446652b9c4f2c1dcaab1b6cb9a1bae-100x100.jpeg\",\"contentUrl\":\"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2016\/01\/64446652b9c4f2c1dcaab1b6cb9a1bae-100x100.jpeg\",\"caption\":\"Joel Hughes\"},\"url\":\"https:\/\/www.glassmountains.co.uk\/campfire\/author\/glass\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Planning your WordPress website - 2. Wireframes &#8226; Glass Mountains","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:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/","og_locale":"en_GB","og_type":"article","og_title":"Planning your WordPress website - 2. Wireframes &#8226; Glass Mountains","og_description":"In the previous, opening article of our &#8216;Planning your WordPress website&#8216; series, we looked at what are visual sitemaps, and how they can help. In this article, we&#8217;re going to look at what &#8216;wireframes&#8216; are how [...] Read more","og_url":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/","og_site_name":"Glass Mountains","article_publisher":"https:\/\/www.facebook.com\/GlassMountainsDigital","article_published_time":"2021-03-06T14:36:51+00:00","article_modified_time":"2021-08-28T13:46:29+00:00","og_image":[{"width":1280,"height":720,"url":"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png","type":"image\/png"}],"author":"Joel Hughes","twitter_card":"summary_large_image","twitter_creator":"@glass_mountains","twitter_site":"@glass_mountains","twitter_misc":{"Written by":"Joel Hughes","Estimated reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#article","isPartOf":{"@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/"},"author":{"name":"Joel Hughes","@id":"https:\/\/www.glassmountains.co.uk\/#\/schema\/person\/87d91a87efe31b2a3591c6e41b10a813"},"headline":"Planning your WordPress website &#8211; 2. Wireframes","datePublished":"2021-03-06T14:36:51+00:00","dateModified":"2021-08-28T13:46:29+00:00","mainEntityOfPage":{"@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/"},"wordCount":1250,"commentCount":0,"publisher":{"@id":"https:\/\/www.glassmountains.co.uk\/#organization"},"image":{"@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#primaryimage"},"thumbnailUrl":"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png","articleSection":["Planning your website","SEO &amp; Google"],"inLanguage":"en-GB","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/","url":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/","name":"Planning your WordPress website - 2. Wireframes &#8226; Glass Mountains","isPartOf":{"@id":"https:\/\/www.glassmountains.co.uk\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#primaryimage"},"image":{"@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#primaryimage"},"thumbnailUrl":"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png","datePublished":"2021-03-06T14:36:51+00:00","dateModified":"2021-08-28T13:46:29+00:00","breadcrumb":{"@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/"]}]},{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#primaryimage","url":"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png","contentUrl":"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2021\/03\/Wirefreames.png","width":1280,"height":720},{"@type":"BreadcrumbList","@id":"https:\/\/www.glassmountains.co.uk\/campfire\/planning-your-wordpress-website-2-wireframes\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.glassmountains.co.uk\/"},{"@type":"ListItem","position":2,"name":"Planning your WordPress website &#8211; 2. Wireframes"}]},{"@type":"WebSite","@id":"https:\/\/www.glassmountains.co.uk\/#website","url":"https:\/\/www.glassmountains.co.uk\/","name":"Glass Mountains","description":"","publisher":{"@id":"https:\/\/www.glassmountains.co.uk\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.glassmountains.co.uk\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-GB"},{"@type":"Organization","@id":"https:\/\/www.glassmountains.co.uk\/#organization","name":"Glass Mountains Digital Ltd","url":"https:\/\/www.glassmountains.co.uk\/","logo":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.glassmountains.co.uk\/#\/schema\/logo\/image\/","url":"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2016\/06\/site_icon.png","contentUrl":"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2016\/06\/site_icon.png","width":512,"height":512,"caption":"Glass Mountains Digital Ltd"},"image":{"@id":"https:\/\/www.glassmountains.co.uk\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/GlassMountainsDigital","https:\/\/x.com\/glass_mountains","https:\/\/www.linkedin.com\/company\/glass-mountains-digital-ltd\/","https:\/\/www.youtube.com\/channel\/UCZ5VyexeS90kU6b2SYQoWgA"]},{"@type":"Person","@id":"https:\/\/www.glassmountains.co.uk\/#\/schema\/person\/87d91a87efe31b2a3591c6e41b10a813","name":"Joel Hughes","image":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.glassmountains.co.uk\/#\/schema\/person\/image\/","url":"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2016\/01\/64446652b9c4f2c1dcaab1b6cb9a1bae-100x100.jpeg","contentUrl":"https:\/\/www.glassmountains.co.uk\/wp-content\/uploads\/2016\/01\/64446652b9c4f2c1dcaab1b6cb9a1bae-100x100.jpeg","caption":"Joel Hughes"},"url":"https:\/\/www.glassmountains.co.uk\/campfire\/author\/glass\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/posts\/45045"}],"collection":[{"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/comments?post=45045"}],"version-history":[{"count":10,"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/posts\/45045\/revisions"}],"predecessor-version":[{"id":45219,"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/posts\/45045\/revisions\/45219"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/media\/45063"}],"wp:attachment":[{"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/media?parent=45045"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/categories?post=45045"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.glassmountains.co.uk\/wp-json\/wp\/v2\/tags?post=45045"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}