[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"detail-sidebar-cat-0-en-105":3,"doc-seo-657712-105":59,"doc-detail-657712-en":130},{"code":4,"msg":5,"data":6},0,"success",[7,13,18,23,28,33,38,43,48,51,55],{"id":8,"doc_module":4,"doc_module_name":9,"category_name":10,"show_sort_weight":11,"slug":12},1,"Document","Story & Novel",90,"story-novel",{"id":14,"doc_module":4,"doc_module_name":9,"category_name":15,"show_sort_weight":16,"slug":17},2,"Literature",80,"literature",{"id":19,"doc_module":4,"doc_module_name":9,"category_name":20,"show_sort_weight":21,"slug":22},4,"Exam",70,"exam",{"id":24,"doc_module":4,"doc_module_name":9,"category_name":25,"show_sort_weight":26,"slug":27},5,"Comic",60,"comic",{"id":29,"doc_module":4,"doc_module_name":9,"category_name":30,"show_sort_weight":31,"slug":32},6,"Technology",50,"technology",{"id":34,"doc_module":4,"doc_module_name":9,"category_name":35,"show_sort_weight":36,"slug":37},7,"Healthcare",40,"healthcare",{"id":39,"doc_module":4,"doc_module_name":9,"category_name":40,"show_sort_weight":41,"slug":42},8,"Research & Report",30,"research-report",{"id":44,"doc_module":4,"doc_module_name":9,"category_name":45,"show_sort_weight":46,"slug":47},9,"Religion & Spirituality",20,"religion-spirituality",{"id":46,"doc_module":4,"doc_module_name":9,"category_name":49,"show_sort_weight":46,"slug":50},"World Cup","world-cup",{"id":52,"doc_module":4,"doc_module_name":9,"category_name":53,"show_sort_weight":52,"slug":54},10,"Lifestyle","lifestyle",{"id":56,"doc_module":4,"doc_module_name":9,"category_name":57,"show_sort_weight":24,"slug":58},19,"General","general",{"code":4,"msg":60,"data":61},"ok",{"site_id":62,"language":63,"slug":64,"title":65,"keywords":66,"description":67,"schema_data":68,"social_meta":123,"head_meta":125,"extra_data":127,"updated_unix":129},105,"en","vhs-strategy-website-sitemap-and-wireframe-guide","VHS Strategy - Website Sitemap and Wireframe Guide","","This document provides a comprehensive guide on the strategy stage of website design, specifically focusing on the creation of sitemaps and wireframes. It outlines the purpose of sitemaps as structural diagrams for user journey planning and defines wireframes as essential skeletal frameworks for prioritizing functionality and content over visual aesthetics. The guide offers actionable tips for development, emphasizing audience awareness, simplicity, and iterative improvement, and includes practical examples of home page wireframe designs.",{"@graph":69,"@context":122},[70,84,105],{"@type":71,"itemListElement":72},"BreadcrumbList",[73,77,79,82],{"item":74,"name":75,"@type":76,"position":8},"https://docshare.wps.com","Home","ListItem",{"item":78,"name":9,"@type":76,"position":14},"https://docshare.wps.com/document/",{"item":80,"name":30,"@type":76,"position":81},"https://docshare.wps.com/document/technology/",3,{"item":83,"name":65,"@type":76,"position":19},"https://docshare.wps.com/document/vhs-strategy-website-sitemap-and-wireframe-guide/657712/",{"url":83,"name":65,"@type":85,"image":86,"author":91,"headline":65,"publisher":94,"fileFormat":97,"inLanguage":63,"description":67,"dateModified":98,"datePublished":99,"encodingFormat":97,"isAccessibleForFree":100,"interactionStatistic":101},"DigitalDocument",{"url":87,"@type":88,"width":89,"height":90},"https://docshare.wps.com/thumbnails/vhs-strategy-website-sitemap-and-wireframe-guide/657712.png","ImageObject",300,407,{"name":92,"@type":93},"Angel","Person",{"url":74,"name":95,"@type":96},"DocShare","Organization","application/pdf","2026-10-30","2026-10-26",true,{"@type":102,"interactionType":103,"userInteractionCount":19},"InteractionCounter",{"@type":104},"ViewAction",{"@type":106,"mainEntity":107},"FAQPage",[108,114,118],{"name":109,"@type":110,"acceptedAnswer":111},"What is the primary function of a sitemap in web design?","Question",{"text":112,"@type":113},"A sitemap is an ordered diagram that displays the structure of a website, helping designers determine content separation and plan the overall user journey.","Answer",{"name":115,"@type":110,"acceptedAnswer":116},"Why are wireframes typically designed without color or detailed graphics?",{"text":117,"@type":113},"Wireframes serve as a skeletal framework where the main focus is on the website's functionality, user behavior, and the priority of content rather than visual styling.",{"name":119,"@type":110,"acceptedAnswer":120},"What are some key recommendations for building effective sitemaps and wireframes?",{"text":121,"@type":113},"The document recommends keeping designs simple, focusing on the target audience and project goals, drawing inspiration from existing websites, and viewing the process as an iterative stage that does not require perfection.","https://schema.org",{"og:url":83,"og:type":124,"og:title":65,"og:site_name":95,"og:description":67},"article",{"robots":126,"canonical":83},"index,follow",{"doc_id":128,"site_id":62},657712,1793051246,{"code":4,"msg":5,"data":131},{"doc_id":128,"user_id":132,"nickname":92,"user_avatar":133,"doc_module":4,"category_id":29,"category_name":30,"doc_title":65,"doc_description":67,"doc_content":134,"file_id":135,"file_url":136,"file_type":137,"file_size":138,"view_count":19,"is_deleted":4,"is_public":8,"is_downloadable":8,"audit_status":8,"page_count":139,"language":140,"language_code":63,"site_id":62,"html_lang":63,"table_of_contents":141,"faqs":142,"seo_title":143,"seo_description":67,"update_tm":144,"read_time":41},687207412472,"https://ap-avatar.wpscdn.com/davatar_155a257f0dc6eb9ab79c44ca47cae57d","Building & Designing Websites  \nStrategy Stage  \nSitemap  \nSitemaps are ordered diagrams showing the structure of a website or application. You can use this to determine how you want to separate the content on the website and develop a user journey.  \nWireframe  \nWireframes are a visual guide that represents the skeletal framework of a website. The wireframe usually lacks typographic style, color, or graphics, since the main focus lies in functionality , behavior, and priority of content.  \nExample of Wireframe & Final Design  \nLet’s Build a Sitemap & Wireframe!  \nHelpful Tips  \nBuilding a sitemap & wireframe  \n1. Use things you like from other websites and make it your own  \n2. Remember our target audience , purpose & main goals  \n3. Keep it simple!  \n4. It doesn’t have to be perfect. We can continue improving later  \nMy Sitemap Example  \nHome Wireframe Example  \n\n| | History of Shoreham |  | |\n| --- | --- | --- | --- |\n| Short clear and simple description of project\u003Cbr>\u003Cbr>Story Title |  |  |  |\n| |  | Short description of story. Something that will draw in readers\u003Cbr>\u003Cbr>Read more |  |\n| |  |  |  |\n\nHome Wireframe Example  \nSocial media share buttons  \nArrows make it really clear that the user should scroll down to see more content  \nAttractive pictures or graphics to represent each section of the website (stories)  \nAs you scroll down more stories come into focus. Uses the same structure as above  \nHistory of Shoreham Short clear and simple description of project  \nStory Title  \nShort description of story. Something that will draw in readers  \nRead more  \nEasy to use timeline to navigate the website. Always in focus. Clicking scrolls the user to the selected story  \nClicking button send user to story page","cbCaif3NhFkxZwbT","https://ap.wps.com/l/cbCaif3NhFkxZwbT","pdf",272529,12,"English","# Building & Designing Websites\n## Strategy Stage\n## Sitemap and Wireframe Best Practices\n## Practical Examples\n## Designing the Home Page","[{\"question\":\"What is the primary function of a sitemap in web design?\",\"answer\":\"A sitemap is an ordered diagram that displays the structure of a website, helping designers determine content separation and plan the overall user journey.\"},{\"question\":\"Why are wireframes typically designed without color or detailed graphics?\",\"answer\":\"Wireframes serve as a skeletal framework where the main focus is on the website's functionality, user behavior, and the priority of content rather than visual styling.\"},{\"question\":\"What are some key recommendations for building effective sitemaps and wireframes?\",\"answer\":\"The document recommends keeping designs simple, focusing on the target audience and project goals, drawing inspiration from existing websites, and viewing the process as an iterative stage that does not require perfection.\"}]","VHS Strategy - Website Sitemap and Wireframe Guide | PDF",1792986624]