Maybe a better way to go about this subject is how I arrived at my chosen framework. I used to be all about Mootools by default, maybe it was the name, maybe the fact I like beef, maybe that I really dug their web site. I eventually (after sporadically testing different frameworks) arrived at JQuery as my default. So what made me choose JQuery over the countless others? Plain and simple it was the community support. Having a great framework or script is all well and good, but when you have a great user base out there that shares their innovations and discoveries then it makes it all the better. It probably didn’t hurt that in my employment we write in .NET technology and in that technology Microsoft decided that it would embrace JQuery as it’s default framework for Javascript going forward, so for me that’s a Win/Win. I program in .NET at work but do a lot of PHP stuff in my offtime, so a framework that appeals to both androgynously really perked up my senses.

So what is your preferred framework, and why?

Localhost: XAMPP
Language: PHP
Database: Sequel Pro
Editor: Coda
OS: Snow Leopard

I usually set up my sites in the Default ~/Sites folder on my Mac, just to keep things in one area mainly and for this demo we'll be using stardup.com (a domain I own and have never really done anything with due to time restraints).

I found this tutorial online a while back by Arron Wolf and it was a really good way to keep my logical file structure instead of duping directories back and forth from XAMPP's native htdocs folder. This is not super intense a process even though some people may shy away from Command Line. Follow along with the instructions on that site if you want to get it set up for your latest project. Go ahead, I'll wait…

…Okay great, you're back! Now let's begin with one really dead easy trick to keep your configuration files working on both sides, without having to change them every time you commit many site changes.

This can be done in any other programming language, however the if/else syntax changes a bit. I've also begun taking this a little further, including other bits in my code like $header and $footer stuff that will help me visually determine which one I may be looking at (as I'm often too lazy to look at the address bar).

So my next tip is related to running a lightweight version of XAMPP (because you really don't need all of the features for local development). I write a very simple Applescript that launches XAMPP with options, and then placed it in my System Preferences > Accounts > My Account > Login Items

Now I know a lot of the more hardcore programmers are probably wondering why I have to do the username/pass with administrator privileges twice, the answer is because I know only as much Applescript as I need to, and nothing more.

What exactly do these terms mean? The M and W stand for your working platform by way of Macintosh or Windows and the AMP stands for Apache, MySQL and PHP. These simple apps can start and stop the full suite of hosting tools at a moments notice without you having to muck around in your system and install all sorts of tools that require more in depth configuration. I've found that overall this can speed up programming and testing because you will not need to constantly upload files to an FTP server and check them that way, instead you would just save and refresh your browser.

And it would be sort of open-source blasphemy if I didn't mention XAMPP mainly used for Linux, but also containing flavors of Mac OS X, Windows and even Solaris.

All of these software packages are free, or have a free (lite) version available for you to use in your programming endeavors so have at it!

*Windows & WAMP makes the assumption that you are developing a PHP/MySQL Web site and not a .NET Solution

Update: I have moved from MAMP to XAMPP for local development, it's a little more flexible for my usage.

Okay, let's take a step through this method. First off is the if(isset($_POST['submit'])), all that really does it tell the page to run the mail and spam checking functions if the user submitted the form. Then it gets the POST methods from the submission and we set the variables.

The if ($human != "123") { business checks that the user is not a spambot.

In this case ABC is easy as 123, so if the user doesn't type in 123 it will alert them and send them back to the previous page (I hate to click a back button, so I took that step out). If they do answer 123 the script will hit the next block, which is a basic PHP mail function. If they did not it alerts them and sends a history.back(1) script so they can take another whack at it.

If the user did answer the secret question correctly, the script can move onto the next step. In this step the users comments will be sent to you. So I set a variable for your email (in this example you@yourdomain.com, pretty basic I know). Then the subject and message body. Tip, you can inject the variables from the first step into your subject and message, in fact you need to somewhere or you won't get any info. You do this by using the $name, $email, etc.

Cool, the form was sent and the user was informed of their success, and then sent to the site root. The } else { is fairly important, without this nothing will show up for the user to fill out.

Lastly, do not forget to put your } before the end of the script, I say that because I sometimes forget that.

So that's it, if you want to download this script for reference click here If you just copy and paste the highlighted code you'll have to replace all ' with the proper single ticks.

Ever run across a good article on a website, but you were about to punch the timecard, or head away from the computer? What do you usually do, you can drag it to your overlowing bookmark bar where you will undoubtably forget about it for a few weeks. Maybe you post it to your del.icio.us account instead, or some other bookmarking site, where again you usually forget about it. I find it's helpful to just hit command+p (ctrl+p for the PC user) and normally get just an awfully layed out print of the page, and normally it has some content cut off, well that was useless and not very green to waste the paper and ink right?

After a week of finding articles and not being able to get a decent print I aimed to fix it for our site, and then write about how others could do the same. If your a designer and your getting a lot of traffic it stands to reason that someone may at some point print out your article for later reading.

Step one: You can do this a few ways, the simplest may be making a copy of your style.css (in some cases the name may differ of course) and name that file print.css. Then fire up your favorite text or CSS editor and get to work on hiding your elements that have no need to print. (navigation, headers, backgrounds, etc. can usually get tossed out for this stylesheet) using a simple display: none; is normally quite effective.

Step two: Start to choose the selectors you want to hide for the print view, normally I set up, jot them down or directly edit the file. You'll end up cutting out the dead weight before you finish your edits. A very simple demo below is an example of how to hide everything but the article for this site.

Put this line into your page head so that the browser will know to grab this stylesheet for printing. The main difference between this and main stylesheet is the media portion.

A project can start on a few different levels, either taking an existing design and creating a reality, or creating the concept from scratch, and then taking the concept into a reality. This here will only deal wiht the former as it's all about how to get the look from Photoshop* and putting it successfully to Firefox, IE, Safari, etc.

As most designers know it is easy to slice as design and prep it for the fun part, which is laying it out. I say fun because every design seems to teach me something new about cross-platform/cross-browser success. Most people who have done this a few times will start out with a good building block, I recommend Eric Meyers' CSS Reset as a starting point. This technique tends to cut down the time it takes to tweak issues you will more than likely run into with standards development (Thank you Eric!).

So with that out of the way, what's the best way to start? I tend to reach for a trusty pad and pencil to sketch the page out and begin to label my base layout elements.

I usually begin with building blocks like:

• wrapper
• container
• masthead
• content
• navigation
• footer

But of course you will have to elaborate on those most times dependent on the design. But a good block like this works normally for my design needs. Next segment will actually entail code that I use for a basic building block!

Check back soon  as I will post some sample files in the next segment!

Luckily if you have your FTP program and a few pics handy you can just traverse your directories and spit out the files in code. This can be handy for swapping the files around and even adding more down the road, it will dynamically expand the gallery.

If you want to be slick, make thumbnails with the same name, but tag like tn_ before the image name and put them in another folder, this will allow you to call something like this:

Note: This will also work for files, you can add options to filter only images if you'd like.

First off let me say that I’m not knocking any software here, I know that people pour hours and hours of their heart and soul into building something that can be used by nearly anybody. But as a seasoned designer I have to gripe about CSS bloat, it’s everywhere, tags nested ten to twenty levels deep sometimes.

So if you're using PHP, you can always do what I’ve done using the ob_start method (in fact it’s how I’m building the Acronyms for this site currently).

So if you want to change a few things around, this is a pretty good method to help you avoid hacking core files to an OpenSource application. The code below is what you want to place before your file starts, or your content area if you’re just looking to change some wording.

This site was built using the Wordpress CMS and carefully loved with CSS for your viewing pleasure.

Simple array in place, if you were only going to replace one word on the site you could just surround it with quotes and put it into the echo str_replace function, I find this useful to help remove extra classes and ID’s unnecessary to a CMS, makes my job easier as a designer to keep the Stylesheet well formed.