Day Two - Big & Small

Both of my sources for this theme’s entry are from Flickr. We have small plant by baarah, and Sequoia Wonder, Big Trees State Park, California by moonjazz.

Brad’s entry was significantly different than mine, and I like how his turned out. He also did more creative work in Photoshop as far as image compositing and editing goes.

Brad - Day Two - Big & Small

Let me take this moment to deviate from the topic at hand and say that I am thoroughly confused by WordPress’ image library tools. I just want to upload an image, provide a thumbnail of a dynamic size (so, have WordPress generate a custom thumbnail size), and have a click-through to the full-size image if I so choose. This has to be possible – I have a feeling I’m just missing something. Since this is the first I’ve really used it in a long time – we’re talking years – I think that’s a safe bet.

Yesterday was the first day of the creative exercise, meant to both help pass the time and give ourselves a creative “break” from work and the other necessities of day-to-day life. Yesterday’s theme was “Flowers”, and my entry is below, which is followed by Brad’s.

Day One - Flowers

I found the picture of the lily from an AKVIS tutorial and modified it to expand the background.

Brad - Day One - Flowers

See? Work hard now and reap the benefits later – and also important, having the satisfaction of knowing you gave it your all because you’re passionate about what you do. The fact that I was rewarded for doing a good job in the first ace is just icing on the cake.

You mentioned you had trouble finding versions of Firefox to test, so I wanted to point you to a couple of places that might help:

It’s true. One of the biggest frustrations I had with trying to help test pre-release versions of Mozilla products was actually finding them. Alix’s response addresses this concern.

- The Mozilla developer news blog will also have the latest release announcements and point to the download page and release notes: https://developer.mozilla.org/devnews/

This looks like a good place to start for anyone wanting to stay updated on the latest releases of Mozilla products, as well as a good source of information for developers and testers.

- The nightly builds of Firefox are available at: http://nightly.mozilla.org/

This is for those wanting to help test the latest bleeding edge version of Firefox.

- When a beta is released, it’s available at http://www.mozilla.com/firefox/all-beta.html – since there’s no beta right now you are redirected to the latest release (Fx 3.6) but this will change once we have a Fx 3.7 beta 1 out.

If you’re feeling a little less adventurous, but still want to test early releases, you can take the current beta version of Firefox for a spin. This will allow you to preview some of the new features and improvements, but in an environment that’s more stable and predictable than the nightly releases.

- Thunderbird’s early releases are available here: http://www.mozillamessaging.com/en-US/thunderbird/early_releases/

The go-to place for Thunderbird’s early releases, including everything from alpha versions to release candidates. What I like about this page is that it provides a one-stop shop for all of your Thunderbird testing needs. Want an alpha release? They’ve got it. Only interested in beta versions? They’re there too. You don’t have to hunt down each release at a different location.

- If you’re interested in joining our test community, you should check out http://quality.mozilla.org/ – we’re always looking for new people to be involved! You will get announcement for new releases and test days.

And finally, this is where to go for anyone interested in joining the test community. There you can do everything from test products to submit your own code. Or, for the less hands-on but equally important tasks, help find and reproduce bugs or analyze crash data and user feedback.

Thank you so much for your feedback, we’re going to work on making it easier to find the different versions.

Alix ends her response by saying they’re planning to make finding this information even easier in the future. I think that’s absolutely critical to garnering user feedback and important test data. If users can more easily find the test versions they’re looking for, it’ll be all the easier for Mozilla to receive the feedback that’s crucial to improving their products.

What I find even cooler, though, is that they took the time to respond to individual responses. In my feedback, I told them I always seemed to have trouble finding alpha/beta versions of Firefox and Thunderbird to test. What I received last month was a friendly response from Alix Franquet with a helpful list of places to go to find early releases of Mozilla products.

Also in my response to the survey I mentioned how I was having serious memory usage issues with Firefox 3.5 – and I wasn’t alone. It’s also not the first time I’ve run into this problem, either. I think 3.5 peaked out at ~1.7 GB  of RAM – insane. Alix asked if 3.6 was better, but at the time I still hadn’t upgraded because Google Gears and, more importantly, Ubiquity weren’t supported. Having upgraded now, I can happily say 3.6 is much better at managing memory. Right now it’s idling at 280 MB, or 17% of what 3.5 would so often near.

More important than getting the information I commented on (after all, I usually found the product version I was looking for after a while of searching) is the fact that the company – a big one, at that – took the time to respond to an individual user’s concerns. Even when I had issues over two years ago with Firefox’s memory usage, a Mozilla rep reached out then, too. It really goes a long way to building a foundation of trust and loyalty in a customer when they know their needs are being addressed.

echo '<pre>';
print_r($foo);
echo '</pre>';

That works just fine, but you can shorten it up by passing true to print_r()‘s second parameter, the $return flag, and mixing it in with your echo statements. What this does is tells print_r() to return the human-readable variable data instead of printing it to the screen right away.

echo '<pre>' . print_r($foo, true) . '</pre>';

Earth-shattering code breakthrough? Absolutely (not). However, it does turn three lines of code into one and makes it quicker (for me, anyway) to write quick debugging statements and move them around easier.

As an added bonus, you can “queue up” a bunch of print_r()‘s by capturing their output in a variable and then echo’ing it just once.

$debug = print_r($foo, true);
$debug .= print_r($bar, true);
echo '<pre>' . $debug . '</pre>';

Voila, shorter debugging statements that are easier to work with.

When it came down to it, it was just too much work trying to keep three sites up and active and full of content, which led me to update none of them. Far from ideal. It’s also a lot easier to give people one link instead of three and makes it less confusing when they don’t have to try to decide which one they want to visit.

Next steps will be to take my web development stuff over at Left Right Designs and bring that here as well, which will coincide with me getting some of my projects set up on GitHub. Over the next few days I’ll also clean up my blog categories and tags that came over with my old blog and start filling out some of my pages.

Until then, have a look through some of my other posts while I get settled.

Update: For those of you who subscribed to my old feed, be sure to grab the updated link! The old Feedburner one will still work, but you should update yours anyway.

960 Grid System (960gs) is a CSS framework that’s – not surprisingly – based on a grid system with a width of 960 pixels. Why 960?

All modern monitors support at least 1024 × 768 pixel resolution. 960 is divisible by 2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320 and 480. This makes it a highly flexible base number to work with.

I’ve been using 960 or 970 pixels as a recommended width for sites for the past two and a half years or so, but I’ve never tried working with a grid system. Although I tend to do the development side of things and not so much the design, when I get site comps they’re very often based on a grid of some sorts. That makes me curious to try something like 960gs to see if it speeds up development any, or at the very least, facilitates cleaner, more uniform CSS.

Two of the biggest things that have stopped me from using a CSS framework in the past are extra bloat from unused rules, and having to resort to non-semantic class names. 960gs currently has their CSS file down to 5.4kb, so I guess that trade-off depends on how much CSS it actually saves you from writing.

Object-Oriented CSS (OOCSS) was first presented by Nicole Sullivan at Web Directions North 2009. The first thing that caught my attention was the name, “Object-Oriented CSS.” Definitely not something I had heard of before, I read her slides on the subject and have been interested in pursuing it further ever since.

As stated on her post about it (linked above), OOCSS has two main principles:

1. Separate structure and skin
2. Separate container and content

Hang on, isn’t separating structure and skin exactly what CSS is in the first place? Yes, but she’s not referring to HTML (structure) and CSS (skin). Instead, it’s about having one class that handles the complexities of presentation, then building on that class with additional ones that provide the skin: colors, borders, background images, etc. For further explanation of these two principles, read her follow-up comment, as well as her response to another good question.

Edit: There’s also a great OOCSS FAQ over at GitHub.

Open up ckeditor/config.js and put the following code in there.

CKEDITOR.editorConfig = function( config )
{
	config.resize_enabled = false;
};

Ultimately, I was aiming to disable only horizontal resizing but that feature’s not available yet (can’t seem to find the forum post where a dev suggested they might implement it). The whole reason I wanted to disable resizing in the first place is because as soon as you would start to drag the resize handle, the editor width would shoot out and you couldn’t make it any smaller. Turns out it’s another somewhat hidden config setting forcing the resize width to a minimum amount.

If you want to keep resizing enabled but adjust the minimum width, use the following code instead.

CKEDITOR.editorConfig = function( config )
{
	// Sizes are in pixels
	config.resize_minWidth = 550;
	// config.resize_maxWidth = 700;
	// config.resize_minHeight = 200;
	// config.resize_maxHeight = 500;
};

As you’ll notice, there is also a setting for resize_maxWidth, along with similar ones for controlling the height. Any config settings you put in this file will be the new defaults for all editor instances, and once you know some of the things you can change here, you can really streamline the setup of new editor instances throughout your application.

I carved up Yoda on the right, Cassie did the bats on the left.