Web by Booth Blog

As I work I’ve tried to collect the things I reference most often into a single place. This cheat sheet is an onging result of that effort. It isn’t pretty, but it is handy (for me at least). I hope it helps someone else: Link to full version. Embedded version below:

For me, an office in the clouds sounds like a dream come true. I put my documents into Google Docs and presto, they are instantly available on any computer. No need to worry about unreadable formats, and no worries about losing data when my hard drive crashes. But a few days ago I discovered a near fatal flaw in my heavenly vision.

No, it’s not the lack of features presently available in Google Docs. Although that is a major drawback, one that has kept me from completely packing up my digital bags and building an office in the sky. Instead it was the sudden total failure of my Google spreadsheet grade book.

I’m a teacher by day, and back in October I spent hours building my dream grade book. It’s nearly perfect because it’s available everywhere and always backed. But then Google went and fixed some bugs. Suddenly, precisely on the day I needed to report mid-quarter progress reports–POOF!–my beautiful arrayformula() formulas ceased to function! None of my actual data was harmed, but it didn’t matter, all of the grade calculations turned up errors.

Why? Well after a few minutes of fiddling I finally figured out that the formula could no longer handle the error text one of my nested if() statements returned on false. 2 hours later, after I had fixed every failing formula in my colleague’s grade book (who absolutely needed her’s fixed ASAP), I fixed my own.

See the problem? Even if the new (and theoretically improved) OpenOffice 3 is as buggy as a pile of dung, at least I know what it can and can’t do. Besides, if it suddenly fricassees one of my documents created in version 2.4, I can easily downgrade and get on with my life.

Now, think about running a business using these apps. Would you risk putting your mission-critical data in apps which could suddenly break because of an unannounced and un-asked for update? Sorry, I think keeping your head out of the clouds is the best bet.

I just discovered that that webmonkey.com is back and full of goodies. This was THE site for learning web design back when I was getting started. And it looks as good and easy to understand as ever. Check it out!

I’ve had an ongoing love-hate relationship with Linux for the last several years. Ubuntu (back with Dapper) opened my eyes to its true possibilities, and it has only gotten better since. No, of course it isn’t ready for everyday “Grandma” use, but with the new netbook remix it is a whole lot closer!

Intended to be used for the next generation of ultra small laptops, like the Asus eee pc, you can easily install it on any laptop running Hardy. I put it on my old, and very tiny, dell with a Pentium III processor and it runs fine.

The ume-launcher is the best part about it. This thing makes it so easy to find and run programs that my wife, who hates all things electronic, saw it over my shoulder and actually said “Ooo, even I’d use that!” You’ve got to try it to believe it. If only my Mac could do this… seriously why has no one ever thought of this before?!

I have been looking for a way to display my iCal todos on my desktop for the longest time. I know there are dashboard widgets that display and create todo items, but I want my todos always visible so I can stay on task easily.  But I also wanted the solution to be unobtrusive and not interfere too much with my wallpaper. (Is that too much to ask!?)

Now I have the solution! It’s not the simplest thing to do, but it works like a charm once setup.  Click on the pic below for a screen shot.

How to embed your own todo list on your desktop

1. Download and install GeekTool
2. Download this applescript: update_todos, it will gather all the todo items from all of your calendars, organize them by priority and then create a file called “todos.txt” and write the list to the file.
3. Unzip it and save it somewhere on your hard drive. It doesn’t matter where, but you need to remember where you put it. I put mine in Documents/workflows along with my automater scripts.
4. In GeekTool create a new entry and set it to a shell command. for the command, enter: "osascript PATH_TO_FOLDER/update_todos.app“. Change “PATH_TO_FOLDER” to the folder where you saved the script. (e.g. mine is “~/Documents/workflows/update_todos.app”, the “~” is shorthand for your home folder.)I set the refresh rate to 300 (5 minutes), which is pretty often for something that doesn’t change very rapidly, you can set yours to anything you want. See a screenshot
5. In GeekTool create a second shell command. Enter “cat ~/Documents/todos.txt“. See a screenshot of my settings for this one.

Viola, you should shortly see your iCal todos on your desktop in a nice neat text based format. You can get fancy by changing settings in GeekTool. For instance, you can see in the screenshot in step 5 above that I have moved the display close to the bottom of my desktop by setting the y value to 690.

I hope this helps someone else! If you found this script and tutorial useful, and are feeling generous, please considering donating $2 for it. I’m a teacher by day and you know what that means ;-).

Please Note: this script will launch ical if it’s not already running, but it will not close iCal (I wouldn’t want to interrupt your work!)

UPDATE: now you can show your iCal events on your desktop!

The following has the potential to make this script-foo even more complex so take it or leave it, no guarantees!

1. Download the update_calendar_events script
2. Save it to your hard drive
3. Open the script in ScriptEditor: On the 6th line which is, set varCalendars to {"Personal", "PCA web calendar"}. Change the names “Personal” and “PCA web calendar” to the names of the calendars you wish to view.
4. Create a new shell command in GeekTool: “osascript PATH_TO_FOLDER/update_calendar_events.app” where “PATH_TO_FOLDER” is the path to the folder where you saved the script.
5. Edit the GeekTool command you created in step 5 above. Enter: “cat ~/Documents/todos.txt ~/Documents/calEvents.txt“

This is the third letter in my series of advice to a fledgling website designer.

By now you are well on your way to becoming a master of HTML and CSS, the two foundations of great website design. This time I want to explain why you should care about web standards. Designing according to accepted standards will, in the long run, make your life easier. It may not seem so at first, but hang in there and you will come to thank me.

First, what are web standards? In the simplest terms web standards are a set of best practices that make the web a more accessible and enjoyable experience for both designers and users. Generally when web designers talk about web standards they mean that a website’s code “validates”. That is, the HTML, CSS and Javascript adhere to the W3C’s guidelines (you can check any publicly available page simply by plugging it into the W3C’s validating service).  But, in my opinion, validation is just the starting point. Truly designing with web standards in mind is an entire philosophy.

A little history will help you understand what I mean. Back in the late 90’s Netscape Navigator was the dominate browser. It was great, you could display basic text-based web pages quickly and easily, but ultimately it limited your creativity.  So, when I first got my hands on Microsoft’s Internet Explorer 4, I was really excited. Ironically, Internet Explorer had adopted many of the W3C’s standards recommendations which meant it supported CSS, among other things, better.

Internet Explorer 4 also had several proprietary HTML tags that performed fun tricks. If you wanted to be cool, and do “neat” things like scroll or blink text, you had to use IE. For amateurs it’s no surprise then that IE gained dominance in the browser wars. In a more sophisticated way IE also gained browser dominance with active x controls that made advanced business applications easier to produce.

Of course, I was just a hobbyist at the time, so I didn’t really understand, or care, about accessibility. Many of my sites, proudly carried the badge: “This site works best in Microsoft Internet Explorer”.  Everyone used IE so what was the big deal?

The big deal was that, without competition, Microsoft’s browser development stagnated with IE 6 which was windows-only compatible, while at the same time operating system and browser usage diversified. Microsoft never released Internet Explorer 6 for the Mac OS, and this crazy new operating system, Linux, was gaining steam. Apple developed Safari, the default browser for all Macs, and the archaic Netscape Navigator was reincarnated as Firefox, which was available for all major OSs. Both Safari and Firefox (and a handful of other browsers) were far more standards compliant.

It was inevitable, everything that goes up must come down. It was impossible for IE to be the ONLY browser forever. The people demanded choice. Today it is impossible for any real website to depend on proprietary technology available only in IE. Doing so means about 40% of web users who can’t or won’t use IE cannot access your site. Obviously, that is terrible for business. Imagine if Walmart made it impossible for 40% of the population to enter their store!

So, you might think that today the accessibility problem is merely academic, right? Wrong. For various reasons the big companies are still trying to win browser dominance by developing proprietary technologies (flash, silverlight, etc.). And small web designers are often uneducated or just plain lazy. Consequently, they build websites that are inaccessible to nearly half of their desired audience. You need to be different.

The benefits of the web standards philosophy:

Accessibility is clearly the heart of the web standard philosophy. That means using technologies and practices that will work the same in all (or nearly all) browsers, on any system. Sometimes this means you will have to make design decisions that seem to limit your site’s functionality, or at least make achieving the same functionality more difficult. But what you sometimes seem to lose in functionality you more than make up for in accessibility.

Usability for the visitor is another huge tenet and benefit. This aspect of the web standards philosophy extends beyond just code that validates. It also means designing the way your site functions in a standardized manner.

For example, links should always be underlined and nothing else should be, unless it is completely impossible for any user to be confused about whether something is a link or not. This obviously restricts the designer. Especially if he or she really doesn’t like what the navigation element looks like with underlined links. But think about it from the users perspective. We see hundreds of websites everyday, without consistency across all of these sites the web is very confusing. It should be incumbent upon a good designer to try to simplify a users experience rather than make it more difficult. If most users expect to see links underlined and navigation on the left side of the page… then out of respect for them you should give the people what they expect.

Usability for the designer is a corollary to both of these. Instead developing different code for every  os/browser setup that a visitor might happen to be using, it’s in your best interest to learn what works the same way in all of them. Adopting a web standards philosophy ideally means that you only have to learn one way to accomplish something.

In truth, however, this ideal is far from a reality. In fact, striving to make your site consistent across all browsers often means you have to make things more complicated in the design process. Until all browsers are themselves standards compliant you will inevitably have to learn the quirks of each.

Yet, web standards support in browsers have come a long way in the last 2 years, and with the release of IE7 and upcoming release of IE 8, pretty much everything a beginner web designer will want to accomplish can be done in the same way for all browsers. (Now, if we can just kill off IE 6 our lives will be much more pleasant.)

Long term maintainability is another good result adopting a web standards philosophy. This benefit is more immediately perceived by the designer, but it also helps visitors in a trickle down way. Sometimes this idea is referred to as “future-proofing” your site. If you design your site based on standards then, theoretically, your site won’t break when a new browser comes out. Of course this assumes that those browsers will be standards compliant, but at least for the foreseeable future browser makers have no reason not to be so and every reason to be so. So even if it is not guaranteed that a standardized website will work in the same way in the next browser versions, your chances are very good.

More choice, and less cost is the final benefit of embracing a web standards approach. Basically this is my plug for using and supporting Open Source technologies like Linux, Apache, PHP and MySQL. By using technologies that only one company has control over you tie your own fate to that of the company’s. You are at their mercy should they decide to stop supporting or developing the technology. Open source technologies on the other hand can always be carried on by anyone, and the are free.  This means that more people can have access to them. Ultimately this fuels competition which drives down cost and drives up features.

The practical advice.

Assuming you are convinced that adopting a web standards philosophy is beneficial, what do you need to know to implement it?

1. Learn and code well-formed XHTML and CSS. XHTML is a strict language, there are few rules, but they must be adhered to carefully. Especially learn about creating documents with the correct doctype. (The classic resource for learning about doctypes and their importance is A List Apart’s doctype article.)

2. Eschew proprietary technologies. Flash has legitimate uses, but building an entire website in flash is a sure-fire way to NOT be accessible. Unless you have one these legitimate reasons for using some proprietary technology then just make a personal vow to steer clear of it. Most of the basic uses for Flash, for example, can be accomplished with Javascript.

3. Learn basic usability guidelines. (another great resource is usability.gov). You don’t have to be an over-the-top usability loony, but please strive to be considerate of your users.

4. Finally, don’t look for shortcuts. Do your homework and research standards compliant ways to accomplish your goals. If something is worth doing, then it is worth doing well.

Okay so we all like to complain about them, and everybody wants to block them with fancy things like AdBlock Plus but I click on them! Yes, my dirty little secret is out. I click on web banner ads, and especially those polite little text only ads that Google runs. Why? because I want to support the websites that I use and appreciate, and short of actually sending them a check (which I do on occasion) nothing is easier then earning them a few cents with a simple mouse click.

I especially like to target the little guys. Anything I can do to support someone’s blog or pet project makes me feel good, and again, it’s so easy! Why wouldn’t you!?

Of course by now, if you don’t have AdBlock Plus installed in your firefox browser, you’ve noticed that I have a few Google ads in my sidebar. Obviously this post is a self-serving, but that is not my primary objective. Instead I want to inspire some goodwill towards all those little guys trying to defray the cost of hosting with advertisements.

In fact, Google has one important rule an advertiser must follow: they cannot explicitly tell people to click on their own ads. It is entirely possible therefore that this post will cause me to lose my account with Google. If that happens, then so be it! Let this post stand as a direct plea to click on other people’s ads because they can’t ask for it themselves.

So here’s to uninstalling AdBlock Plus and clicking on a few web ads. Why not do it now?

I really hate to say it, but website design is not a do-it-yourself venture. At least not unless you want to spend a lot of time actually learning all the technologies you need to learn in order to make functional and beautiful sites.

Case study #1 (the only one I need):

web.com offers webdesign and marketing tools for about $100 per month. They will give you a brief interview and even have their “design team” start a draft of your site. The draft is even reviewed by their copy editing and quality assurance “teams.” Then you can access the site yourself and make changes and/or have their “modifications team” make changes and receive 30 minutes of website design training every month. Wow huh?

Let me translate: They will drop your ms word documents into one of a hundered or so table-based (archaic!) templates and run spell-checker on it. Then they will grab a few cheap clip-art shots that vaguely have something to do with your business category and finally you can change some text with a web-based form.

The results:

http://www.hotrockpottery.com/

http://www.stepbysteppingstones.com/

http://www.jkartcreate.com/

What’s the cost?

web.com: $1,200 per year, for as long as you own the site. Plus a site that looks like your little brother designed it.

A small design firm that knows what it is doing: one time fee of $1,000 - $3,000, plus $0-$300 per year for hosting. Plus something that actually looks unique and works well.

I think the choice is clear.

p.s. sorry if this is a bit of a rant, but I am tired of these cookie-cutter companies duping well meaning small business owners into paying a lot for so little.

Here’s a link to 15 essential CakePHP tips. They are extremely helpful. Tips #1 and #2 alone are worth the look. (hint: these tips explain why save() “mysteriously” stops working. It’s probably because of validation conflicts. E.g. when you are trying to update only a few model fields and but have other fields marked as “required”. This happened to me while I was creating a change password form. My form only had three fields: old password, new password, and retype new password; but my validation rules for the User model said that a username was required, thus validation failed without a warning.)

I’ve only been working with CakePHP for a little more than 3 weeks but I’ve learned a few good tips of my own. Please comment to correct my noob misconceptions!

1. Temporarily turn off validation rules in a controller. save() isn’t working for you because of the problem cited above? then use the following code to temporarily bypass individual validation requirements.
   unset($this->Model->validate['fieldname']);

2. See the entire structure of variables passed to your view from your controllers: The following code prints a very nicely formatted view of the entire array:
   In your controller:
$this->set('variable','value');
In your view:
pr($variable);
3. Join the crowd in IRC! man those folks are helpful! (Colloquy is a fantastic free IRC client for Mac, Windows users, let me know in the comments what’s good!)
4. More will be forth coming as I think of them!

I’ve got a hobby php project going on, and since I don’t code in PHP every day, my memory of how to accomplish things gets rusty between coding sessions. So creating a robust, databased, php application can take me a lot longer than it should.

This frustration drove me to search for an easier way to do things. Why build my own user authentication system when there are plenty of good ones already built and free to use? But why stop there? Why not go get an entire framework to relieve the stress of having to code all nitty gritty stuff myself?

I’m familiar with other frameworks, such as mootools for javascript development, and I know how helpful they can be, so when I discovered CakePHP a PHP framework I was definitely interested. I’ve only spent a few days learning it, so my knowledge is very limited right now, but my initial impression is: wow!

Like all frameworks there is definitely a learning curve. And like most opensource tools the documentation is done by volunteers and can be confusing, although CakePHP’s documentation seems exeptionally good considering what I’ve seen with some other opensource tools.

But already CakePHP has freed me from having to design and program my own user authentication system, and it’s power in working with relational databases is awesome.

It’s definitly worth a look-see if you are interested in a powerful and fast way to develop PHP apps!