Update my skillz, yo.

November 11, 2007 2:47 PM

Help me get better at this whole website-making thing - like November 2007 better.

Hi. I excel at making shit in Photoshop. I can still make baby websites and such using tables (*shudder*) if I have to. And my stuff looks pretty good, I think. I get a lot of compliments and a lot of work commissioned from it.

But now, I want to upgrade. I want to start producing websites full time, and maybe get some side gig work at a few companies here in Dallas. Both with and without a content management system, what's the cool way to make a website now, from start to finish? Is it CSS? PHP? How do I learn it?

A sidenote: I am poor and I am a visual learner - meaning, I can read something a hundred times and it will never sink in. I see it performed once and I'm good for life.

So, lil' help? Make me stronger, better, faster?

posted by damnjezebel to computers & internet (21 comments total)

It depends on what you want to offer. Better design - CSS. If your working with databases, lots of users, etc. - PHP. I recommend this book called "The Zen of CSS Design."
posted by meta.mark at 2:50 PM on November 11, 2007

The place to play with CSS is the CSS Zen Garden.

PHP is... entirely different... er, it's something that runs server-side to provide dynamic content, power forums/blogs, that kind of thing. You would probably need it in addition to CSS, if you wanted to do any of those things.
posted by anaelith at 3:01 PM on November 11, 2007

Somewhat related question.
posted by Brandon Blatcher at 3:02 PM on November 11, 2007

As you've got so much to learn, the best thing would probably be to go into a partnership with someone who can do the code but not the graphics.

It's quite rare to find someone who's good at the geeky stuff who's also a good designer, so that shouldn't be too hard.

Once you're paired up, you can learn their side of things as you go along.
posted by AmbroseChapel at 3:20 PM on November 11, 2007

The "no tables" thing is cute for gimmicky design sites like the zen garden linked above. in 99% of real world cases, you'll want at least one table. It's more cross-browser, more robust, it just makes more sense, unless you want to absolutely position everything.

This doesn't mean you won't be using CSS, of course. But the whole table-phobia thing baffles me. There are so many cases where "table-less" works poorly or not at all. It even says right on the zen garden page:

Unfortunately, designing this way highlights the flaws in the various implementations of CSS. Different browsers display differently, even completely valid CSS at times, and this becomes maddening when a fix for one leads to breakage in another.
posted by drjimmy11 at 3:30 PM on November 11, 2007 [1 favorite]

in 99% of real world cases, you'll want at least one table. It's more cross-browser, more robust, it just makes more sense, unless you want to absolutely position everything.

I've designed plenty of sites without using a single table, and I'll bet many others could tell you the same. Tables are great when used as originally intended—for tabular data. When used as a way of enforcing a grid design, tables can often get in the way of code readability and aren't as flexible as tableless layouts. It doesn't mean you should never use them for layout purposes, but "99% of real world cases" is a gross exaggeration.
posted by chrominance at 3:51 PM on November 11, 2007 [1 favorite]

what's the cool way to make a website now, from start to finish?

Tables are definitely not cool.
posted by kirkaracha at 4:10 PM on November 11, 2007

The "no tables" thing is cute for gimmicky design sites like the zen garden linked above. in 99% of real world cases, you'll want at least one table. It's more cross-browser, more robust, it just makes more sense, unless you want to absolutely position everything.

No offense to drjimmy11 at all, but this is outdated advice. There are many cross-browser compatible ways to lay out sites without the use of tables. Unless, of course, you're also designing for Netscape 4.0 and IE 5.5. Don't design for ancient browsers. Provide an easy fall-through for any old browser that provides your content, but do not expect to get anywhere near what modern browsers will be displaying.

I'd suggest you take a look through the Yahoo User Interface Library, which has lots of real code that you can use directly on your site. They take care of a whole bunch of the coding tricks that you'd have to take care of yourself and provide a wonderful API for a lot of neat things.
posted by odinsdream at 4:19 PM on November 11, 2007 [3 favorites]

It depends on what you want to offer. Better design - CSS. If your working with databases, lots of users, etc. - PHP.

This doesn't make sense. The two don't serve the same function, and are practically always combined.

CSS defines the layout and look of HTML.

HTML and CSS can be generated by PHP.
posted by Mikey-San at 4:39 PM on November 11, 2007

Just seconding chrominance's excellent suggestions. There are many web sites with complex layouts done entirely with css. It's possible but still a PITA and you might have to resort to a couple of ugly css/javascript hacks.

Regarding Yahoo UIL, there's this really neat grid generator which allows you to specify a custom grid and get both the markup and css. If generators aren't your thing, you'll still find the YUI's core CSS foundation for reseting xhtml elements and fonts very useful.
posted by Foci for Analysis at 4:45 PM on November 11, 2007

The best way I've found to hand off immediately usable websites is to use content management systems which you customize for the client. Wordpress can do wonderful things - and then the client has a means to make their own updates. You need some CSS chops but a CMS means all the database and php stuff is handled for you.

If you can get yourself up to hacking Drupal for clients, you'll stay busy.
posted by zadcat at 5:57 PM on November 11, 2007

I've been wondering this exact same question damnjezebel, thanks for asking :P
posted by jmnugent at 6:01 PM on November 11, 2007

No offense to drjimmy11 at all, but this is outdated advice.

Google might disagree.
posted by normy at 6:20 PM on November 11, 2007

I only manage to turn out clean, table-less designs because I pick a CMS and then hack the CSS to be un-drone-like.

WordPress is actually very, very handy if you can think outside the blog box and repurpose the navigation, for example, so that's what I've used most recently. You can find about a billion templates, so as long as the layout works for your purpose, you can always overhaul the design. There are also loads of plugins for non-blog functionality you may need to add.

There are loads of tools you can repurpose, though - Joomla I hate, but other seem to like it.
posted by DarlingBri at 6:22 PM on November 11, 2007

[a few comments removed -- please do not turn this into a derail about using tables in 2007 when the thread only has 15 answers in it, thank you.]
posted by jessamyn at 8:10 PM on November 11, 2007 [1 favorite]

OK maybe I can help more than these derailers...

You'll want to learn XHTML and CSS to correctly program according to web standards. Why? Read ALA to find out.

If you want to get into database interaction and app building, PHP and MySQL are beautiful open source tools that will allow you to do anything you need. Lots of resources on the web and books are available.

If you want a tool that can do a lot of the heavy lifting for you, data-wise, I suggest Expression Engine. Its a wonderful content management system that is very versatile.

Beyond that, there are a million directions you could go in. Just do me one favor. Make yourself a promise to be a GOOD developer- research the best ways to do things and don't cut corners. There are enough bad developers out there that people are paying good money to. Figure out how and why certain methods work and they will become second nature.

Web development is fun, I've been doing it 10 years professionally and keeping on top of everything is fun and challenging.
posted by Chuck Cheeze at 10:52 PM on November 11, 2007 [1 favorite]

Start with the sites bookmarked at delicious/css, and explore out from there. You'll find everything you need, I guarantee it.
posted by stavrosthewonderchicken at 2:34 AM on November 12, 2007

Perhaps Lynda.com videos would be a good solution for you. For 25$ you can watch unlimited amount of videos in a month. Quick look showed that they have them on CSS and XHTML. I am not a web designer, but had a chance to watch a few of the Photoshop ones. They moved pretty slowly and had plenty of information, but I wished I found them when I was starting out with the program.
posted by A! at 3:19 AM on November 12, 2007

I think AmbroseChapel's advice -- to stick with what you know, and bring those skills to the market, by teaming up with coder-types -- is the stand-out here.

People who can talk to a prospective or actual client, hear and translate the client's needs / wants into concrete designs, and then work alongside a programmer or coder to execute the design visually and functionally, are rarer than you think. If you can make good mock-ups in Photoshop, why reinvent the wheel?

But, if you are certain that learning to build out the actual site code is the way you want to go, I agree that Wordpress is a great place to start. People hear Wordpress and think "oh, it must look like a blog," but Wordpress is really robust and versatile. Here are just a few non-blog entities whose sites are WP:

- Stanford Community Health Resource Center
- The Carpetbagger Blog at the New York Times
- all the higher ed orgs listed in this thread
- this California law firm
- this design/media firm's site
(there are loads more non-blog sites out there using WP but this is what I got in a quick Google search)

Like DarlingBri said about WP, you'll have to work to repurpose the stuff, but then afterward, the administrative side is so easy to use and train on that your client will think you're a brilliant genius. I suspect that in 2-3 years as people continue using the software and discovering how flexible and friendly it is, you'll see Wordpress as the default CMS for website building.
posted by pineapple at 5:25 AM on November 12, 2007

in 99% of real world cases, you'll want at least one table. It's more cross-browser, more robust, it just makes more sense, unless you want to absolutely position everything.

Doing a table is like eating junk-food. It feels good when you do it, but it will make you feel really guilty later on.

What tables make it difficult to do is re-arrange things when the customer asks you too (and they will). Using tables for design is just a bad thing

Facebook does not use tables on their main page, and myspace does. QED.
posted by delmoi at 8:17 PM on November 13, 2007

Also: Why not learn something like dream weaver? I'm a big HTML guy, but if you're not already what's the point? I mean, computers are supposed to make our lives easier, not the other way around.
posted by delmoi at 8:27 PM on November 13, 2007