|
|
HTML fundamentals
CHAPTER #
6
HTML
Page Accessibility
Front-end
Issues
- Cross browser compatibility
-the page should be rendered in the same way in all web browsers.
- Interactive - the
page is attractive if it contains interactive components.
- Up to date info
- Keep hyperlinks updated.
- Easy navigation
- no navigation dead end, and alternate navigation method to
image map if used.
- Branding standards
- consistent with design, color scheme, graphics and logos which
the company is already using.
Cascading Style Sheets
(CSS)
- CSS is a list of
formatting instructions that can be used to format an HTML page.
- CSS can be placed
inside the HTML document or stored as a separate file and link
the HTML page to it.
- This technology
saves time to formatting the HTML page as well as make a consistent
page design.
- CSS1 governs the
basic structures of the HTML page
- CSS2 adds more capability
to CSS1 such as, ability to support media type (such as specific
printer) and works with HTML tables.
|
CSS
RULE
|
|
Selector
|
Declaration
|
Property
|
value
|
|
color:
|
red
|
|
- A CSS rule selects
an HTML tag (The selector) and declare (Declaration) the value
of its property(color:red).
- CSS sets only the
properties declared in the rule, the remaining will follow the
default.
Implementation of
CSS
| In line
style |
- Placed in
side the body along with the HTML element.
- Declare using
the container tag <SPAN> and STYLE attribute.
- Declare within
the HTML tag itself using STYLE attribute.
|
| Embedded
Style Sheet |
- Placed inside
the <HEAD> container Tag using <STYLE> Tag.
|
| External
Style Sheet |
- The CSS rules
stored in a separate text file with .css extension.
- The HTML page
is linked to the Style Sheet using <LINK>Tag within
<HEAD> container Tag.
|
| Imported
Style Sheet |
- The CSS rules
stored in a separate text file with .css extension and
the first line with the code "@import(filename.css)".
- The HTML page
is linked to the Style Sheet using <STYLE>Tag within
the <HEAD> container Tag.
|
Web-safe Color
- Web-safe color is
the color that is supported by the browsers.
- There are 216 Web-safe
colors.
- A color which is
not supported by the browser is used in an HTML page, it will
cause dithering.
Back-end Issues
- The downloading
time for an HTML file is directly proportional to the size.
- The page size go
high as it contains graphic files which are larger in size.
The Document Type
Declaration (DTD)
- The DTD tag describes
the nature of HTML codes.
- DTD tag is placed
at the beginning of the HTML document i.e. before the <HTML>
tag.
- DTD is used to take
advantage of a particular browser.
- An HTML validator
can validate only if DTD is declared.
The META tag
- This is an empty
tag which describes the content of the HTML document.
- This tag is placed
with in the <HEAD> tag.
- This tag is used
to provide keywords of the documents to the search engines.
Dynamic HTML
Document Object Model
(DOM)
- The Document Object
Model is a platform- and language-neutral interface that will
allow programs and scripts to dynamically access and update
the content, structure and style of documents.
XML (Extensible Markup
Language)
- Allows to describe
the function and context of information in the document.
- It allows to create
ourown tags and assign meaning to it.
- An XML is valid
only if it is well-formed.
- It will not funtion
without DTD (Document Type Declaration ).
- DTD defines the
meaning and structure of the all XML tags used.
- DTD can be a seperate
file but should exixt in the same system with proper reference
made in the DTD.
- It must have the
root tag like <HTML> in HTML.
- No empty tags.
- XMLis not supported
by Browser versions earlier to version 4.0 of Netscape or IE.
- XSL is the style
sheet used for XML.
- CSS can work with
XSL.
|
|
