CINXE.COM
How We Build Websites | Optima Graphic Design Consultants
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <!-- ONLY FOR MOBILE OPTIMISED SITES --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>How We Build Websites | Optima Graphic Design Consultants</title> <meta name='description' content='When building websites, we have a tried and tested method. Discover how we work when building your website.' /> <link rel='canonical' href='https://www.optimadesign.co.uk/web/how-we-work' /> <meta name='robots' content='INDEX, FOLLOW' /> <!-- Open Graph --> <meta property='og:title' content='How we work' /> <meta property='og:type' content='article' /> <meta property='og:url' content='https://www.optimadesign.co.uk/web/how-we-work' /> <!-- Twitter Card --> <meta property='twitter:title' content='How we work' /> <meta property='twitter:card' content='summary' /> <script defer src="https://kit.fontawesome.com/a85b030b90.js" crossorigin="anonymous"></script> <script type="module" src="/assets/js/lite-vimeo/lite-vimeo.js"></script> <link rel="stylesheet" media="all" href="/assets/aos/aos.css"> <link rel="stylesheet" media="all" href="/assets/css/styles.css?v=1732206651"> <link rel="preconnect" href="https://p.typekit.net" crossorigin> <link rel="preconnect" href="https://use.typekit.net" crossorigin> <link rel="preload" href="https://use.typekit.net/tjn6yeg.css" as="style" onload="this.onload=null;this.rel='stylesheet'"> <link rel="apple-touch-icon-precomposed" href="https://www.optimadesign.co.uk/assets/images/templates/favicons/apple-touch-icon-precomposed.png"> <link rel="icon" href="https://www.optimadesign.co.uk/assets/images/templates/favicons/favicon.png"> <!--[if IE]><link rel="shortcut icon" href="https://www.optimadesign.co.uk/assets/images/templates/favicons/favicon.ico"><![endif]--> <!-- or, set /favicon.ico for IE10 win --> <meta name="msapplication-TileColor" content="#ffffff"> <meta name="msapplication-TileImage" content="https://www.optimadesign.co.uk/assets/images/templates/favicons/msapplication-tileimage.png"> <style> .{} { font-family: {}; } </style> <!-- --> </head> <body id="web" class=""> <a class="skip-main" href="#main">Skip to main content</a> <div id="cursor" class="cursor"> <div class="cursor-inner"></div> </div> <div class="wrap push shadow"> <div class="outer-nav-wrapper"> <header id="banner"> <div class="container"> <div class="row gx-0 gx-lg-4"> <div class="col-6 col-lg-3"> <a class="site_logo" href="https://www.optimadesign.co.uk/"> <img src="https://www.optimadesign.co.uk/assets/images/templates/optima-graphic-design-lincoln.svg" alt="Optima Graphic Design Consultants Logo" width="135" height="37"> </a> </div> <div class="col-6 col-lg-9 d-flex justify-content-end align-items-center"> <button type="button" id="mobile_menu_button"> <span class="sr-only">Toggle menu</span> <span></span> </button> <nav class="slidemenu" id="menu" style="background:linear-gradient(0deg, rgba(53,56,62,0.7035407913165266) 0%, rgba(53,56,62,1) 100%), url('https://www.optimadesign.co.uk/images/jcogs_img/cache/Welcome_to_Optima_-_28de80_-_d085b0f4bb027982c00336f167aa2f93b068be8f.jpg') no-repeat; background-size: cover"> <ul class="menu"> <li class="nav-item dropdown"> <button class="nav-link dropdown-toggle " id="navbarDropdownMenuLink_design" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Design <i class="fa-solid fa-chevron-right"></i></button> <div class="optima-dropdown-menu" aria-labelledby="navbarDropdownMenuLink_design"> <button type="button" class="mobile_return"><i class="fa-solid fa-chevron-left"></i> Design</button> <a class="dropdown-item " href="https://www.optimadesign.co.uk/design">Overview</a> <a class=" dropdown-item" href="/design/brand-identity">Brand Identity</a><a class=" dropdown-item" href="/design/design-for-print">Design for Print</a><a class=" dropdown-item" href="/design/design-for-digital">Design for Digital</a> </div> </li> <li class="nav-item dropdown"> <button class="nav-link dropdown-toggle active " id="navbarDropdownMenuLink_web" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Web <i class="fa-solid fa-chevron-right"></i></button> <div class="optima-dropdown-menu" aria-labelledby="navbarDropdownMenuLink_web"> <button type="button" class="mobile_return"><i class="fa-solid fa-chevron-left"></i> Web</button> <a class="dropdown-item " href="https://www.optimadesign.co.uk/web">Overview</a> <a class=" dropdown-item" href="/web/responsive-web-design">Responsive web design</a><a class=" dropdown-item" href="/web/expressionengine">ExpressionEngine</a><a class=" dropdown-item" href="/web/wordpress">WordPress</a><a class=" dropdown-item" href="/web/shopify">Shopify</a><a class=" dropdown-item" href="/web/accessibility">Accessibility</a><a class="active dropdown-item" href="/web/how-we-work">How we work</a> </div> </li> <li class="nav-item dropdown"> <button class="nav-link dropdown-toggle " id="navbarDropdownMenuLink_digital-marketing" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Digital Marketing <i class="fa-solid fa-chevron-right"></i></button> <div class="optima-dropdown-menu" aria-labelledby="navbarDropdownMenuLink_digital-marketing"> <button type="button" class="mobile_return"><i class="fa-solid fa-chevron-left"></i> Digital Marketing</button> <a class="dropdown-item " href="https://www.optimadesign.co.uk/digital-marketing-services">Overview</a> <a class=" dropdown-item" href="/digital-marketing-services/seo-services">Search Engine Optimisation</a><a class=" dropdown-item" href="/digital-marketing-services/ppc-services">Search Engine Advertising</a><a class=" dropdown-item" href="/digital-marketing-services/social-media-advertising-services">Social Media Advertising</a><a class=" dropdown-item" href="/digital-marketing-services/content-marketing-services">Content Marketing</a><a class=" dropdown-item" href="/digital-marketing-services/email-marketing-services">Email Marketing</a> </div> </li> <li class="nav-item"> <a class="nav-link " href="https://www.optimadesign.co.uk/work">Work</a> </li> <li class="nav-item"> <a class="nav-link " href="https://www.optimadesign.co.uk/contact">Contact</a> </li> <li class="nav-item d-none d-lg-block"> <button class="nav-link " type="button" id="mega_menu_btn"> More <span>+</span> </button> </li> <li class="nav-item d-block d-lg-none"> <ul class="mobile-more-menu"> <li><a class="nav-link" href="https://www.optimadesign.co.uk/about-us">About us</a></li> <li><a class="nav-link" href="https://www.optimadesign.co.uk/blog">Blog</a></li> <li><a class="nav-link" href="https://www.optimadesign.co.uk/careers">Careers</a></li> </ul> </li> </ul> </nav> <nav class="mega_menu" style="background: linear-gradient(0deg, rgba(53,56,62,0.7035407913165266) 0%, rgba(53,56,62,1) 100%), url('https://www.optimadesign.co.uk/images/jcogs_img/cache/Welcome_to_Optima_-_28de80_-_d085b0f4bb027982c00336f167aa2f93b068be8f.jpg')"> <div class="container"> <div class="row"> <div class="col-2"> <a class="nav-link" href="/design" aria-label="Design" id="mega_desgin"> Design </a> <div class="mega_menu_sub_nav" aria-labelledby="mega_desgin"> <a class=" dropdown-item" href="/design/brand-identity">Brand Identity</a><a class=" dropdown-item" href="/design/design-for-print">Design for Print</a><a class=" dropdown-item" href="/design/design-for-digital">Design for Digital</a> </div> </div> <div class="col-2"> <a class="nav-link" href="/web" aria-label="Web" id="mega_web"> Web </a> <div class="mega_menu_sub_nav" aria-labelledby="mega_web"> <a class=" dropdown-item" href="/web/responsive-web-design">Responsive web design</a><a class=" dropdown-item" href="/web/expressionengine">ExpressionEngine</a><a class=" dropdown-item" href="/web/wordpress">WordPress</a><a class=" dropdown-item" href="/web/shopify">Shopify</a><a class=" dropdown-item" href="/web/accessibility">Accessibility</a><a class="active dropdown-item" href="/web/how-we-work">How we work</a> </div> </div> <div class="col-2"> <a class="nav-link" href="/digital-marketing-services" aria-label="Digital marketing" id="mega_digital_marketing"> Digital marketing </a> <div class="mega_menu_sub_nav" aria-labelledby="mega_digital_marketing"> <a class=" dropdown-item" href="/digital-marketing-services/seo-services">Search Engine Optimisation</a><a class=" dropdown-item" href="/digital-marketing-services/ppc-services">Search Engine Advertising</a><a class=" dropdown-item" href="/digital-marketing-services/social-media-advertising-services">Social Media Advertising</a><a class=" dropdown-item" href="/digital-marketing-services/content-marketing-services">Content Marketing</a><a class=" dropdown-item" href="/digital-marketing-services/email-marketing-services">Email Marketing</a> </div> </div> <div class="col-2"> <div class="min_h"> <a class="nav-link" href="/work" aria-label="Work" id="mega_work"> Work </a> <p>See a selection of the exciting work we do for our clients.</p> </div> <a class="nav-link" href="/about-us" aria-label="About Us" id="mega_about_us"> About Us </a> <div class="mega_menu_sub_nav" aria-labelledby="mega_about_us"> <a class=" dropdown-item" href="/about-us/our-team">Our Team</a> </div> </div> <div class="col-2"> <div class="min_h"> <a class="nav-link" href="/blog" aria-label="Blog" id="mega_blog"> Blog </a> <p>The latest news and articles</p> </div> <a class="nav-link" href="/careers" aria-label="Careers" id="mega_careers"> Careers </a> <div class="mega_menu_sub_nav" aria-labelledby="mega_careers"> </div> </div> <div class="col-2"> <a class="nav-link" href="/contact" aria-label="Contact" id="mega_contact"> Contact </a> </div> </div> </div> </nav> </div> </div> </div> </header> </div> <div class="page_hero secondary" style="background-color: #35383E"> <div class="mobile_background" style="background-image: url('https://www.optimadesign.co.uk/assets/images/common/Web_How_We_Work_Mobile.jpg')"> <img loading="lazy" src="/images/jcogs_img/cache/Web_How_We_Work_Mobile_-_28de80_-_aa680b5656fd5454f2e9251c1ed57453bec7599c.jpg" srcset="/images/jcogs_img/cache/Web_How_We_Work_Mobile_-_28de80_-_aa680b5656fd5454f2e9251c1ed57453bec7599c_710w.jpg 710w, /images/jcogs_img/cache/Web_How_We_Work_Mobile_-_28de80_-_aa680b5656fd5454f2e9251c1ed57453bec7599c_1065w.jpg 1065w, /images/jcogs_img/cache/Web_How_We_Work_Mobile_-_28de80_-_aa680b5656fd5454f2e9251c1ed57453bec7599c.jpg 1066w" sizes="(max-width:710px) 710px, (max-width:1065px) 1065px, 1066px" alt="https://www.optimadesign.co.uk/assets/images/common/Web_How_We_Work_Mobile.jpg" class="lazy hero_image"> </div> <div class="desktop_background" style="background-image: url('https://www.optimadesign.co.uk/assets/images/common/Web_How_We_Work.jpg')"></div> <div class="container"> <div class="row"> <div class="col-12 col-lg-7 col-xl-6"> <div class="hero_content"> <div> <h1 class=""> <span>How we work</span> Strategy & implementation </h1> <p>Our tried and tested approach to developing successful website projects</p> </div> </div> </div> </div> </div> </div> <main id="main"> <section class="section fl_text_editor" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <div class="container"> <div class="row"> <div class="col-12 col-lg-10 mx-auto"> <h2>Optima thrive on creating engagement with online audiences – it’s how the success of every website is measured.</h2> <p>We achieve this by delivering thought-through creativity that helps rather than hindering the user journey. We have all the skills in house to achieve anything we can imagine and that relies on us having a talented and motivated development team. We have built close to 150 technically strong websites over the past 20 years which continue to evolve and develop today. As standard, Optima build websites that are:</p> <ul> <li>Bespoke, well designed and technically sound</li> <li>Hand-coded, unique and fit for purpose, not comprised of re-used templates</li> <li><a href="/web/responsive-web-design">Mobile responsive </a></li> <li>Content managed, allowing clients to update the site in real-time with content and imagery</li> <li>Monitored for effectiveness using Google Analytics and Google Tag Manager as well as industry-standard SEO tools (as a result our websites evolve to meet the true needs of their users)</li> <li>Built with <a href="/digital-marketing-services/seo-services">search engine optimisation</a> (SEO) best practices from the outset (semantic well-structured HTML, copywriting for web, human and search readable URLs, carefully considered page titles, next-gen image formats, lazy loading, advanced caching and compression, XML sitemap)</li> <li>Compliant to W3C’s Website Content <a href="/web/accessibility">Accessibility</a> Guidelines (WCAG) and the Disability Discrimination Act. We are dedicated to web standards and the latest techniques</li> <li>Produced as valid HTML and CSS documents enhanced with JavaScript</li> <li>Managed in a Version Control system to create a code revision history to track changes and allow changes to be rolled back with ease</li> <li>Compliant with all current Data Protection and Cookie Legislation</li> <li>We build websites with maximum flexibility so that they can grow and develop and are able to respond to the changing digital environment</li> <li>Future proof, as all websites need to evolve (our hand coded, tailored approach allows easy future moulding)</li> <li>We also build a matching staging site that you can populate, test new styles and initiatives on.</li> </ul> </div> </div> </div> </section> <section class="section fl_title_content_split fl_steps_to_content"> <div class="container"> <div class="row"> <div class="col-12"> <h2 class="block-title">The ten steps to your new website:</h2> </div> </div> <div class="row"> <div class="col-12 content_col d-flex"> <div> <h2 class="step">01</h2> </div> <div> <h3>Strategy</h3> <p>The beginning of any website project involves a collaborative process. Optima work closely with clients to develop a shared understanding of their business objectives and user needs. We listen, absorb, and reflect on what you tell us. We ask lots of questions and challenge preconceptions, and we will always bring new possibilities and ideas to the table based on our experience and skills.</p> <p>By fully understanding your brand proposition and all the moving parts that make up your website project, we can recommend different approaches that allow you to connect with your audiences. We will decide with you which content management system best suits your needs, whether that is <a href="/web/expressionengine">ExpressionEngine</a>, <a href="/web/wordpress">WordPress</a> or something else.</p> <p>Optima are confident communicators comfortable with leading creative ideation and planning sessions. We come to the table with an open mind but will contribute to the dialogue with our experiences, thoughts, and observations. <br /> </p> </div> </div> </div> <div class="row"> <div class="col-12 content_col d-flex"> <div> <h2 class="step">02</h2> </div> <div> <h3>Scoping and specification</h3> <p>Optima undertake research that, depending on your needs, may include UX workshops with different stakeholders and users, a review of analytics and competitor analysis. During this phase, all the resources and requirements needed to build the website are detailed and aligned with user and business strategies and objectives.</p> <p>The scoping process also uncovers any content strategies, performance, accessibility and SEO practices which need to be discussed and implemented as part of the website project.</p> <p>Our website specification documents bring together all the information needed to deliver a website project on time and within budget. We identify the project team involved and points of contact. Most importantly, there is a detailed overview of the website goals and objectives, site scope, front and back-end development, data collection mechanisms and technical details. The specification document is the plan which keeps everyone focused on the agreed deliverables throughout the project journey.</p> </div> </div> </div> </div> </section> <section class="section fl_images"> <div class="container"> <div class="row"> <div class="col-12"> <div class="fl_images_masonry_container grid"> <div class="grid-sizer"></div> <div class="grid-item" data-aos="fade-up" data-aos-once="true" data-aos-duration="1500"> <img src="/images/jcogs_img/cache/Scoping_-_28de80_-_d90d5bafeb68f6bbe51d0c1c787f55455eee0a3c.jpg" srcset="/images/jcogs_img/cache/Scoping_-_28de80_-_d90d5bafeb68f6bbe51d0c1c787f55455eee0a3c_584w.jpg 584w, /images/jcogs_img/cache/Scoping_-_28de80_-_d90d5bafeb68f6bbe51d0c1c787f55455eee0a3c_876w.jpg 876w, /images/jcogs_img/cache/Scoping_-_28de80_-_d90d5bafeb68f6bbe51d0c1c787f55455eee0a3c.jpg 877w" sizes="(max-width:584px) 584px, (max-width:876px) 876px, 877px" alt="Scoping.jpg"> </div> <div class="grid-item" data-aos="fade-up" data-aos-once="true" data-aos-duration="1500"> <img src="/images/jcogs_img/cache/Structure_-_28de80_-_6ff55bfaa2afcc13b4b0eeac145ba93a3783e756.jpg" srcset="/images/jcogs_img/cache/Structure_-_28de80_-_6ff55bfaa2afcc13b4b0eeac145ba93a3783e756_584w.jpg 584w, /images/jcogs_img/cache/Structure_-_28de80_-_6ff55bfaa2afcc13b4b0eeac145ba93a3783e756_876w.jpg 876w, /images/jcogs_img/cache/Structure_-_28de80_-_6ff55bfaa2afcc13b4b0eeac145ba93a3783e756.jpg 877w" sizes="(max-width:584px) 584px, (max-width:876px) 876px, 877px" alt="Structure.jpg"> </div> </div> </div> </div> </div> </section> <section class="section fl_title_content_split fl_steps_to_content"> <div class="container"> <div class="row"> <div class="col-12 content_col d-flex"> <div> <h2 class="step">03</h2> </div> <div> <h3>Site structure</h3> <p>Optima visualises a website structure using a detailed sitemap as part of the specification process. The sitemap is used in the website planning phase to determine how the website is organised and information is prioritised. Quite often, the sitemap process will start with the tried and tested method of moving groups of post-it notes around on a wall until we have the basis of a website structure. </p> <p>As the process develops, we create a detailed digital sitemap demonstrating the different page types we will build to display information throughout the website and the points where the website will capture information.</p> <p>The sitemap process considers how users interact with the website and how the system responds to these interactions. An SEO audit, strategy, and consideration of the customer journey through different digital touch points underpin this process.</p> </div> </div> </div> <div class="row"> <div class="col-12 content_col d-flex"> <div> <h2 class="step">04</h2> </div> <div> <h3>Wireframing</h3> <p>Optima creates ‘skeleton’ page plans for each website that show the arrangement of elements and content on different devices. These plans are essential to understanding site navigation, the responsive grid, and the priorities of different content. We refer to these skeleton plans as ‘wireframes’ as they demonstrate the website architecture underlying the visual design.</p> <p>Wireframes are visual plans, pretty basic at this stage, but explore the possibilities of web page layouts. They allow proper consideration of grids and content placement, calls to action and conversion mechanisms without the distraction of design elements, colour and imagery. This approach makes it easier to focus on the fundamental building blocks that make up a page. We use a ‘mobile first’ approach to wireframing and ensure that decisions around content and functionality for mobile and tablet responsive layouts are considered from the outset rather than an afterthought. </p> </div> </div> </div> <div class="row"> <div class="col-12 content_col d-flex"> <div> <h2 class="step">05</h2> </div> <div> <h3>Web design concepts</h3> <p>Building on the previous steps, Optima designs stunning websites that develop a distinctive online presence for your brand. We ensure the design approach fits your website and business objectives and reflect your vision and values. We consider how the design enhances user experience and creates memorable associations with your brand.</p> <p>Our initial concepts explore a couple of design routes and options for how key pages might look and UI elements like navigation, fonts, graphics, icons and data visualisation. We’ll create innovative ways to display information through bespoke content blocks. Our process balances creative front-end web design with back-end functionality, user needs, accessibility considerations and UX design conventions. We consider using different media to promote your message, device-specific adaptations, and corresponding load times, which could affect search engine rankings. Everything is properly joined-up throughout the design process. </p> </div> </div> </div> </div> </section> <section class="section fl_images"> <div class="container"> <div class="row"> <div class="col-12"> <div class="fl_images_masonry_container grid"> <div class="grid-sizer"></div> <div class="grid-item" data-aos="fade-up" data-aos-once="true" data-aos-duration="1500"> <img src="/images/jcogs_img/cache/Wireframing_-_28de80_-_9b7b4aee61ee82c5097da47f1eee5826e02c37d8.jpg" srcset="/images/jcogs_img/cache/Wireframing_-_28de80_-_9b7b4aee61ee82c5097da47f1eee5826e02c37d8_584w.jpg 584w, /images/jcogs_img/cache/Wireframing_-_28de80_-_9b7b4aee61ee82c5097da47f1eee5826e02c37d8_876w.jpg 876w, /images/jcogs_img/cache/Wireframing_-_28de80_-_9b7b4aee61ee82c5097da47f1eee5826e02c37d8.jpg 877w" sizes="(max-width:584px) 584px, (max-width:876px) 876px, 877px" alt="Wireframing.jpg"> </div> <div class="grid-item" data-aos="fade-up" data-aos-once="true" data-aos-duration="1500"> <img src="/images/jcogs_img/cache/Design_Concepts_-_28de80_-_6ff3c59798d3af71dcd4a764d125eb50c6bbba22.jpg" srcset="/images/jcogs_img/cache/Design_Concepts_-_28de80_-_6ff3c59798d3af71dcd4a764d125eb50c6bbba22_584w.jpg 584w, /images/jcogs_img/cache/Design_Concepts_-_28de80_-_6ff3c59798d3af71dcd4a764d125eb50c6bbba22_876w.jpg 876w, /images/jcogs_img/cache/Design_Concepts_-_28de80_-_6ff3c59798d3af71dcd4a764d125eb50c6bbba22.jpg 877w" sizes="(max-width:584px) 584px, (max-width:876px) 876px, 877px" alt="Design_Concepts.jpg"> </div> </div> </div> </div> </div> </section> <section class="section fl_tabbed_content_blocks" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <div class="container"> <div class="row"> <div class="col-12"> <h2>06 Website development and build</h2> <div class="content_nav_arrows"> </div> <ul class="content_nav"> <li> <button type="button" id="nav5-2" class="tab_nav_item active" data-nav-id="1"> Build </button> </li> <li> <button type="button" id="nav5-3" class="tab_nav_item " data-nav-id="2"> Review </button> </li> <li> <button type="button" id="nav5-4" class="tab_nav_item " data-nav-id="3"> Training </button> </li> <li> <button type="button" id="nav5-5" class="tab_nav_item " data-nav-id="4"> Fine tuning </button> </li> </ul> <div class="content_blocks_container"> <div class="content" id="content5-2"> <div class="inner_content"> <div> <p>Optima build robust websites on a variety of content management systems. We develop bespoke page templates and stylesheets to current web standards and mobile responsive technologies and deliver pixel-perfect web pages. We have built hundreds of responsive websites using HTML5/CSS3, JavaScript/jQuery and PHP and are experienced in delivering websites to W3C’s Web Content Accessibility Guidelines 2.1.</p> </div> </div> </div> <div class="content" id="content5-3"> <div class="inner_content"> <div> <p>We share website sections for review at key stages throughout the web development and build process using a project-specific website staging area.</p> </div> </div> </div> <div class="content" id="content5-4"> <div class="inner_content"> <div> <p>Optima provides clients with CMS training, support, and a reference manual to enable them to populate the new website with content. We demo all the features within the website, empowering clients to take control and become familiar with their newly designed site whilst it is on Optima’s staging server, hidden from search engines and the world.</p> </div> </div> </div> <div class="content" id="content5-5"> <div class="inner_content"> <div> <p>Once the site has been populated with content, we tidy up any formatting issues and ensure it looks and functions perfectly for users. Then it is ready for final review and edits before getting the green light to go live! </p> </div> </div> </div> </div> </div> </div> </div> </section> <section class="section fl_images"> <div class="container"> <div class="row"> <div class="col-12"> <div class="fl_images_masonry_container grid"> <div class="grid-sizer"></div> <div class="grid-item" data-aos="fade-up" data-aos-once="true" data-aos-duration="1500"> <img src="/images/jcogs_img/cache/website-review_-_28de80_-_fdfbab4548fa232f0cef89c158f43c2beeda3752.jpg" srcset="/images/jcogs_img/cache/website-review_-_28de80_-_fdfbab4548fa232f0cef89c158f43c2beeda3752_702w.jpg 702w, /images/jcogs_img/cache/website-review_-_28de80_-_fdfbab4548fa232f0cef89c158f43c2beeda3752_1053w.jpg 1053w, /images/jcogs_img/cache/website-review_-_28de80_-_fdfbab4548fa232f0cef89c158f43c2beeda3752.jpg 1054w" sizes="(max-width:702px) 702px, (max-width:1053px) 1053px, 1054px" alt="website-review.jpg"> </div> <div class="grid-item" data-aos="fade-up" data-aos-once="true" data-aos-duration="1500"> <img src="/images/jcogs_img/cache/Build_-_28de80_-_bc9a4c911e568bd5984255ba7c3aaa2bca3aedb5.jpg" srcset="/images/jcogs_img/cache/Build_-_28de80_-_bc9a4c911e568bd5984255ba7c3aaa2bca3aedb5_584w.jpg 584w, /images/jcogs_img/cache/Build_-_28de80_-_bc9a4c911e568bd5984255ba7c3aaa2bca3aedb5_876w.jpg 876w, /images/jcogs_img/cache/Build_-_28de80_-_bc9a4c911e568bd5984255ba7c3aaa2bca3aedb5.jpg 877w" sizes="(max-width:584px) 584px, (max-width:876px) 876px, 877px" alt="Build.jpg"> </div> </div> </div> </div> </div> </section> <section class="section fl_title_content_split fl_steps_to_content"> <div class="container"> <div class="row"> <div class="col-12 content_col d-flex"> <div> <h2 class="step">07</h2> </div> <div> <h3>Testing</h3> <p>Optima complete a high level of testing before websites are deployed. Our code is rigorously tested across the main browsers and devices, and any bugs are addressed. The code is rigorously tested in the latest three versions of Chrome, Firefox, Microsoft and Safari browsers and across multiple iOS and Android devices. </p> <p>We also test website functionality, such as forms and data capture and do a final proofread, ensuring no placeholder content is visible before it is presented to the world.</p> </div> </div> </div> <div class="row"> <div class="col-12 content_col d-flex"> <div> <h2 class="step">08</h2> </div> <div> <h3>Website launch</h3> <p>Optima coordinates website launches in collaboration with client teams to ensure a smooth and timely transition. Pre-launch, we confirm we have the necessary details to deploy the website to a client's server or in the server space we provide from our trusted UK providers. We are proud of the websites we launch, and each go-live is celebrated by ringing a bell in the office!</p> <p>Our go-live process – the techy bit:</p> <ul> <li>Dedicated server space is configured to the needs of the website before website’s database and files are deployed. </li> <li>Pre-flight checks are performed once the website is installed on the new server. </li> <li>SSL certificates are applied to the domain.</li> <li>XML sitemaps are checked, and Google Analytics, Tag Manager and Search Console are set up to track user interactions and conversions.</li> <li>The CMS is configured to log user interactions such as form submissions and site search terms.</li> <li>Redirects are prepped to send old page URLs to their new counterparts. </li> <li>The IP address is aligned with the chosen domain name(s), and propagation around the internet begins. The propagation typically takes between 1 and 24 hours before the website is visible worldwide.</li> </ul> <p>Optima’s hosting option is through one of our UK-based fully managed cloud hosting partners with regular security reviews and patches rolled out for any vulnerabilities and high availability guaranteed Service Level Agreements (SLAs). Our hosting partners operate out of UK-based ISO 27001 certified data centres. 24 x 7 on-site support and service are also included as standard.</p> <p>Our hosting includes full secure encrypted backups taken daily, with a retention period of 7 days. The website code is managed in a version control environment, which means that all changes are documented and accountable. An up-to-date copy of the code is held in our version control repository, separate from the server and backup, as an extra level of security. This means that Optima can quickly restore the website if for any reason it is required. </p> </div> </div> </div> </div> </section> <section class="section fl_images"> <div class="container"> <div class="row"> <div class="col-12"> <div class="fl_images_masonry_container grid"> <div class="grid-sizer"></div> <div class="grid-item" data-aos="fade-up" data-aos-once="true" data-aos-duration="1500"> <img src="/images/jcogs_img/cache/Testing_-_28de80_-_d0694fb55a5058af740ccbcb94472a2dc92820e2.jpg" srcset="/images/jcogs_img/cache/Testing_-_28de80_-_d0694fb55a5058af740ccbcb94472a2dc92820e2_584w.jpg 584w, /images/jcogs_img/cache/Testing_-_28de80_-_d0694fb55a5058af740ccbcb94472a2dc92820e2_876w.jpg 876w, /images/jcogs_img/cache/Testing_-_28de80_-_d0694fb55a5058af740ccbcb94472a2dc92820e2.jpg 877w" sizes="(max-width:584px) 584px, (max-width:876px) 876px, 877px" alt="Testing.jpg"> </div> <div class="grid-item" data-aos="fade-up" data-aos-once="true" data-aos-duration="1500"> <img src="/images/jcogs_img/cache/Launch_-_28de80_-_b6d9cf21f9e87d7038b5113d10e2491d048f996d.jpg" srcset="/images/jcogs_img/cache/Launch_-_28de80_-_b6d9cf21f9e87d7038b5113d10e2491d048f996d_584w.jpg 584w, /images/jcogs_img/cache/Launch_-_28de80_-_b6d9cf21f9e87d7038b5113d10e2491d048f996d_876w.jpg 876w, /images/jcogs_img/cache/Launch_-_28de80_-_b6d9cf21f9e87d7038b5113d10e2491d048f996d.jpg 877w" sizes="(max-width:584px) 584px, (max-width:876px) 876px, 877px" alt="Launch.jpg"> </div> </div> </div> </div> </div> </section> <section class="section fl_tabbed_content_blocks" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <div class="container"> <div class="row"> <div class="col-12"> <h2>09 Website maintenance</h2> <div class="content_nav_arrows"> </div> <ul class="content_nav"> <li> <button type="button" id="nav9-2" class="tab_nav_item active" data-nav-id="1"> Initial support </button> </li> <li> <button type="button" id="nav9-3" class="tab_nav_item " data-nav-id="2"> Maintenance packages </button> </li> <li> <button type="button" id="nav9-4" class="tab_nav_item " data-nav-id="3"> Further development </button> </li> </ul> <div class="content_blocks_container"> <div class="content" id="content9-2"> <div class="inner_content"> <div> <p>Optima will monitor and tweak newly launched websites for the first month after go-live to ensure optimum performance and that they are working effectively. Beyond this, we offer a range of maintenance packages which enable us to continue to update the site and monitor site health as it develops and grows alongside digital technologies.</p> </div> </div> </div> <div class="content" id="content9-3"> <div class="inner_content"> <div> <p>Optima have maintenance packages available in four plans varying from 2-40 hours per month. Maintenance packages guarantee studio and development time for:</p> <ul> <li>Ongoing CMS updates</li> <li>Investigating and reporting website errors as a result of content management system updates, add-ons and plug-ins</li> <li>Investigating third-party providers’ issues, including payment gateways, Google Maps, etc.</li> <li>Fixing browser glitches in Optima’s standard list of supported browsers</li> <li>Editing existing page templates</li> <li>Editing graphics</li> <li>Small modifications to functionality</li> <li>SEO and performance improvements, including external factors such as link building, as well as internal on-page parameters</li> <li>Provision of telephone support with website developers.</li> </ul> </div> </div> </div> <div class="content" id="content9-4"> <div class="inner_content"> <div> <p>More significant website development or feature requests fall outside of the maintenance contract agreement and are costed separately. Full details of our maintenance packages are available on request.</p> </div> </div> </div> </div> </div> </div> </div> </section> <section class="full-width-image" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <div class="container"> <div class="row"> <div class="col-12 col-md-12 "> <img loading="lazy" src="/images/jcogs_img/cache/websites_at_optima_-_28de80_-_93769aed2bd7ad52cc82e4ea7b6777cb2ca411d7.png" srcset="/images/jcogs_img/cache/websites_at_optima_-_28de80_-_93769aed2bd7ad52cc82e4ea7b6777cb2ca411d7_1196w.png 1196w, /images/jcogs_img/cache/websites_at_optima_-_28de80_-_93769aed2bd7ad52cc82e4ea7b6777cb2ca411d7_1794w.png 1794w, /images/jcogs_img/cache/websites_at_optima_-_28de80_-_93769aed2bd7ad52cc82e4ea7b6777cb2ca411d7.png 1795w" sizes="(max-width:1196px) 1196px, (max-width:1794px) 1794px, 1795px" alt="websites_at_optima.png" class="lazy"> </div> </div> </div> </section> <section class="section fl_title_content_split fl_steps_to_content"> <div class="container"> <div class="row"> <div class="col-12 content_col d-flex"> <div> <h2 class="step">10</h2> </div> <div> <h3>Website promotion</h3> <p>Optima can assist with promoting your website to ensure it is discoverable and remains visible to your audiences. We offer various digital marketing services to support this, including SEO, pay-per-click, digital advertising, content marketing and email marketing.</p> <p>Search Engine Optimisation is an effective way to drive visitors to your site. SEO starts with reviewing and editing your website’s text content to target keywords prospective visitors might use in search engines. SEO also relies on setting up good backlinks from other websites, social media integration, schema markup, optimised page load times and meta descriptions. All of these SEO tactics can boost website performance. Optima can help with all aspects of SEO and additional digital marketing services tailored to your audience and requirements.</p> <a class="dyn-arrow-link dyn-arrow-link--secondary" href="https://www.optimadesign.co.uk/digital-marketing-services"> Find out more about our digital marketing services </a> </div> </div> </div> </div> </section> <section class="section fl_cta_banner" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000" style="background-image: url('https://www.optimadesign.co.uk/images/jcogs_img/cache/Optima_Exterior_Copper_-_28de80_-_e21347d9d0767c1965cdd018b12c6b0713352b23.jpg')"> <div class="container"> <div class="row"> <div class="col-12 col-lg-10 mx-auto"> <h2>Are you planning your next website project and need some advice?</h2> <a class="dyn-arrow-link dyn-arrow-link--white" href="https://www.optimadesign.co.uk/contact"> Get in touch </a> </div> </div> </div> </section> </main> <section class="section section--pre-footer"> <div class="container"> <div class="row"> <div class="col-12" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <div class="row"> <div class="col-12 col-md-4 me-auto"> <div class="px-3 p-md-0 mb-5 mb-md-0"> <h3>We’d love to be involved in your next project</h3> <p>We can work with you to:</p> <ul><li>Create, refine or rationalise your brand</li><li>Develop a stunning bespoke website</li><li>Produce innovative design for print or digital</li><li>Advance your digital marketing </li></ul> <a href="/contact" class="dyn-arrow-link dyn-arrow-link--secondary">Get in touch </a> </div> </div> <div class="col-12 col-md-7 px-0 px-md-3"> <div class="row"> <div class="col-12"> <img loading="lazy" src="/images/jcogs_img/cache/duke-of-wellington_-_28de80_-_047a2b2228c4d862449399f5c58c2f165d97c66b.jpg" srcset="/images/jcogs_img/cache/duke-of-wellington_-_28de80_-_047a2b2228c4d862449399f5c58c2f165d97c66b_400w.jpg 400w, /images/jcogs_img/cache/duke-of-wellington_-_28de80_-_047a2b2228c4d862449399f5c58c2f165d97c66b_600w.jpg 600w, /images/jcogs_img/cache/duke-of-wellington_-_28de80_-_047a2b2228c4d862449399f5c58c2f165d97c66b.jpg 601w" sizes="(max-width:400px) 400px, (max-width:600px) 600px, 601px" alt="Duke of Wellington exterior" class="lazy img-fluid"> </div> </div> </div> </div> <div class="row"> <div class="col-12 col-md-7 ms-auto"> <div class="hold-music-wrapper"> <div class="hold-music-content"> <div class="px-3 p-md-0"> <div class="title"> What’s playing on our hold music? </div> <div class="song-artist"> Blondie – Atomic </div> <div class="supporting"> Because we are constructing a web framework using Atomic Design Principles </div> </div> </div> </div> <div class="col-12 px-3 d-block d-md-none"> <a href="https://www.optimadesign.co.uk/blog/optimas-thirty-things" target="_blank"> <div class="logo-wrapper me-5 d-flex align-items-center"> <img class="w-25 mt-4 mb-0" src="https://www.optimadesign.co.uk/assets/images/common/Optima_30.png" alt="Celebrating 30 Years" loading="lazy" /> </div> </a> </div> </div> </div> </div> </div> </div> </section> <footer id="footer"> <div class="container"> <div class="row"> <div class="col-12 col-lg-5 footer-address-wrapper" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <a class="site_logo" href="https://www.optimadesign.co.uk/"> <img src="https://www.optimadesign.co.uk/assets/images/templates/optima-graphic-design-lincoln.svg" alt="Optima Graphic Design Consultants" width="148" height="41"> </a> <div class="contact_details"> <p>Optima Graphic Design Consultants Ltd<br /> The Duke of Wellington, 37 Broadgate<br /> Lincoln<br /> Lincolnshire<br /> LN2 5AE<br /> United Kingdom</p> </div> </div> <div class="col-12 col-lg-4 footer-nav-wrapper" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <nav class="footer-nav h-100"> <ul class="footer-menu h-100"> <li><a class="footer-menu-link underline" href="https://www.optimadesign.co.uk/design">Design</a></li> <li><a class="footer-menu-link underline" href="https://www.optimadesign.co.uk/web">Web</a></li> <li><a class="footer-menu-link underline" href="https://www.optimadesign.co.uk/digital-marketing-services">Digital Marketing</a></li> <li><a class="footer-menu-link underline" href="https://www.optimadesign.co.uk/privacy-policy">Privacy Policy</a></li> <li><a class="footer-menu-link underline" href="https://www.optimadesign.co.uk/cookie-policy">Cookie Policy</a></li> <li><a class="footer-menu-link underline" href="https://www.optimadesign.co.uk/terms-of-use">Terms of Use</a></li> </ul> </nav> </div> <div class="col-12 d-sm-none footer-mobile-socials-wrapper" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <ul class="footer-social-links d-flex"> <li><a class="footer-social-link" href="https://www.linkedin.com/company/optima-graphic-design-consultants-ltd" target="_blank"><i class="fab fa-linkedin-in"></i><span class="sr-only">Visit Optima Graphic Design on Linkedin</span></a></li> <li><a class="footer-social-link" href="https://www.instagram.com/optimadesign" target="_blank"><i class="fab fa-instagram"></i><span class="sr-only">Visit Optima Graphic Design on Instagram</span></a></li> <li><a class="footer-social-link" href="https://twitter.com/optimadesign" target="_blank"><i class="fa-brands fa-x-twitter"></i><span class="sr-only">Visit Optima Graphic Design on X (formerly Twitter)</span></a></li> </ul> </div> <div class="col-12 col-lg-3 footer-contact-wrapper" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <div class="footer-phone-email-careers h-100"> <div class="footer-phone-email"> <div class="footer-tel"><a href="tel:01522522773">01522 522773</a></div> <div class="footer-email"><a href="/cdn-cgi/l/email-protection#6e070008012e011e1a07030f0a0b1d070900400d01401b05"><span class="__cf_email__" data-cfemail="3e575058517e514e4a57535f5a5b4d575950105d51104b55">[email protected]</span></a></div> <div class="footer-contact"> <a class="dyn-arrow-link dyn-arrow-link--secondary" href="https://www.optimadesign.co.uk/contact">Get in Touch </a> </div> </div> <div class="footer-careers"> <p>Looking for your next role?</p> <div class="footer-careers-link"> <a class="dyn-arrow-link dyn-arrow-link--secondary" href="https://www.optimadesign.co.uk/careers">Careers </a> </div> </div> </div> </div> </div> <div class="row accreditations-row mt-4 mt-lg-5"> <div class="col-12 d-flex flex-wrap" data-aos="fade-up" data-aos-once="true" data-aos-duration="1000"> <a class="d-none d-md-block" href="https://www.optimadesign.co.uk/blog/optimas-thirty-things" target="_blank"> <div class="logo-wrapper me-5 d-flex align-items-center"> <img class="h-100" src="https://www.optimadesign.co.uk/assets/images/common/Optima_30.png" alt="Celebrating 30 Years" loading="lazy" /> </div> </a> <a href="https://www.ncsc.gov.uk/cyberessentials/overview" target="_blank"> <div class="logo-wrapper me-md-5 d-flex align-items-center"> <img class="h-75" src="https://www.optimadesign.co.uk/assets/images/common/Optima-Cyber-Essentials-Plus.svg" alt="Cyber Essentials Certified" loading="lazy" /> </div> </a> <a href="https://www.dba.org.uk/" target="_blank"> <div class="logo-wrapper me-md-5 d-flex align-items-center"> <img class="h-75" src="https://www.optimadesign.co.uk/assets/images/common/Optima_DBA_Member.svg" alt="Design Business Association Member" loading="lazy" /> </div> </a> <a href="https://www.investorsinpeople.com/" target="_blank"> <div class="logo-wrapper me-md-5 d-flex align-items-center"> <img class="h-75" src="https://www.optimadesign.co.uk/assets/images/common/investors-in-people-logo.png" alt="Investors in People" loading="lazy" /> </div> </a> </div> </div> <div class="row copyright-row"> <div class="col-12 d-flex align-items-center"> <p><small>© Optima Graphic Design Consultants 2024</small></p> <ul class="footer-social-links d-none d-sm-flex"> <li><a class="footer-social-link" href="https://www.linkedin.com/company/optima-graphic-design-consultants-ltd" target="_blank"><i class="fab fa-linkedin-in"></i><span class="sr-only">Visit Optima Graphic Design on Linkedin</span></a></li> <li><a class="footer-social-link" href="https://www.instagram.com/optimadesign" target="_blank"><i class="fab fa-instagram"></i><span class="sr-only">Visit Optima Graphic Design on Instagram</span></a></li> <li><a class="footer-social-link" href="https://twitter.com/optimadesign" target="_blank"><i class="fa-brands fa-x-twitter"></i><span class="sr-only">Visit Optima Graphic Design on X (formerly Twitter)</span></a></li> </ul> </div> </div> </div> </footer> </div> <div id="cookie-banner"> <p><strong>Cookie Policy: </strong>Our site uses cookies to analyse usage, record your cookie preferences and give you the best possible experience. <a href="https://www.optimadesign.co.uk/privacy-policy">Tell me more</a></p> <div class="cb-controls"> <form id="cookie-banner-form" method="post" action="https://www.optimadesign.co.uk/web/how-we-work" > <div class='hiddenFields'> <input type="hidden" name="ACT" value="10" /> <input type="hidden" name="RET" value="82SIO4paPkb03bmVDUD4Ru08h0nsCJliK2fLXvEYJaU=" /> <input type="hidden" name="consent_names" value="/aFA2NQKlt1lgSZsJc+MtogGKwAtusVgGymjwoHlUJKrUOwTUpTarhbShd2Dc4tswUbTdF60V/cgbnYZfnRT6boOk3UWeiBPVdiT5iPtXOSWRQEqGrfgXHFWIcqkz6Te" /> <input type="hidden" name="site_id" value="1" /> <input type="hidden" name="csrf_token" value="5197d83a63b13f68ead9e2a6de81fdeb2e3089d0" /> </div> <input type="hidden" name="ee:cookies_functionality" value=""> <input type="hidden" name="ee:cookies_performance" value=""> <input type="hidden" name="ee:cookies_targeting" value=""> <a href="#" class="cb-settings">Cookie Preferences</a> <button class="btn btn-primary cb-btn-reject" data-act="47">Reject All</button> <button class="btn btn-primary cb-btn-accept">Accept All</button> </form> </div> <a href="#" class="cb-close" aria-label="Close cookie preferences window"></a> </div> <div id="cookie-settings-overlay"> <div id="cookie-settings"> <h3>Cookie Preferences</h3> <form id="cookie-settings-form" method="post" action="https://www.optimadesign.co.uk/web/how-we-work" > <div class='hiddenFields'> <input type="hidden" name="ACT" value="10" /> <input type="hidden" name="RET" value="Z6Z//jzmiP+uG40hEwuBa3PBYksmlEk7gxbIZeav34w=" /> <input type="hidden" name="consent_names" value="4DNVEH/zdw4bqOAai74eQ50mZDrbude1M/Wl/Had9br22t9rlflbYOvUhW7k7u1wYc6sP0U9zOlBxjDtqtT6g5IzJwr9fF32Mx5pvz/iyduVH0uBm5ucun/teUKizaAo" /> <input type="hidden" name="site_id" value="1" /> <input type="hidden" name="csrf_token" value="5197d83a63b13f68ead9e2a6de81fdeb2e3089d0" /> </div> <div class="cs-box"> <div> <label for="cs-switch-ee:cookies_necessary">Necessary Cookies</label> <p>These cookies are used to record your cookie consent preferences and secure form submissions. <a href="https://www.optimadesign.co.uk/cookie-policy" class="dyn-arrow-link dyn-arrow-link--secondary" target="_blank">Tell me more</a></p> </div> <div class="form-check form-switch"> <input type="checkbox" class="form-check-input" id="cs-switch-ee:cookies_necessary" name="ee:cookies_necessary" value="y" checked disabled> </div> </div> <div class="cs-box"> <div> <label for="cs-switch-ee:cookies_functionality">Functionality Cookies</label> <p>These cookies help us personalize content and functionality for you, including remembering changes you have made to parts of the website that you can customize, or selections for services made on previous visits. If you do not allow these cookies, some portions of our website may be less friendly and easy to use, forcing you to enter content or set your preferences on each visit. <a href="https://www.optimadesign.co.uk/cookie-policy" class="dyn-arrow-link dyn-arrow-link--secondary" target="_blank">Tell me more</a></p> </div> <div class="form-check form-switch"> <input type="checkbox" class="form-check-input" id="cs-switch-ee:cookies_functionality" name="ee:cookies_functionality" value="y" > </div> </div> <div class="cs-box"> <div> <label for="cs-switch-ee:cookies_performance">Performance Cookies</label> <p>These cookies allow us measure how visitors use our website, which pages are popular, and what our traffic sources are. This helps us improve how our website works and make it easier for all visitors to find what they are looking for. The information is aggregated and anonymous, and cannot be used to identify you. If you do not allow these cookies, we will be unable to use your visits to our website to help make improvements. <a href="https://www.optimadesign.co.uk/cookie-policy" class="dyn-arrow-link dyn-arrow-link--secondary" target="_blank">Tell me more</a></p> </div> <div class="form-check form-switch"> <input type="checkbox" class="form-check-input" id="cs-switch-ee:cookies_performance" name="ee:cookies_performance" value="y" > </div> </div> <div class="cs-box"> <div> <label for="cs-switch-ee:cookies_targeting">Targeting Cookies</label> <p>These cookies are usually placed by third-party advertising networks, which may use information about your website visits to develop a profile of your interests. This information may be shared with other advertisers and/or websites to deliver more relevant advertising to you across multiple websites. If you do not allow these cookies, visits to this website will not be shared with advertising partners and will not contribute to targeted advertising on other websites. <a href="https://www.optimadesign.co.uk/cookie-policy" class="dyn-arrow-link dyn-arrow-link--secondary" target="_blank">Tell me more</a></p> </div> <div class="form-check form-switch"> <input type="checkbox" class="form-check-input" id="cs-switch-ee:cookies_targeting" name="ee:cookies_targeting" value="y" > </div> </div> <button class="btn btn-primary" data-act="47">Save</button> </form> <a href="#" class="cb-settings-close" aria-label="Close cookie settings window"></a> </div> </div> <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script src="/assets/js/plugins-min.js?v=1732030028"></script> <script src="/assets/js/onload-min.js?v=1732196602"></script> <script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script> </body> </html>