ボタンとフォームラベルのi18nキー命名

ボタン、フォームラベル、インタラクティブ要素のi18n翻訳キー命名のベストプラクティス。アクション動詞、確認ダイアログ、アクセシブルラベルの規則を含みます。

Key Types

詳細な説明

ボタンとラベルのi18nキー命名

ボタンとフォームラベルは最も頻繁に翻訳されるUI要素です。これらの要素に一貫したキー命名を行うことで、翻訳者の混乱を減らし、コードベースの保守を容易にします。

ボタンキーパターン

最も一般的なパターンは、すべてのボタンを共有名前空間にグループ化します:

{
  "common": {
    "buttons": {
      "submit": "Submit",
      "cancel": "Cancel",
      "save": "Save",
      "delete": "Delete",
      "edit": "Edit",
      "close": "Close",
      "confirm": "Confirm",
      "back": "Back",
      "next": "Next",
      "retry": "Retry"
    }
  }
}

フォームラベルパターン

フォームラベルも同様の構造に従い、フォームまたは機能ごとにグループ化されます。

関心事の分離

以下を別のキーグループとして管理:

  1. ラベル -- フォームフィールドの横または上に表示されるテキスト
  2. プレースホルダー -- フィールド内のヒントテキスト
  3. ヘルプテキスト -- フィールド下の追加ガイダンス
  4. バリデーションメッセージ -- バリデーション失敗時のエラーテキスト
  5. Ariaラベル -- 画面に表示されないアクセシビリティテキスト

汎用的なキーを避ける

button1label_atext_23のようなキーは避けてください。これらは翻訳者にコンテキストを提供せず、コードレビューを困難にします。常にコンテンツや目的を反映する説明的な名前を使用してください。

ユースケース

ボタンとラベルのキーは翻訳ファイルの基盤です。これらの要素の命名を正しく行うことで、後の痛みを伴うリファクタリングを防ぎます。新しいチームメンバーや翻訳者をオンボーディングする際、適切に命名されたキーにより、UIを見なくても各文字列が何を指すかが即座にわかります。

試してみる — i18n Key Generator

フルツールを開く