Hi. I'm John.

Sometimes I make games. Sometimes I make websites. This is my blog.

Category Archives: Web Design


Placeholder Images For Your Site

kitten

Sean Yo from last night’s Guelph Web Maker Meetup shared a few awesome web tools I’d never heard of and I thought they were so neat I resolved to share them (and a few extras) today with everyone here.

Every web designer and developer under the sun has used (or at least heard of) the default ‘lorem ispum‘ text that is used as a filler for unfinished text copy on websites that are a work in progress. Well, now us web developers and designers have an option to use something similar for our images as well.

The image on the right should give you some sort of indication where is going… check it:

 

Need a Color Picker? Try Nattyware’s Pixie.

This thing is really handy. It’s tiny — it only takes up 8k of RAM (which is what’s left over on a typical Vista install :)), it’s loaded with features, and it works as advertised.

If you find yourself wondering what the hex color value of an item on your screen is, this tool will tell you. Simply start the program then hover your cursor over any color to retrieve its hex, HTML, RGB, CYMK, and HSV color values instantly.

Download Pixie now.

Render Your Sites In IE6 With Free Software

If you’re a web developer like me or even a web designer, there comes a time in the development of your site when you need to verify that everything works with Internet Explorer. For small sites or minor tweaks this can wait until the end of the day without much worry. On larger sites, it’s likely you’ll be checking for IE 6 or IE 7 compatibility several times throughout the project.

For those of us who have moved to greener pastures by switching to Linux or for others who have updated their system to Internet Explorer 7, several options exist to view your website in everyone’s favorite web browser: Internet Explorer 6.

In order of success I’ve had with this software, some of the options for Mandriva Linux users are listed below:

#1 – Wine, Wine-Doors, and Internet Explorer 6.

Wine-Doors is a graphical, easy-to-use point and click program that uses Wine. For those unfamiliar with Wine, it is a Windows “compatibility layer” that, in layman’s terms, allows you to run Windows programs like Internet Explorer and Microsoft Office in Linux.

Installing Wine and Wine-Doors in Mandriva Linux is a breeze. Simply open up the software installer in type Wine in the search box. Install both Wine and Wine-Doors.

Once they are installed, open Wine-Doors and click on Internet Explorer 6 to install it. Wine-Doors will take care of everything, including downloading Windows fonts and the Internet Explorer program itself.

Internet Explorer 6 works great for me this way. IE loads quick and displays websites just as it would if it were running on a Windows computer. With some of the other options listed below, the fonts and performance were not as smooth.

#2 – IE NetRenderer – Web-Based Browser Screenshot

This is a unique solution that is truly cross-platform. It’s not perfect – sometimes divs, table widths, or images are off by a few pixels, but for the most part this is a really reliable and quick solution.  The process is simple: You go to their website, paste your website’s address in a form and it will refresh with a screenshot of what your website looks like in IE5.5, IE6, IE7, and IE8 beta (still in beta as of this article’s creation).

Similar, but not free service: Browsershots. Well… It’s free, but you get put into a queue and it could take hours to get your screenshot. Unless you pay. :)

#3 – IEs4Linux

This is another project that is based off of Wine and installs easily on Mandriva Linux as well. You are able to download and extract the installer program from their homepage, but some of the fonts were off for me and it only loaded once. Once I closed the browser it never re-opened.

Also, the program is able to install IE5, IE5.5, and IE6 though I personally was only able to get IE6 installed. All other options resulted in an error. Your mileage may vary.

Complimentary Color Wheel

color-wheel

When designing sites, there comes a point where you need to decide on a color scheme. Usually you will have an idea for one or two basic overall colors that you’d like to have (red and black for Synn Studios for instance), but what about gradients or borders or shading or links?

Enter “Color Wheel” by Antone Roundy.

This is a really, really handy tool for those of us designing a website. You select the most prominent color on your website and it will give you a complete color wheel of complimentary colors. This really helps to speed up the color choices for your pages.