offered by instructional computing at the university of missouri – st.louis
Post on 19-Dec-2015
216 views
TRANSCRIPT
A WEB DEVELOPMENT SHORT COURSE
OFFERED BY
INSTRUCTIONAL COMPUTING AT THE UNIVERSITY OF MISSOURI – ST.LOUIS
It is A TEXT FILE full of hints for your internet browser.
○ Those hints are called “TAGS”
○ “TAGS” tell your browser how to make your web page look.
○ Where it should place an image, text, a link to another document, etc.
What is a webpage?
Where the web page is stored?
While you are working on webpage, you can save it on your computer, it does NOT have to be published on the WWW.
If you want your page to be available online, it will have to be uploaded to the remote computer called a “server”
Programs that can be used to create a web document at UMSL computer labs
Notepad NVU ADOBE Dreamweaver MX Hotdog Professional Microsoft Word 2007 Microsoft PowerPoint 2007
Common rules
1. The start page should be called “index.html”2. Following pages may have almost any name
Some restrictions apply: The filename should have a *.html or *.htm extension
Recommendation – File name should not contain spaces and special characters
Let’s create the first web page of your website To create a simple website we can use a
simple tool NOTEPAD
1. Click “Save as” in file menu2. Change the file type from *.txt to “All files”
The best place to save the file is a folder in your “K: drive” called “public_html”.
This folder is open to public. People from all over the world can read files in it but they cannot delete them.
“K drive” is nothing else but a storing space on the remote computer called “admiral.umsl.edu”.
Now let’s save your webpage
The address for your webpage is :http://www.umsl.edu/~Your(SSO)ID
This link is an internet address for your “public_html” folder. According to the rules, the first file is named “index.html”
If you have such file in your “public_html” folder it will show up in your browser window
Now let’s check your web page
Wait……This is not exactly what we wanted, is it?.
There are no line breaks!
How can we fix this?
Here it is ...
HTML stands for the HyperText Markup Language
HyperText – text containing links to other texts
Markup Language – defines hints/Tags for the browser.
Tags are only visible for the browser. The Browser interprets the Tags The result shows up in the Browser
Window.
For example in html we write something like this:
This is a <b> bold </b>
- The browser will show us the result:
This is a bold- If we want a line break at the end of line: This is a <b> bold </b><br> new line
- The browser will show : This is a bold
new line
Let’s make changes to our webpage
And we got what we wanted!
Let’s try to use software suited for building web pages
START>Programs>Web Publishing>Macromedia Dreamweaver
Menus
Properties panel
Toolbars
Dreamweaver has 3 types of views Design view Code View Code And design view (split)
You can switch back and forth between them using these 3 buttons
Step 1 : SAVE YOUR WEBPAGE
With Dreamweaver you can easily modify the page’s properties
Path: from the top menu choose Modify/Page Properties
You can modify text
You can make it bold, Italic Change color
Size Font type
Center text Create a link
Probably the most important part of a website are “links”
A big part of a web page are images
You can preview your web page in a browser at any time
More information on web page development
You can find html reference books in the following computer labs
SSB 103 TJ 316Ward E. Barnes
Of course there is a lot of help online too:http://www.w3schools.comhttp://www.w3.org
Questions?
If any further questions arise, please contact a lab consultant in any of the
following Instructional Computing Labs.
SSB 103 SSB 452
Math TLC (UC 050) Ward E. Barnes Library
Thomas Jefferson Research Commons
QUESTIONS ?
Additional Information http://www.micros.umsl.edu
The Microcomputer Program at the University of Missouri-St. Louis offers day and evening computer courses as part of the Chancellor's Certificate series.
http://mell.umsystem.eduMicrosoft E-Learning Library has tutorials on many MS
Office products available to all UMSL students and staff http://www.umsl.edu/stg
The Online Student Technology Guide has answers to many computing questions.