skills.rest
ProfPowell
ProfPowellCOMMUNITY
Explore all skills by this author →
GitHub

i18n

Create internationalization-friendly HTML pages with language attributes and hreflang links.

4|Updated Jan 13, 2026
Search Tags:#html#accessibility#localization#i18n#internationalization#multilingual
One-click install
npx skills add https://github.com/ProfPowell/vanilla-breeze --skill i18n-profpowell
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: i18n
Source: https://github.com/ProfPowell/vanilla-breeze/tree/main/.claude/skills/i18n
Command: npx skills add https://github.com/ProfPowell/vanilla-breeze --skill i18n-profpowell

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill ensures your HTML pages are correctly structured for internationalization and localization, making your content accessible and understandable to a global audience.

Core Features & Use Cases

  • Language Declaration: Properly sets the lang attribute for HTML documents and inline elements.
  • Directionality: Handles right-to-left (RTL) languages using the dir attribute.
  • Language Alternatives: Links to different language versions of a page using hreflang.
  • Character Encoding: Enforces UTF-8 for broad character support.
  • Translation-Friendly Markup: Provides guidance on structuring content to avoid translation issues.
  • Date/Time/Number Formatting: Uses semantic elements like <time> and <data> for machine-readable values.
  • Pluralization: Offers strategies for handling different pluralization rules across languages.
  • Use Case: When creating a website that needs to be available in English, Spanish, and Arabic, this skill helps ensure all language attributes, text direction, and links to alternate versions are correctly implemented.

Quick Start

Ensure the HTML document has the correct language declaration by adding the lang attribute to the html tag.

Frequently Asked Questions about i18n

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add internationalization to HTML for multilingual websites?▼

Internationalization in HTML involves setting the lang attribute, managing text directionality with dir, enforcing UTF-8 encoding, and linking alternate versions using hreflang to ensure global accessibility.

What is the best way to handle right-to-left RTL languages in HTML?▼

Handle right-to-left RTL languages in HTML by applying the dir attribute to the html tag or inline elements, ensuring proper visual structure for scripts like Arabic.

How do I use hreflang to link alternate language versions of a page?▼

Use hreflang in HTML link elements to specify alternate language versions of a page, allowing search engines and browsers to direct users to the correct regional content.

Why does my multilingual HTML content break when translated?▼

Multilingual HTML content often breaks during translation due to poor semantic markup, improper text directionality, or unstructured date and number formatting that ignores pluralization rules.

Do I need semantic markup for date and time formatting in internationalization?▼

Semantic markup is necessary for date and time formatting in internationalization because elements like time and data provide machine-readable values that adapt correctly across different locales.

Related Skills

Explore More Content & Communication Skills→
kreuzberg-devkreuzberg-dev
836

character-encoding-detection

Detects and converts character encodings to UTF-8 using encoding_rs library.

Official
Intermediate
lobehublobehub
81.4k

i18n

Manage react-i18next translations and locale data in React applications.

Official
Intermediate
latelierkiyoselatelierkiyose

accessibility-compliance

Implement WCAG 2.2 compliant interfaces with ARIA and semantic HTML.

Official
Advanced
KaakatiKaakati
2

i18n

Implement internationalization and localization for Rails, React Native, ReactJS, and Next.js applications.

Community
Advanced