VSW Workshop Summer 2006

Friday, July 21, 2006

Swapping Images
Here is an example of swapping out images and image rollovers.

Last Day!
We made it through the week. A lot of hard work and determination and some excellent web pages. Congratulations!!!!

Today's demo will be on uploading finished web pages to a web server or host. Most hosting companies give you access to your site via a web page and a control panel. I will also show how to use an FTP program called Transmit (for the Macintosh).

I have posted links to some of the websites that students have uploaded. If you have a url to your website, please email me so I can post it.

Thursday, July 20, 2006


Afternoon Photo Break....

Web Hosting
If you want the public to see your web site, you must publish it to a web server. The first step is to obtain server space on a server. There are a variety of ways you can do this, sometimes the school or job you are associated with offers space, or you can purchase space through a hosting company or ISP (Internet Service Provider).

Here are some links to some sites that offer hosting services for a range of prices and services.
Web Hosting -Compare Services
GoDaddy
Dotster
Doteasy (offers free hosting, I have a friend who uses this)

Domain Name
Hosting services often offer specials that include the purchase of a domain name. You can also purchase a domain name separately from several companies.

Embedding Media
Video
Using Flash MX
Using Embedded Video in Flash MX
Flash, Video and Dreamweaver 8
Using Dreamweaver and Flash Video Object
Sound
Flash
Flash in HTML
Flash - Video Import Wizard

Forms
Here is a simple HTML mail-to form that you can use on your site. Tis does not use any server-side scripting technologies.

If you are interested in getting a little more technical with your forms and using php or cgi server-side scripting technologies, here is an archive of scripts that are available for download. Remember, your web-hosting service must support these technologies for you to be able to use them.

Flash Slideshow Templates
To use with Photoshop CS2
Download the templates here to try them out.

Review of Anchor / Link Tags
A hyperlink or a link is a pointer from one page (or file) to another.
<A HREF="page.html">link text</A>
The A stands for anchor, the HREF means HyperText Reference

Link colors are part of the page properties. If you change them using the page properties dialog box (in Dreamweaver), you will be setting the color values for the ALL the links on that page.

Another approach (and what we looked at in yesterday's class), is to use CSS or style sheets to define your anchor or link tags.
A:link
A:visited
A:active
A:hover

To read more take a look at some of these pages:
CSS Anchor/Link States

Wednesday, July 19, 2006

Wednesday's Class **please read**

We are hitting the halfway point and I have been tremendously impressed with the energy, time, and quality of the work you have been producing. I just wanted to give everyone a heads up on what my expectations were for the web site you are creating for the workshop. This particularily pertains to those students who are taking the class for credit.
Each student should incorporate the various technigues that we are covering throughout the week into their web pages. This means that you should be able to show me your planning sketches, you should be able to discuss your ideas and strategies and your inspirations, you should have a layout that includes tables, graphics or images that you have resized and reworked in Photoshop and saved for the web.
Your web pages should include either graphical rollovers, or use of the hover tag if your navigation is text based (HTML). We will cover CSS (Style sheets) today, and the use of fonts. Your pages should reflect a basic understanding and usage of styles.
Today's demo will also include links and linking your pages together. Your web site should contain at least 3 to 5 pages that are correctly linked together using a well planned and designed navigational system. We will also cover links to "outside" sites.
Thursday and Friday we will look at various ways to include interactive or animated content to your site. This will include forms, frames, putting your webpages on a server, incorporating video, sound or Flash animations into your pages. Many of you are already planning and designing pages that will include these technologies.
If there are other questions or skills that you wish me to cover in the next two days, please mention it so we can put it on the list.
If you are unsure of how your current pages measure up to my expectations and to a passing grade, please talk to me today. I will also be speaking to students individually about their work, so be ready to demonstrate that you have the above incorporated into your pages.
Thanks.....

Tuesday, July 18, 2006

Sample Pages
Table widths and sizes
Background Images
Font Faces and Sizes

Tables
The HTML tables allow you to arrange information into rows and columns of cells. The links below define table usage and illustrate basic table examples. Take some time to review the pages. We will be covering tables today in class, and I will go through the process of inserting a table into your html page.

Many of these links also include information about other HTML tags and usage. Because everyone learns and understands things a little differently, take some time to read through some of the pages and bookmark the sites that help you understand a little more about this mysterious thing called HTML!
HTML Table Basics
HTML Tables
Table Sampler
So You Want A Table, Huh?
Table Tutorial
Beginners Guide to HTML Tables

Monday, July 17, 2006

Creating Slideshows - Displaying Photographs/Artwork
Here are some websites that use various technologies to display photos or art work. If you have other sites to share, please post the url as a comment.
FLASH
Dustin Aksland
Flickr
Greyhounds

JAVASCRIPT or PHP
thegreyhounds.com
990000.com

FLASH - HOW-TO
Blogger Templates
SlideRoll

JAVASCRIPT - HOW-TO
Codelifter
Cut-And-Paste Javascript
Slide-Show Wizard

Summer Workshop 2004 link
Use the information and links on this previous workshop blog to get ideas, inspiration, or ask questions about.
Some of the information may and will be duplicated on the 2006 blog, and we will be covering many of the same skills. If you see something that you are curious about and want to learn more about, PLEASE ASK!!!! Your questions form the foundation of this workshop.

Monday's Class:
  • Introductions - to the class, to the facilities, and to Rochester.
  • Discussion of individual goals for the week.
  • For the next five days you will be planning, designing, coding a web site. Throughout the workshop we will discuss various strategies for developing effective and consistent navigation, functional site organization, and the use of graphical design and creativity.
  • Much emphasis will be placed on the conceptual development of your proposed/planned web site through the week. Starting with your initial idea - how you work with and expand upon that idea, and how well you incorporate the various skills, ideas, techniques, and peer/teacher feedback into your final piece.
Hands On and Demos:
- Strategies for mocking up your site.
- Software, HTML Editors and more
- The importance of planning!!

Wednesday, July 12, 2006

The class starts Monday and I am looking forward to meeting everyone and finding out everyone's interests and ideas. I am going to post some links that may bet some of us inspired or headed in a particular direction.

See you next week.

Saturday, April 08, 2006

Web Site Design For Artists

July 17 - 21 2006
Visual Studies Workshop
31 Prince St.
Rochester, NY 14607

For more information about this workshop or other summer workshops at VSW please contact Kris at 585-442-8676 or the VSW web site