Download presentation
Presentation is loading. Please wait.
1
HTML Simple Introduction
Copyright Curt Hill
2
HTML Hyper Text Markup Language A text based formatting language
Consists of text and tags Text is written mostly without regard to margins The browser may dynamically change margins XML was once seen as the successor before HTML 5 It may emulate HTML Copyright Curt Hill
3
Purpose HTML is designed to display material
It has many of the same functions as a word processor or text processor It has no control over margins A word processor intends to print, so margin control is important A browser intends to display, margins are a function of window size and display size of the information A word processor may store its documents in a file using any characters The markup of HTML must be plain text for machine independence Copyright Curt Hill
4
HTML Tags A tag is enclosed in < >
A keyword identifies the function Some parameters may be part of the tag Paired tags start with <xxx> and end with </xxx> Tag names are not sensitive to case Some tags do not need a ending tag They do not need to be properly nested Copyright Curt Hill
5
Structure of HTML file Starts with <HTML> and ends with </HTML> The file is composed of two pieces within this: Head - <HEAD> to </Head> Body - <BODY> to </BODY> Different tags can be in each These will be considered now, but many more exist than than will be shown Copyright Curt Hill
6
HTML Head Tags <Title>Page Title</Title>
The title that most browsers show Various META tags that indicate author etc. HTML files produced by other programs (eg. Word) will produce many other tags in this area These are usually <META> tags which give a variety of auxiliary information like subject, program name, template, etc Copyright Curt Hill
7
Home Page Head <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO "> <TITLE>SE 311 Home Page</TITLE> <META NAME="AUTHOR" CONTENT="Curt Hill"> <META NAME="GENERATOR" CONTENT="Curt Done It"> </HEAD> Copyright Curt Hill
8
HTML Body Tags The body contains most of what shows in the browser window The Body tag can set the default colors, backgrounds etc Between <BODY> and </BODY> occurs all the content of the page as well Copyright Curt Hill
9
Paired Formatting tags
<CENTER> to </CENTER> <B> to </B> bold <I> to </I> italics <U> to </U> underline <TT> to </TT> monospaced typewriter font <FONT> to </FONT> determines font sizes and styles – needs parms <Hn> through </Hn> creates a header Copyright Curt Hill
10
Unpaired tags Some HTML generators will pair these as well, but it is not necessary <P> new paragraph <BR> a new line <BR/> a new line with no </BR> <HR> produces a horizontal line Copyright Curt Hill
11
Unrecognized Tags There have been a proliferation of tags
Tag of the week became the saying A browser that does not handle a tag should just ignore it Not display and not act upon Some tags have an action to perform if the feature is not available The Java applet tag Copyright Curt Hill
12
White space White space is defined as anything that does not produce a printable character This includes: Blanks Tabs Carriage returns Line feeds Generally HTML treats one or more contiguous characters as it they were just one Copyright Curt Hill
13
More Examples <H1><CENTER>SE 311 Home Page </CENTER> </H1>SE <H2>Test</H2> No tests are currently scheduled. <H2>Presentations and Examples</H2> <BR/>No presentations have yet been given, but they will appear here after they are. <H2>Other links</H2> Copyright Curt Hill
14
More of page <H2>Return links </H2> <P> <A HREF="index.htm" target="_top"> Return to Curt Hill's home page.</A> <P>Last time I updated this page: <!DATE2>January 7, 2008<!/DATE>. <P> <FONT SIZE=1> </FONT> </BODY> Copyright Curt Hill
15
Browsers Nearly every web browser has the ability to show the original source You should look at the actual home page of this class for examples Copyright Curt Hill
16
Creating HTML There are very many ways
HTML is a simple text file with nothing that is not ASCII Thus a simple program like Notepad++ may create or modify Most word processors may export HTML or act on it directly Like MS Word There are numerous specialized programs as well DreamWeaver FrontPage Copyright Curt Hill
17
Another Example Lets consider one more example
The nearly obsolete Java Applet Tag Copyright Curt Hill
18
Java applet tags <APPLET code=“X.class” height=100 width=400> <PARAM name=p value=“parm value”>Default message </APPLET> code identifies the class file size of panel is determined by height and width Multiple params can be entered The default message is shown if the browser cannot handle Java Copyright Curt Hill
19
Required Parameters The height and width are special parameters
They must be given in order that the browser knows the size of the applet to display However, they may be accessed from Java, just like any parameters Copyright Curt Hill
20
Optional Parameters The HTML for a parameter is a tag, which is enclosed within the applet tag Parameters tags have three pieces: The PARAM tag label The name of the parameter The value of the parameter These are separated by blanks in the PARAM tag Copyright Curt Hill
21
<PARAM name=p value=“parm value”>
The name is how the parameter will be identified in Java Must be unique for this applet Not case sensitive The value is always a string Must be enclosed in quotes if it contains special characters Copyright Curt Hill
22
Finally There is much more to know but not much of it is relevant to this class Although the library has reference material it is more common to use the web I am partial to: for both HTML and JavaScript If you find better sites let me know Copyright Curt Hill
Similar presentations
