HTML is an acronym for HyperText Markup Language.
Every .html document will include "html" tags
within angle-brackets <html tags here>
A few examples are provided below. NOTE: many html-tags will indicate the START and the END of the tags with BEGIN/END pairs. Such as:
<TITLE> HTML Tutorial Information </TITLE>
Notice that the keyword TITLE begins the document title
information and the same keyword with the slash terminates
the range-effectiveness of the keyword.
You can skip directly to sections on:
or, examine this brief TABLE-tutorial
Within the BODY of an html document, you may utilize
a wide variety of markup tags, a few of the
more common are briefly listed here.
Lists can be provided for easy listing of items:
HTML keywords and definition/usage
The general lay-out of an html document is:
<HTML> begin an html document file
<HEAD> begin document header
<TITLE> begin document title
specify document title here
</TITLE> end title tag
</HEAD> end header information
<BODY> begin the BODY of the document
the bulk of the html document is here.
</BODY> end of document BODY
</HTML> end of HTML document
EM begin/end EM-phasized text (Italicized)
STRONG begin/end STRONGLY-emphasized text
B begin/end BOLD text
I begin/end ITALIC text
U begin/end UNDERLINED text
TT begin/end TypeWriter font
H1 begin/end HEADER, level 1 (largest font)
H2 begin/end HEADER, level 2 (large font)
H3 begin/end HEADER, level 3 (moderate font)
H4 begin/end HEADER, level 4 (small font)
H5 begin/end HEADER, level 5 (smaller font)
H6 begin/end HEADER, level 6 (smallest font)
PRE begin/end PRE-formatted text, ie leave lines "as-is"
CODE begin/end mono-spaced font text
SAMP begin/end mono-spaced font text
BLINK begin/end flashing or blinking of text
P new Paragraph of your document
HR place a Horizontal Reference line in the document
BR place a "hard" carriage return in the document
OL ORDERED(numbered) list with <LI>
UL UN-numbered list with <LI>
LI a LIST-item
<IMG SRC="filepath/tosome/imagefile.gif" >
<A HREF="http://www.HostName.com/filespec.html"> Click-Here </A>
<A HREF="folder/filespec.html"> Click-Here </A>
This is Header3 information
Displayed | Coded | Description |
---|---|---|
< | < | less-than |
> | > | greater-than |
& | & | ampersand |
| hard-space character | |
© | © | copyright |
® | ® | registered |
™ | ™ | trademark |
° | ° | degrees |
‘ | ‘ | quote-left |
’ | ’ | quote-right |
′ | ′ | prime (minutes, feet) |
″ | ″ | double prime (Seconds, Inches) |
" | " | double-quote |
“ | “ | double-quote-left |
” | ” | double-quote-right |
¢ | ¢ | Cent |
¥ | ¥ | Yen |
€ | € | Euro |
£ | £ | Sterling |
« | « | Left angle quote |
» | » | Right angle quote |
¶ | ¶ | Paragraph |
§ | § | Section sign |
† | † | dagger |
‡ | ‡ | dagger Double |
¼ | ¼ | One Quarter |
½ | ½ | One Half |
¾ | ¾ | Three Quarters |
¹ | ¹ | SuperScript 1 |
² | ² | SuperScript 2 |
³ | ³ | SuperScript 3 |
÷ | ÷ | Divide |
± | ± | PlusMinus |
é | é | acute-accented e |
è | è | grave-accented e |
É | É | acute-accented E |
È | È | grave-accented E |
Æ | Æ | dipthong ligature |
æ | æ | dipthong ligature |
ñ | ñ | tilde-n |
¸ | ¸ | cedilla |
ö | ö | o-umlaut |
´ | ´ | acute accent |
¿ | ¿ | question (SideUPdown) |
¡ | ¡ | exclamation (SideUPdown) |
The specifications for the HTML escape or special characters is
extensive and may have subtle variations from one browser to
another. A web-search for: HTML special characters
can locate several detailed lists, for example:
www.Natural-Innovations.com
or
www.HTMLhelp.com
The Greek alphabet is displayed by mapping regular keyboard
characters into a Symbol font.
The LOG files are:
You might also be interested in running "lynx" to
view your web-page, see the man-page for lynx, briefly
use 'q' to quit, to start, from your linux vt100-telnet-logon
screen: lynx http://10.6.10.22
If you are interested in a brief Astronomy lesson,
click here.
Still want to know more...,
click here.
For some information on the Solar System,
click here.
Habla espanol?, aqui.
Html has a convenient and powerful feature of direct referencing
of other html documents or files of many other types, directly
in the document. The browser will handle the file according
to the file type and html specifications. The generic term for
a file designation is a URL or Uniform Resource Locators.
The specification tells the browser how to communicate with the
http server to get the file.
Picture files(.gif and .jpg) can be referenced for inclusion
Return to the tutorial contents.
The above examples should serve our purposes in the unix class.
However, if you are interested in more html (for use beyond this
course), you can find a nice beginner html tutorial, with additional
links and references,
here.
httpd - the web server
The Linux web-server is a program that is available at all
times to "serve" any network requests for html-files.
The program must be started by the system administrator
and is a daemon called 'httpd'.
"httpd" has configuration and log files that are
kept in /etc/httpd you are encouraged to
explore and understand the contents of these files.
You can change directory to the logs and then use
more [logfile] or view [logfile]
to examine the contents.
/etc/httpd/logs/access_log
/etc/httpd/logs/agent_log
/etc/httpd/logs/error_log
/etc/httpd/logs/referer_log
There is also a "man page" on httpd.
Server-Side Includes
There are some specifications that can be placed in
a html document that will cause the httpd-server to
execute something special. NOTE: the httpd-server must be "configured" by
the system administrator to perform the 'Server-Side Include' functions,
so your system may not perform these functions. that is why they look
like html-comments, so that when the feature is turned-off,
they are simply "comments" to the browsers. The general form is:
<!--#fun-name parm=some-value -->
<!--#echo var= DATE_GMT --> produces:
<!--#echo var= DATE_LOCAL --> produces:
<!--#echo var= LAST_MODIFIED --> produces:
<!--#echo var= DOCUMENT_NAME --> produces:
<!--#echo var= DOCUMENT_URI --> produces:
<!--#config sizefmt= bytes --> produces:
<!--#config datefmt= %y/%m/%d --> produces:
<!--#fsize virtual=index.html--> produces:
<!--#flastmod virtual=index.html--> produces:
<!--#config sizefmt= abrev --> produces:
<!--#config datefmt= %d/%m/%y --> produces:
<!--#fsize virtual=index.html--> produces:
<!--#flastmod virtual=index.html--> produces:
ICON files are also available
The Linux "apache" httpd distribution also provides
several "icons" for your use:
Please see /home/httpd/icons/README for information on
many-many more available icons.
Notice the tag references /icons/filename.gif,
this is relative to the httpd-server's "HOME", which
is /home/httpd, with the 'icons' subdirectory below.
With the student "web-page-home" under the 'html' subdirectory.
<IMG SRC="/icons/ball.gray.gif">
<IMG SRC="/icons/ball.red.gif">
<IMG SRC="/icons/comp.gray.gif">
<IMG SRC="/icons/comp.blue.gif">
<IMG SRC="/icons/back.gif">
<IMG SRC="/icons/forward.gif">
<IMG SRC="/icons/up.gif">
<IMG SRC="/icons/down.gif">
<IMG SRC="/icons/left.gif">
<IMG SRC="/icons/right.gif">
<IMG SRC="/icons/f.gif"> a fortran program
<IMG SRC="/icons/c.gif"> a c program
<IMG SRC="/icons/p.gif"> a pascal program
Referencing a list of other .html documents
My hobby is astronomy, you can view some of the recent
research announcement circulars from this
list.
Information on inclusion of picture files
Note the different alignment of the text, next to each small picture.
is a small picture of M45,
the Pleiades Star Cluster in Taurus.
A larger and more detailed image of M45 can be viewed
here.
is a small picture of M51,
the WhirlPool Galaxy in Canes Venatici.
A larger and more detailed image of M51 can be viewed
here.
is a small picture of M31,
the Andromeda Galaxy.
A larger and more detailed image of M31 can be viewed
here.
is a small picture of M57,
the Ring Nebulae in Lyra.
A larger and more detailed image of M57 can be viewed
here.
is a small picture of M104,
the Sombrero Galaxy at the Corvus-Virgo border.
A larger and more detailed image of M104 can be viewed
here.