Collecting the Internet So You Don't Have To

We work on the Internet. As such, we are constantly consuming information. Believe me, there is a lot of it out there. Sometimes we even forget things unless we write them down. Our blog covers everything from web standards to the muppets, php to comic books, music and everything else that we find interesting. Leave us a note when you drop by.

Flickr and a Canon SD1000

Technology
Wil Alambre
Wil Alambre Senior Programmer
Visual Lizard
work
1 (204) 957-5520 ext:152
fax
1 (204) 957-5519
toll-free
1 (888) 237-9559
url
http://www.visuallizard.com
Wil Alambre Whiteboard Ninja

I’ll be taking a trip to Italy in mid February, so last weekend, I popped into Futureshop and picked up a Canon SD1000 digital camera. I also made sure to pick up a spare battery and a couple 2G SD cards, as I don’t want to be in the middle Rome with a full or drained camera. I’ve never owned a camera before, nor taken very many pictures, so in the weeks leading up to my trip, I’m getting used to using the thing.

So far, I’ve been practicing taking pictures of pretty much anything that catches my fancy. I try to have the camera handy so, if I spot something even semi-interesting, I can grab it and snap a couple of images. My biggest hurdle is holding still... I usually end up with one or two good pictures for every dozen blurry useless ones. :)

Taking pictures regularly now means I’m also regularly using iPhoto. I plug in my camera using the provided USB cable, and iPhoto imports all my pictures lickety split. It’s in iPhoto that I usually review the pictures and delete all the unfocused crap. If any survive the purge, then I open up iPhoto’s editing tools to adjust tint, saturation, contrast, and over photograph-y type sliders.

On the recommendation of Julian, I then signed up for a Flickr account. For those who are unfamiliar with Flickr, it is a social network site owned by Yahoo for uploading and sharing your digital pictures. You can collect them into sets, tag them, place notes directly on your images, and comment on them. And best of all, Flickr has a free service level available to anyone.

Flickr has both a basic upload form, and a much nicer advanced upload tool that uses DOM scripting. The only catch I seemed to have so far is that, though the upload tool can handle five or six images, sometimes it stutters saying it was unsuccessful in getting a file... though when you finally get it after an attempt or two, you’ll see multiple copies, as if it did make it every time. But Flickr’s excellent AJAX tools make it a painless process to delete the copies, and to edit and update any aspect of your photos.

About a week into using Flickr, and I can already see the 100MB limit of the free account is not going to cut the mustard. I expect to upgrade to Pro by February. Also, being addicted to social network sites as I am, I was pleasantly surprised to find Flickr has an excellent API that’s been leveraged by multiple developers for widgets, badges, Facebook apps, and many more web elements! It was a simple matter to get my Flickr images to appear almost anywhere I wanted them to.

All in all, I’ve been enjoying my jump into digital photography. The availability and simplicity of the tools at my disposal have made taking, managing, and sharing images completely painless. Now, all that’s left is to get used to keeping my hands still before I get on that plane :)

Google Posts Their Best Looking Logo Ever

General
Julian Moffatt
Julian Moffatt CEO / Partner
Visual Lizard
work
1 (204) 957-5520 ext:1
fax
1 (204) 957-5519
toll-free
1 (888) 237-9559
url
http://www.visuallizard.com
Julian Moffatt Purveyor of Good Times

Google’s Best Looking Logo Ever

Google.com posted a special 50th anniversary edition of their logo in honour of Lego’s birthday. While there has been much debate in the past about how good or bad the Google logo actual is, today’s logo puts all that to rest.

Simple design rule: When your logo looks good in Lego you have a winner.

If you are a big kid at heart (and who isn’t) here are a few links to check:

Hand Written Notes

General
Julian Moffatt
Julian Moffatt CEO / Partner
Visual Lizard
work
1 (204) 957-5520 ext:1
fax
1 (204) 957-5519
toll-free
1 (888) 237-9559
url
http://www.visuallizard.com
Julian Moffatt Purveyor of Good Times

Subway order notes

We usually take turns picking up food when we work late. Yesterday I was up, so I asked the guys for their orders. This request yielded two very lovely notes from Wil (yellow) and Doug (purple).

Wil, in Freudian fashion, lets us know how he really feels about cucumbers.

Doug had been doing accounting all day, so his note reads like a math equation that has no solution (much like our accounting).

These notes earned a place in our Notes Hall of Fame for the insight they provide into the minds of two very hard working gentlemen.

Make your life easier and less frustrating in 2008

Design

1. Keep your css clean & organized. Save time.

Frustration brought by cssFor some it’s been drilled into our heads since we could barely walk and for others it’s been an uphill battle. Make an effort to get into the habit of keeping clean specific code. Start by dividing your code up into organized sections:
body, layout, general css styles (general link colours, headings & etc), layout specific styles.

Take the following into mind: 


	<div id=”column1”>
<div class=”box”><!- Box Content -></div>
</div>
 
<div id=”column2”>
<div class=”box”><!- Box Content -></div>
</div>

If for instance I wanted apply a specific link color to all links in column to with class=”at” inside a list I would do the following:

div#column2 div.box ul.submenu2 li a.at {
    [...]
}

Perhaps this example is taking it too far and something like div.box ul.submenu2 a.at would be more appropriate, but the point is the more specific you are, the better. Why?
The reason you want to be specific is to avoid clashing styles and know exactly where on the “tree” you are working. Try and get into the habit of referring to elements with their containing div class/id before them. Personally I avoid one-liners and divide everything up. Comment your sections of css code appropriately so that when your code exceeds 300+ lines of code you can easily find the part of your code that you need.

Learn about the Document Object Model which will help you grasp the concept if you haven’t already.

2.When in doubt use borders.

We’ve all been in the situation where we test our website and it’s not behaving the way we expected. This is often followed by the good old head banging and expressive hand gestures.

Apply a border to any miss-behaving elements. You’ll find there is much to be learn from the ye almighty border. If you use borders frequently I recommend creating a shortcut (depending on what program you use). I use 7+tab, 8+tab, 9+tab for coloured borders respectively with my weapon of choice.

div#column1 {
    border: 1px solid red;
    [...]
}

div#column2 {
    border: 1px solid green;
    [...]
}

Lets say for whatever reason column2 is appearing below column one and you just can’t figure out why. Turn borders on (notice the slick use of alternate colours) and ahh... The infamous double margin bug returns.

3. Test Often. Test Well.

We’ve all had that project where we simply want to do our job and couldn’t care less about the inferior non-standard compliant browsers (they know who they are). In most cases it is our job to have the websites we build work and behave in all common browsers, including IE6.

I recommend testing incrementally as you work on any given project. Not only will this help relieve any added stress towards the end of the project due to the fact that your website is indecipherable. But it will also help you reduce the number (if any) css hacks. Some developers have decided to ditch browsers such as IE6 all together in the hope to push people to newer browsers. However other developers don’t have this luxury or find it an unacceptable practice. You’ll also find it easier to learn from your mistakes if they are few (or plentiful), far and between. Rather than dealing with them all at once.

4. Develop your own base style sheet.

Find you are repeating your code on every single each project? Do you find CSS frameworks frustrating and bloated?

One of the first things we ever learn in any programming language is if you find yourself programming the same task more than once, create a function or class. These don’t exist in css however there is a simple solution. The “base stylesheet”.

Develop your own base style sheet that you understand. A base style sheet is a style sheet that includes things such as global reset / font-size / fonts / body background / wrapper / etc. Develop your own conventions for all your projects and keep them consistent. This will not only give you a head start on each project, saving you an hour or two here and there, but it will also help you easily switch from project to project without trying to figure out your base logic all over again.

5. “Professional Development”

Install a copy of your favourite feed reader or use a web app based one, such as Google Reader for instance, and subscribe to your favourite CSS related feeds. Spend 5 minutes everyday skimming through your feeds and you might just find you’ll pick up a thing or two. There are some excellent css books out there. Read reviews, read some sample chapters and pick up a copy you think you can benifit the most from. You’ll find there’s a great wealth of knowledge to be gained from these.

All in all 2008 is going to be yet another exciting year to be web developer. I encourage you to give these disciplines a shot and you’ll find yourself spending less time on trying rewrite or trying to figure out your code allowing you spend more time on other aspects of your work.

CakePHP Website Updated

Technology
Wil Alambre
Wil Alambre Senior Programmer
Visual Lizard
work
1 (204) 957-5520 ext:152
fax
1 (204) 957-5519
toll-free
1 (888) 237-9559
url
http://www.visuallizard.com
Wil Alambre Whiteboard Ninja

Click here to visit the official CakePHP website

The official CakePHP website sports a new design at the start of this year, designed by Armando Sosa. Not only is it a handsome update in and of itself, but also draws attention to the beta release of CakePHP 1.2. I haven’t had a chance to experiment too much with 1.2 yet, but with the full stable release expected to come out May 2008 (-ish?), I think I’ll have to give it and all it’s new features a try :)