Our Website Design, Development Methodology

We will redesign and launch your new site on WordPress Our website design methodology below explains how we will do it. Our end-end process for redesigning and launching websites has the following steps:

Overall Project Management and Communication

We truly do manage by engagement and weekly check-ins via web conference is a regular feature of our work. Emails are generally sent as supporting documents, confirming decisions, answering and asking questions, and receiving direction from our clients. Exemplifi enables JIRA project management software to track the progress of work, enter work orders or other client directions, internal timekeeping, and support reporting.
‍
Deliverables: Meetings scheduled for kick-off and milestone reviews, and as needed; weekly check-ins via web conference, email, or project management application. We will have a dedicated project manager to communicate with all the client stakeholders. The PM will manage the overall project timelines and client meeting schedules Weekly progress reports are shared with the client stakeholders.
‍
Our typical communication tools include: Smartsheets, Google docs, Slack, Emails, Zoom, and phone calls.

Weekly Status Reports will be submitted to the respective manager’s

Task 1: Content Audit and Strategy

This phase is led by our Content Strategist.  During this phase, we do the following:

  1. Do a thorough content audit
  2. Interview multiple stakeholders
  3. Look at any site analytics (Eg. Google Analytics) to understand user behavior on the current site
  4. Understand your user personas and their typical pathways on the site
  5. Review competitor sites
  6. Review aspirational sites
  7. Establish success criteria for the site redesign such as traffic, bounce rates, conversions, and user interactions.

‍

Project Management
Team Member Activity
Project Manager Planning, Communication, weekly reports, Delivery, Interviewing Stakeholders, Review Competitors, Review Aspirational Sites
Information Strategist  Review Competitors, Review Aspirational Sites, Understand Redesign Criteria, Understand User Interactions
SEO Expert Look at current site analytics, understand user behavior
QA Lead Understand Bounce Rates, Review Competitors, Review Aspirational Sites, Understand User Interactions


There are two key deliverables for this phase:

  • A presentation and document that outlines the key research findings, establish priorities for the new site and defines success criteria.
  • A complete content audit of the current site.

An example of research findings is shown below:

Below is an example of a content audit: 

Task 2: Information Architecture Design

‍

This phase builds on the Content Audit and Strategy results. Here, we incorporate the results of the strategy sessions and do the following:

  1. Based on the new priorities, we design the new sitemap and the content hierarchy
  2. We design the new navigation structure
  3. Analyze Content, Categories, and Labels in greater depth
  4. Finalize on Tags and Taxonomies

‍

Project Management
Team Member Activity
Project Manager Planning, Communication, weekly reports, Sharing the content strategy results, Conduct review of new priorities, showcase new site map and content hierarchy
Information Strategist  Design new navigation structure
SEO Expert Analyze content, categories, and labels, finalize tags and taxonomies


From the phase, the deliverable is primarily the new sitemap that articulates the new content structure. A sample design from a prior project is shown below: 
‍

As you can see, we highlight new pages, pages that have moved, and any pages that have name changes. The live link to this sitemap is here: https://bit.ly/3rPV0AJ 

Task 3: UX and Wireframes

During this phase, we do the following: 

  1. Design Wireframes based on the Information Architecture
  2. Build Content Modules and a Component Library that forms the foundation of the Design System
  3. Build Clickable Prototypes to help the clients visualize the flow of the pages
  4. Iterate with the client and get high-level lock-in
  5. Typical tools used are Adobe XD, Sketch, Zeplin, and InVision Studio.


The deliverables from this phase of the project are:

  • A comprehensive set of layouts for all the templates on the site
  • A component library that forms the foundation for the design system
Project Management
Team Member Activity
Project Manager Planning, Communication, weekly reports, Iterate the designs and prototypes
UX Designer Design wireframes, build clickable prototypes

Some samples of our work are below:

Some live links for wireframes from prior projects are: https://bit.ly/3A6fA2phttps://bit.ly/3lqz4L5

You can see a live implementation of this component library here: https://bit.ly/2TRsamO 

Task 4: Design System and Visual Design

‍

During this phase, we accomplish the following: 

  1. Leverage the client’s style guide and brand guidelines to create visual designs based on the wireframes
  2. Iterate with the client and finalize these design assets
  3. Designs are done for multiple breakpoints: desktop, tablet, and mobile
  4. These designs are typically done in tools such as Adobe XD, Sketch, Figma, or Photoshop.

The main deliverable from this phase is the approved design files. Some examples from prior projects are shown below:
‍

Project Management
Team Member Activity
Project Manager Planning, Communication, Weekly report, Sharing the content strategy results, Conduct review of new priorities, Showcase new site map and content hierarchy
UI Designer Execute all of the activities mentioned above.

Task 5: Content Migration

  1. We leverage the WordPress migration modules to migrate the content from WordPress to WordPress 
  2. The development team creates migration scripts and tests them thoroughly
  3. These migration scripts will then be run to migrate the content
  4. After the migration is complete, the QA team will thoroughly review the content and ensure that it is complete. 
  5. Any gaps in the migration will be addressed manually

‍


After completing the migration, all content will be successfully migrated to the new development environment. A sample content migration plan is shown below:
‍

Project Management
Team Member Activity
Project Manager Planning, Communication, Weekly reports, Initiating the migration plan
WordPress Lead Content migration
QA Engineer Review the content migrated into the new system

Task 6: Component, Template, and CMS Development

The development team comprises front-end and back-end, WordPress developers. They work with the visual designs provided by the design team. Their work involves the following activities: 

  1. Implement the style guide in WordPress
  2. Build a component library
  3. Build templates for dynamic content that are based on the component library and the underlying WordPress-driven dynamic content
  4. Build pages for static content that are based on the component library
  5. Build admin screens for the marketing teams to manage and publish content
Project Management
Team Member Activity
Front-End Developer Execute all of the activities mentioned above
WordPress Developer Execute all of the activities mentioned above

After development is complete, the deliverables will be:

Task 7: Responsive and Multi-browser Quality Assurance

‍

Our Quality Assurance team does multi-browser and multi-device testing using the Browserstack product. 

We will not be using real devices for testing as Browserstack uses virtualization technology to mimic real devices. The browsers that we check on include Edge, Chrome, Firefox, and Safari. 
The devices that we check on include: 

  • Latest three versions of the iPhone
  • Latest three versions of the Samsung Galaxy phones
  • Latest three versions of the iPad
  • Desktops at the following resolutions: 1366, 1660, 1920, and 2520.
Project Management
Team Member Activity
QA Engineer Testing for responsiveness and multi-browser compatibility

Task 8: Accessibility, SEO, and Performance Quality Assurance

‍

Based on the client’s accessibility requirements (AAA, AA, or A), our QA team runs the appropriate tests using tools such as WAVE, Accessible, or SiteImprove. 

All the errors identified are fixed by the design and development teams. 
During SEO testing, our QA team checks for the following items:

  • Proper content hierarchy and usage of H1, H2, H3 styles
  • Appropriate titles and meta descriptions
  • Addressing 404 errors
  • Establishing the proper 301 and 302 redirects
  • Ensuring that the sitemap and robots.txt are set up correctly

The final round of tests relates to Site Performance. Our specialized team of performance engineers will test the main site pages for speed and performance on mobile and desktop devices. The tools that we leverage here include Google Pagespeed Insights, Webpagetest, Pingdom, and others. The recommendations are then communicated to the development team, which implements the optimizations.  Sample test results are shown below:

Project Management
Team Member Activity
QA Engineer All of the quality assurance activities mentioned above.
Front-end Developer Fixing bugs identified by the QA Engineer
WordPress Developer Fixing bugs identified by the QA Engineer and implementing performance improvements.

Task 9: Deployment and DevOps

‍

During development, we will set up the development, staging, and production environments on the appropriate infrastructure. We will configure them for code management via tools such as beanstalk or GitHub.

Our DevOps team will work with the client’s infrastructure team to launch the site. The typical activities involved in this process include:

  • Pushing code and content from the staging environment to the production environment
  • Ensure the analytics and other martech tags are working correctly
  • Establishing the 301 redirects as needed
  • Confirming that the SEO parameters are configured correctly
  • After the DNS is migrated, configure the production environment to go live
Project Management
Team Member Activity
Project Manager Coordinating with your IT team and our DevOps team
DevOps Engineer All of the activities mentioned above.
QA Testing the complete production site, page speed, performance, 404 Errors, redirects
SEO Expert Performance Improvisations

Task 10: CMS Education and Training

From an educational and training perspective, we will provide the following:

  • 8 hours of live virtual training. Each training session will be 1-hour long and will be conducted on Zoom. 
  • A Training Guide that outlines how to operate the CMS and perform key activities
Project Management
Team Member Activity
Project Manager Setting up the training sessions
WordPress Dev Training on how to create and edit the content on the site
SEO Expert Training on SEO considerations while creating or editing content on the site
SEO Expert Performance Improvisations

Development: Post Launch 30-day Warranty

  • Exemplifi will fix any bugs or minor adjustments identified within 30-days of launch. This will be done free of charge. 
  • This does not include any large enhancements that take more than 8 hours of development time each.

Ongoing Site Maintenance Activities

During support, we conduct all of the following activities: 

  • ADA Compliance: Make fixes to the website such as color contrasts, image labeling, form field issues, javascript issues, and font size adjustments. 
  • SEO Enhancements: This includes adjustments to the pages to include title, meta-tags, and proper URL naming.  
  • Analytics: We log into your analytics platform regularly and identify any opportunities for improvement. Based on discussions with our client, we then implement these changes. 
  • Performance Monitoring: We regularly scan the website for any performance issues, and provide quarterly reporting. If any issues are identified, based on prioritization with the client, we implement them. 
  • Security: We regularly monitor the website for any security threats. Any fixes that need to be done, based on these reports, will also be done. 
  • Upgrades: This is a quarterly task and usually is time-intensive. However, we make sure that CMS is upgraded regularly and the plugins are kept up to date. 
  • Content Issues: If you have issues with publishing content (news, blogs, page updates, etc), we fix them and train you on how to do it independently. 
  • Site Back Up: Daily/Weekly backup of the entire website which includes posts, pages, media files, etc.
  • Template Changes: If there are any bugs in your templates, we fix them. This category of work usually involves issues with multiple browsers (Chrome, Safari, Firefox, Edge, IE 11, etc) as well as multiple devices (Desktop, Mobile, Tablet). 
  • Training: This is an important set of activities that our clients require us to do. Training is usually delivered remotely (on Zoom calls) and includes our project manager and developer. 

Uptime monitoring: We use tools such as Pingdom to make sure that your site is up regularly. Any downtime is automatically identified and notified.

Our Support Process

All issues identified by the client will be logged in our support portal (powered by JIRA). This system will let our clients assign priorities and get updates when the ticket is acknowledged by the support team and when the ticket is closed.

If you already have a support/ticketing system, we will continue to use it. Otherwise, we will open up our system and migrate any current issues there. 

Support Team and Hours

The support team will consist of a dedicated project manager and a developer. This team will be supported by a broader (non-dedicated) team consisting of a designer, a QA Engineer, and a DevOps Engineer. 

The project manager will respond to tickets logged on the support portal. He will be accessible via slack, email, chat, and phone. His working hours will be 9-5 pm PST.  For any urgent issues that arise outside the 9-5 pm PST support window, we offer email support from our overnight remote team. You will be able to email and will get an acknowledgment of the issue. 

We will dedicate one developer who will get familiar with your website. This person will be responsible for doing all the site activities including content changes, bug fixes, configuration changes, SEO adjustments, ADA compliance checks, and upgrades

Finally, we offer a broader (non-dedicated) team consisting of a designer, UX specialist, QA, DevOps engineer, SEO specialist, and Analytics expert. This team will be brought in by the project manager on an as-needed basis to address specific issues that require these skill sets. 

Free Quarterly Site Health Checks

Every quarter, we conduct a free scan of your website along the following dimensions:

  • WCAG Compliance: We use tools such as Accessibe or Equalweb to assess your site for WCAG compliance. 
  • SEO Optimization: We use tools such as SEO Site Checkup or SEMRush to review your site for SEO-related improvements. 
  • Performance Monitoring: Sometimes your site might have performance issues either on the desktop or mobile. We use Google Pagespeed Insights to measure performance and obtain recommendations for improvements. 
  • Security Scans: Finally, we use products such as Pingdom to conduct security scans on your site and identify vulnerabilities. 

We publish the reports for your review and organize a session wherein we can prioritize any tasks that need to be accomplished.

Exemplifi Logo
Press and Media
Home
InsightsAboutPrivacy Policy
Press and Media
Platforms
WordPressDrupalAEMContentfulKentico
Press and Media
Address

2563 Waverley Street
‍
Palo Alto, CA - 94301
Copyright © 2024 Exemplifi | All Rights Reserved.