The Webtypografie designates the parts of the Typografie relevant during the Web organization and their special application in the Web, in particular the rules which can be considered when using individual indications in HTML documents. It belongs to the basic knowledge of Web designers and is based in Germany on the DIN 5008. ''

Kinds of honor

As also in other media, there are several possibilities of the text emphasis, which are called kinds of honor also in the Web. One differentiates with respect to the Web between logical and physical kinds of honor. Even if elements for it exist, physical text honor in honor languages has no more place at the latest since the introduction of CSS (in particular should be used instead of the i the em-element and instead of b better strong). In the following therefore only the logical kinds of honor are in HTML listed:

• Abbreviations are distinguished by means of abbr element.
• Acronyms are distinguished by means of acronym element (starting from XHTML replaces 2,0 by the abbr element).
• Examples are distinguished by means of samp element.
• Definitions of the surrounding element are distinguished by means of dfn element.
• Stress is distinguished by means of em-element.
• Strong stress is distinguished by means of strong element.
• Source text is distinguished by means of code-Element (starting from XHTML of 2,0 longer source text sections also with the block code element).
• Keyboard entries are distinguished by means of kbd element.
• Variable ones are distinguished by means of var element.
• Quotations are distinguished by means of q-element (starting from XHTML replaces 2,0 by the ratio element).
• Longer quotations are distinguished by means of block ratio element.
• Source data are distinguished by means of cite element.

for the topic of quotations see also section quotation mark

Beyond that there are further elements. Depending upon user attitudes, platform, Webbrowser, character fonts etc. excellent ranges are differently represented. While HTML should not be abused for it, on it influence to take (in particular outdated elements from the time before Cascading Style Sheets (CSS) as font should not be used no more), insists the possibility of causing a change of the shape by means of CSS.

Quotation mark

Usually quotation marks in two cases are used:

1. To the representation of literal speech.
2. To the emphasis of irony.

Uncommonly however are it, stresses or title of books to represent to songs etc. by quotation marks. For this rather a stressed representation should be used (see above).

With the use of quotation marks frequently errors are made. Here a listing of the correct use of different quotation marks. Blanks are for the sake of clarity emphasized with "“in the result.

Simple quotation marks are already used normally only within ranges being located in quotation marks.

Quotation marks are used for quotations or around individual words as ironical to mark. They are not used however for the stress. Also this is made often wrong. For the stress are suitable instead the elements em and strong.

The correct use of quotation marks is supported by CSS2 by the quotes characteristic, which is evaluated however only by current Browsern: W3C Recommendation CSS2, '' quotes ''.

Lines

Also lines are often confounded. In particular the hyphen, which is on the German keyboard to the left of the right shift key, for all possible lines is abused.

The German hyphen (Halbgeviertstrich) leaves itself - on use of correct coding - under Windows also during pressed old key and input of the key sequence "„to 0, 1, 5, 0 "“on the number block (!) produce, under Mac OS X by simultaneous pressing of the old key and the hyphen key. With many Ms-Windows-programs also the combination Strg key functions and "„- "“from the number block.

With non-proportional character fonts, for example Courier or with old typewriters, recommend to set Typografen around the until line blank.

Blank

Frequently one wants to avoid a paging by a blank. Thus it does not look usually well, if in multipart abbreviations a line-makeup takes place. Therefore one uses the protected blank here.

Instead of the normal protected blank ( ) would be partial a narrow protected blank in the following examples ( ) more appropriate, however by many Browsern yet one does not support. Also with − (−) has some Browser problems, so that for it the hyphen is nearly always used.

For multipart abbreviations are suitable however also formatting with CSS, which has a direct influence on the line-makeup of abbreviations and the width of the blank. For example the abbr element can be formatted global. In the current Internet Explorer this functions not, becomes there however differently than the use of   not as disturbing felt. Besides so the meaning of an abbreviation can be deposited over the title attribute and formatted if necessary.

Example: e.g.

One can obtain a comparable effect also for measure data in connection with splinter.

Points of omission/ellipse

Points of omission become usually with the ellipse ("…) represented. This becomes with the … (…) represented. Before it a blank stands, if the preceding word were terminated. Becomes only one partial word (e.g. "„Partly"… "“) separated, then before it however no blank stands.

The ellipse can be produced under Windows also by input of 0 to 1 3 3 on the number block with pressed old key.

See also: Plenk

Articles in category "Webtypografie"

We found here 9 articles.

Related Websites

We found here 3 related websites.

• "typography" in juretta's Tags on Ma.gnolia
  Visit Webtypografie - Wikipedia Webtypografie - Wikipedia · View Details. Clear. Copy Bookmark Send to Contact Send to Group ...


• sIFR Beauty: a showcase of rich accessible typography for the ...
  sIFR


• User
  http://www.praegnanz.de/essays/295/sifr-revolution-der-webtypografie - similar - cached - mail it - history. 9. Copy this Creating Bulletproof and Easy to ...