Fundamentals of Web Publishing
MIS 208-BLEC: T 08:15PM-10:05PM- ADM102
LAB: TH 08:15PM-10:05PM - ADM138
Andy Stokes
Course Introduction
• Syllabus
• Teaching Philosophy
• Assignments
• Projects
• Schedule
• Absences, Feedback, Email Policy
Fundamentals of Web Publishing
• 5 Ws of www• HTML in 25 words or less OR Tag, you’re
it! • Guten Tag(s) - Start to Finish• Design and Usability Issues• Why buy the cow when you can get the milk
for free? - A host of issues or an issue of hosts?
• Other issues and considerations
Chapter One
• Internet
• WWW
• Web Browsers
• HTML
Internet
• Huge network of computers
• Began with ARPA
• TCP/IP– Backbone of the Internet Infrastructure
WWW
• Created in 1992
• Organizing, presenting, and accessing information
• Developed by CERN
Technologies
• HTML
• Hypertext Transfer Protocol (http)
• Web Browsers
Growth Factors
• Graphical User Interfaces (GUIs)
• Easy ISP Access
• Faster Modems
• Improved Compression Technologies
• Less Expensive Hardware
Client-Server Network
• Your computer is a Client– The Web Browser is Client Software
• The Internet is a Network
Web Browsers
• Client Software
• Receives Information over the Internet
• Interprets the HTML
• Displays the Results
Features
• Back Button
• Bookmark
• Reload
• Home
• Search
• Web Address
Source Code
• Page Source
• HTML Tags– Cross Platform Independence
HTML or Tag, you’re it!
HTML Explained
• H-T-M-L are initials that stand for HyperText Markup Language (computer people love initials and acronyms -- you'll be talking acronyms ASAP). Let me break it down for you:
HTML Explained
• Hyper
HTML Explained
• Text
HTML Explained
• Mark up
HTML Explained
• Language
Simple Page
HTML Source for Simple Page
Start with a title
Every HTML document needs a title. Here is what you need to type:
<title>My first HTML document</title>
Change the text from "My first HTML document" to suit your own needs. The title text is preceded by the start tag <title> and ends with the matching end tag </title>. The title should be placed at the beginning of your document.
Add headings and paragraphsIf you have used Microsoft Word, you
will be familiar with the built in styles for headings of differing importance. In HTML there are six levels of headings. H1 is the most important, H2 is slightly less important, and so on down to H6, the least important.
Add headings and paragraphsHere is how to add an important heading:<h1>An important heading</h1>
and here is a slightly less important heading:
<h2>A slightly less important heading</h2>
Add headings and paragraphs
Each paragraph you write should start with a <p> tag. The </p> is optional, unlike the end tags for elements like headings. For example:
<p>This is the first paragraph.</p>
<p>This is the second paragraph.</p>
Adding a bit of emphasis
You can emphasize one or more words with the <em> tag, for instance:
This is a really <em>interesting</em> topic!
Add interest to your pages with images
WidthHeight
Alt
More Alt
Images and Formats
GIF
JPG
PNG
Adding links to other pages
What makes the Web so effective is the ability to define links from one page to another, and to follow links at the click of a button. A single click can take you right across the world!
<a> </a>
Link to another site
Link an image
May 1996:Top Ten Mistakes in Web
Design
1. Using Frames
2. Gratuitous Use of Bleeding-Edge Technology
3. Scrolling Text, Marquees, and Constantly Running Animations
4. Complex URLs
5. Orphan Pages
6. Long Scrolling Pages
7. Lack of Navigation Support
8. Non-Standard Link Colors
9. Outdated Information
10. Overly Long Download Times
The Top Ten New Mistakes of Web Design
1. Breaking or Slowing Down the Back Button
2. Opening New Browser Windows
3. Non-Standard Use of GUI Widgets
4. Lack of Biographies
5. Lack of Archives
6. Moving Pages to New URLs
7. Headlines That Make No Sense Out of Context
8. Jumping at the Latest Internet Buzzword
9. Slow Server Response Times
10. Anything That Looks Like Advertising
Why buy the cow when you can get the milk for free? - A host of issues or an
issue of hosts?
• Commercial Hosting vs Free Hosting
• BYOS and BYOB
Other issues and considerations
• Size matters
• Stream this!
• Flash-ers
• XML, PERL, CGI, TCL
Backup