良い実践

ウェブ向け

例：アンカー付きの`<h2>`タグの場合

現在の言語でのラベル

LLMはリンクを保護する上で人間よりも効率的であり、

は異なる言語バージョン間の問題を検出できます。

そうすれば、全ての言語で機能するリンクを共有し、非推奨のアンカーの置換を

で管理できます。

コードの曖昧さ

データ指向モデルを扱う際には、曖昧さを避けてください。

例：

「`key`」という用語は明確ではなく、検索が困難になります。

ts
const PRODUCTS: Product[] = [
	{
		id: 'fcf7o',
		logo: '/icons/fcf7o-icon-40.webp',
		label: 'FCF7O',
		key: 'game:fcf7o.words.game_title',
	},
	{
		id: 'lsde',
		logo: '/icons/lsde-icon-40.webp',
		label: '<c1>LSDE</c1>',
		key: 'software:lsde.name',
	},
	{
		id: 'lsge',
		logo: '/icons/lsge.webp',
		label: 'LSGE',
		key: 'software:lsge.name',
	},
];

一貫性のある独自の命名規則を採用してください。

「`i18nKey`」という用語は非常に明確で、正規表現（`Regex`）を使ってこの値を正確に検索することができます。

ts
const PRODUCTS: Product[] = [
	{
		id: 'fcf7o',
		logo: '/icons/fcf7o-icon-40.webp',
		label: 'FCF7O',
		i18nKey: 'game:fcf7o.words.game_title',
	},
	{
		id: 'lsde',
		logo: '/icons/lsde-icon-40.webp',
		label: '<c1>LSDE</c1>',
		i18nKey: 'software:lsde.name',
	},
	{
		id: 'lsge',
		logo: '/icons/lsge.webp',
		label: 'LSGE',
		i18nKey: 'software:lsge.name',
	},
];

怠惰

悪いアイデアは怠惰から生まれます。

コンテンツを取得するために操作を実行することで、キーを節約しようとしないでください。

例：

javascript
const [title, subtitle] = t( 'game:game.title' ).split( /[:：]/ );

これは誤った良いアイデアです。なぜなら、特定の言語では文字が異なったり、語順が変わったりする可能性があるためです。

タグのフォーマット

デザインのためのコードをテキスト内に直接含めることを最小限に抑え、コードベースからそれを制御できるようにしてください。

例えば、画像の場所は指定できますが、そのスタイルやレンダリング方法を指定することはできません。

デザインの変更が必要になった場合、単にタグのスタイルを変更するためだけに10言語でテキストを再翻訳することを強制されたくありません！

タグには識別子を含めることができますが、追加情報を加えることは通常、強く推奨されず、悪い実践例とされます。

例：次のようにしないでください

むしろ

その後、画像タグのIDを取得し、コードベースで必要なスタイルを適用します。

IDは文字通り使用されるべきであり、そのインデックスを介してではありません。

実際、異なる言語では、タグが移動される可能性があり、最初のインデックスと一致しなくなる可能性があります。

自然なインデックスの使用は、開発者にとって複雑さを引き起こします。画像やタグがどのインデックスに対応するかを推測しようとすることは、本当に頭を悩ませる問題です。

したがって、補間後にタグをカスタマイズできるようにしたい場合は、識別子を持つタグを使用してください。

CSS

サイトの翻訳において、段落がある場合、言語変更時の視覚的なずれを避けるために、翻訳後に最小の高さ（`min-height`）を選択してください。

例：`mih={'3lh'}`

これにより、最も多くの行を占める言語に基づいて最小の高さを定義でき、一貫性のある控えめなユーザーエクスペリエンス（UX）が保証されます。

名前空間

これにより、キーを見つけるための`Regex`パターンを設定するのが非常に容易になります。

例：

、