Aim: Why do we create a Web page Counter?

As a Web Master you might want to know how successful your design is?
How many People had visit your site?
What kind of customer visits your site and Why?

This is just and introduction to WEB DESIGN, therefore we are not going to build a Web counter, that requires PHP and JAVA scrip coding we don´t get to learn in our class.

Please Insert the following link into your Home Page

https://spreadsheets.google.com/viewform?formkey=dGE5UGRRai1xUXJTOWxrSWhXWXNGZ1E6MA

1. Tell friends and family to visit your site and then hit that link.
2. It will take them to an online survey that will measure how many visitor are going to your site.
3. Make sure they know your company´s name and the  name of the Web Masters ( you and your partner)

Aim: How to Troubleshoot the remote folder setup?

The following list provides information on common problems you may encounter in setting up a remote folder, and how to resolve them:

• The Dreamweaver FTP implementation might not work properly with certain proxy servers, multilevel firewalls, and other forms of indirect server access. If you encounter problems with FTP access, ask your local system administrator for help.
• For a Dreamweaver FTP implementation, you must connect to the remote system’s root folder. Be sure to indicate the remote system’s root folder as the host directory. If you’ve specified the host directory using a single slash (/), you might need to specify a relative path from the directory you are connecting to and the remote root folder. For example, if the remote root folder is a higher level directory, you may need to specify a ../../ for the host directory.
• Use underscores in place of spaces, and avoid special characters in file and folder names wherever possible. Colons, slashes, periods, and apostrophes in file or folder names can prevent Dreamweaver from creating a site map.
• If you encounter problems with long filenames, rename them with shorter names. On the Mac OS, filenames cannot be more than 31 characters long.
• Many servers use symbolic links (UNIX), shortcuts (Windows), or aliases (Macintosh) to connect a folder on one part of the server’s disk with another folder elsewhere. Such aliases usually have no effect on your ability to connect to the appropriate folder or directory; however, if you can connect to one part of the server but not another, there might be an alias discrepancy.
• If you encounter an error message such as “cannot put file,” your remote folder may be out of space. For more detailed information, look at the FTP log.
  Note: In general, when you encounter a problem with an FTP transfer, examine the FTP log by selecting Window > Results (Windows) or Site > FTP Log (Macintosh), then clicking the FTP Log tag.

Aim: How to create a Menu bar using Dreamweaver preset Spry?

1. Select Insert > Spry > Spry Menu Bar.
2. Select Horizontal or Vertical, and click OK.

Note: You can also insert a Menu Bar widget using the Spry category of the Insert bar.

Note: The Spry Menu Bar widget uses DHTML layers to display sections of HTML on top of other sections. If your page contains Flash content, this might cause a problem because Flash movies are always displayed on top of all other DHTML layers, so the Flash content might be displayed on top of your submenus. The workaround for this situation is to change the parameters for the Flash movie to use wmode="transparent". For more information, seewww.adobe.com/go/15523.

1.  Define a Site LB9.
2.  Create a Root Folder and Name it LB9NameLastnamePeriod#
3.  Open 5 new Html file .
4.  Title and Save the first one as MY NEW YEAR RESOLUTIONS 
5.  Title and save the other for by each one of your four NEW YEAR     RESOLUTIONS; Write a couple of sentences about each in their pages.
6.  Edit the homepage, "MY NEW YEAR RESOLUTIONS"  by inserting a SPRY MENU from the property inspector.
7. Link all pages together
8. Copy the Menu in all the other pages
9. Verify that works. 
10. YOU can add picture, color background or rollovers for extra-credit.
11. Compress the root folder that contains the SpryAssest folder as well as your pages.
12.  Send me the LB9NAMELASTNAMEP#.ZIP file via email.
13.  Upload it to your Folder on the server.

AIM: How to Set up a remote folder?

This folder is where you store files for production, collaboration, deployment, or a number of other scenarios. Typically, the remote folder is on the computer where your web server is running. You can set options for this folder by answering the wizard questions in the Basic tab or by clicking the Advanced tab and entering the information directly.

In the Dreamweaver Files panel, the remote folder is referred to as your remote site. When you set up a remote folder, you must select an access method for Dreamweaver to upload and download files to your web server.

For a tutorial on setting up a remote folder, seewww.adobe.com/go/vid0162.

AIM: How to create a "contact me" link using Dreamweaver?

An e‑mail link opens a new blank message window (using the mail program associated with the user’s browser) when clicked. In the e‑mail message window, the Tool box is automatically updated with the address specified in the e‑mail link.

Create an e-mail link using the Insert Email Link command

1. In the Document window’s Design view, position the insertion point where you want the e-mail link to appear, or select the text or image you want to appear as the e-mail link.
2. Do one of the following to insert the link:
   
   
   • 
     
     
     Select Insert > Email Link.
     
     
     
     
   • 
     
     
     In the Common category of the Insert bar, click the Email Link button.
     
     
     
     
   
   
   
3. In the Text box, type or edit the body of the e-mail.
4. In the Email box, type the e-mail address, then click OK.

Create an e‑mail link using the Property inspector

1. Select text or an image in the Document window’s Design view.
2. In the Link box of the Property inspector, type mailto:followed by an e‑mail address.
   
   
   Do not type any spaces between the colon and the e‑mail address. 
   (all information you could find on Dreamweaver help)
   
   
   
   
   
   
   
   1) Define a Site LB8.
   
   2) Create a Root Folder and Name it LB8NameLastnamePeriod#
   
   3) Open a new Html file.
   
   4) Create a Email link Using the Property inspector linked to your email.
   
   5) Send me the lab via email.
   
   6) Upload it to your Folder on the server
   
   
   
   

AIM: What is a Rollover?

It is time to add some fun stuff to our websites!!!

1) Open up a new or existing web page/site on macromedia Dreamweaver.

2) Scroll your mouse up to the main toolbar on the top of the screen and hit Insert.

3) When the menu appears after hitting insert scroll down to Image Objects.

4) When hovering your mouse over Image Objects another menu will appear.

5) Scroll over to Rollover Image, and click once.

6) Next a dialog window box will appear. Click browse and browse your computer to find two images for your roll over image.

7) Once you have selected both of these images click okay and continue.

8) You will now have you rollover image complete. You may edit it by clicking on the icon in the page and using the properties button below.

9) To preview you roll over image go up to the top of your screen to the globe click and scroll down to Internet Explorer.

10) You will then be able to preview your image when running your mouse over top of the image.

11) Don´t forget to link it to your ONLINE BLOG

12) SEND me the compress folder with both pictures and rollover HTML file as a Zip file named LB7NAMELASTNAMEPeriod #

Aim: What is CSS?

ASSIGNMENT FOR TODAY 01/07/09

visit For a tutorial on understanding Cascading Style Sheets, see www.adobe.com/go/vid0152

1._ Manage well your time you got a full period to improved and build up your site!

Remember you are required to have:

Hyper links, Email link, rollovers, animations, buttons, spry menus, background, Pictures, copyright information, date last update, date create among other important components of a fully functional website.

2._ Read the information below!!!

As you continue designing and building your website! you might find very useful to learn about CSS. As you were working on your site You might have stumble by the CSS Panel or watch me changing properties of the site by a side panel. Unaware that you were working already using Cascading style sheets and left behind simple HTML language!

In adobe experts´ words:

You can use table design features in Adobe Dreamweaver CS3 to create a simple page layout. However, a more powerful technique is to use Cascading Style Sheets (CSS). The basic building block of CSS layout is the div tag— an HTML tag that in most cases acts as a rectangular container for text, images, and other page elements. When you create a CSS layout, you place div tags (or divs) on the page, add content to them, and position them in various places. Unlike table cells, which are restricted to existing somewhere within the rows and columns of a table, divs can appear anywhere on a web page. You can position divs absolutely (by specifying x- and y-coordinates), or relatively (by specifying their distance from other page elements).

In Dreamweaver, you can quickly and easily place an AP div (short for absolutely positioned div tags). These elements provide great control over the page layout,reduce the amount of code you need, and enable you to format layout blocks with margins, borders, and colors. In addition, people using screen readers to view web pages have a much easier time browsing pages built with CSS because the code is simpler and shorter. The limitation of an AP div, however, is that since it is absolutely positioned, its position never adjusts on the page to accommodate to the size of the browser window.

You will learn more about CSS in later units.