{"id":560,"date":"2022-03-30T06:04:44","date_gmt":"2022-03-30T06:04:44","guid":{"rendered":"https:\/\/www.normanbalberan.com\/blog\/?p=560"},"modified":"2022-03-08T19:42:00","modified_gmt":"2022-03-08T19:42:00","slug":"web-design-strategy-and-planning-guide","status":"publish","type":"post","link":"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/","title":{"rendered":"Web Design Strategy and Planning Guide"},"content":{"rendered":"<figure id=\"attachment_561\" aria-describedby=\"caption-attachment-561\" style=\"width: 890px\" class=\"wp-caption aligncenter\"><img decoding=\"async\" class=\"wp-image-561\" src=\"https:\/\/www.normanbalberan.com\/blog\/wp-content\/uploads\/2016\/11\/web-design-strategy-and-planning-300x225.jpg\" alt=\"web design strategy and planning\" width=\"900\" height=\"675\" srcset=\"https:\/\/www.normanbalberan.com\/blog\/wp-content\/uploads\/2016\/11\/web-design-strategy-and-planning-300x225.jpg 300w, https:\/\/www.normanbalberan.com\/blog\/wp-content\/uploads\/2016\/11\/web-design-strategy-and-planning-768x576.jpg 768w, https:\/\/www.normanbalberan.com\/blog\/wp-content\/uploads\/2016\/11\/web-design-strategy-and-planning-1024x768.jpg 1024w, https:\/\/www.normanbalberan.com\/blog\/wp-content\/uploads\/2016\/11\/web-design-strategy-and-planning.jpg 1200w\" sizes=\"(max-width: 900px) 100vw, 900px\" \/><figcaption id=\"caption-attachment-561\" class=\"wp-caption-text\"><center><a href=\"https:\/\/pixabay.com\/en\/web-internet-symbol-web-design-1045994\/\" target=\"_blank\"><span style=\"font-size: small;\">britaseifert \/ Pixabay<\/span><\/a> \/ <a href=\"https:\/\/creativecommons.org\/publicdomain\/zero\/1.0\/deed.en\" target=\"_blank\"><span style=\"font-size: small;\">CC0 1.0<\/span><\/a><\/center><\/figcaption><\/figure>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 counter-hierarchy ez-toc-counter ez-toc-transparent ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-5'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/#This_is_my_simple_design_strategy_to_create_a_website_with_high_usability\" >This is my simple design strategy to create a website with high usability.<\/a><ul class='ez-toc-list-level-6' ><li class='ez-toc-heading-level-6'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/#Figure_Out_Who_will_See_the_Site\" >Figure Out Who will See the Site<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-6'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/#How_Big_is_your_Site\" >How Big is your Site?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-6'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/#Remember_that_Code_Controls_your_Website\" >Remember that Code Controls your Website<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-6'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/#Make_a_Good_Feel_and_Impression_for_Visitors\" >Make a Good Feel and Impression for Visitors<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-6'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/#Make_your_Visitors_Stay_Longer\" >Make your Visitors Stay Longer<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-6'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/#Create_Different_Versions_of_your_Home_Page\" >Create Different Versions of your Home Page<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-6'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/#Let_People_Review_your_Site\" >Let People Review your Site<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<h5 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"This_is_my_simple_design_strategy_to_create_a_website_with_high_usability\"><\/span>This is my simple design strategy to create a website with high usability.<span class=\"ez-toc-section-end\"><\/span><\/h5>\n<p style=\"text-align: justify;\"><strong>Initial planning of the design and its function is the first key, and that will determine if it can be used. <\/strong>Think about these steps and don\u2019t rush to get the project done.<\/p>\n<h6 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"Figure_Out_Who_will_See_the_Site\"><\/span>Figure Out Who will See the Site<span class=\"ez-toc-section-end\"><\/span><\/h6>\n<p style=\"text-align: justify;\">Will it be just <strong>you or your family and friends, business associates or casual web surfers<\/strong>? That will give you parameters for the acceptable styles of colors, music, navigation, and functionality.<\/p>\n<h6 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"How_Big_is_your_Site\"><\/span>How Big is your Site?<span class=\"ez-toc-section-end\"><\/span><\/h6>\n<p style=\"text-align: justify;\">Think about how big will your site needs to be. Do you need only a main page or do you need secondary pages, a database or forms? Will you have web ads running on your site? <strong>Think about the costs from these details.<\/strong><\/p>\n<h6 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"Remember_that_Code_Controls_your_Website\"><\/span>Remember that Code Controls your Website<span class=\"ez-toc-section-end\"><\/span><\/h6>\n<p style=\"text-align: justify;\"><strong>If you can code then, all is fine and dandy but if not consider a turnkey template to paste pictures and text into, or learn the code needed.<\/strong><\/p>\n<p style=\"text-align: justify;\"><strong>Knowing code gives you the flexibility to create your designs and be outside the herd<\/strong>. You can develop that code to create the design. You can write that code using:<\/p>\n<ul style=\"text-align: justify;\">\n<li>HTML, <a href=\"http:\/\/www.html.net\/\" target=\"_blank\">http:\/\/www.html.net\/<\/a><\/li>\n<li>JavaScript, <a href=\"http:\/\/www.javascript.com\/\" target=\"_blank\">http:\/\/www.javascript.com\/<\/a><\/li>\n<li>ASP, <a href=\"http:\/\/www.hotscripts.com\/category\/scripts\/asp\/\" target=\"_blank\">http:\/\/www.hotscripts.com\/category\/scripts\/asp\/<\/a><\/li>\n<li>PHP, <a href=\"http:\/\/us.php.net\/tut.php\" target=\"_blank\">http:\/\/us.php.net\/tut.php<\/a><\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Or maybe <strong>use a free software program<\/strong> <strong>like WordPress<\/strong>,\u00a0<a href=\"https:\/\/wordpress.org\/\" target=\"_blank\">https:\/\/wordpress.org\/<\/a> or use a <strong>downloaded prebuilt website template or a commercial business software program like Adobe Dreamweaver<\/strong>. <a href=\"http:\/\/www.adobe.com\/products\/dreamweaver\/\" target=\"_blank\">http:\/\/www.adobe.com\/products\/dreamweaver\/<\/a>.<\/p>\n<p style=\"text-align: justify;\"><strong>It is up to you, as you determine the effort you want to put into your project.<\/strong><\/p>\n<h6 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"Make_a_Good_Feel_and_Impression_for_Visitors\"><\/span>Make a Good Feel and Impression for Visitors<span class=\"ez-toc-section-end\"><\/span><\/h6>\n<p style=\"text-align: justify;\"><strong>The feel and impression of your site influence a visitor in seconds.<\/strong><\/p>\n<ul style=\"text-align: justify;\">\n<li>How you want the site to look and \u201cfeel\u201d to a visitor?<\/li>\n<li>Is your site inviting the right visitors by being tailored to their mindsets?<\/li>\n<li>Does your design for navigation hinder a visitor or help them?<\/li>\n<li>Do you want to use crazy graphics, unusual type fonts and loud colors?<\/li>\n<\/ul>\n<p style=\"text-align: justify;\">If you are a skateboarding site, that might be okay. But if you are a <strong>business site, a more muted color pallet and standard buttons for navigation would be better<\/strong> since your site needs to be tailored to the conformity and styling of the industry you want to do business with.<\/p>\n<h6 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"Make_your_Visitors_Stay_Longer\"><\/span>Make your Visitors Stay Longer<span class=\"ez-toc-section-end\"><\/span><\/h6>\n<p style=\"text-align: justify;\">Think about offering the visitor something for spending time on your site. It could be <strong>a free screensaver, a small Flash game, some wallpaper, or a tutorial<\/strong>, but make it an appropriate item for the type of the site classification.<\/p>\n<h6 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"Create_Different_Versions_of_your_Home_Page\"><\/span>Create Different Versions of your Home Page<span class=\"ez-toc-section-end\"><\/span><\/h6>\n<p style=\"text-align: justify;\">Once you have the original home page built, save it and then make at least two more slightly different versions of your home page.<\/p>\n<p style=\"text-align: justify;\">As you switch between the styling changes, <strong>you will begin to see how little changes can affect the tone and create a shift in style<\/strong>. This may be as simple as a small tone change in the color pallet used, or a different font type or size but you will see the difference and see what draws the visitor\u2019s eye focus and then work from that point.<\/p>\n<h6 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"Let_People_Review_your_Site\"><\/span>Let People Review your Site<span class=\"ez-toc-section-end\"><\/span><\/h6>\n<p style=\"text-align: justify;\">Have some people review the site and be honest with you. Then consider what they say and add it into your perceptions.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This is my simple design strategy to create a website with high usability. Initial planning of the design and its function is the first key, and that will determine if it can be used. Think about these steps and don\u2019t rush to get the project done. Figure Out Who will See the Site Will it &#8230; <a title=\"Web Design Strategy and Planning Guide\" class=\"read-more\" href=\"https:\/\/www.normanbalberan.com\/blog\/web-design-strategy-and-planning-guide\/\" aria-label=\"Read more about Web Design Strategy and Planning Guide\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":561,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8,1],"tags":[71,268,267],"class_list":["post-560","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-guide","category-web-development","tag-web-design","tag-web-design-planning","tag-web-design-strategy"],"_links":{"self":[{"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/posts\/560","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/comments?post=560"}],"version-history":[{"count":0,"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/posts\/560\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/media\/561"}],"wp:attachment":[{"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/media?parent=560"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/categories?post=560"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.normanbalberan.com\/blog\/wp-json\/wp\/v2\/tags?post=560"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}