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:

Google Search Tip

It can be overwhelming to filter through the results of a Google search link by link. There is a new feature now, where you can sort the links by time, and thus find the most recent posts quickly. Click the "“Show options” link (the one with the little plus sign in front of it) below the search box. Lots of filtering options will appear on the left-hand side of your screen, so you can limit results to posts made in the last hour, the last week, or the last year. Lots of other options appear as well (shown at the left), including "Fewer shopping sites" to help ween out the folks trying to sell you something, and the "Wonder Wheel" to give you a graphic representation of related subjects.

There will be an all day Google Tools workshop in Pueblo on December 4th, where we will explore how to use on many of the amazing free Google tools available to you. Email me at Jeffrey.Wood@Colostate.edu for more details.

Thanks to Loretta Lohman for the tip.

Google Docs Presentations

Google Docs allows you to share a synchronized PowerPoint presentation with others using a shared URL. Combined with a conference call, you can offer an entire presentation in this manner. For free!

Upload the PowerPoint to Google docs. Then in the upper right-hand corner, click Start presentation, which will turn the presentation to full screen.

In the lower right-hand corner, click View Together. This will bring up the presentation with a chat pod on the right (shown below).





Just above the chat pod will be a URL to share with the others in the group. Email the link to the rest of the group. As they click on the link, their names will show up on the chat pod. When everyone has joined, simply progress through the presentation, slide by slide. The presentations on their screens will move with yours, so everyone wil quite literally be on the same page.

Google Doc Forms

This is an incredibly useful tool I use so often, and suggest to others so frequently, I was actually surprised to realize I hadn't written about this already.

You can easily build an online form and have it write the resulting data to an online Excel document housed at a Google Docs account. The form can handle many kinds of questions: multiple choice, multiple answer, text, paragraph text, grids, and scales.

To create a Google Docs form, go to your Google Docs home page. Choose Create New, then Form.



Simply type your question text into the Question Title box, choose your question type, and type in your answer options.



If you like, you can add a customized confirmation message. The resultant poll can be emailed, published as a stand alone web page, or embedded in an existing webpage or blog (as I've done below). The data will be automatically written to an Excel form at the Google Docs site.

Here's a sample form embedded into this blog. It's a live, functioning form, so feel free to fill it out. I promise to read your answers!

Publisher and PowerPoint Templates

Much has been made of the Extension webpage templates, but there are other templates at your disposal as well, for brochures, reports and PowerPoint presentations. Also available are a wide range of loges, in different colors, sizes, alignments and backgrounds.

Template for Publisher brochures are available at http://www.ext.colostate.edu/logos/Communications%20Template-Instructions/. There are templates here for Colorado Living brochures, 4H brochures (one is shown below), and general Extension brochures. Also available here, inside the Photos folder, are a wide range of photos and images, cleared for use. The instructions for using all of these are resources are posted at the URL as well.



Templates for a wide range of press releases and reports are available at http://www.ext.colostate.edu/logos/Communications%20Template-Instructions/Report%20templates/. Many of these allow you to easily insert an image of your own to personalize the graphics (a letterhead with an blank placeholder for your own image is shown below). Instructions are posted.



Template for PowerPoint presentations are available at http://www.ext.colostate.edu/logos/PP_Templates/. One of the Master Gardener title slides is shown below.



Finally, a vast number of CSU, Extension, 4H and Master Gardener logos, in many formats, sizes, colors, and alignments, are available at http://www.ext.colostate.edu/staffres/bulletin/logos.html. Applicable graphic standards are posted here as well. The MG logo is shown below.

Excel 07: Table Formatting

A cool new feature in Excel 07 is the automatic formatting options available for tables.

If you go to the Insert tab, choose Table, and select the data you want to convert, the Table tools and formatting options will appear in the ribbon.




By default, Excel will band the rows and columns for easier reading. It will also add pulldown filter menus to each of the column headers, a total row at the bottom, and a pulldown menu in the bottom right to quickly get a minimum, maximum, average or sum of your total row. Each of these options can be easily turned on or off in the Table Styles Options section of the ribbon (see below).

Pagination in Word 07

Paginating a specific section in previous versions of Word could be a frustrating process, and I suppose it's comforting to know that some things never change. Here's a tutorial on paginating a specific section of a document in Word 07.

First, you need to create a separate section. Go to the Page Layout tab, choose Breaks, then create a section break (in most cases you'll want a "Next Page" section break). This is shown in the screen shot below.



Next, choose a Header, Footer, or Page Number option from the Header and Footer section at the upper left (shown below).



Now, the crucial step: disconnect it from the previous section. This can be done in the Design tab by clicking the "Link to Previous" button in the Navigation section, to toggle OFF the link (shown below).



From there, it's simply a matter of going to the Page Number command, choosing Format Page Numbers, and choosing which numbering style you want, what number to start with, etc. The previous section of the document can be formatted with the same dialogue box. Or, if you don't want the previous section numbered, simple choose Remove Header or Remove Footer from the Header or Footer tab.

Creating Masks in PowerPoint

Sometimes you want to highlight a section on a graphic by masking out the rest of it with a semi-transparent mask. An example is below. Here's how you do it in PowerPoint.



1) Insert the graphic (Insert>Picture).



2) Use the drawing tool to draw a rectangle over the graphic (Insert>Shapes, then choose the rectangle tool and draw it).



Then, right click the rectangle, choose Format Picture and dial the transparency up to 25% or so.



It should now look like this:



3) Draw an oval over the bit you want to highlight. Use the Fill Color tool to make it a different color.




4) Select the oval, hold down Ctrl, and select the rectangle. Right-click, and choose Save as Picture. Name it "mask.png".



5) Delete the rectangle and the oval. Then insert the mask.png graphic you just made (Insert>Picture, and browse to "mask.png").

6) Click Recolor Picture. Select Set Transparent Color. Then click the oval. This will make it transparent.





To see a live demonstration of this process, and learn how to animate it so the mask dissolves in and moves from item to item, show up for next Wednesday's Connect session on PowerPoint 07, from 9 to 10:30 a.m.. There will be an announcement in Monday's email, or you can contact me at jeffrey.wood@colostate.edu.

ZScreen: Free Screen Capture Software

I mentioned today in a Connect training session that I changed a Word document to a .jpg image by taking a screenshot of it, as Connect allows you to import .jpg's, but not Word documents. I did not explain how I did that. Personally, I use SnagIt (http://www.techsmith.com/screen-capture.asp) for these kind of screen captures, but it costs $50.

A free piece of open source software that works nearly as well is ZScreen (http://brandonz.net/projects/zscreen/index.html). You specify whether you'd like to capture the entire screen, a specific window, or a crop of your desktop. You can set the hotkeys for the capture to whatever you want (a screenshot - created with ZScreen - of that menu is below), choose what folders you want to put your images into, and whether you want to bring them up in a photo editor after capture.


ZScreen doesn't have all the bells and whistles of Snagit, but it is fast and fr`ee and good at what it does. If you bring your captures up in an image editor like Photoshop or GIMP to modify it, you can do anything Snagit can do.

Convert PowerPoint to Flash

ISpring (http://www.ispringsolutions.com/)is a cool, free little add-on to PowerPoint that allows you to convert PowerPoint into flash files (.swf) so they can be inserted into web pages, Moodle, and any other platform that uses Flash content. It adds a tab (shown below) to the PowerPoint "Ribbon," or toolbar


It also allows you to easily insert Flash movies into PowerPoint slides, and YouTube videos as well.

An example is shown below. It is the the PowerPoint that will accompany the "Using Connect" Connect session on Sept. 2, from 9 to 10 a.m.. For more information about attending this session, contact me at Jeffrey.Wood@colostate.edu.

Reusing Slides in PowerPoint 07

Slides in PowerPoint presentations get reused often. In older versions of PowerPoint, all you had to do was click Insert, Slides from Files, and then browse to the slideshow from you want to reuse a slide.

Oddly, Microsoft has made this commonly used command a little harder to find in PowerPoint 07, the latest version of PowerPoint. I've gotten several questions about it already. So, here's how. Click the dropdown arrow just under the New Slide button. Then go to the bottom of the dialogue box and you'll see the Reuse Slides command. Click it, browse to the slideshow you want to use, and you're done.

Joanne Littlefield and I will be holding a Connect session on using PowerPoint 07 on September 16th, from 9 a.m. to 10:30 a.m. If you're new to PowerPoint 07, or thinking of switching to it, be there. An email reminder will be sent out the week before.

If there are any specific topics you'd like addressed during the session, please email me at jeffrey.wood@colostate.edu.

Online IT Training on Facebook

eXtension now has a presence on Facebook (http://www.facebook.com/). Facebook is a social networking site that provides a "feed" from other people's Facebook pages. You essentially subscribe to another person's feed by becoming their "friend." Think "contact" whenever you see the word "friend" on Facebook and the whole thing will make more sense.

You can network with other Extension professionals there, share ideas, provide feedback and much more. Sign-up is easy; all you need to provide is an email address and a password. Other profile details are optional.

If you do a search for "Extension Online IT Training" (use the Search box in the upper right corner) you can join the Extension Online IT Training Group. Their next training is "The Basics of Working With Images" on Wednesday, August 19, from 12-2. Go to
http://slms.delta.ncsu.edu/join_meeting.html?meetingId=1247246047004 at the appointed time to attend the session.

Future IT trainings posted on Facebook include discussions of Twitter and Facebook. The more general eXtension Group on Facebook offers a calender of Connect sessions on working with keywords, the Ask an Expert widget, and much more. Become a Extension Online IT Training member on Facebook to learn more.

Excel 07 Page Layout View

Microsoft Excel 07 - the latest version of Excel - offers a solution to one of the most vexing aspects of Excel: print formatting. In older versions of Excel, to format the printed version of a spreasdsheet, you needed to go to File, then Page Setup, then Print Preview, and then sort of hop back and forth between Page Setup and Print Preview and tweak the layout to get the correct printed page. Getting the rows and columns to break at just the right spot was a cumbersome and time-consuming process.

Excel 07 has a Page Layout view as the center icon at the lower righthand corner of the page (it's circled in the illustration to the right). It changes the view on the document screen (below) to how it will look when printed so that you can tweak it and see your changes enacted immediately. The row and column heading bars are moved to just outside the document, so you can resize rows and columns, hide columns, etc., just by working with the row and column bar options. You can also use the Ribbon commands to change font size and styles, hide or show gridlines, add border styles, all on the document pane, until you get the exact printed document you want. You can even add headers and footer by clicking directly on the page and typing. Page breaks, both horizontal and vertical, automatically readjust as you make changes to the document.

Firefox Add-ins and Hyperwords

Firefox's Add-ons page (https://addons.mozilla.org/en-US/firefox/) allows you to easily customize the Firefox browser. There are hundreds of add-ons available, ranging from changing the appearance of your browser to managing bookmarks, downloads and RSS feeds. Many are merely odd, some are engaging enough to actually change the way you use your browser.

I'll focus on one I find particularly useful here: Hyperwords (https://addons.mozilla.org/en-US/firefox/addon/1941). Hyperwords adds a right-click menu to your mouse button so that by selecting text and right-clicking you can select from a dizzying array of commands. Search Google for the selected text, look up a dictionary definition, translate it one of 16 languages, copy it to your clipboard, even shop for it on Craigslist. The screenshot below shows how to search for YouTube videos of Pedro Martinez simply with a right-click and a couple of menu commands.



This is just one of the hundreds of add-ins available on Firefox. I urge you to follow the link at the top of the post and take a look. it will change the way you use your browser.

Google Wave - The Future In Web Communications

Google Wave is a new tool for communication and collaboration on the web, coming later this year. This tool seems to combine email, instant messaging, blogging, tweeting, image sharing, document collaboration, and other forms of communication into one amazing tool. Potential uses seem almost endless. At this time, there has been no announcement for a release date, but you can request that Google contact you once the tool has been released. Watch the video demo below.

Sources:

- http://wave.google.com/
- http://anotherubuntu.blogspot.com/2009/05/google-wave.html

Edward Tufte and Smart Art

I just read Edward Tufte's snarky, funny and deadly accurate diatribe against PowerPoint,The Cognitive Style of PowerPoint: Pitching Out Corrupts Within, and thought I'd address a solution to one of the problems he poses in the essay.


Tufte correctly points out that a limitation of Powerpoint is that the bullet point format forces the content of every slide into a hierarchical relationship, with one bullet point relentlessly following another down the slide. PowerPoint 07 offers a partial solution to this limitation with Smart Art.


PowerPoint 07 offers the option of sidestepping the traditional march of bullet points down the slide. Go to the Insert Tab and choose Smart Art. The dialogue box offers plenty of visual formats to represent not only lists, but processes, cycles, hierarchies, relationships, matrices, and pyramids (an example of the "Cycles" options in the dialogue box is shown at left). Some example of slides are shown below.

Smart Art won't magically turn a boring, sloppy or badly designed presentation into an exciting and meaningful one. But it is a step in the right direction.