B2B SaaS Website Redesign and Rebuild (3-Page)
Budget: $250 – $750 USD
Freelance Gig: 3-Page Redesign for B2B SaaS (Figma → WordPress)
Scope: Redesign and rebuild three public marketing pages for a B2B SaaS. End-to-end delivery: design in Figma, develop in WordPress, and launch on our server.
Pages:
1. Home
2. Features (overview)
3. Feature (detail template) — reusable for multiple features
What You’ll Deliver:
Figma: High-fidelity desktop & mobile designs, componentized with a lightweight design system (colors, type scale, buttons, cards, grid).
WordPress build:
Custom theme or modern block theme (no heavy page builders).
Clean, semantic HTML, responsive CSS, minimal JS.
Reusable Gutenberg blocks for hero, feature grid, testimonials, FAQs, CTAs.
Configurable Feature Detail template (title, summary, benefits, screenshots, FAQ, CTA).
Performance & SEO:
Core Web Vitals-friendly (Lighthouse 90+ targets).
Schema basics, meta tags, open graph, sitemap, robots.
Image optimization (modern formats, srcset).
Accessibility: WCAG 2.2 AA-minded structure (headings, color contrast, focus states, ARIA where needed).
QA & Launch: Cross-browser/device testing and deployment on our server (staging → production),
Handover: Short loom/walkthrough + README (edit instructions), 30-day bug warranty.
Must-Have Skills:
Figma: components, auto-layout, responsive thinking.
WordPress: block theme or custom theme, Gutenberg block patterns, PHP/JS basics.
Front-end: semantic HTML, accessible CSS, vanilla JS.
Performance tuning, basic on-page SEO.
DevOps light: staging setup and launching on client servers (SSH/cPanel/Cloud panels), backups, zero-downtime deploy.
Nice to Have:
Experience designing for technical B2B/SaaS audiences.
Screenshot/diagram polish for feature storytelling.
Basic illustration or icon customization.
Acceptance Criteria:
Pixel-accurate build vs Figma across breakpoints.
Lighthouse: Performance/Accessibility/Best Practices/SEO ≥ 90 on the three pages.
Valid, semantic markup and keyboard-navigable UI.
Reusable blocks let non-technical editors update content without code.
Successful production launch on our server with backup/rollback tested.
How to Apply:
Please include:
Portfolio links (Figma + WordPress builds you both designed & developed).
2–3 sentence approach to: (a) feature template reusability, (b) performance, (c) accessibility.
A fixed-fee quote and timeline from kickoff to launch.
Tech stack details (theme approach, block strategy, any lightweight plugins).
Two relevant client references.
Start: ASAP
Engagement: Fixed-price, milestone-based (Design → Build → QA/Launch).
We’ll provide brand guidelines, copy, and server access upon award.
Scope: Redesign and rebuild three public marketing pages for a B2B SaaS. End-to-end delivery: design in Figma, develop in WordPress, and launch on our server.
Pages:
1. Home
2. Features (overview)
3. Feature (detail template) — reusable for multiple features
What You’ll Deliver:
Figma: High-fidelity desktop & mobile designs, componentized with a lightweight design system (colors, type scale, buttons, cards, grid).
WordPress build:
Custom theme or modern block theme (no heavy page builders).
Clean, semantic HTML, responsive CSS, minimal JS.
Reusable Gutenberg blocks for hero, feature grid, testimonials, FAQs, CTAs.
Configurable Feature Detail template (title, summary, benefits, screenshots, FAQ, CTA).
Performance & SEO:
Core Web Vitals-friendly (Lighthouse 90+ targets).
Schema basics, meta tags, open graph, sitemap, robots.
Image optimization (modern formats, srcset).
Accessibility: WCAG 2.2 AA-minded structure (headings, color contrast, focus states, ARIA where needed).
QA & Launch: Cross-browser/device testing and deployment on our server (staging → production),
Handover: Short loom/walkthrough + README (edit instructions), 30-day bug warranty.
Must-Have Skills:
Figma: components, auto-layout, responsive thinking.
WordPress: block theme or custom theme, Gutenberg block patterns, PHP/JS basics.
Front-end: semantic HTML, accessible CSS, vanilla JS.
Performance tuning, basic on-page SEO.
DevOps light: staging setup and launching on client servers (SSH/cPanel/Cloud panels), backups, zero-downtime deploy.
Nice to Have:
Experience designing for technical B2B/SaaS audiences.
Screenshot/diagram polish for feature storytelling.
Basic illustration or icon customization.
Acceptance Criteria:
Pixel-accurate build vs Figma across breakpoints.
Lighthouse: Performance/Accessibility/Best Practices/SEO ≥ 90 on the three pages.
Valid, semantic markup and keyboard-navigable UI.
Reusable blocks let non-technical editors update content without code.
Successful production launch on our server with backup/rollback tested.
How to Apply:
Please include:
Portfolio links (Figma + WordPress builds you both designed & developed).
2–3 sentence approach to: (a) feature template reusability, (b) performance, (c) accessibility.
A fixed-fee quote and timeline from kickoff to launch.
Tech stack details (theme approach, block strategy, any lightweight plugins).
Two relevant client references.
Start: ASAP
Engagement: Fixed-price, milestone-based (Design → Build → QA/Launch).
We’ll provide brand guidelines, copy, and server access upon award.
Related categories:
PHP
JavaScript
Website Design
Graphic Design
SEO
WordPress
CSS
HTML
Figma
Web Design