Web Explorations

JumpCut is a free app for the Mac that allows you access the contents of your last 25 copy operations.

On most systems you only have access to the current clipboard. So, if you copy an item (CTRL c) it overwrites the previous copy. With JumpCut you have access to a list of items you’ve copied giving you the ability to copy multiple items and paste them into a document or form when you need them.

I especially find this useful when I want to copy multiple URL addresses to send in an email or when writing code and want multiple snippets of code available.

I use JumpCut on a regular basis whenever I’m editing or writing. It has become a natural extension to my copy/paste activities.

Although I haven’t used it, there is a similar program for people using Windows. copy/paste clipboard extender that is available for free here. Or, you can pay $10 for a more sophisticated version out at BriefSoft.

Adobe has released a new Flex application called Browser Lab. It allows you to see what your web pages will look like in a variety of browser versions including FireFox, Safari, and Internet Explorer (versions 6, 7, and 8).

You can set up a side by side view, magnify part of the page, and select different browsers.
There’s an onion-skin feature that lays two pages on top of each other so you can quickly check alignment issues.

This tool is very helpful because it is so hard having access to multiple versions of Internet Explorer.

Here is a screen shot showing my home page in FireFox 3.0 and IE 7.0.

You do need to register with Adobe to use this tool. However, if you are already registered for BuzzWord (a collaborative document site) or Kuler (a color scheme tool) than you have the userID/password you need. Here’s an article I wrote on Kuler.

Apple does it right.

On Wednesday I received an email notice from Apple saying that Snow Leopard, the new operating system was ready to ship. If I ordered right away I could have it by Friday.

Price. I thought about it for a few microseconds and then placed my order. After all, a major upgrade for $29, what a deal. And, the reviews were coming in very positive. A faster, smaller upgrade that solved real problems instead of adding on unnecessary features. And, it was shipping a month early. (Take note Microsoft!)

As Promised. Friday afternoon comes and as promised here comes Snow Leopard disguised as a FedEx delivery person. Right on time.

Customer Service. Ahh, but there is a glitch, a lump of coal in the snow. When I start installing the new system I hit an error. There is a scratch on the CD-ROM and the installation errors out. But, my original system is still intact and running fine. So, I call customer service. Something I don’t normally do. Hey, it’s only $29. (Actually it is $69 because I ordered the family pack license for 5 computers.) I can’t believe it when the Apple representatives answer the phone on the third ring. After some verification of my address I’m told a new CD will be on its way. I should have it Tuesday or Wednesday. “We are so sorry for the inconvenience,” the representative tells me with what sounds like true sincerity.

The snow leopard is very rare. So is a company that ships weeks before a deadline, does fast shipping, offers a product with a low price and increased performance, and has absolutely great customer service if something goes wrong. Now, that’s the way to run a business. Apple shows that this is possible. It’s a shame that the few remaining Snow Leopards living in the remote Himalayan mountains of Tibet are so rare. The world needs more Snow Leopards.

Photo by Dave Murphy. Check out his Flickr photos.

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.

The established way to publish a book, or calendar, or photo book was to beg a publisher to accept your manuscript. An editor would help refine your writing and get it prepared for printing. For economy hundreds or thousands of books would be printed and stored as inventory while the publisher and the author worked on marketing the book. The author normally gets 5-10% of the sale of the book.

If changes have to be made a new edition is set up and another printing run.

WIth Lulu.com all of that changes.

Here is a great opportunity if you have anything you are passionate about. From your business to a hobby, you can write about what you know and love and publish a book about it for minimal costs. And, you can make about 80% on the sale of each book.

This is a great way to promote a product or establish your expertise in your field. (What a great resume builder!).

Or, if you are into photography you can publish a calendar or photo book with your writing and images.

I recently published my first book, Secrets of a Web Developer using Lulu.com and discovered the following:

1. I could use Word to write and layout the text and graphics.
2. Word will build a table of contents and an index with just a few clicks of the mouse. Both of these can be quickly updated if any changes are made to the text.
3. Using Word styles greatly simplified the editing and formatting process. With every element on the page marked with a specific style all I had to do was change the style and that element changed throughout the entire document. (Very much like CSS styles.)
4. PDF format (printed from the Word file) is much more stable and easy to work with, especially when using fonts that are not common on Window machines.
5. My start up costs were zero (not counting the weeks and weeks it took me to write, edit, and fine-tune the contents.
6. Errors could be corrected immediately. The only challenge was the time it took to upload a 300 page file (80 meg).

90 percent of the work was preparing the manuscript. I had over thirty Word documents that were converted into web page tutorials using a program called Wimba Create. After updating and revising each of these doc files inserted them into a master document. In the master document I changed each of the styles that I had used for Wimba to the look and feel I wanted for the book. As I inserted each new document the Wimba styles automatically changed to the new look and feel of the master document.

To build the Table of Contents all I had to do was position the cursor near the beginning of the document and use Insert/Document elements/Table of Contents. Each of the major headlines was used to build the table of contents. If I changed the document all I had to do was right-mouse click on the table of contents and select “update field” from the list of options.

The index was a little more difficult. Going through the document I highlighted each keyword I wanted in the index and hit CTRL OPTION Shift x. This made a hidden field containing the index information. After the keywords were selected I went to the end of the document and used Insert/Index and Tables and selected the format for the index.

The only real problem I had was when the index word was bold in the document it showed up bold in the index as well. Even after going in to edit the index markers the bold would not go away. For my next book I will create the index marker in the main text so it won’t be bold.

Once I had everything ready to go and had created a cover using PhotoShop I used the Lulu.com publishing wizard. It took about four hours one morning to complete the process. Along the way I discovered that it was easier to use a PDF file for the cover art instead of using the online cover creator. When I had first designed the cover I had only thought of the front and had to rebuild it to a specific dimension including a back cover as well.

I also used the FTP uploading service because of the larger file size I had. Once the FTP transfer is complete the file is automatically transferred into the My Lulu files where it can be selected as part of the content. That means that each time you connect to the FTP server it will be empty.

I first uploaded the Word document. However, Lulu gave an error because I had used a special font (Adobe Caslon) and Lulu didn’t have that available. They recommended that I make a PDF file from the Word document which effectively embeds the font as part of the document.

After I finished the wizard Lulu automatically built a web page with a preview window. I am able to customize which pages show up in the preview window as well as add a text describing the book. (I used the introduction section from the book itself.)

I also built a landing page on my website describing the book and added a brief summary on my home page.

My start up cost was zero.

And, here’s the best part: Instant Revisions. As a proud published author I sent an email out to members of my family. About ten minutes later I get an email from my son pointing out that I misspelled XHTML (XHTLM) three places (the magic of copy and paste!). I quickly made the fixes, reuploaded the files, and ran through the wizard again. The correction was made in less than an hour. Now that’s my kind of publishing.

The downside of Lulu.com (and other self-publishing venues)

• You are in control of the entire process. You are your own editor and graphic designer and it is very hard catching all those errors, weak writing, and horrible design flaws.
• The finished book will only look professional if you create a professionally design document. Headers, page numbers, typography, page layout, and graphics are all essential to making a book look and feel “right”.
• Designing a cover is especially important and a step I found very difficult. I put off publishing for weeks as I agonized over the cover design.
• Having a book from O’Reilly or Harcourt Brace is like having a degree from Harvard or MIT. It means you have gone through the wringer and survived and that most likely the text fairly high quality
• No one will buy your book unless you get the word out and market it

The benefits of Self Publishing

• The book is immediately available and easy to update
• You are in control of the entire process
• The books are printed as they are ordered. You don’t have to buy any expensive inventory that might sit in your basement for years.
• You make about 80% on the sale of each book
• You book is available to a global market
• You can be any age, any body, any where, writing about any thing

Let me know when you are published. Leave a comment with a link to your newly published text!

Over the years students have asked/suggested/cajoled that I write a book with the information I present in my classes. For starters I decided to pull together all of the tutorials I have written for my Web Development course.

The Secrets of a Web Developer is now available for $39.00. You can view some excerpts from the book as well as the complete table of contents out on the site.

There are over 300 pages covering all the major aspects of web page development with lots of screen shots and graphics and step-by-step instructions.

• The
  Web and the Internet
• XHTML markup
• Page styling with CSS
• Page layout
  using CSS
• SEO – Search Engine Optimization
• Design Principles and the Design Process
• Web Marketing
• An introduction to JavaScript

These tutorials were written for anyone interested in learning
how to build web sites with no prior knowledge of programming or HTML.

This is an entry-level book and all you need is an understanding file
management and basic typing skills.

The tools are all free. You will need a color-coded text editor (such as NotePad++)
and a browser. FireFox is recommended because of the many add-on tools that are available.

If you are interested in taking the complete Web Developer course online there is more information at http://southcentral.edu/cc/course/webDev.html.

Steve Pottenger has set up a new blog on using Nikon cameras. His first lesson covered using the automated flash units and different settings that you can use to get different results.

His lesson got me inspired to go out and do some shooting. Here’s a shot from my neighbor Tom’s garden of his poppies against the quick summer storm that passed through.

http://www.nikonspling.com/

I look forward to his next lesson!

Each semester the Web Development class at South Central College is required to complete a capstone project, working with a business. This project is designed to use all of the material covered in the class in a practical manner. At the same time the student gets hands-on practice in business communications, problem-solving, and citizenship.

This project gives small businesses and entrepreneurial companies an excellent introduction into web marketing and establishing a presence on the Web.

Students added to this year’s showcase include:

• Kelly Bode – Barn Wood And More..
• Rose Kruse – Kruse Insulation
• Kevin Leintz – Mankato Mamapalooza
• Nicole Weisenburger – Dance Express
• Monica Yarger – River Valley Industries

Here is a link to the showcase showing some of the top sites created for businesses over the last few years.

Programming is an art and a science. It’s a life-long passion, not something you will learn in 7-days, 30-days, or even a semester.

Learning one language is not learning how to program. Peter Norvig, in his 2001 article, “Teach Yourself Programming in 10 Years” summarizes this up:

Researchers (Bloom (1985), Bryan & Harter (1899), Hayes (1989), Simmon & Chase (1973)) have shown it takes about ten years to develop expertise in any of a wide variety of areas, including chess playing, music composition, telegraph operation, painting, piano playing, swimming, tennis, and research in neuropsychology and topology. The key is deliberative practice: not just doing it again and again, but challenging yourself with a task that is just beyond your current ability, trying it, analyzing your performance while and after doing it, and correcting any mistakes. Then repeat. And repeat again. There appear to be no real shortcuts: even Mozart, who was a musical prodigy at age 4, took 13 more years before he began to produce world-class music. In another genre, the Beatles seemed to burst onto the scene with a string of #1 hits and an appearance on the Ed Sullivan show in 1964. But they had been playing small clubs in Liverpool and Hamburg since 1957, and while they had mass appeal early on, their first great critical success, Sgt. Peppers, was released in 1967.

Being a programmer is a state-of-mind. And if it your passion, those ten years will fly past before you know it.

Here’s some points that Peter lists as Secrets to Success:
* Get interested in programming, and do some because it is fun. Make sure that it keeps being enough fun so that you will be willing to put in ten years.

* Talk to other programmers; read other programs. This is more important than any book or training course.

* Program. The best kind of learning is learning by doing.

* Work on projects with other programmers. Be the best programmer on some projects; be the worst on some others. When you’re the best, you get to test your abilities to lead a project, and to inspire others with your vision. When you’re the worst, you learn what the masters do, and you learn what they don’t like to do (because they make you do it for them).

* Work on projects after other programmers. Be involved in understanding a program written by someone else. See what it takes to understand and fix it when the original programmers are not around. Think about how to design your programs to make it easier for those who will maintain it after you.

* Learn several programming languages. Include one language that supports class abstractions (like Java or C++).

---

So, as you struggle with that obtuse error message, or work through a re-design or a re-design for a program that just didn’t work right keep in mind that challenge to move out just beyond your current ability; making yourself an expert in your field.

Kacie Kinzer is interested in humans and how we interact with each other. The TweenBot is a rolling box with a smiley face and a flag giving the robot’s desired destination in the middle of New York City.

Thinking that the robot might be destroyed or ruined due to the hazards of city life it was made disposable. Kacie filmed the results from a discrete distance and it is heart warming to see what happens.

I can’t help but wonder if the tweenBot had been fashioned after the more sinister Transformers. Or, how would people respond if it was otherwise rude and abrasive with flashing lights and was painted with an irritating color combination or loud boom-box noise output. I think it is the happy face that does it and the delightful simplicity of the TweenBot. (There is a lesson in all of this!)

Here’s Kacie’s website describing the TweenBot project.

Mission 1: Get from the Northeast to the Southwest Corner of Washington Square Park / time: 42 minutes / number of people who intervened: 29

Doing a search on Kacie I discovered the Whisper Jar:

One secret captured forever in a jar, until a human comes along to listen to it and then replace it with his or her own secret. The roundness and the white luminescence inside a plain and simple canning jar makes this so magical. I wonder where I can get one for my office?

Kacie has more! She created the There Chair. When Kacie sits on the chair in her apartment in New York City, a light glows in the chair back home at her parent’s house, giving them a sense of presence. This is so totally cool.

So, this isn’t really about if people are good or not, as I first thought when I saw the TweenBot video. Instead I think these designs show us connection, with each other and the technology around us.

Here is Kacie Kinzer’s portfolio if you would like to see some other fascinating designs that touch deep into our sense of being connected as humans.

One of my favorite technical words is “noodling”. I have my students noodle around with code to see how it works – have them break it and than fix it again to get control.

I often noodle around with code when working on a project, trying to stretch things a little more, trying to find out “What happens if I do this?”. This is especially useful when working with CSS and a new web site design.

At South by Southwest I heard Jared Spool from User Interface Engineering talk about design and user interfaces. I’m on their mailing list now and today he introduced me to another technical term: hunkering.

Here’s a excerpt from his article:
The behavior of hunkering was the same [for all types of people]:

1. They lay out whatever physical pieces they have — raw materials,
   sketches, and images they’d collected.
2. They work to put things close to where they’d be in their final
   form, relative to the other pieces.
3. Then they step back and ponder it for a while.
4. In some cases, they walk around to view it from a different
   angle, to see what it looked like from another perspective.
5. Then they start back up to work.

This can be done in any type of business from web designer, to programmer, to cabinet maker, to dress designer.

Hunkering also ties in with a book I’m reading,
A Whole New Mind, by Daniel Pink. Daniel talks about using both sides of the brain, both the analytic left side as well as the more artistic, free-flowing right-side in order to deal with challenges we face in today’s world. No longer can we just be analytical thinkers working a problem in a straight line. Instead, we have to become more artistic thinkers, looking at things as a whole and getting ideas from other disciplines. Jared’s term “hunkering” describes how to do this process in a very real manner.

So, next time you are starting a project, before you start writing code or hammering nails, do some noodling around and hunkering to kick your right brain into gear.

Here’s Jared’s article: Hunkering: Putting Disorientation in the Design Process.

I’ve just finished a tutorial that will show you how to annotate your programs using PATH statements so you can specify where a file is relative to the file or program that is running. This information is essential for web pages (displaying graphic files stored in a graphic folder), as well as applications (looking to open databases and text files).

If you are working with files of any kind you’ll need to understand how to write a path statement.

On Monday, February 23rd I’ll be presenting at the Marketplace for Entrepreneurs, a free conference being held at the civic center in Mankato, Minnesota.

I’ll be talking about using the Web as a Marketing tool and will be discussing:

• Obtaining a domain name and hosting service
• How to use the web to check on your competitors
• Tips ‘n tricks on getting your website developed
• Things every web site must have
• How to improve your SEO (Search Engine Optimization)
• Google Analytics and AdWords

There are over 20 speakers presenting on three different tracks throughout the day. So, if you are in the Minneapolis/St. Paul, Mankato area you should check this out.

On February 11th, 2009 Thomas Friedman wrote in the New York Times, “We live in a technological age where every study shows that the more knowledge you have as a worker and the more knowledge workers you have as an economy, the faster your incomes will rise.”

What are you doing to become a knowledge worker?

Knowledge Worker – a person employed due to his or her knowledge of a subject matter, rather than their ability to perform manual labor. It includes those in the information technology fields, such as computer programmers, systems analysts, technical writers and so forth. The term can also refer to people outside of information technology but who are hired for their knowledge of some subject, such as lawyers, teachers, and scientists.

If you haven’t been out to WhiteHouse.gov lately I suggest you take a look. President Obama and his communications team know about the Web and they know how to communicate. Notice how easy they make it for you to send your ideas and thoughts to the team in Washington. (Of course, their followup in the weeks ahead will really show if the communication loop is truly there.)

The next time you open up iTunes, check out the Presidential Podcasts. No longer waiting for the news media to take their cut and put their spin on the topic, the President is now producing weekly video podcasts that you can download and play and decide for yourself. Notice how the title isn’t “The President’s Weekly Address” but instead: “Your Weekly Address”. Those few words change the whole purpose of the message. It is a message for you, it gives whoever watches this ownership.

In this week’s address the President mentioned the creation of a new website http:Recovery.Gov. Of course, I immediately pulled up the site to only find a landing page with links to WhiteHouse.gov and USA.gov (and several validation errors….) I’ll be interested to see what they do with this.

At first I was disappointed when I did a view/source not to see the Google Analytics code at the bottom of the page and then it dawned on me… this is the President’s Office. They can track all of the analytics they want for any of their landing pages.

The Web is more than eCommerce or watching videos of Mentos and Coke. It is going to be one of the major tools that will help us work together to fix the things that are broken. Finally, after 20 years, we finally have a President that understands and is ready to use this incredible communication tool.

And, it also brings up the question: What are you doing with your web knowledge that will make a change in our world?

BrowserShots.org allows you to specify the URL of a target website and then proceeds to take “pictures” of how the page will look in each of the browsers you selected. This is a great way to do the final testing on how well your pages work without having multiple browsers loaded on your machine.

Here’s what the home page looks like:

There is also a link that will validate your CSS code as well as your XHTML code.

The top graphic a look at my home page which is a valid (strict) XTHML page. Notice how text and images don’t show up on all the browsers including the new IE 8.0

Special thank to Tim for telling me about this valuable web site.

I just received this email question from one of my students:

Peter,
I am currently working on a website for one of my clients. She said that she took your web design class and mentioned that you use QualityHostOnline.com for your hosting and domain needs instead of GoDaddy. My question is why? Why meaning is there a reason or just a preference that you choose Quality Hosting. Please let me know.

Here is my response:
Tim,
Originally GoDaddy limited what you could install on the server. When I first hosted with them I quickly found out I couldn’t install Drupal. I still remember how arrogant the help person was telling me that the agreement did not allow a refund but that he was going to refund some of my money anyway…

The Drupal limitation has since been fixed although recently there was a snafu with a GoDaddy client using Drupal and being charged over $6,000 (http://www.huffingtonpost.com/adam-fendelman/why-i-dont-owe-godaddy-65_b_129276.html) The only thing that helped resolve the problem was his article on Huntington and the furor it caused. All the bad press caught GoDaddy’s president’s attention and he stepped in to resolve the things and stop the bad press.

Their advertising is extremely sexist. Something I might enjoy looking at but not something I can recommend to students in class. Especially when one of my students started doing a web site for his church…

And, just recently, I tried to transfer my domain being held by GoDaddy to QualityHostOnline. It took me over two months to accomplish due to an unknown userid/password that was automatically setup without my input when I purchased a privacy option. Because my email on GoDaddy was no longer valid I had to fax, mail, and send scanned copies of my driver’s license and a specific numbered form to a branch of GoDaddy. They would also have accepted copies of my passport which makes me even more nervous. They made it EXTREMELY difficult to do the transfer. I had to send the request three different times and made numerous phone calls all to the answer of “I’m sorry, that is out of our control.”

Meanwhile, I’ve been with QualityHostOnline for almost five years now and have had excellent support, low cost, and overall good results on a consistent basis. They were very helpful and responsive during my domain name transfer. I’ve also recommended this hosting service to other instructors and many many clients and everyone is having the same positive experience.

So, there you have it.

Guess I’ll make this into a blog entry.

Peter

PS – You might want to do a web search for “GoDaddy ethics” It makes for some interesting reading.

Addendum: 09-15-09 I’ve been having a lot of downtime with QualityHostOnline.com and am migrating my servers over to BlueHost.com based on recommendations from several of my students. I can no longer recommend QualityHost as I have in the past.

We feel fine is an interesting Java Applet utilizing colors, shapes, and motion. It summarizes phrases from blogs on the Web based on emotion keywords, weather, age, sex, etc.

Check out the presentation that its creator, Jonathan Harris made during a TED conference:

Here is a quote from their mission page:

Since August 2005, We Feel Fine has been harvesting human feelings from a large number of weblogs. Every few minutes, the system searches the world’s newly posted blog entries for occurrences of the phrases “I feel” and “I am feeling”. When it finds such a phrase, it records the full sentence, up to the period, and identifies the “feeling” expressed in that sentence (e.g. sad, happy, depressed, etc.). Because blogs are structured in largely standard ways, the age, gender, and geographical location of the author can often be extracted and saved along with the sentence, as can the local weather conditions at the time the sentence was written. All of this information is saved.

At its core, We Feel Fine is an artwork authored by everyone. It will grow and change as we grow and change, reflecting what’s on our blogs, what’s in our hearts, what’s in our minds. We hope it makes the world seem a little smaller, and we hope it helps people see beauty in the everyday ups and downs of life.

SitePoint is offering The Art and Science of CSS as a free PDF download until December 1st, 2008. Check it out at this link: http://twitaway.aws.sitepoint.com/

• Using Flash for specific fonts
• Rounded corners
• Specialized background techniques (very cool)
• Using CSS with tables

Lots of really great ideas and lots of example code walking you through everything a step at a time.

While you are at it, register for their Community Crier newsletter. Its short and sweet and often has some great ideas included.

Leverage your knowledge of the Web. Here’s a great opportunity to meet some really interesting people and help non-profits with their web presentation.

Sierra Bravo is a web design group in the Minneapolis-St. Paul area and they are putting together their 2nd annual Overnight Website Challenge.

The Challenge: Build ten teams of volunteer web pros to create free websites for ten nonprofits. Last time we dropped the F-word (free free free) we had more takers than we could take. Sierra Bravo fully expects that this kind of loose talk will again open the floodgates for non-profits seeking help and do-gooder types with mad programming chops. So, until there are no more good nonprofits with bad websites, let’s do it again.

Even if you aren’t a professional coder I’m sure the folks at Sierra Bravo would love to have you pouring coffee or making movies.

Be a part of the movement of using the Web to help change the world.

– Thanks Jesse for sending me this link!

Plan to attend? Post your experience as a comment to this blog entry.