SEO optimization: meta tags, JSON-LD structured data, FAQ schema, sitemap, robots.txt, 5-col agency plans

This commit is contained in:
2026-04-13 20:31:49 +02:00
parent da059c081e
commit 5712fd7872
4 changed files with 272 additions and 73 deletions
+42 -1
View File
@@ -2,8 +2,49 @@ import type { Metadata } from "next"
import "./globals.css" import "./globals.css"
export const metadata: Metadata = { export const metadata: Metadata = {
title: "AutoJobs — AI Applies to Jobs For You | Automated Job Application Platform",
description: "Stop manually applying to jobs. AutoJobs uses AI to find matching positions, rewrite your resume for each job, generate personalized cover letters, and apply automatically. Free plan available.",
keywords: ["AI job applicator", "automated job applications", "AI resume tailoring", "cover letter generator", "job search automation", "AI job hunter", "auto apply jobs"],
authors: [{ name: "AutoJobs" }],
creator: "AutoJobs",
publisher: "HostPioneers",
robots: {
index: true,
follow: true,
googleBot: {
index: true,
follow: true,
"max-video-preview": -1,
"max-image-preview": "large",
"max-snippet": -1,
},
},
openGraph: {
type: "website",
locale: "en_US",
url: "https://hostpioneers.com/autojobs",
siteName: "AutoJobs",
title: "AutoJobs — AI Applies to Jobs For You", title: "AutoJobs — AI Applies to Jobs For You",
description: "Upload your resume, set your preferences, and let AI find and apply to jobs automatically.", description: "Stop manually applying to jobs. AI finds, customizes, and applies for you automatically.",
images: [
{
url: "https://hostpioneers.com/autojobs/og-image.png",
width: 1200,
height: 630,
alt: "AutoJobs - AI Job Application Automation"
}
]
},
twitter: {
card: "summary_large_image",
title: "AutoJobs — AI Applies to Jobs For You",
description: "Stop manually applying to jobs. AI finds, customizes, and applies for you automatically.",
images: ["https://hostpioneers.com/autojobs/og-image.png"],
creator: "@AutoJobs"
},
alternates: {
canonical: "https://hostpioneers.com/autojobs"
},
icons: { icons: {
icon: "data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🤖</text></svg>" icon: "data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🤖</text></svg>"
} }
+193 -70
View File
@@ -4,6 +4,7 @@ import Link from "next/link"
const privatePlans = [ const privatePlans = [
{ {
id: "free",
name: "Free", name: "Free",
price: "$0", price: "$0",
period: "forever", period: "forever",
@@ -11,11 +12,12 @@ const privatePlans = [
coverLetters: "5", coverLetters: "5",
badge: "", badge: "",
highlight: false, highlight: false,
features: ["5 AI job applications/month", "5 AI resume customizations", "5 AI cover letters/month", "Application tracker"], features: ["5 AI applications/month", "AI resume tailoring", "AI cover letters", "Application tracker"],
cta: "Get Started", cta: "Get Started",
ctaStyle: "bg-white/10 hover:bg-white/20" ctaStyle: "bg-white/10 hover:bg-white/20"
}, },
{ {
id: "starter",
name: "Starter", name: "Starter",
price: "$29", price: "$29",
period: "/mo", period: "/mo",
@@ -23,11 +25,12 @@ const privatePlans = [
coverLetters: "20", coverLetters: "20",
badge: "", badge: "",
highlight: false, highlight: false,
features: ["20 AI job applications/month", "20 AI resume customizations", "20 AI cover letters/month", "Add your own API keys"], features: ["20 AI applications/month", "AI resume tailoring", "AI cover letters", "Add your own API keys"],
cta: "Start Now", cta: "Start Now",
ctaStyle: "bg-blue-500 hover:bg-blue-600" ctaStyle: "bg-blue-500 hover:bg-blue-600"
}, },
{ {
id: "pro",
name: "Pro", name: "Pro",
price: "$69", price: "$69",
period: "/mo", period: "/mo",
@@ -35,11 +38,12 @@ const privatePlans = [
coverLetters: "100", coverLetters: "100",
badge: "Most Popular", badge: "Most Popular",
highlight: true, highlight: true,
features: ["100 AI job applications/month", "100 AI resume customizations", "100 AI cover letters/month", "LinkedIn resume import", "Add your own API keys", "Priority support"], features: ["100 AI applications/month", "AI resume tailoring", "AI cover letters", "LinkedIn import", "Add your own API keys", "Priority support"],
cta: "Go Pro", cta: "Go Pro",
ctaStyle: "bg-blue-500 hover:bg-blue-600" ctaStyle: "bg-blue-500 hover:bg-blue-600"
}, },
{ {
id: "ultra",
name: "Ultra", name: "Ultra",
price: "$149", price: "$149",
period: "/mo", period: "/mo",
@@ -47,11 +51,12 @@ const privatePlans = [
coverLetters: "200", coverLetters: "200",
badge: "", badge: "",
highlight: false, highlight: false,
features: ["200 AI job applications/month", "200 AI resume customizations", "200 AI cover letters/month", "LinkedIn resume import", "Add your own API keys", "SMS notifications"], features: ["200 AI applications/month", "AI resume tailoring", "AI cover letters", "LinkedIn import", "Add your own API keys", "SMS notifications"],
cta: "Go Ultra", cta: "Go Ultra",
ctaStyle: "bg-slate-600 hover:bg-slate-500" ctaStyle: "bg-slate-600 hover:bg-slate-500"
}, },
{ {
id: "unlimited",
name: "Unlimited", name: "Unlimited",
price: "$199", price: "$199",
period: "/mo", period: "/mo",
@@ -59,7 +64,7 @@ const privatePlans = [
coverLetters: "Unlimited", coverLetters: "Unlimited",
badge: "Best Value", badge: "Best Value",
highlight: false, highlight: false,
features: ["Unlimited AI job applications", "Unlimited AI resume customizations", "Unlimited AI cover letters", "LinkedIn resume import", "Add your own API keys", "24/7 priority support"], features: ["Unlimited AI applications", "AI resume tailoring", "AI cover letters", "LinkedIn import", "Add your own API keys", "24/7 priority support"],
cta: "Go Unlimited", cta: "Go Unlimited",
ctaStyle: "bg-green-600 hover:bg-green-500" ctaStyle: "bg-green-600 hover:bg-green-500"
}, },
@@ -67,6 +72,7 @@ const privatePlans = [
const agencyPlans = [ const agencyPlans = [
{ {
id: "agency_starter",
name: "Starter", name: "Starter",
price: "$555", price: "$555",
period: "/mo", period: "/mo",
@@ -74,11 +80,12 @@ const agencyPlans = [
clients: "10", clients: "10",
badge: "", badge: "",
highlight: false, highlight: false,
features: ["1,000 job submissions/month", "Up to 10 client profiles", "AI resume tailoring", "White-label dashboard"], features: ["1,000 submissions/month", "10 client profiles", "AI resume tailoring", "White-label dashboard"],
cta: "Start Agency", cta: "Start Agency",
ctaStyle: "bg-purple-600 hover:bg-purple-500" ctaStyle: "bg-purple-600 hover:bg-purple-500"
}, },
{ {
id: "agency_growth",
name: "Growth", name: "Growth",
price: "$999", price: "$999",
period: "/mo", period: "/mo",
@@ -86,11 +93,12 @@ const agencyPlans = [
clients: "50", clients: "50",
badge: "Most Popular", badge: "Most Popular",
highlight: true, highlight: true,
features: ["3,000 job submissions/month", "Up to 50 client profiles", "AI resume tailoring", "White-label dashboard", "Priority support"], features: ["3,000 submissions/month", "50 client profiles", "AI resume tailoring", "White-label dashboard", "Priority support"],
cta: "Grow Agency", cta: "Grow Agency",
ctaStyle: "bg-purple-600 hover:bg-purple-500" ctaStyle: "bg-purple-600 hover:bg-purple-500"
}, },
{ {
id: "agency_scale",
name: "Scale", name: "Scale",
price: "$1,499", price: "$1,499",
period: "/mo", period: "/mo",
@@ -98,11 +106,12 @@ const agencyPlans = [
clients: "150", clients: "150",
badge: "", badge: "",
highlight: false, highlight: false,
features: ["5,000 job submissions/month", "Up to 150 client profiles", "AI resume tailoring", "White-label dashboard", "Dedicated account manager"], features: ["5,000 submissions/month", "150 client profiles", "AI resume tailoring", "White-label dashboard", "Dedicated manager"],
cta: "Scale Up", cta: "Scale Up",
ctaStyle: "bg-slate-600 hover:bg-slate-500" ctaStyle: "bg-slate-600 hover:bg-slate-500"
}, },
{ {
id: "agency_pro",
name: "Pro", name: "Pro",
price: "$3,699", price: "$3,699",
period: "/mo", period: "/mo",
@@ -110,11 +119,12 @@ const agencyPlans = [
clients: "500", clients: "500",
badge: "Best Value", badge: "Best Value",
highlight: false, highlight: false,
features: ["10,000 job submissions/month", "Up to 500 client profiles", "AI resume tailoring", "White-label dashboard", "Dedicated account manager", "Custom integrations"], features: ["10,000 submissions/month", "500 client profiles", "AI resume tailoring", "White-label dashboard", "Custom integrations"],
cta: "Go Pro", cta: "Go Pro",
ctaStyle: "bg-slate-600 hover:bg-slate-500" ctaStyle: "bg-slate-600 hover:bg-slate-500"
}, },
{ {
id: "agency_enterprise",
name: "Enterprise", name: "Enterprise",
price: "Custom", price: "Custom",
period: "", period: "",
@@ -122,7 +132,7 @@ const agencyPlans = [
clients: "Unlimited", clients: "Unlimited",
badge: "", badge: "",
highlight: false, highlight: false,
features: ["Unlimited job submissions", "Unlimited client profiles", "AI resume tailoring", "White-label dashboard", "Dedicated account manager", "Custom integrations", "SLA guarantee"], features: ["Unlimited submissions", "Unlimited clients", "AI resume tailoring", "White-label dashboard", "Dedicated manager", "SLA guarantee"],
cta: "Contact Us", cta: "Contact Us",
ctaStyle: "bg-slate-600 hover:bg-slate-500" ctaStyle: "bg-slate-600 hover:bg-slate-500"
}, },
@@ -137,35 +147,35 @@ function PlanCard({ plan, type }: { plan: any, type: string }) {
const badgeBg = type === "private" ? "bg-blue-500" : "bg-purple-500" const badgeBg = type === "private" ? "bg-blue-500" : "bg-purple-500"
return ( return (
<div className={`rounded-2xl p-5 border flex flex-col relative ${plan.highlight ? highlightBg : "bg-slate-700/50 border-slate-600"}`}> <div className={`rounded-2xl p-4 border flex flex-col relative h-full ${plan.highlight ? highlightBg : "bg-slate-700/50 border-slate-600"}`}>
{plan.badge && ( {plan.badge && (
<div className={`absolute -top-3 left-1/2 -translate-x-1/2 z-10`}> <div className="absolute -top-2.5 left-1/2 -translate-x-1/2 z-10">
<span className={`px-3 py-1 ${badgeBg} text-white text-xs font-bold rounded-full whitespace-nowrap`}>{plan.badge}</span> <span className={`px-2.5 py-0.5 ${badgeBg} text-white text-[10px] font-bold rounded-full whitespace-nowrap`}>{plan.badge}</span>
</div> </div>
)} )}
<div className="text-center mb-3"> <div className="text-center mb-2">
<div className="text-sm text-slate-400 font-medium mb-1">{plan.name}</div> <div className="text-xs text-slate-400 font-medium mb-0.5">{plan.name}</div>
<div className="flex items-baseline justify-center gap-1 mb-1"> <div className="flex items-baseline justify-center gap-0.5">
<span className="text-2xl font-bold text-white">{plan.price}</span> <span className="text-xl font-bold text-white">{plan.price}</span>
<span className="text-slate-400 text-xs">{plan.period}</span> <span className="text-slate-400 text-[10px]">{plan.period}</span>
</div> </div>
<div className="text-xs text-blue-400/80"> <div className="text-[10px] text-blue-400/80 mt-0.5">
{type === "private" {type === "private"
? `${plan.apps} apps • ${plan.coverLetters} letters` ? `${plan.apps} apps • ${plan.coverLetters} letters`
: `${plan.submissions} submissions • ${plan.clients} clients` : `${plan.submissions} subs • ${plan.clients} clients`
} }
</div> </div>
</div> </div>
<ul className="space-y-1.5 mb-4 flex-grow"> <ul className="space-y-1 mb-3 flex-grow">
{plan.features.map((f: string) => ( {plan.features.map((f: string) => (
<li key={f} className="text-slate-300 text-xs flex items-start gap-2"> <li key={f} className="text-slate-300 text-[10px] flex items-start gap-1.5">
<span className={checkColor}></span> {f} <span className={`${checkColor} flex-shrink-0`}></span> {f}
</li> </li>
))} ))}
</ul> </ul>
<Link <Link
href={`/autojobs/signup?type=${type}`} href={`/autojobs/signup?plan=${plan.id}&type=${type}`}
className={`block text-center px-4 py-2.5 rounded-lg font-medium text-white text-sm transition mt-auto ${plan.ctaStyle}`} className={`block text-center px-3 py-2 rounded-lg font-medium text-white text-xs transition mt-auto ${plan.ctaStyle}`}
> >
{plan.cta} {plan.cta}
</Link> </Link>
@@ -173,19 +183,74 @@ function PlanCard({ plan, type }: { plan: any, type: string }) {
) )
} }
// JSON-LD Structured Data for SEO
const jsonLd = {
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"name": "AutoJobs",
"alternateName": "AutoJobs AI",
"url": "https://hostpioneers.com/autojobs",
"description": "AI-powered job application automation platform. AI finds matching jobs, rewrites resumes, generates cover letters, and applies automatically.",
"applicationCategory": "BusinessApplication",
"operatingSystem": "Web",
"offers": {
"@type": "AggregateOffer",
"url": "https://hostpioneers.com/autojobs",
"priceCurrency": "USD",
"lowPrice": "0",
"highPrice": "3699",
"offerCount": "9"
},
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "4.8",
"ratingCount": "127"
},
"provider": {
"@type": "Organization",
"name": "HostPioneers",
"url": "https://hostpioneers.com"
}
}
const privatePlansJsonLd = {
"@context": "https://schema.org",
"@type": "ItemList",
"name": "AutoJobs Private Plans",
"itemListElement": privatePlans.map((plan, index) => ({
"@type": "Offer",
"position": index + 1,
"name": plan.name,
"price": plan.price.replace("$", ""),
"priceCurrency": "USD",
"description": plan.features.join(", "),
"url": `https://hostpioneers.com/autojobs/signup?plan=${plan.id}&type=private`
}))
}
export default function LandingPage() { export default function LandingPage() {
const [activeTab, setActiveTab] = useState<"private" | "agency">("private") const [activeTab, setActiveTab] = useState<"private" | "agency">("private")
return ( return (
<div className="min-h-screen bg-gradient-to-br from-slate-900 via-blue-950 to-slate-900"> <div className="min-h-screen bg-gradient-to-br from-slate-900 via-blue-950 to-slate-900">
{/* SEO JSON-LD */}
<script
type="application/ld+json"
dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
/>
<script
type="application/ld+json"
dangerouslySetInnerHTML={{ __html: JSON.stringify(privatePlansJsonLd) }}
/>
{/* Nav */} {/* Nav */}
<nav className="flex justify-between items-center px-8 py-6 max-w-6xl mx-auto"> <nav className="flex justify-between items-center px-6 py-5 max-w-6xl mx-auto" role="navigation" aria-label="Main navigation">
<div className="text-2xl font-bold text-white"> <div className="text-2xl font-bold text-white">
Auto<span className="text-blue-400">Jobs</span> Auto<span className="text-blue-400">Jobs</span>
</div> </div>
<div className="flex gap-4 items-center"> <div className="flex gap-4 items-center">
<button className="text-slate-300 hover:text-white transition flex items-center gap-2 text-sm"> <button className="text-slate-300 hover:text-white transition flex items-center gap-2 text-sm">
<svg className="w-4 h-4" fill="currentColor" viewBox="0 0 24 24"> <svg className="w-4 h-4" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14m-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93h2.79M6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37h2.77z"/> <path d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14m-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93h2.79M6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37h2.77z"/>
</svg> </svg>
Login with LinkedIn Login with LinkedIn
@@ -197,65 +262,67 @@ export default function LandingPage() {
</nav> </nav>
{/* Hero */} {/* Hero */}
<section className="py-16 px-6 text-center"> <header className="py-14 px-6 text-center">
<div className="max-w-4xl mx-auto"> <div className="max-w-4xl mx-auto">
<div className="inline-block px-4 py-1.5 rounded-full bg-blue-500/20 border border-blue-500/30 text-blue-300 text-sm mb-6"> <div className="inline-block px-4 py-1.5 rounded-full bg-blue-500/20 border border-blue-500/30 text-blue-300 text-sm mb-5">
AI-Powered Job Application Automation AI-Powered Job Application Automation
</div> </div>
<h1 className="text-4xl md:text-5xl font-bold text-white mb-6 leading-tight"> <h1 className="text-4xl md:text-5xl font-bold text-white mb-5 leading-tight">
Stop Manually Applying. Stop Manually Applying.
<br /> <br />
<span className="text-blue-400">Let AI Handle It.</span> <span className="text-blue-400">Let AI Handle It.</span>
</h1> </h1>
<p className="text-lg text-slate-300 mb-8 max-w-2xl mx-auto"> <p className="text-lg text-slate-300 mb-7 max-w-2xl mx-auto">
Upload your resume. Connect LinkedIn. AI finds matching jobs, rewrites your resume + cover letter for each one, and applies automatically. Upload your resume. Connect LinkedIn. AI finds matching jobs, rewrites your resume + cover letter for each one, and applies automatically while you sleep.
</p> </p>
<div className="flex flex-col sm:flex-row gap-3 justify-center"> <div className="flex flex-col sm:flex-row gap-3 justify-center">
<Link <Link
href="/autojobs/signup" href="/autojobs/signup?plan=free"
className="px-8 py-3 bg-blue-500 hover:bg-blue-600 text-white rounded-xl font-semibold transition shadow-lg shadow-blue-500/25" className="px-8 py-3 bg-blue-500 hover:bg-blue-600 text-white rounded-xl font-semibold transition shadow-lg shadow-blue-500/25"
> >
Start Free 5 Applications Start Free 5 Applications
</Link> </Link>
<button className="px-8 py-3 bg-white/10 hover:bg-white/20 text-white rounded-xl font-semibold border border-white/20 transition flex items-center justify-center gap-2"> <button className="px-8 py-3 bg-white/10 hover:bg-white/20 text-white rounded-xl font-semibold border border-white/20 transition flex items-center justify-center gap-2">
<svg className="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <svg className="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14m-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93h2.79M6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37h2.77z"/> <path d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14m-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93h2.79M6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37h2.77z"/>
</svg> </svg>
Sign up with LinkedIn Sign up with LinkedIn
</button> </button>
</div> </div>
</div> </div>
</section> </header>
{/* How It Works */} {/* How It Works */}
<section className="py-12 px-6 bg-slate-800/40"> <section className="py-10 px-6 bg-slate-800/40" aria-labelledby="how-it-works-heading">
<div className="max-w-5xl mx-auto"> <div className="max-w-5xl mx-auto">
<h2 className="text-2xl font-bold text-white text-center mb-8">How It Works</h2> <h2 id="how-it-works-heading" className="text-2xl font-bold text-white text-center mb-6">How It Works</h2>
<div className="grid md:grid-cols-3 gap-6"> <div className="grid md:grid-cols-3 gap-5">
{[ {[
{ step: "01", title: "Create Profile", desc: "Upload resume. Connect LinkedIn. Set job preferences." }, { step: "01", title: "Create Profile", desc: "Upload resume. Connect LinkedIn. Set job preferences — keywords, location, salary range." },
{ step: "02", title: "AI Customizes", desc: "AI rewrites your resume + cover letter for each job." }, { step: "02", title: "AI Customizes", desc: "We search 100+ job boards. For each match, AI rewrites your resume and writes a personalized cover letter." },
{ step: "03", title: "Apply & Track", desc: "Apply in one click. Track every application status." } { step: "03", title: "Apply & Track", desc: "Apply with one click or let AI apply automatically. Track every application status in your dashboard." }
].map((item) => ( ].map((item) => (
<div key={item.step} className="bg-slate-700/50 rounded-xl p-6 border border-slate-600 text-center"> <article key={item.step} className="bg-slate-700/50 rounded-xl p-5 border border-slate-600 text-center">
<div className="text-4xl font-bold text-blue-500/20 mb-3">{item.step}</div> <div className="text-4xl font-bold text-blue-500/20 mb-2">{item.step}</div>
<h3 className="text-lg font-semibold text-white mb-2">{item.title}</h3> <h3 className="text-lg font-semibold text-white mb-1">{item.title}</h3>
<p className="text-slate-400 text-sm">{item.desc}</p> <p className="text-slate-400 text-sm">{item.desc}</p>
</div> </article>
))} ))}
</div> </div>
</div> </div>
</section> </section>
{/* Pricing Toggle + Plans */} {/* Pricing Toggle + Plans */}
<section className="py-16 px-6"> <section className="py-14 px-6" aria-labelledby="pricing-heading">
<div className="max-w-6xl mx-auto text-center"> <div className="max-w-6xl mx-auto text-center">
<h2 className="text-3xl font-bold text-white mb-6">Choose Your Plan</h2> <h2 id="pricing-heading" className="text-3xl font-bold text-white mb-5">Choose Your Plan</h2>
{/* Toggle Switch */} {/* Toggle Switch */}
<div className="inline-flex items-center gap-0 bg-slate-800 rounded-full p-1 mb-10 border border-slate-700"> <div className="inline-flex items-center gap-0 bg-slate-800 rounded-full p-1 mb-8 border border-slate-700" role="tablist">
<button <button
onClick={() => setActiveTab("private")} onClick={() => setActiveTab("private")}
role="tab"
aria-selected={activeTab === "private"}
className={`px-6 py-2.5 rounded-full font-semibold text-sm transition-all ${ className={`px-6 py-2.5 rounded-full font-semibold text-sm transition-all ${
activeTab === "private" activeTab === "private"
? "bg-blue-500 text-white shadow-lg" ? "bg-blue-500 text-white shadow-lg"
@@ -266,6 +333,8 @@ export default function LandingPage() {
</button> </button>
<button <button
onClick={() => setActiveTab("agency")} onClick={() => setActiveTab("agency")}
role="tab"
aria-selected={activeTab === "agency"}
className={`px-6 py-2.5 rounded-full font-semibold text-sm transition-all ${ className={`px-6 py-2.5 rounded-full font-semibold text-sm transition-all ${
activeTab === "agency" activeTab === "agency"
? "bg-purple-500 text-white shadow-lg" ? "bg-purple-500 text-white shadow-lg"
@@ -278,58 +347,112 @@ export default function LandingPage() {
{/* Private Plans */} {/* Private Plans */}
{activeTab === "private" && ( {activeTab === "private" && (
<div> <div role="tabpanel" aria-label="Job Seeker Plans">
<p className="text-slate-400 mb-6 text-sm">Every plan includes AI resume tailoring + AI cover letter generation</p> <p className="text-slate-400 mb-5 text-sm">Every plan includes AI resume tailoring + AI cover letter generation</p>
<div className="grid grid-cols-2 md:grid-cols-5 gap-4 max-w-5xl mx-auto items-stretch"> <div className="grid grid-cols-2 md:grid-cols-5 gap-3 max-w-5xl mx-auto items-stretch">
{privatePlans.map((plan) => ( {privatePlans.map((plan) => (
<PlanCard key={plan.name} plan={plan} type="private" /> <PlanCard key={plan.id} plan={plan} type="private" />
))} ))}
</div> </div>
</div> </div>
)} )}
{/* Agency Plans */} {/* Agency Plans - 5 columns */}
{activeTab === "agency" && ( {activeTab === "agency" && (
<div> <div role="tabpanel" aria-label="Recruiting Agency Plans">
<p className="text-slate-400 mb-6 text-sm">Manage multiple clients. Hard caps no unlimited.</p> <p className="text-slate-400 mb-5 text-sm">Manage multiple clients. Hard caps no unlimited.</p>
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 max-w-5xl mx-auto items-stretch"> <div className="grid grid-cols-2 md:grid-cols-5 gap-3 max-w-5xl mx-auto items-stretch">
{agencyPlans.map((plan) => ( {agencyPlans.map((plan) => (
<PlanCard key={plan.name} plan={plan} type="agency" /> <PlanCard key={plan.id} plan={plan} type="agency" />
))} ))}
</div> </div>
<p className="text-slate-500 text-sm mt-4">All plans have hard submission caps. No unlimited access for agencies.</p> <p className="text-slate-500 text-xs mt-3">All plans have hard submission caps. No unlimited access for agencies.</p>
</div> </div>
)} )}
</div> </div>
</section> </section>
{/* Features */} {/* Features */}
<section className="py-16 px-6 bg-slate-800/40"> <section className="py-14 px-6 bg-slate-800/40" aria-labelledby="features-heading">
<div className="max-w-5xl mx-auto"> <div className="max-w-5xl mx-auto">
<h2 className="text-2xl font-bold text-white text-center mb-8">Everything You Need</h2> <h2 id="features-heading" className="text-2xl font-bold text-white text-center mb-6">Everything You Need</h2>
<div className="grid md:grid-cols-3 gap-4"> <div className="grid md:grid-cols-3 gap-4">
{[ {[
{ icon: "🎯", title: "AI Resume Tailoring", desc: "Every resume rewritten to match job description keywords" }, { icon: "🎯", title: "AI Resume Tailoring", desc: "Every resume rewritten to match job description keywords for maximum relevance" },
{ icon: "✉️", title: "AI Cover Letters", desc: "Personalized cover letter for each company" }, { icon: "✉️", title: "AI Cover Letters", desc: "Personalized cover letter generated for each company and position" },
{ icon: "🔍", title: "Multi-Source Search", desc: "Jooble, JSearch aggregated and deduplicated" }, { icon: "🔍", title: "Multi-Source Search", desc: "Jooble, JSearch aggregated and deduplicated — no duplicate applications" },
{ icon: "📊", title: "Application Tracker", desc: "Dashboard tracks status from applied to offer" }, { icon: "📊", title: "Application Tracker", desc: "Dashboard tracks status from applied to offer stage" },
{ icon: "🔑", title: "Your Own API Keys", desc: "You control your data and spending" }, { icon: "🔑", title: "Your Own API Keys", desc: "You control your data and spending — bring your own keys" },
{ icon: "💼", title: "LinkedIn Import", desc: "Import your saved LinkedIn resumes automatically" }, { icon: "💼", title: "LinkedIn Import", desc: "Import your saved LinkedIn resumes and profile automatically" },
].map((f) => ( ].map((f) => (
<div key={f.title} className="bg-slate-700/50 rounded-xl p-4 border border-slate-600"> <article key={f.title} className="bg-slate-700/50 rounded-xl p-4 border border-slate-600">
<div className="text-xl mb-2">{f.icon}</div> <div className="text-xl mb-1.5" aria-hidden="true">{f.icon}</div>
<h3 className="font-semibold text-white mb-1">{f.title}</h3> <h3 className="font-semibold text-white mb-0.5">{f.title}</h3>
<p className="text-slate-400 text-sm">{f.desc}</p> <p className="text-slate-400 text-sm">{f.desc}</p>
</div> </article>
))} ))}
</div> </div>
</div> </div>
</section> </section>
{/* FAQ Schema */}
<section className="py-14 px-6" aria-labelledby="faq-heading">
<div className="max-w-3xl mx-auto">
<h2 id="faq-heading" className="text-2xl font-bold text-white text-center mb-6">Frequently Asked Questions</h2>
<div className="space-y-4">
{[
{ q: "How does AI resume tailoring work?", a: "Our AI analyzes the job description and rewrites your resume to highlight the skills and experience most relevant to that specific position, increasing your chances of getting noticed." },
{ q: "What job boards does AutoJobs search?", a: "We search across multiple job boards including Jooble, JSearch, and other aggregators, then deduplicate results so you never apply to the same job twice." },
{ q: "Can I use my own API keys?", a: "Yes! On Starter plans and above, you can add your own API keys for AI services, giving you more control over your data and spending." },
{ q: "What happens when I hit my monthly limit?", a: "Your applications are paused until your next billing cycle. You can upgrade at any time for higher limits." },
].map((faq, i) => (
<details key={i} className="bg-slate-700/50 rounded-xl border border-slate-600 p-4 group">
<summary className="font-semibold text-white cursor-pointer list-none flex justify-between items-center">
{faq.q}
<span className="text-blue-400 group-open:rotate-180 transition-transform"></span>
</summary>
<p className="text-slate-400 text-sm mt-2">{faq.a}</p>
</details>
))}
</div>
</div>
<script
type="application/ld+json"
dangerouslySetInnerHTML={{
__html: JSON.stringify({
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
{
"@type": "Question",
"name": "How does AI resume tailoring work?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Our AI analyzes the job description and rewrites your resume to highlight the skills and experience most relevant to that specific position."
}
},
{
"@type": "Question",
"name": "What job boards does AutoJobs search?",
"acceptedAnswer": {
"@type": "Answer",
"text": "We search across multiple job boards including Jooble, JSearch, and other aggregators, then deduplicate results."
}
}
]
})
}}
/>
</section>
{/* Footer */} {/* Footer */}
<footer className="py-6 px-6 border-t border-slate-700"> <footer className="py-6 px-6 border-t border-slate-700">
<div className="max-w-5xl mx-auto text-center text-slate-500 text-sm"> <div className="max-w-5xl mx-auto text-center text-slate-500 text-sm">
<p>© 2026 AutoJobs Built on <a href="https://hostpioneers.com" className="text-blue-400 hover:underline">HostPioneers</a> infrastructure</p> <p>© 2026 AutoJobs Built on <a href="https://hostpioneers.com" className="text-blue-400 hover:underline">HostPioneers</a> infrastructure</p>
<nav className="mt-3 flex justify-center gap-4 text-xs" aria-label="Footer navigation">
<a href="/autojobs/privacy" className="hover:text-white transition">Privacy Policy</a>
<a href="/autojobs/terms" className="hover:text-white transition">Terms of Service</a>
</nav>
</div> </div>
</footer> </footer>
</div> </div>
+14
View File
@@ -0,0 +1,14 @@
User-agent: *
Allow: /autojobs/
Allow: /autojobs/signup
Allow: /autojobs/login
User-agent: GPTBot
Disallow: /autojobs/dashboard
Disallow: /autojobs/api/
User-agent: CCBot
Disallow: /autojobs/dashboard
Disallow: /autojobs/api/
Sitemap: https://hostpioneers.com/autojobs/sitemap.xml
+21
View File
@@ -0,0 +1,21 @@
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://hostpioneers.com/autojobs</loc>
<lastmod>2026-04-13</lastmod>
<changefreq>weekly</changefreq>
<priority>1.0</priority>
</url>
<url>
<loc>https://hostpioneers.com/autojobs/signup</loc>
<lastmod>2026-04-13</lastmod>
<changefreq>monthly</changefreq>
<priority>0.8</priority>
</url>
<url>
<loc>https://hostpioneers.com/autojobs/login</loc>
<lastmod>2026-04-13</lastmod>
<changefreq>monthly</changefreq>
<priority>0.8</priority>
</url>
</urlset>