A further development toward clear information management in web HTML is the Cascading Style Sheet (CSS) which allows the web designer/coder to separate out text and image file content from instructions on how to layout the information when the web page or website is presented. An example of how the same content can be represented by differing CSS instructions can be seen at the css Zen Garden site. CSS standards are set by W3C.
A general form of CSS code is:
selector, selector, ... {property1:value1; property2:value2; ... propertyN:valueN;}
This example defines selectors Heading1 and 2 and gives them the same property/values
for colour and font
Heading1, Heading2
{
color: red;
font-family: tahoma
}
Where selectors are used to identify those areas of the document in which to follow the style declarations inside brackets {declaration, declaration}. Each declaration provides properties and values, like colour and type face to apply in the selected part of the document. An example is shown here.
CSS can also define positioning of text and graphics elements of the web page. Positioning can be static - in the document flow, relative - changeable with reference to it's stated position or absolute - a fixed position anywhere in the document.
Benefits of CSS include:
CSS can also define positioning of text and graphics elements of the web page. Positioning can be static - in the document flow, relative - changeable with reference to it's stated position or absolute - a fixed position anywhere in the document.
Benefits of CSS include:
- Single down load of the CSS instructions which can cover an enter website layout
- Reduced data loading for the website and less memory usage
- The ability to decide at the point of delivery how to use the layout in the CSS once platform is known - different layout for a PC screen and a handheld device
- The ability to let the web user select a layout e.g. for large text if partially sighted - link to RNIB Web Accessibility pages
- Differences between browser software (e.g. versions of MSInternet Explorer, Firefox, Safari etc) give different representations for the same CSS instructions.
No comments:
Post a Comment