Spaces:

Tauseef080
/

wd

Running

App Files Files Community

wd / index.html

Tauseef080

Add 2 files

0b5aed2 verified 6 months ago

raw

history blame contribute delete

14.1 kB

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
	<title>ApexSEO - 100% Free AI-Powered SEO Suite</title>
	<script src="https://cdn.tailwindcss.com"></script>
	<script>
	tailwind.config = {
	theme: {
	extend: {
	fontFamily: {
	sans: ['Inter', 'sans-serif']
	},
	animation: {
	fade: 'fadeIn 0.3s ease-in-out',
	},
	keyframes: {
	fadeIn: {
	'0%': { opacity: 0, transform: 'translateY(10px)' },
	'100%': { opacity: 1, transform: 'translateY(0)' },
	}
	}
	}
	}
	};
	</script>
	<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
	</head>
	<body class="bg-gray-50 text-gray-800 font-sans">

	<!-- Header -->
	<header class="bg-white shadow-sm fixed w-full z-10">
	<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 flex justify-between items-center">
	<h1 class="text-2xl font-bold text-indigo-600">ApexSEO</h1>
	<nav class="space-x-6">
	<a href="#features" class="text-gray-700 hover:text-indigo-600 font-medium">Features</a>
	<a href="#tools" class="text-gray-700 hover:text-indigo-600 font-medium">Tools</a>
	<a href="#pricing" class="text-gray-700 hover:text-indigo-600 font-medium">Pricing</a>
	</nav>
	</div>
	</header>

	<!-- Hero Section -->
	<section class="bg-indigo-700 text-white pt-32 pb-20">
	<div class="max-w-4xl mx-auto text-center px-6">
	<h2 class="text-5xl font-extrabold mb-6 leading-tight">The Ultimate Free AI-Powered SEO Suite</h2>
	<p class="text-lg mb-8">ApexSEO offers 500+ powerful SEO tools, real-time data, and AI insights — all 100% free. No login, no limits, forever.</p>
	<a href="#tools" class="inline-block px-8 py-4 bg-white text-indigo-700 rounded-lg font-semibold shadow hover:bg-indigo-50 transition">Explore Tools</a>
	</div>
	</section>

	<!-- Core Features -->
	<section id="features" class="py-20 bg-white">
	<div class="max-w-6xl mx-auto px-6">
	<h3 class="text-3xl font-bold text-center mb-12">Why ApexSEO Stands Out</h3>
	<div class="grid md:grid-cols-3 gap-10">
	<div class="bg-gray-50 p-8 rounded-xl shadow hover:shadow-xl transition">
	<h4 class="text-xl font-semibold mb-3">🧠 AI-Driven Insights</h4>
	<p>Real-time analysis using multiple AI models for smarter content, backlink, and keyword recommendations — all free.</p>
	</div>
	<div class="bg-gray-50 p-8 rounded-xl shadow hover:shadow-xl transition">
	<h4 class="text-xl font-semibold mb-3">🧰 500+ Free Tools</h4>
	<p>From technical SEO to local listings, ApexSEO offers 2x more tools than competitors — and all are 100% free to use.</p>
	</div>
	<div class="bg-gray-50 p-8 rounded-xl shadow hover:shadow-xl transition">
	<h4 class="text-xl font-semibold mb-3">🚀 No Restrictions</h4>
	<p>No login required, no usage caps. ApexSEO is designed to be fast, open, and accessible to everyone — forever.</p>
	</div>
	</div>
	</div>
	</section>

	<!-- Competitor Analysis -->
	<section class="py-20 bg-gray-100">
	<div class="max-w-6xl mx-auto px-6">
	<h3 class="text-3xl font-bold text-center mb-10">ApexSEO vs. Paid SEO Tools</h3>
	<div class="grid md:grid-cols-2 gap-10">
	<div class="bg-white p-6 rounded-lg shadow">
	<h4 class="text-xl font-semibold mb-3 text-red-600">Why Paid Tools Fall Short</h4>
	<ul class="list-disc ml-6 space-y-2 text-gray-700">
	<li>Expensive monthly subscriptions</li>
	<li>Usage limits and API caps</li>
	<li>Outdated data and slow updates</li>
	<li>Clunky interfaces and poor UX</li>
	</ul>
	</div>
	<div class="bg-white p-6 rounded-lg shadow">
	<h4 class="text-xl font-semibold mb-3 text-green-600">ApexSEO Wins with</h4>
	<ul class="list-disc ml-6 space-y-2 text-gray-700">
	<li>100% free, forever</li>
	<li>Unlimited usage, no login required</li>
	<li>Real-time data and AI insights</li>
	<li>Modern UI with intuitive workflows</li>
	</ul>
	</div>
	</div>
	</div>
	</section>

	<!-- Tool Library -->
	<section id="tools" class="py-20 bg-white">
	<div class="max-w-6xl mx-auto px-6">
	<h3 class="text-3xl font-bold text-center mb-12">ApexSEO Tool Library</h3>

	<!-- Keyword Intelligence Suite -->
	<div class="mb-8">
	<h4 class="text-xl font-semibold mb-4 flex items-center text-indigo-600">
	<span class="mr-2">🔍</span> Keyword Intelligence Suite
	</h4>
	<div class="space-y-3">
	<div class="border rounded-lg p-4 bg-gray-50 cursor-pointer hover:bg-gray-100 transition" onclick="openTool('ki1')">
	<span class="font-medium">Keyword Intent Analyzer</span>
	</div>
	<div class="border rounded-lg p-4 bg-gray-50 cursor-pointer hover:bg-gray-100 transition" onclick="openTool('ki2')">
	<span class="font-medium">Search Forecast Engine</span>
	</div>
	<div class="border rounded-lg p-4 bg-gray-50 cursor-pointer hover:bg-gray-100 transition" onclick="openTool('ki3')">
	<span class="font-medium">Keyword Gap Analyzer</span>
	</div>
	</div>
	</div>

	<!-- Content Optimization -->
	<div class="mb-8">
	<h4 class="text-xl font-semibold mb-4 flex items-center text-indigo-600">
	<span class="mr-2">✍️</span> Content Optimization & AI Authoring
	</h4>
	<div class="space-y-3">
	<div class="border rounded-lg p-4 bg-gray-50 cursor-pointer hover:bg-gray-100 transition" onclick="openTool('co1')">
	<span class="font-medium">AI Content Writer</span>
	</div>
	<div class="border rounded-lg p-4 bg-gray-50 cursor-pointer hover:bg-gray-100 transition" onclick="openTool('co2')">
	<span class="font-medium">SEO Content Grader</span>
	</div>
	<div class="border rounded-lg p-4 bg-gray-50 cursor-pointer hover:bg-gray-100 transition" onclick="openTool('co3')">
	<span class="font-medium">Plagiarism Checker</span>
	</div>
	</div>
	</div>

	<!-- Technical SEO -->
	<div class="mb-8">
	<h4 class="text-xl font-semibold mb-4 flex items-center text-indigo-600">
	<span class="mr-2">🛠️</span> Technical SEO & Site Health
	</h4>
	<div class="space-y-3">
	<div class="border rounded-lg p-4 bg-gray-50 cursor-pointer hover:bg-gray-100 transition" onclick="openTool('ts1')">
	<span class="font-medium">AI-Powered Site Crawl Audit</span>
	</div>
	<div class="border rounded-lg p-4 bg-gray-50 cursor-pointer hover:bg-gray-100 transition" onclick="openTool('ts2')">
	<span class="font-medium">Schema Markup Generator</span>
	</div>
	<div class="border rounded-lg p-4 bg-gray-50 cursor-pointer hover:bg-gray-100 transition" onclick="openTool('ts3')">
	<span class="font-medium">Mobile Usability Checker</span>
	</div>
	</div>
	</div>
	</div>
	</section>

	<!-- Modals -->
	<div id="toolModal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
	<div class="bg-white rounded-lg shadow-xl w-full max-w-lg max-h-[90vh] overflow-auto">
	<div class="p-6">
	<div class="flex justify-between items-center mb-4">
	<h4 id="modalTitle" class="text-xl font-semibold"></h4>
	<button onclick="closeTool()" class="text-gray-500 hover:text-gray-700">×</button>
	</div>
	<div id="toolContent" class="space-y-4">
	<!-- Tool content will be injected here -->
	</div>
	</div>
	</div>
	</div>

	<!-- Monetization Strategy -->
	<section id="pricing" class="py-20 bg-gray-100">
	<div class="max-w-6xl mx-auto px-6">
	<h3 class="text-3xl font-bold text-center mb-10">100% Free Forever</h3>
	<div class="bg-white p-8 rounded-lg shadow-md max-w-3xl mx-auto">
	<h4 class="text-xl font-semibold mb-4">No Tiers, No Limits</h4>
	<p class="text-gray-700 mb-6">All 500+ tools are completely free to use — no subscription, no trial, no login required. ApexSEO is built to empower every SEO professional, student, and business owner with access to cutting-edge tools without any cost.</p>
	<h4 class="text-xl font-semibold mb-3">No Hidden Tricks</h4>
	<p class="text-gray-700">We believe in open access to SEO technology. That's why there are no usage caps, no premium upgrades, and no annoying pop-ups.</p>
	</div>
	</div>
	</section>

	<!-- Footer -->
	<footer class="bg-white border-t py-6">
	<div class="max-w-6xl mx-auto px-6 text-center text-sm text-gray-500">
	© 2025 ApexSEO. All tools are 100% free and open for everyone.
	</div>
	</footer>

	<!-- JavaScript -->
	<script>
	const tools = {
	ki1: {
	title: "Keyword Intent Analyzer",
	content: `
	<input type="text" placeholder="Enter keyword..." class="w-full p-2 border rounded mb-4">
	<button class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Analyze</button>
	<div class="mt-4 p-3 bg-gray-100 rounded">Intent: Informational \| Suggested Content: Blog Post</div>
	`
	},
	ki2: {
	title: "Search Forecast Engine",
	content: `
	<input type="text" placeholder="Enter keyword..." class="w-full p-2 border rounded mb-4">
	<button class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Predict</button>
	<div class="mt-4 p-3 bg-gray-100 rounded">Trend: Rising \| Forecasted Peak: April 2025</div>
	`
	},
	ki3: {
	title: "Keyword Gap Analyzer",
	content: `
	<input type="text" placeholder="Enter competitor URL..." class="w-full p-2 border rounded mb-4">
	<button class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Find Gaps</button>
	<div class="mt-4 p-3 bg-gray-100 rounded">Top Missed Keywords: "SEO tools", "free SEO", "SEO software"</div>
	`
	},
	co1: {
	title: "AI Content Writer",
	content: `
	<textarea placeholder="Describe your content needs..." class="w-full p-2 border rounded mb-4 h-24"></textarea>
	<button class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Generate</button>
	<div class="mt-4 p-3 bg-gray-100 rounded">[Generated content placeholder]</div>
	`
	},
	co2: {
	title: "SEO Content Grader",
	content: `
	<textarea placeholder="Paste content..." class="w-full p-2 border rounded mb-4 h-24"></textarea>
	<button class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Grade</button>
	<div class="mt-4 p-3 bg-gray-100 rounded">Score: 87/100 \| Keyword Density: 1.2% \| Readability: Good</div>
	`
	},
	co3: {
	title: "Plagiarism Checker",
	content: `
	<textarea placeholder="Paste content..." class="w-full p-2 border rounded mb-4 h-24"></textarea>
	<button class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Check</button>
	<div class="mt-4 p-3 bg-gray-100 rounded">Plagiarism Score: 0% \| Originality: 100%</div>
	`
	},
	ts1: {
	title: "AI-Powered Site Crawl Audit",
	content: `
	<input type="url" placeholder="Enter website URL..." class="w-full p-2 border rounded mb-4">
	<button class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Crawl</button>
	<div class="mt-4 p-3 bg-gray-100 rounded">Pages Crawled: 45 \| Errors: 2 \| Redirects: 5</div>
	`
	},
	ts2: {
	title: "Schema Markup Generator",
	content: `
	<select class="w-full p-2 border rounded mb-4">
	<option>Article</option><option>Product</option><option>FAQ</option>
	</select>
	<button class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Generate</button>
	<div class="mt-4 p-3 bg-gray-100 rounded">{"@context": "https://schema.org", "@type": "Article", "headline": "Example"}</div>
	`
	},
	ts3: {
	title: "Mobile Usability Checker",
	content: `
	<input type="url" placeholder="Enter website URL..." class="w-full p-2 border rounded mb-4">
	<button class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Check</button>
	<div class="mt-4 p-3 bg-gray-100 rounded">Mobile Score: 92/100 \| Tap Targets: Good \| Viewport: OK</div>
	`
	}
	};

	function openTool(id) {
	const tool = tools[id];
	document.getElementById('modalTitle').innerText = tool.title;
	document.getElementById('toolContent').innerHTML = tool.content;
	document.getElementById('toolModal').classList.remove('hidden');
	}

	function closeTool() {
	document.getElementById('toolModal').classList.add('hidden');
	}
	</script>
	<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-qwensite.hf.space/logo.svg" alt="qwensite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-qwensite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >QwenSite</a> - 🧬 <a href="https://enzostvs-qwensite.hf.space?remix=Tauseef080/wd" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
	</html>