Millions and millions of clients running browsers
Client sends an HTTP request to server.
Server responds by sending HTML and images back to browser
Browser renders HTML and images so that you see page.
|
|
Millions of servers storing HTML files Millions and millions of clients running browsers Client sends an HTTP request to server. Server responds by sending HTML and images back to browser Browser renders HTML and images so that you see page. |
Almost like a word processor, but can view either WYSIWYG or with HTML tags.
Front Page, Dreamweaver, NVU (Free and open source).
You can get a trial version of Dreamweaver for your computer at http://www.macromedia.com/cfusion/tdrc/index.cfm?product=dreamweaver
1. Open Dreamweaver (Start | Programs | Macromedia | Dreamweaver 8)
2. In the opening window, select 'Create New HTML'.
3. Write your name in the page that opens.
4. Save the file to the web in a file called index.html in your 'web' directory. Your web directory is in the W: drive of the computer, in a subdirectory with your user name. The system administrators here have set up W: as a 'mounted' directory, meaning its really a directory on the computer science web server.
Your username is the user name you were provided to log on to the computer.
5. Open a browser and view your page. The URL will be http://cs.usfca.edu/~username, where username is your user name. By default, a browser will open an "index.html" file of a directory if no other file name exists. If you created a file named "home.html", you'd need to specify it explicitly, e.g., http://cs.usfca.edu/~username/home.html.
6. Have your neighbor view your page from another computer.
1. Adding Links.
On the menu, select Insert | Hyperlink. Enter 'USF' as the text, and 'http://www.usfca.edu' as the link (do not include single quotes)
File | Save
Open browser and refresh the page to view.
2. Adding Tables
On the menu, select Insert | Table. Enter 3 and 3 as the rows and columns.
Click on a table cell and enter text.
Right Click on the 'USF' link and choose Copy. Then click on a table cell and choose Edit | Paste.
Open your browser and refresh.
3. Adding Images
First, go to a browser and open a web page, e.g., http://www.cs.usfca.edu/~wolber/.
Right-click on an image of some good looking man or boy, and choose 'Save Image As'. Save the image file into your home directory W:/username.
Back in Dreamweaver, choose Insert | Image, then navigate to your home directory again and choose the image you just pasted.
Save your HTML file, then go to your browser and refresh to see the results.
1. Select the 'Split' tab at the top of the window in Dreamweaver. What does each view display?
Click on the border between the views and drag so that each view takes about 1/2 of the screen.
2. In the HTML View, Change the text within the <title> tags to "<Your Name>'s Homepage", e.g., Davey's Homepage
3. Save the file and refresh your browser. Where does the title appear?
1. Complete your home page, version 0.1. We will add to it as the semester progresses.
2. Open a browser and enter the URL for your new home page. Then add a bookmark to your browser by selecting the link in the browser's address bar and dragging it into the toolbar of the browser. After you've done this, you can quickly get to your home page anytime you open your browser. Try going to a different page and then clicking on your bookmark.
3. Add the course homepage, http://cs.usfca.edu/~wolber/courses/107, as another bookmark in your browser toolbar.