[FEAT] SEO best practices

This commit is contained in:
2025-11-26 17:20:09 +01:00
parent accea99408
commit b801cd4c99
9 changed files with 222 additions and 193 deletions

View File

@@ -17,17 +17,11 @@ const SITE_URL = 'https://spritesheetgenerator.online';
const DEFAULT_IMAGE = '/og-image.png';
export function useSEO(metadata: SEOMetaData) {
const fullTitle = metadata.title.includes(SITE_NAME)
? metadata.title
: `${metadata.title} - ${SITE_NAME}`;
const fullTitle = metadata.title.includes(SITE_NAME) ? metadata.title : `${metadata.title} - ${SITE_NAME}`;
const fullUrl = metadata.url
? `${SITE_URL}${metadata.url}`
: SITE_URL;
const fullUrl = metadata.url ? `${SITE_URL}${metadata.url}` : SITE_URL;
const imageUrl = metadata.image
? `${SITE_URL}${metadata.image}`
: `${SITE_URL}${DEFAULT_IMAGE}`;
const imageUrl = metadata.image ? `${SITE_URL}${metadata.image}` : `${SITE_URL}${DEFAULT_IMAGE}`;
const metaTags: any[] = [
// Primary Meta Tags
@@ -72,8 +66,6 @@ export function useSEO(metadata: SEOMetaData) {
useHead({
title: fullTitle,
meta: metaTags,
link: [
{ rel: 'canonical', href: fullUrl }
]
link: [{ rel: 'canonical', href: fullUrl }],
});
}

View File

@@ -24,23 +24,20 @@ export function useStructuredData() {
const schema = {
'@context': 'https://schema.org',
'@type': 'Organization',
'name': SITE_NAME,
'url': SITE_URL,
'logo': `${SITE_URL}/og-image.png`,
'description': 'Free online tool to create spritesheets for game development',
'sameAs': [
'https://gitea.adhd.sh/root/spritesheet-generator',
'https://discord.gg/JTev3nzeDa'
]
name: SITE_NAME,
url: SITE_URL,
logo: `${SITE_URL}/og-image.png`,
description: 'Free online tool to create spritesheets for game development',
sameAs: ['https://gitea.adhd.sh/root/spritesheet-generator', 'https://discord.gg/JTev3nzeDa'],
};
useHead({
script: [
{
type: 'application/ld+json',
children: JSON.stringify(schema)
}
]
children: JSON.stringify(schema),
},
],
});
};
@@ -49,23 +46,23 @@ export function useStructuredData() {
const schema = {
'@context': 'https://schema.org',
'@type': 'WebSite',
'name': SITE_NAME,
'url': SITE_URL,
'description': 'Create professional spritesheets for your game development projects',
'potentialAction': {
name: SITE_NAME,
url: SITE_URL,
description: 'Create professional spritesheets for your game development projects',
potentialAction: {
'@type': 'SearchAction',
'target': `${SITE_URL}/blog?search={search_term_string}`,
'query-input': 'required name=search_term_string'
}
target: `${SITE_URL}/blog?search={search_term_string}`,
'query-input': 'required name=search_term_string',
},
};
useHead({
script: [
{
type: 'application/ld+json',
children: JSON.stringify(schema)
}
]
children: JSON.stringify(schema),
},
],
});
};
@@ -74,36 +71,36 @@ export function useStructuredData() {
const schema = {
'@context': 'https://schema.org',
'@type': 'BlogPosting',
'headline': post.title,
'description': post.description,
'image': `${SITE_URL}${post.image}`,
'author': {
headline: post.title,
description: post.description,
image: `${SITE_URL}${post.image}`,
author: {
'@type': 'Person',
'name': post.author
name: post.author,
},
'publisher': {
publisher: {
'@type': 'Organization',
'name': SITE_NAME,
'logo': {
name: SITE_NAME,
logo: {
'@type': 'ImageObject',
'url': `${SITE_URL}/og-image.png`
}
url: `${SITE_URL}/og-image.png`,
},
},
'datePublished': post.datePublished,
'dateModified': post.dateModified || post.datePublished,
'mainEntityOfPage': {
datePublished: post.datePublished,
dateModified: post.dateModified || post.datePublished,
mainEntityOfPage: {
'@type': 'WebPage',
'@id': `${SITE_URL}${post.url}`
}
'@id': `${SITE_URL}${post.url}`,
},
};
useHead({
script: [
{
type: 'application/ld+json',
children: JSON.stringify(schema)
}
]
children: JSON.stringify(schema),
},
],
});
};
@@ -112,21 +109,21 @@ export function useStructuredData() {
const schema = {
'@context': 'https://schema.org',
'@type': 'BreadcrumbList',
'itemListElement': items.map((item, index) => ({
itemListElement: items.map((item, index) => ({
'@type': 'ListItem',
'position': index + 1,
'name': item.name,
'item': `${SITE_URL}${item.url}`
}))
position: index + 1,
name: item.name,
item: `${SITE_URL}${item.url}`,
})),
};
useHead({
script: [
{
type: 'application/ld+json',
children: JSON.stringify(schema)
}
]
children: JSON.stringify(schema),
},
],
});
};
@@ -135,30 +132,30 @@ export function useStructuredData() {
const schema = {
'@context': 'https://schema.org',
'@type': 'Blog',
'name': `${SITE_NAME} Blog`,
'description': 'Latest articles about sprite sheet generation and game development',
'url': `${SITE_URL}/blog`,
'blogPost': posts.map(post => ({
name: `${SITE_NAME} Blog`,
description: 'Latest articles about sprite sheet generation and game development',
url: `${SITE_URL}/blog`,
blogPost: posts.map(post => ({
'@type': 'BlogPosting',
'headline': post.title,
'description': post.description,
'image': `${SITE_URL}${post.image}`,
'author': {
headline: post.title,
description: post.description,
image: `${SITE_URL}${post.image}`,
author: {
'@type': 'Person',
'name': post.author
name: post.author,
},
'datePublished': post.datePublished,
'url': `${SITE_URL}${post.url}`
}))
datePublished: post.datePublished,
url: `${SITE_URL}${post.url}`,
})),
};
useHead({
script: [
{
type: 'application/ld+json',
children: JSON.stringify(schema)
}
]
children: JSON.stringify(schema),
},
],
});
};
@@ -167,6 +164,6 @@ export function useStructuredData() {
addWebSiteSchema,
addBlogPostSchema,
addBreadcrumbSchema,
addBlogListSchema
addBlogListSchema,
};
}