From e5f44a888cf835698764c2b26fa33707f94a8802 Mon Sep 17 00:00:00 2001 From: spences10 Date: Sat, 6 Jan 2024 15:22:40 +0000 Subject: [PATCH] docs: :memo: update readme --- README.md | 64 ++++++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 59 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index e2fd8c9f..ee4444e2 100644 --- a/README.md +++ b/README.md @@ -47,18 +47,72 @@ Import it into your Svelte pages and use: ```svelte ``` +## Managing the `lang` Attribute in `app.html` + +The `lang` attribute in your SvelteKit application is crucial for +specifying the primary language of your content. This attribute is +essential for accessibility and SEO, as it helps search engines and +assistive technologies understand the language of your text. + +### Default Language Setting + +Typically, the `lang` attribute is set in the `app.html` file of your +SvelteKit project. Here's a typical example: + +```html + + + + +``` + +In this snippet, `lang="en"` sets the language of the document to +English. + +### Customizing the Language + +To customize the language for your application: + +1. **Static Setting:** If your site is primarily in one language, + simply replace the `en` in `lang="en"` with the appropriate + language code (e.g., `fr` for French). + +2. **Dynamic Setting:** If your site supports multiple languages and + you need to change the language dynamically based on user + preferences or other criteria, you'll need to handle this at the + server level or through client-side scripting. Here are some + strategies: + +- **Server-Side Rendering (SSR):** Adapt your SSR setup to insert the + correct `lang` attribute based on the request's context or user + settings. +- **Client-Side Script:** Use client-side JavaScript to set + `document.documentElement.lang` based on user interaction or other + indicators. This method is less preferred due to potential SEO and + user experience implications. + +### Note on svead Usage + +The svead package is designed to enhance your application's SEO and +accessibility through structured data and other optimizations. +However, managing the `lang` attribute in the `app.html` file is +outside the scope of svead. As such, you'll need to manage this +attribute as part of your general SvelteKit application setup. +Following the best practices for setting the `lang` attribute will +complement the enhancements provided by svead. + ## Packaging for NPM Scott, this is here for you to remember how to do this 🙃