Caroline's
Corner
Home
html/xhtml
User Analysis
Design
Accessibility
CSS
Documentation
JavaScript
Testing
Links to Tips, Tutorials &
Tools
PHP
|
- A Web page is a text file written in a language
called Hypertext Markup Language.
- A markup language is a language that describes
a document’s structure and content.
- HTML is not a programming language or a formatting
language.
- Styles are format descriptions written in a separate
language from HTML that tell browsers how to render each element. Styles
are used to format your document.
- The first version of HTML was created using the
Standard Generalized Markup Language (SGML).
- In the early years of HTML, Web developers were
free to define and modify HTML in whatever ways they thought best.
- Competing browsers introduced some differences
in the language. The changes were called extensions.
- A group of Web developers, programmers, and authors
called the World Wide Web Consortium, or the WC3, created a set of standards
or specifications that all browser manufacturers were to follow.
- The WC3 has no enforcement power.
- The recommendations of the WC3 are usually followed
since a uniform approach to Web page creation is beneficial to everyone.
- Older features of HTML are often deprecated, or
phased out, by the W3C. That does not mean you can’t continue
to use them—you may need to use them if you are supporting older
browsers.
- Future Web development is focusing increasingly
on two other languages: XML and XHTML.
- XML (Extensible Markup Language) is a metalanguage
like SGML, but without SGML’s complexity and overhead
- XHTML (Extensible Hypertext Markup Language) is
a stricter version of HTML and is designed to confront some of the problems
associated with the different and competing versions of HTML.
- XHTML is also designed to better integrate HTML
with XML.
- HTML will not become obsolete anytime soon.
- Become well-versed in the history of HTML.
- Know your market.
- Test.
- Basic text editor like Notepad.
- HTML Converter - converts formatted text into HTML
code
- Can create the source document in a word processor
and then convert it.
- HTML code created using a converter is often longer
and more complicated than it needs to be, resulting in larger-than-necessary
files.
- HTML Editor – helps you create an HTML file
by inserting HTML codes for you as you work
- They can save you a lot of time and help you work
more efficiently.
- Advantages and limitations similar to those of
HTML converters.
- Allow you to set up a Web page quickly.
- Will usually still have to work with HTML code
to create a finished document
SlideShow Reference: Chapter 9 of New Perspectives HTML and XHTML
by Patrick Carey (Comprehensive), Thompson Course Technology, ISBN: 0-619-26747-X.
Great html reference to have open in the background while you work
Meta Tag Overview
Meta tags are information inserted into the "head" area of web pages. Other than the title tag information in the head area of your web pages is not seen by those viewing your pages in browsers. Instead, meta information in this area is used to communicate information that a human visitor may not be concerned with. Meta tags, for example, can tell a browser what "character set" to use or whether a web page has self-rated itself in terms of adult content.
The Meta Description Tag
The meta description tag allows you to influence the description of your page in the crawlers that support the tag
(these are listed on the Search Engine Features page).
<meta name="description" content="Write a description of the page here" />
The Meta Keywords Tag
The meta keywords tag allows you to provide additional text for crawler-based search engines to index along with your body copy. How does this help you? Well, for most major crawlers, it doesn't. That's because most crawlers now ignore the tag. The few supporting it can be found on the Search Engine Features page.
<meta name="keywords" content="keyword, keyphrase, etc" />
Meta Robots Tag
One other meta tag worth mentioning is the robots tag. This lets you specify that a particular page should NOT be indexed by a search engine. To keep spiders out, simply add this text between your head tags on each page you don't want indexed. The format is shown below:
<meta name="robots" content="noindex" />
For comprehensive information on metsdata and search engines go to SearchEngineWatch.
Image Map Example Code
Example usuing <img> tag.
<img src="welcome.gif" alt="Image map of areas in the library" usemap="#map1">
<map name="map1">
<area shape="rect" coords="0,0,30,30" href="reference.html" alt="Reference">
<area shape="rect" coords="34,34,100,100" href="media.html" alt="Audio visual lab">
</map>
End example.
Example using <object> tag.
<object data="welcome.gif" type="image/gif" usemap="#map1"> There are several areas in the library including the <a href="reference.html">Reference</a> section and the <a href="media.html">Audio Visual Lab</a>. </object>
<map name="map1">
<area shape="rect" coords="0,0,30,30" href="reference.html" alt="Reference">
<area shape="rect" coords="34,34,100,100" href="media.html" alt="Audio visual lab">
</map>
End example.
Redundant text links for client-side image maps
In addition to providing a text equivalent, provide redundant textual links. If the <a> element is used instead of <area>, the content developer may describe the active regions and provide redundant links at the same time.
Example.
<object data="navbar1.gif" type="image/gif" usemap="#map1">
<map name="map1">
<p>Navigate the site.
[<a href="guide.html" shape="rect" coords="0,0,118,28">Access Guide</a>]
[<a href="shortcut.html" shape="rect" coords="118,0,184,28">Go</a>]
[<a href="search.html" shape="circle" coords="184.200,60">Search</a>]
[<a href="top10.html" shape="poly" coords="276,0,276,28,100,200,50,50,276,0"> Top Ten</a>]
</map>
</object>
End example.
[Top]
|