英文スタイルガイド解説(13):UI要素の書き方4 ― キー操作

Googleが公開している開発者向け英文スタイルガイドから項目を1つ取り上げて紹介します。スタイルガイドは基本的には書く際に利用されますが、読む際にも参考になります。

キー操作

URL: https://developers.google.com/style/ui-elements#keyboard (2020-11-27閲覧)

開発者であれば、ちょっとした操作説明を英語で書く機会があります。操作説明におけるUI要素の書き方の第4回目で、今回はキーボードのキー操作を取り上げます(第1回2回3回)。なお英語例文はGoogleのものです。

等幅フォントを使う

ボタンなどのUI要素はボールドで囲む(例: Click Next.)のが基本です。

一方でキーボードのキーを表す場合は、等幅フォント(monospace)を使うとしています。HTMLの場合は「<kbd>」要素を使うことで等幅での表示が可能です。

  • ◯ Press Control+C.
    • 上記のHTML:Press <kbd>Control+C</kbd>.

キー名のみか、theとkeyを付けるか

キー名(たとえば「Esc」)を指す際は、以下のどちらの表記も使えます。

  • ◯ Press Esc.
  • ◯ Press the Esc key.

つまりキー名だけ、または、theとkeyも付けるか、という書き方です。

なお、なぜtheとkeyという形になるのかという理由は、記事「UI要素の書き方1」の「theを付けるか付けないか」セクションで説明しています。

キーの組み合わせ

複数のキーを一緒に押すときは「修飾キー+キー」で表記します。

  • ◯ Press Control+V.

さらにシフト・キーも押す場合も「+」で書き加えます。

  • ◯ Press Control+Shift+?.

もしキーが「.」や「+」などで読者が混乱しそうであればスペルアウト(例:period、plus)するとしています。

【補足】キーの英語表記サンプル

「Chrome DevTools」のキーボード・ショートカットがこちらのページにまとめられています。英語で書く際に悩みそうな表記をいくつかサンプルとして転載します。

英語表記サンプル説明
Control+Shift+Cコントロールとシフト
Command+Option+Jコマンドとオプション
Function+F1ファンクション
Escapeエスケープ。上の例では「Esc」とも
ReturnEnterReturnはMac、EnterはWindows
Control+.ピリオド。スペルアウトはされていない
UpDownLeftRight Arrow
(例:Press Shift+Up Arrow.)
上下左右の矢印
取得元: https://developers.google.com/web/tools/chrome-devtools/shortcuts (2020-11-27閲覧)

(ライセンス表示: Portions of this page are modifications based on work created and shared by Google and used according to terms described in the Creative Commons 4.0 Attribution License.)


[筆者紹介]

西野 竜太郎

Ryutaro Nishino

翻訳者/著者

訳書に「血と汗とピクセル」、著書に「アプリケーションをつくる英語」(第4回ブクログ大賞)、「ITエンジニアのための英語リーディング」、「ソフトウェア・グローバリゼーション入門」、「アプリ翻訳実践入門」など。
産業技術大学院大学修了(情報システム学修士)、東京工業大学大学院博士課程単位取得。

リンク:ブログTwitter

Profile Picture