Code | Webdesigner Depot

OUR LATEST POST ON TECHI

Rating Apple's Annoucements: Great Updates to iPods, iTunes and a Meh Apple TV http://bit.ly/d3shOZ

31 Mar
Fight Div-itis and Class-itis With the 960 Grid System
CSS, Code, Programming
30

Years ago, HTML tables were the standard for laying out web pages. CSS and semantic thinking changed that, and today CSS frameworks make designing relatively easy.
But they can also generate a surprising number of superfluous elements.
The 960 Grid System encourages the addition of <div> elements and class attributes, especially on complicated pages. Is this really an improvement over nested tables?
Creating cleaner code means going beyond the framework and thinking about what it really represents.
Read more
15 Mar
CSS Bugs and Inconsistencies in Firefox 3.x
Code, Firefox, Programming
38

There aren’t many articles covering incompatibilities, or CSS differences in Firefox alone — and for good reason.
Firefox has always done an excellent good job of supporting both CSS and JavaScript in a standards-compliant manner without too many awkward bugs.
There are, however, a few CSS properties and selectors that aren’t supported by one or more of the versions released since version 3.0., which I will cover here.
This article will cover bugs, inconsistencies, and nonsupport. So, if you’re having trouble with a CSS property or selector in Firefox and it’s not listed here, then you’ll probably have to rethink your layout and reconsider what the culprit might be. Read more
5 Feb
How to Plan for the Absence of JavaScript
Code, How to, Programming
34

Though the methods used to gather website traffic statistics call into question the validity of the stats themselves, the fact is that some of your website’s visitors will have JavaScript disabled.
You could divide your traffic sources into four broad categories:
Search engines, mobile visitors, visitors using screen readers and visitors who have JavaScript turned off.
When planning your information architecture and design, you must figure out how to deal with these special groups.
I have assembled a few recent real-world scenarios to find clarity on the issue. Read more
29 Jan
10 Tips for Better Print Style Sheets
Code, Print, Web Design
62

Print style sheets have been somewhat forgotten, and yet they remain important all the same. Many people print out articles to read while traveling or when they have no access to the Internet.
Print style sheets have definite benefits. For example, reading on paper is less tiring on the eyes than reading on screen.
Also, following tutorials is easier if you have one next to you, with your code editor open on the screen; that way, you don’t have to switch windows every time to look something up.
In this article we’ll point out 10 easy tips that will help you create better print style sheets.
Read more
18 Jan
CSS Transitions 101
CSS, Code, Programming
72

Despite people’s expectation of change and movement on the screen, CSS and HTML have few controls that allow you to design interactivity, and those that exist are binary.
A link is either one color or another. A text field is either one size or another. A photo is either transparent or opaque. No in-betweens from one state to the next. No transitions.
This has led to most web pages feeling abrupt, with elements shifting and changing ungracefully.
Yes, we can use DHTML and leverage the jQuery library for transitions, but this requires a lot of code for something that should be very simple.
What we need is a quick and easy way to add simple transitions to the page and in this article you’ll find useful information about CSS transitions and how to use them. Read more
20 Nov
The Ultimate Toolbox for iPhone Development
Code, Resources, iPhone
46

iPhone development can be intimidating, especially to someone who’s unfamiliar with Macs, or the way iPhone apps work.
But with currently more than 100,000 apps officially available from the App Store, it’s kind of hard for a developer to ignore the potential market the iPhone provides.
And there are apps for virtually anything you could think of, from games to productivity apps to horoscopes to news and more.
Below are 70 tools, tutorials, and resources to help you get started developing your own iPhone apps. There’s everything from basic tutorials to templates to resource libraries to help you on your way. Read more
12 Nov
Coding a Web Design for Speed and Quality
Code, Usability, Web Development
90

The beauty of being a web designer is creating a detailed, creative, and original web design in Photoshop, without having to (for the most part) think about how it will be coded.
During the design phase, it’s all about the look, and either the coding can be taken care of later, or be outsourced to a developer.
Either way, not thinking about the development usability or functionality is a great way for a designer to not feel limited in the design process.
This is a great way of thinking, and can lead to the best designs. However, once it does need to be coded, we as designers are in a tricky spot.
In this article, you’ll find a few simple tips that can help designers learn basic XHTML/CSS conversion efficiently for a quick-loading website that is accurate to the original PSD. Read more
18 Aug
250+ Resources to Help You Become a CSS Expert
CSS, Code, Compilation
56

CSS is the second-most-important thing you can master when it comes to web design, right after HTML.
And the capabilities of CSS can be staggering (especially with the new CSS3 standard already making appearances in some browsers).
If you can imagine it, it’s likely someone has already figured out how to do it with CSS.
Below are more than 250 resources for mastering CSS. While they’re not likely to make it any less staggering, they can help you master the techniques that will help set your designs apart from the crowd. Read more
10 Aug
5 CSS3 Design Enhancements That You Can Use Today
CSS, Code, Development
94

Cascading Style Sheets (CSS) is the language of Web design, and the next generation of CSS design properties are just chomping at the bit to be released.
Are you eager to start using them, but don’t know where to start?
Although many of the new properties are not yet “official”, some browsers have already implemented many of the features of the coming CSS Level 3 specifications.
The problem is that many browsers—most notably Internet Explorer—have not.
The trick to using these new CSS3 features is to treat them as design enhancements. Read more
22 Jul
30 Handy Cheat Sheets and Reference Guides for Web Professionals
Cheat Sheets, Code, Web Developers
90

Cheat sheets and reference guides are useful for both beginners and advanced web professionals.
They can be used to help you remember syntax or as a tool to aid in memorization.
In this post, we aim to cover the reference guides for all of the most commonly used platforms, software and coding languages.
Below you’ll find a compilation of the 30 most useful and well-organized cheat sheets, checklists and reference guides.
If you know of a useful cheat sheet that we haven’t covered here, please share the link in the comments’ section at the end of the article.
Read more
20 May
10 Best CSS Practices to Improve Your Code
CSS, Code, Programming
157

It’s really easy to find yourself wondering how your CSS got to be such a mess.
Sometimes it’s the result of sloppy coding from the start, sometimes it’s because of multiple hacks and changes over time.
Whatever the cause, it doesn’t have to be that way. Writing clean, super-manageable CSS is simple when you start off on the right foot and make your code easier to maintain and edit later on.
Here are 11 tips for speeding up the process, writing CSS that is slimmer, faster and less likely to give you a headache. Read more
10 Feb
14 Applications for Project Management and Collaboration
Business, CMS, Code, Freelancing
85

In this article, we list several great applications for project and time management as well as collaboration between you and your clients. There are free and commercial options available.
These project management apps are here to save you time, but they can also be very time consuming and not intuitive. If you have a team who works with you remotely, then this is an ideal choice. If you are a freelancer however, you will have to spend some time learning these as well as teaching your clients how to use and interact with the application.
Let’s keep the cons aside and give the apps a chance, you can then see for yourself which ones will suit your needs best. Read more
5 Feb
Is Google Chrome The New IE 6 For Web Designers?
CSS, Code, Programming, Validation
123

Just when you thought you were done with IE 6 and its hacks and exceptions, now you’ve got a new browser to consider: Google’s Chrome.
The good news is that Chrome is a lot more compatible with web standards than IE 5 and 6. However, Chrome has its own idiosyncrasies and bugs.
No one knows if Chrome is here to stay, but it has already captured a surprisingly decent share of the web browser market in a short period of time.
Here are some tips to get your web pages working in Chrome and hopefully looking the way they were designed to look.
Read more
20 Dec
Quick and Easy WordPress Development on a Mac with MAMP
Code, Programming, WordPress
47

Ready for some WordPress development on your Mac? First, you need to be running Apache, MySQL, and PHP.
Although Mac OS X comes with Apache and PHP, you don’t want Apple’s automatic software update to break your development environment by changing your working versions of PHP and Apache. Plus, do you really want to spend time tweaking MySQL?
In this guide, I will show you how to quickly install and configure a working WordPress environment including Apache, PHP, and MySql. Read more
11 Nov
How Ajax Works
Ajax, Code, Programming
19

In traditional JavaScript coding, if you want to get any information from a database or a file on the server, or send user information to a server, you will have to make an HTML form and GET or POST data to the server. The user will have to click the “Submit” button to send/get the information, wait for the server to respond, and then a new page will load with the results.
Because the server returns a new page each time the user submits input, traditional web applications can run slowly and tend to be less user-friendly. With AJAX, your JavaScript communicates directly with the server, through the JavaScript XMLHttpRequest object.
With an HTTP request, a web page can make a request to, and get a response from a web server, without reloading the page. The user will stay on the same page, and he or she will not notice that scripts request pages, or send data to a server in the background. Read more