Webpage Template Connect Sessions

We'll be conducting twice monthly Connect sessions on working with the CSU Extension webpage template, starting on the second Wednesday in January, and continuing on the 1st and 3rd Wednesdays of every month.

We'll work with every aspect of the webpage template, from downloading the files and defining the site in Dreamweaver to publishing the site working with Google Analytics to see who is visiting your site, and why.

The complete schedule is below. Each session will start at 9 a.m., and run approximately an hour. Mark your calenders!

Jan. 13 – Walkthrough of template components; Walkthrough of Dreamweaver workspace

Jan. 20 – Directory structure, defining the site

Feb. 3 – Metatags; Adding text, images, links to the home page

Feb. 17 –Working with Server Side Includes (SSIs)

March 3 – Named anchors

March 17 – Micro-content (headers, links, lists, data definition lists, buttons, block quotes, boxes)

April 7 – Working with tables on the main page

April 21 – 2nd level page content

May 5 – Writing your own CSS

May 19 – Using Google Analytics

Connect Session Archives

The session archives for Connect trainings (http://www.coopext.colostate.edu/comptrain/co.shtml) have been redesigned to make topics easier to find. Everything is now on one easily searched page.

Over 30 hours of computer Applications training are now archived there, including Connect sessions on CSS, Dreamweaver, Google Tools, Image Editing Using Photoshop and GIMP, Office 07, Online Collaborative Tools, Photoshop, and Writing HTML and CSS from the Ground Up. All sessions are between 30 and 90 minutes long. Please check them out!

HTML 101 Tutorial

Darrin Goodman has put together an excellent HTML 101 video that succinctly explains the basic structure of the HTML tags in a web page. It's a great introductory lesson if you are just learning about HTML and web design. Check it out!

This video was created with free and open source software. The tools used: Ubuntu Linux, Firefox, Leafpad, and gtk-recordMyDesktop.



Another excellent tutorial on HTML and CSS is available at http://www.youtube.com/watch?v=GwQMnpUsj8I. It shows you how to create a webpage from scratch using only a text editor.

The 25 Second Rule

It is easy, if you have a fast internet connection, to be lured into the assumption that the rest of the world has one as well. But a significant percentage of the people looking at your website are using dial-up connections, and you need to keep them in mind when designing your web pages. The 25 second rule is a good one to keep in mind: make sure your web pages can be downloaded within 25 seconds on a 56 kbps (kilobytes per second) modem.

If you are using Dreamweaver, this is easy to check. Look in the lower right-hand corner of the document window (see below; click to enlarge) and you will see the download time of whatever page you have up in the window.



To change the connection speed, and see how quickly your page loads at different speeds, use the pull dowbn arrow just to the left of the download time (see below; click to enlarge). Click Edit Sizes. from, there you will be able to choose from a variety of different connection speeds.

Using Filters in Google Analytics

If you use Google Analytics to monitor traffic to your website, it might be wise to exclude visits to the site by yourself and other site developers. You can do this easily, by adding a filter, so that certain IP addresses or domain names are not included in the metrics.

Log in to Google Analytics and select the site you want to add the filter to. Click Edit, toward the right side of the screen (see below, click to enlarge).



Go to the section Filters applied to profile and select +Add Filter (see below, click to enlarge).



This will take you to the filter dialogue box. Choose whether you want to exclude traffic from a domain, an IP address, or traffic to certain subdirectories, and then enter the domain, address, or subdirectory. In the example below we've used an IP address. Click Save Changes and you are done (see below, click to enlarge).



You can use the site What is My IP Address (http://whatismyipaddress.com/) to find your IP address.

To see a Connect tutorial on setting up Google Analytics for your site, go to the Connect tutorial page on Google Analytics (http://connect.extension.iastate.edu/p28806841/)

Online Dreamweaver and Photoshop Tutorials

Adobe has thousands of video tutorials up at Adobe TV (http://tv.adobe.com/channel/how-to/), in easy to digest five minute segments.

These tutorials cover the latest versions (e.g. CS4, in most cases) of all the products Adobe offers: Dreamweaver, Photoshop, Flash, Acrobat, Illustrator, InDesign, Premeire, and lots more. Experience levels range from beginner to advanced. They are well thought out, and well produced.

Embedded below is a tutorial pulled from their site on defining a site on Dreamweaver CS4, the first step in working with any site in Dreamweaver.



Thanks to Darrin Goodman for the tip!

Microcontent

People read books. They scan websites.

Keep this in mind when adding content to your own website, particularly your home page. Use short sentences, short paragraphs. Develop a clean, clear, simple writing style. Write like Hemmingway.

An excellent strategy to draw people into your site is use micocontent. Microcontent refers to small bits bits of text, formatted so they can be easily scanned.

Example include...

Headlines:

Links:

Lists:

Buttons (image links):

Boxes:

Blockquotes: