css Zen Garden: The Beauty in CSS Design
ISO/IEC 8859-1
ISO-8859-1 is the IANA preferred name for this standard when supplemented with the C0 and C1 control codes from ISO/IEC 6429. The following other aliases are registered for ISO-8859-1: iso-ir-100, csISOLatin1, latin1, l1, IBM819, CP819. Coverage[edit] Each character is encoded as a single eight-bit code value. Languages with complete coverage[edit] Languages commonly supported but with incomplete coverage[edit] Quotation marks[edit] For some languages listed above the correct typographical quotation marks are missing, as only « », " ", and ' ' are included. History[edit] ISO 8859-1 was based on the Multinational Character Set used by Digital Equipment Corporation in the popular VT220 terminal. In 1985 Commodore adopted ISO 8859-1 for its new AmigaOS operating system. In 1992, the IANA registered the character map ISO_8859-1:1987, more commonly known by its preferred MIME name of ISO-8859-1 (note the extra hyphen over ISO 8859-1), a superset of ISO 8859-1, for use on the Internet.
UTF-8
The official IANA code for the UTF-8 character encoding is UTF-8.[6] History[edit] By early 1992 the search was on for a good byte-stream encoding of multi-byte character sets. The draft ISO 10646 standard contained a non-required annex called UTF-1 that provided a byte-stream encoding of its 32-bit code points. In July 1992, the X/Open committee XoJIG was looking for a better encoding. In August 1992, this proposal was circulated by an IBM X/Open representative to interested parties. UTF-8 was first officially presented at the USENIX conference in San Diego, from January 25 to 29, 1993. Google reported that in 2008 UTF-8 (misleadingly labelled "Unicode") became the most common encoding for HTML files.[9][10] Description[edit] The design of UTF-8 can be seen in this table of the scheme as originally proposed by Dave Prosser and subsequently modified by Ken Thompson (the x characters are replaced by the bits of the code point): The salient features of this scheme are as follows: Examples[edit]
How to size text using ems | Clagnut § Typography · CSS techniques
Text for the screen is sized with CSS in terms of pixels, ems or keywords. As most of us know, sizing with pixels is easy: get your selector and give it a font-size – no more thought required. Sizing with keywords is more complicated and requires a few workarounds, but you’re in luck as the techniques are well documented. That leaves ems. At this point people often leg it. Why ems? If the world were an ideal place, we’d all use pixels. Keyword-based text sizing will allow all browsers to resize text so this is a possibility, but I don’t find it gives me the precision that pixels would give me. Get on with it OK let’s dive into ems. This takes 16px down to 10px, which apart from being less huge is a nice round number. So this would give us a document where text in the navigation and side bar is displayed at 10px, the main content is 12px and the footer is 9px. And so to the final tweak and the bit folks seem to find most tricky: dealing with nested elements. 16 x 0.625 = 10 And that’s it.
Sliding Doors of CSS
A rarely discussed advantage of CSS is the ability to layer background images, allowing them to slide over each other to create certain effects. CSS2’s current state requires a separate HTML element for each background image. In many cases, typical markup for common interface components has already provided several elements for our use. Article Continues Below One of those cases is tabbed navigation. What if we could take the exact same markup from the tabs above, and turn them into something like this: With simple styling, we can. Where’s the Innovation? Many of the CSS-based tabs I’ve seen suffer from the same generic features: blocky rectangles of color, maybe an outline, a border disappears for the current tab, a color changes for the hover state. Prior to a more widespread adoption of CSS, we started seeing a lot of innovation in navigation design. Pure text navigation is much easier to maintain and loads more quickly than text-as-image navigation. Tab Creation#creation
