CSS Nested Vertical Menu

Judy Genereux, one of our Web Programming graduates, sent me a link to Devin R. Olsen’s web page showing how to created nested menus using pure CSS.

This one-page tutorial shows how to build up a menu, one layer at a time, and doesn’t add any extra information that might side-track you from the goal. When you are finished you will have a nice basic menu system that will be easy to modify for whatever site you use it on.

The best part is that this code works with IE5, IE6, IE7 and IE8 as well as FireFox and Safari.

Here is a link to an example menu.

Google Alerts

Google Alerts is a great tool to help you keep the pulse on specific topics being published to the Web.

Set up alerts for any topic you are interested in:

  • sports team
  • products or trademarks
  • your domain name (who else is referring to it?)
  • favorite topics or business names
  • people, famous or otherwise

The service is free and whenever Google sees a phrase that matches your Alert it will send you an email with links to that page.

Here is an example: I work with Drupal, an open-source content managment system. By setting up an alert for “Drupal” I can find out about all the latest reference to this program including potential security holes someone has discovered, tutorials, and new books.

Which way is up? The USB Dance.

USB plugs with "right-side up" markedI’m forever doing the USB dance. Each time I start to insert a USB device I flip it back and forth wondering which way is up. I was complaining out loud during a meeting the other day. "Why don’t USB manufacturers use two different colors of plastic or a large symbol that we can feel?" I asked everyone. Someone pointed out that there is the USB symbol, but it is so small and I shouldn’t have to put my glasses on to figure out which side of a plug goes up.

I got an idea later that day and went and got a bottle of my wife’s fingernail polish. Here’s a shot showing how I marked the "up side" of each of my USB plugs. And, now a week later I’m pleased to report that this has made my life just a little smoother.

Now, if we could only get architects to design doors so you could tell by looking if you should be pushing or pulling… Instead of fingernail polish everyone has to put up signs telling us to push or pull. That’s great until you are in a country where you don’t know the language. Why not just design things properly so their use is obvious? Push or Pull ?

We shouldn’t have to resort to fingernail polish and push/pull signs.

The New Web Counters – Google Analytics

Tracking Users

Clients often ask me about adding web counters to their web sites. When the Web first came out people would have numbers at the bottom of their pages showing how many visitors had visited the page. The trouble with this was that often these people would have their web site as their main browser page throughout the company. Then, every time an employee would open up a browser the page counter would be updated, giving skewed results.

All of has changed with the availability of new tools such as Google Analytics.

Here’s how it works: You sign up with Google and add a few lines of JavaScript to the bottom of each web site. Then, each time a person views the page Google tracks the usage. On the Google Analytics site you can log into your account and view charts and graphs and maps showing who has visited your site. You can also block specific IP addresses so you don’t have skewed results from your own company. In addition, if you set up landing pages (specific pages your advertising or marketing send people to for specific products/services) you can track how effective your campaigns are. For example, I have a landing page for my Web I programming class. Instead of sending people to our Computer Careers home page I send them directly to http://southcentral.edu/cc/web1 On this page the can (1) read a summary of the course (2) go to a registration page (3) send me an email question. Google Analytics allows me to track which decision people take which in turn helps me refine my marketing efforts.

Google Analytics also tells you the difference between new visits and when a person moves from page to page on your web site.

Paul Boag also lists some good tools you can use for this on his blog http://boagworld.com/forum/comments.php?DiscussionID=20 . His information as well as the feedback from his users will give you some other web stat tools that can help you judge how effective your web site is.


Technorati :
Del.icio.us :
Ice Rocket :
Flickr :
Zooomr :
Buzznet :

InkScape – An open-source alternative to Illustrator

inkspace.pngInkScape is an open-source alternative to Adobe Illustrator. It uses SVG – Scalable Vector Graphics which is XML based. You can download it here. Tavmjong Bah is working on an InkScape book. You can view his preliminary copy on his web site.

Here’s a sample of the type of illustration that can be created using this program:

inkscape_rpg_map.pngThis is a perfect companion to GIMP (GNU Image Manipulation Program) which is an open-source program similar to Adobe PhotoShop. GIMP is excellent for photo manipulation.


Technorati :

Got API?

gotAPILogo.gif.jpg

Got API?

An Application Programming Interface is a set of functions that let you “hook” into a system without having access to the source code or inside workings of that system. There’s an API for all the modern languages like Java, PHP, Ruby On Rails, and HTML. Sites such as Google, Amazon, and eBay all have an API allowing programmers to access information from their sites. Here’s a list of the APIs Google has available for many of its services including maps, adwords, and Blogger data. This lets a savvy programmer include all types of eBay or Amazon services on their web site by using what these sites have already created.

You can also think of an API as a dictionary. Just like an English dictionary displays words and their meanings, an API lists all the functions available in the API as well as what type of information each one is expecting and what type of information each function will return. Programmers use an API as a reference in using functions correctly.

Up until now a programmer had to keep a copy of each API on their computer or keep a list of bookmarks pointing to the APIs out on Web.

gotapi.com changes all of that. All the common language APIs are now available from a single link page. (Sorry, the application APIs such as Google, Amazon, and eBay aren’t listed yet.) As a programmer this means you can find information quickly as you are writing code.

gotAPIStartMenu.jpgTip: With the gotapi.com page displaying, click and drag the icon in the Address field gotAPIURL.jpgof your browser and drop it on upper part of your Start menu button. You’ll see a solid black line showing you were it will be positioned as you drag it into the Start list.

Anytime you need to look up a function, gotAPI.com is only a click or two away.

– Special thanks to Sean Washington for reminding me about this really great programming tool.


Technorati :
Del.icio.us :
Ice Rocket :
Buzznet :