fix: improve SEO with pre-rendering and dynamic meta tags
Critical SEO improvements to fix Google Search Console indexing: ## Sitemap Updates: - Added missing Invoice Editor and What's New pages - Updated all lastmod dates to 2025-10-15 - Increased editor tools priority to 0.9 - Added organizational comments - Fixed /whats-new route (was /release-notes) ## Pre-rendering Implementation: - Added react-snap for static HTML generation - Configured to pre-render all tool pages - Solves React SPA indexing issue - Crawlers now see full HTML content ## Dynamic Meta Tags: - Added react-helmet-async for SEO management - Created reusable SEO component with: - Dynamic titles and descriptions - Open Graph tags (Facebook) - Twitter Card tags - JSON-LD structured data - Canonical URLs - Wrapped App with HelmetProvider - Added SEO to Home page ## Route Fixes: - Added /whats-new route (primary) - Kept /release-notes as fallback - Consistent routing across app ## Documentation: - Created comprehensive SEO_FIX_GUIDE.md - Step-by-step Google Search Console instructions - Troubleshooting guide - Timeline expectations - Testing procedures These changes will dramatically improve Google indexing and search visibility.
This commit is contained in:
75
src/components/SEO.js
Normal file
75
src/components/SEO.js
Normal file
@@ -0,0 +1,75 @@
|
||||
import React from 'react';
|
||||
import { Helmet } from 'react-helmet-async';
|
||||
|
||||
const SEO = ({
|
||||
title,
|
||||
description,
|
||||
keywords,
|
||||
path = '/',
|
||||
type = 'website',
|
||||
image = 'https://dewe.dev/og-image.png'
|
||||
}) => {
|
||||
const siteUrl = 'https://dewe.dev';
|
||||
const fullUrl = `${siteUrl}${path}`;
|
||||
const fullTitle = title ? `${title} | Developer Tools` : 'Developer Tools - Essential Web Developer Utilities';
|
||||
const defaultDescription = 'Free online developer tools for JSON, CSV, Base64, URL encoding, code beautification, and more. Privacy-first, no data storage, all processing in your browser.';
|
||||
const metaDescription = description || defaultDescription;
|
||||
const defaultKeywords = 'developer tools, json editor, csv converter, base64 encoder, url encoder, code beautifier, diff tool, web developer utilities, online tools';
|
||||
const metaKeywords = keywords || defaultKeywords;
|
||||
|
||||
return (
|
||||
<Helmet>
|
||||
{/* Basic Meta Tags */}
|
||||
<title>{fullTitle}</title>
|
||||
<meta name="description" content={metaDescription} />
|
||||
<meta name="keywords" content={metaKeywords} />
|
||||
<link rel="canonical" href={fullUrl} />
|
||||
|
||||
{/* Open Graph / Facebook */}
|
||||
<meta property="og:type" content={type} />
|
||||
<meta property="og:url" content={fullUrl} />
|
||||
<meta property="og:title" content={fullTitle} />
|
||||
<meta property="og:description" content={metaDescription} />
|
||||
<meta property="og:image" content={image} />
|
||||
<meta property="og:site_name" content="Developer Tools" />
|
||||
|
||||
{/* Twitter Card */}
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:url" content={fullUrl} />
|
||||
<meta name="twitter:title" content={fullTitle} />
|
||||
<meta name="twitter:description" content={metaDescription} />
|
||||
<meta name="twitter:image" content={image} />
|
||||
|
||||
{/* Additional SEO Tags */}
|
||||
<meta name="robots" content="index, follow" />
|
||||
<meta name="googlebot" content="index, follow" />
|
||||
<meta name="author" content="Developer Tools" />
|
||||
<meta name="language" content="English" />
|
||||
|
||||
{/* JSON-LD Structured Data */}
|
||||
<script type="application/ld+json">
|
||||
{JSON.stringify({
|
||||
"@context": "https://schema.org",
|
||||
"@type": "WebApplication",
|
||||
"name": fullTitle,
|
||||
"description": metaDescription,
|
||||
"url": fullUrl,
|
||||
"applicationCategory": "DeveloperApplication",
|
||||
"operatingSystem": "Any",
|
||||
"offers": {
|
||||
"@type": "Offer",
|
||||
"price": "0",
|
||||
"priceCurrency": "USD"
|
||||
},
|
||||
"provider": {
|
||||
"@type": "Organization",
|
||||
"name": "Developer Tools",
|
||||
"url": siteUrl
|
||||
}
|
||||
})}
|
||||
</script>
|
||||
</Helmet>
|
||||
);
|
||||
};
|
||||
|
||||
export default SEO;
|
||||
Reference in New Issue
Block a user