RecruitingKQQA9

Rebuild a Small Business Site on a Modern Stack

Rebuild an outdated small business website on a modern, maintainable stack.

Rebuild a Small Business Site on a Modern StackPhoto: Tranmautritam / PexelsWebsite Builds · 2–3 Months
CategoryWebsite Builds
DifficultyIntermediate
Time2–3 Months
Commitment4 hrs/week
TypeTeam
LocationRemote
Team4 people
ScheduleFlexible, async-first

The Brief

What you'd be taking on

A rebuilt marketing website for a small business currently running on an outdated platform. The existing site is slow, hard to update, and not mobile-friendly. The business is likely losing customers due to a poor mobile experience.

The Programme

100 tasks across six phases

Every phase below carries its own tasks and the line that decides when each one is done. Nothing is left to interpretation.

Discovery

Get inside the problem before touching the work: scope, constraints, and who you're building for.

What you need coming in

  • Some technical familiarity helpful, not always required
  • Own laptop
  • Willingness to commit 3–5 hours per week
Discovery tasks10
  1. 001Read the full project brief and note where the current site is losing customers.Done whenSummary of gaps written in your own words.
  2. 002Meet your teammates and agree who takes each of the four project roles.Done whenRole assignments recorded in Notion.
  3. 003Set up the shared workspace: Notion board, Slack channel and Google Drive folder.Done whenAll three spaces created and every teammate has access.
  4. 004Browse the current site page by page and list every page, its URL and its purpose.Done whenComplete page inventory saved to the workspace.
  5. 005Run the current site through PageSpeed Insights on mobile and record the scores.Done whenBaseline mobile and desktop scores recorded.
  6. 006Interview the owner about how they update the site today and what frustrates them most.Done whenInterview notes logged in the workspace.
  7. 007Clarify budget, hosting spend and domain ownership constraints with the owner.Done whenConstraints confirmed in writing.
  8. 008Agree with the owner the top three things a visitor must be able to do on the new site.Done whenThree visitor journeys confirmed in writing.
  9. 009Collect all existing brand assets: logo files, photography, colours and copy documents.Done whenAsset folder populated in Google Drive.
  10. 010Write a one-page discovery summary and send it to the owner to confirm nothing is missed.Done whenOwner confirms the summary is accurate.

Research

Gather the evidence the decisions will rest on.

The objectives to work against

  1. Audit the existing site's content and structure
  2. Rebuild on a modern stack
  3. Ensure mobile responsiveness
  4. Launch within 5 weeks
Research tasks15
  1. 011Audit every page's content and mark each as keep, rewrite or cut.Done whenKeep/rewrite/cut decision recorded for every page.
  2. 012Export all text and images from the old platform into the shared Drive folder.Done whenEvery page's content backed up outside the old platform.
  3. 013Check any existing analytics for the most and least visited pages.Done whenTraffic findings logged, or the absence of analytics noted.
  4. 014Review three competitor sites on a phone and note what they do better and worse.Done whenComparison notes written for all three competitors.
  5. 015Shortlist three modern stack options suited to a small marketing site.Done whenShortlist of three stacks written up with trade-offs.
  6. 016Research CMS options the owner could realistically use without a developer.Done whenAt least two editor-friendly CMS candidates documented.
  7. 017Trial the editing screen of the top two CMS candidates by creating a dummy page in each.Done whenEditing trial notes recorded for both candidates.
  8. 018Research hosting providers with free or low-cost tiers and automatic deploys.Done whenHosting comparison covering at least three providers.
  9. 019Confirm each candidate host supports custom domains, HTTPS and 301 redirects.Done whenSupport confirmed and noted per host.
  10. 020Collect screenshots of five small business sites that work especially well on mobile.Done whenReference folder of five annotated examples created.
  11. 021Draft a performance budget: target page weight, image sizes and load time on 4G.Done whenPerformance budget written down with numeric targets.
  12. 022Record the current site's SEO baseline: page titles, descriptions and search rankings.Done whenSEO baseline captured for every indexed page.
  13. 023Draft an accessibility checklist: contrast, alt text, tap targets and keyboard use.Done whenChecklist drafted and shared with the team.
  14. 024Find out where the domain is registered and confirm who can change its DNS records.Done whenDNS access route confirmed with the owner.
  15. 025Share the research summary with the owner and note any early reactions.Done whenOwner feedback logged.

Planning

Split the work, pick the tools, agree the dates.

Who does what · 4 roles

Project Lead

Coordinates scope, timeline, and delivery.

Project management, communication · 4 hrs/week

Developer

Builds and tests the core technical work.

Relevant programming/tooling · 5 hrs/week

QA / Tester

Checks the build works as intended before launch.

Attention to detail, basic testing · 3 hrs/week

Documentation Lead

Writes clear setup and usage documentation.

Technical writing · 3 hrs/week

Tools the team runs on

GitHubNotionSlackGoogle WorkspaceVS Code
Planning tasks15
  1. 026Select the stack and CMS from the shortlist as a team and record why.Done whenDecision recorded with rationale in Notion.
  2. 027Choose the hosting provider and confirm its ongoing cost with the owner.Done whenHosting choice and cost approved in writing.
  3. 028Draw the new site map showing every page and the navigation structure.Done whenSite map approved by the owner.
  4. 029Write the content plan: who rewrites which page and by when.Done whenContent plan in Notion with a named owner per page.
  5. 030Sketch mobile-first wireframes for the homepage and one inner page template.Done whenWireframes shared and agreed by the team.
  6. 031Define the design tokens (colours, fonts, spacing) from the collected brand assets.Done whenStyle reference page created in the workspace.
  7. 032Map every old URL to its new destination for 301 redirects.Done whenRedirect map drafted covering every URL in the page inventory.
  8. 033Create the GitHub repository with a protected main branch and pull request reviews.Done whenRepository created and every teammate can push a branch.
  9. 034Agree a definition of done for each page: responsive, optimised images, proofread copy.Done whenDefinition-of-done checklist agreed by the team.
  10. 035Break the build into weekly milestones across the five-week timeline.Done whenMilestone plan in Notion with dates.
  11. 036Plan how owner feedback will be tracked and limited to avoid scope creep.Done whenRevision process agreed (e.g. max 2 rounds).
  12. 037Write the test plan: which devices, browsers and checks the QA lead will run.Done whenTest plan written and assigned.
  13. 038Draft the launch runbook: DNS switch steps, timing and a rollback route.Done whenRunbook drafted and stored in the workspace.
  14. 039Schedule the weekly team check-in and agree the Slack update cadence.Done whenRecurring invite sent and cadence agreed.
  15. 040Walk the owner through the full plan and get sign-off before the build starts.Done whenOwner sign-off recorded in writing.

Execution

The build. Most of the hours on this project live here.

Skills you'll practise here

ProgrammingProblem SolvingDocumentationTestingSystems ThinkingCommunication
Execution tasks40
  1. 041Scaffold the project with the chosen stack and confirm it runs locally in VS Code.Done whenFresh clone runs locally for every teammate.
  2. 042Connect the chosen CMS to the codebase and confirm content can be fetched.Done whenA test entry from the CMS renders in the local build.
  3. 043Deploy the scaffold to the chosen host to create a shared preview URL.Done whenPreview URL loads for the whole team.
  4. 044Set up automatic deploys so merges to main publish to the preview URL.Done whenA merged pull request triggers a successful deploy.
  5. 045Build the global layout: header, navigation, footer and mobile menu.Done whenLayout renders correctly at 320px, 768px and 1280px widths.
  6. 046Implement the design tokens as the site theme.Done whenColours, fonts and spacing match the style reference page.
  7. 047Model the CMS content types: pages, services, opening hours and testimonials.Done whenOwner-editable fields exist for each content type.
  8. 048Rewrite the homepage copy following the content plan.Done whenHomepage copy drafted and reviewed by one teammate.
  9. 049Build the homepage against the wireframe using CMS content.Done whenHomepage matches the wireframe on mobile and desktop.
  10. 050Optimise all photography: resize, compress and convert to modern formats.Done whenEvery image is under the performance budget's size target.
  11. 051Rewrite the about page copy following the content plan.Done whenAbout copy drafted and reviewed by one teammate.
  12. 052Build the about page with the optimised imagery.Done whenAbout page live on the preview URL.
  13. 053Rewrite the services copy so each service has a clear description and call to action.Done whenServices copy drafted and reviewed by one teammate.
  14. 054Build the services section so each service is a CMS entry.Done whenAdding a service in the CMS creates its section without code changes.
  15. 055Build the contact page with a form, phone number, email and address.Done whenContact page renders on the preview URL.
  16. 056Wire the contact form to deliver submissions by email with spam protection.Done whenA test submission arrives in the owner's inbox.
  17. 057Add the location map and opening hours block, editable through the CMS.Done whenChanging hours in the CMS updates the site.
  18. 058Build the remaining inner pages from the site map.Done whenEvery page in the site map exists on the preview URL.
  19. 059Design and build a helpful 404 page pointing visitors to key pages.Done whenUnknown URLs show the custom 404 page.
  20. 060Implement the 301 redirects from the redirect map.Done whenEach old URL returns a 301 to its mapped destination on the preview build.
  21. 061Write unique page titles and meta descriptions for every page.Done whenNo page shares a title or description with another.
  22. 062Add local business structured data with name, address, hours and contact details.Done whenMarkup passes Google's Rich Results test.
  23. 063Add the favicon, social sharing image and Open Graph tags.Done whenLink previews show the correct image and title in Slack.
  24. 064Install the privacy-friendly analytics tool agreed with the owner.Done whenA test visit appears in the analytics dashboard.
  25. 065Run a performance pass on the preview site against the budget.Done whenEvery page meets the performance budget on a throttled 4G test.
  26. 066Work through the accessibility checklist across all pages and fix failures.Done whenAll checklist items pass on every page.
  27. 067Demo the preview site to the owner and log all feedback in one place.Done whenRound-one feedback list recorded.
  28. 068Apply the round-one feedback changes agreed within scope.Done whenEvery accepted feedback item is closed with a linked change.
  29. 069Proofread every page's copy for spelling, tone and consistency.Done whenProofreading corrections merged.
  30. 070Check every page against the definition-of-done checklist and fix any gaps.Done whenChecklist signed off for every page.
  31. 071Outline the content editing guide around the owner's most frequent updates.Done whenGuide outline agreed with the team.
  32. 072Write the guide section for logging in and editing text on a page.Done whenA teammate can follow it to change text unaided.
  33. 073Write the guide section for replacing and adding images.Done whenSteps verified against the actual CMS screens.
  34. 074Write the guide sections for updating opening hours, services and testimonials.Done whenEach section verified by performing the steps once.
  35. 075Add annotated screenshots to every step of the guide.Done whenEvery step has a matching screenshot.
  36. 076Have the least technical teammate make a real edit using only the guide.Done whenEdit completed without help and sticking points noted.
  37. 077Revise the guide based on the sticking points from the walkthrough.Done whenUpdated guide re-tested cleanly.
  38. 078Hold the second owner review of the full preview site and the editing guide.Done whenRound-two feedback list recorded.
  39. 079Apply the round-two changes and declare a content freeze.Done whenFeedback closed and freeze announced in Slack.
  40. 080Tag a release candidate in GitHub from the frozen main branch.Done whenTagged release deployed to the preview URL.

Quality Assurance

Check the work against the standard before the client ever sees it.

How the founder judges done

  • Site passes mobile responsiveness check
  • Owner approves final build
  • Site live at launch
QA tasks10
  1. 081Test every page on at least one real iPhone and one real Android phone.Done whenAll pages pass with any issues logged as tickets.
  2. 082Test the full site in Chrome, Safari, Firefox and Edge on desktop.Done whenBrowser matrix completed with issues logged.
  3. 083Run Lighthouse on every page and record scores against the performance budget.Done whenScores logged and every page meets or beats the budget.
  4. 084Click every link and button on the site and submit the contact form end to end.Done whenZero broken links and the form submission is received.
  5. 085Test every redirect in the redirect map against the preview build.Done whenEach old URL lands on its mapped page.
  6. 086Run the accessibility checks: keyboard-only navigation and a screen reader pass.Done whenIssues logged and no blockers remain.
  7. 087Make a test edit through the CMS as the owner would and confirm it publishes.Done whenEdit appears on the preview site without developer help.
  8. 088Fix every critical and major issue from testing and retest each fix.Done whenIssue list shows all critical and major items closed.
  9. 089Ask a teammate who has not built the site to review it and the guide with fresh eyes.Done whenPeer review completed and notes logged.
  10. 090Run the owner's final pre-launch review on the preview URL.Done whenOwner approval to launch recorded in writing.

Delivery & Reflection

Hand it over properly, then write down what the team learned.

What the client walks away with

A fast, mobile-friendly site the owner can update without a developer.

Handed over

  • Rebuilt website
  • Basic content editing guide
Delivery tasks10
  1. 091Agree the launch date and time with the owner, avoiding their busiest trading hours.Done whenLaunch slot confirmed in writing.
  2. 092Take a final export of the old site and store it in the shared Drive folder.Done whenBackup verified as complete and openable.
  3. 093Follow the launch runbook: point the domain's DNS at the new hosting.Done whenDomain resolves to the new site.
  4. 094Verify the live domain: HTTPS certificate, www redirect and every page loading.Done whenAll checks pass on the live domain.
  5. 095Re-test the contact form and the redirect map on the live domain.Done whenLive submission received and redirects resolve correctly.
  6. 096Submit the sitemap to Google Search Console and confirm indexing has started.Done whenSitemap accepted with no errors reported.
  7. 097Transfer all credentials: hosting, CMS, domain, analytics and repository access.Done whenOwner confirms access to every account.
  8. 098Walk the owner through the editing guide on a call and watch them make a live edit.Done whenOwner completes an edit unaided.
  9. 099Write a short handover note: what shipped, known limitations and suggested next steps.Done whenHandover note delivered to the owner.
  10. 100Submit the completed project for credential review and close it out.Done whenProject marked complete.

FAQs

Common questions

Is this project paid?

No — RogueBoard projects are unpaid. What you earn is real experience, portfolio evidence, and a verified reference.

Can beginners join?

Depends on the role — check the Difficulty rating and each role's required skills above. Several roles on this project are beginner-friendly.

What if I miss a meeting?

Let your Project Lead know in advance where possible. One missed check-in won't remove you from the team, but consistent attendance is expected.

Can I leave early?

You can step back from a project, but try to hand off your work cleanly so the team and the credential process aren't disrupted.

Will I receive a reference?

Yes — completing your role to the agreed standard earns a verified RogueBoard credential and a reference you can point employers or clients to.

KQQA9Rebuild a Small Business Site on a Modern Stack
Apply to Join →