Zum Inhalt springen

Vorlage:Kbd/Doku

Aus Wikivoyage

Purpose

[Bearbeiten]

This template is for explicitly indicating that the content inside it represents input from a keyboard or other source (speech recognition software, exit code of an application, standard input, etc.) It uses the [X]HTML element <kbd>...</kbd> (keyboard input) which exists for this purpose, and applies some styling to it, namely a faint grey background (borrowed from the related template {{key press}}) and slight CSS letter-spacing to suggest individually entered characters. It retains the default monospaced (non-proportional) font style of the <kbd> element. Because it uses <kbd>...</kbd> instead of simply applying visual style effects, it is semantic markup that conveys meaning, and it can be further acted upon by the user agent (e.g. with custom local style sheets). This tag is the exact opposite of {{samp}}, which is for example output.

Usage

[Bearbeiten]

The template takes one mandatory parameter, the content to be marked up. If this content contains "=" (an equals sign), the parameter must be explicitly named |1=, or the template will fail. (This is a limitation of the MediaWiki software, not the template.) It is always safer to use |1= syntax. It may be used as a container for {[tlx|var}}, {{varserif}} or <var>...</var> when the example keyboard input contains or consists entirely of a variable. It may also be used with (but not inside) {{code}}, or with <code>...</code> (it generally should not be used inside the latter, as input is not a part of source code, but something that interacts with it; however, this style can be used to illustrate computer display of mixed type, as illustrated below).

There is an optional parameter | (or | or any other value), to get rid of the slight letter spacing, which can look awkward on long passages of input.

Examples:

  • {{kbd|71077345}}: "Entering 71077345 on a calculator and turning it upside down appears to spell ShellOil."
  • {{kbd|1=ssh {{var|hostname}}}} with {{samp|%}}: "At the % prompt, the user must enter ssh hostname."
  • {{kbd|1=ssh {{var|hostname}}}} with {{samp|%}} and {{key press|Enter}}: "At the % prompt, the user must input ssh hostname Enter."
  • Inside <code>...</code>: "The commandline should read: % ssh hostname (where hostname is the IP address or domain name of the system to connect to); if this is correct, press Enter."
  • {{kbd|1={{lorem}}|spacing=0}} to get rid of the spacing: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Some of these examples may look slightly different outside this documentation, because the default background color varies by page type (articles are stark white, template documentation pale green, most other pages very pale grey). In-article example:

  • {{kbd|71077345}}: "Entering 71077345 on a calculator and turning it upside down appears to spell ShellOil."
  • {{kbd|1=ssh {{var|hostname}}}} with {{samp|%}}: "At the % prompt, the user must enter ssh hostname."
  • {{kbd|1=ssh {{var|hostname}}}} with {{samp|%}} and {{key press|Enter}}: "At the % prompt, the user must input ssh hostname Enter."
  • Inside <code>...</code>: "The commandline should read: % ssh hostname (where hostname is the IP address or domain name of the system to connect to); if this is correct, press Enter."
  • {{kbd|1={{lorem}}|spacing=0}} to get rid of the spacing: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

See also

[Bearbeiten]

Die semantischen Vorlagen dienen der Kennzeichnung von Text. Der Text wird in spezielle HTML-Tags eingebettet, die die Bedeutung des Inhalts kennzeichnen. Browser, Robots und Werkzeuge für Barrierefreiheit können entsprechend darauf reagieren. Folgende semantische Vorlagen können in Wikivoyage-Artikeln eingesetzt werden:

  • {{em}} Die Vorlage kennzeichnet Text, der besonders betont werden soll. Browser stellen ihn im Regelfall kursiv dar.
  • {{strong}} Dient der starken Hervorhebung von Wörtern und Passagen. Die Darstellung erfolgt standardmäßig in Fettschrift.

In Artikeln außerhalb des Haupt- und Nachrichtennamensraums (Diskusssionen, Projekt- und Hilfeseiten) können weitere Vorlagen Anwendung finden:

  • {{strongbad}} Wie {{strong}} aber rot wie in dem Beispiel: „Benutze {{strongbad}} niemals in Artikeln.“
  • {{stronggood}} Wie {{strongbad}} aber grün wie in dem Beispiel: „Benutze {{stronggood}} nur außerhalb des Artikelnamensraums.“
  • {{var}} Zusammen mit {{varserif}} dient die Vorlage der Kennzeichnung und Visualisierung von Variablen bzw. Platzhaltern in Dokumentationen und Hilfetexten.

Die folgenden Vorlagen stellen lediglich eine Formatierungshilfe dar, erzeugen aber keine speziellen [X]HTML-Tags, um Inhalte maschinenlesbar eine Bedeutung zu geben.

  • {{wikivar}} Stellt Text als Magisches Wort dar und erleichtert damit die Dokumentation und Erstellung von Hilfeseiten. Beispiele: {{PAGENAME}}, {{DEFAULTSORT:Lastname, Firstname}}.
  • {{para}} Dient der Ausgabe von Vorlagenparametern (|title=) oder Parametern mit Werten (|year=2008).
  • {{tlx}} and related For displaying entire templates (with or without parameters and values) as code.
  • {{tag}} – For using HTML elements ("tags") in prose (e.g. "When coding HTML <img>...</img> tags, always include …").
  • {{code}} For computer source code (e.g. "always include the alt= parameter"). (Note: to nest other templates like {{var}} inside, use <code>...</code> instead of {{code}}.)
  • {{syntaxhighlight}} or {{sxhl}} – Wrapper for <syntaxhighlight>...</syntaxhighlight>, but will wrap overflowing text.
  • {{pre}} – For larger blocks of source code and other pre-formatted text.
  • {{pre2}}, a template with similar functionality but induces optional line wrap and optional scroll bars.
  • {{bq}} For indented blocks of content, such as block quotations, examples, poems, etc.
  • {{kbd}} For indicating user input.
  • {{key press}} For indicating the input of specific keystrokes, e.g. CtrlX.
  • {{samp}} For example output.
  • <syntaxhighlight>