How can I update my late-'90s HTML skills?

September 27, 2004 7:06 PM

RipVanWinkleFilter: Way back in '98, I learned very basic HTML. I wrote some code, made graphics in Photoshop, saved it all in Simpletext, got a domain, and had myself a website. And, err ... six years later I'm basically using the same method. Help me upgrade my skillz? (mi)

Obviously, I'm not a web designer by trade. I haven't kept up with CSS updates, or all of the various standards-compliance advances. But I like making sites myself, and I'd like to think I'm somewhat savvy around techie things. (I once was proficient at Macromedia Director, at least.) I also have a graphic-design background, and as such avoid Comic Sans and seizure-inducing blinkies.

Still, I find myself constricted by the fact that I don't know what the hell I'm doing. (Seriously, I go back to System 9 to open Simpletext and write my HTML, because I don't like TextEdit.) I basically use tables, Javascript commands that I find on other sites, a few cheesy rollovers, and try for the best. I'm often frustrated that I can't make the design in my head appear on the monitor.

Now I have a few new sites I need to create -- nothing terribly complex -- and I also want to redo my main photography site. I want them to look like they belong in the 21st century. Where to start?

If I were to learn a WYSIWIG program, what do you recommend? (I'm using OSX, v 3.2.) Dreamweaver? Or should I just keep writing code by hand? (Ack.) Are there any good, modern tutorial websites out there? (The main ones I find haven't been updated since '99.) Or good books? Should I break down and take a Dreamweaver course? Do I need to learn Flash, too, or is its day in the sun over?

Thanks.

posted by lisa g to Computers & Internet (12 answers total)

Dreamweaver's OK, but honestly, I can't stand using for an entire design cycle. Flash definitely has a place, but don't abandon markup. But do learn Fireworks -- I think it's the mightiest, bestest graphics tool out there for screen-destination design. Best of the vector and raster world combined into one very handy program. I do design within it, and then export images/html.

This will still leave you doing table based layout, tho'. Not that I recommend you avoid table based layout like sin, but it's good to learn all the CSS stuff. For that, you could probably pick up Eric Meyer's book, or poke around sites like W3Schools or half a dozen weblogs. Or just read CSS Discuss for a while.
posted by weston at 7:13 PM on September 27, 2004

I would avoid Flash and Dreamweaver (well, DW for sure).

I urge you to learn CSS and XHTML from books like Elizabeth Castro's book as well as maybe Eric Meyer's CSS books and a good HTML coding software package like BBEdit (mac) or Homesite (windows).

Also, take a look at the CSS and design links people have gathered together on delicious.

The W3Schools site that weston recommends is good for basics--this site is short and sweet as well.
posted by dobbs at 7:17 PM on September 27, 2004

Glish will teach you basic CSS layouts, A List Apart will give you a little bit more knowledge.
posted by signal at 7:30 PM on September 27, 2004

I've also gone the route of structural HTML and CSS. Now my teeth are brighter and my whites are whiter. It's really about returning HTML to its roots, with smart CSS to make it look pretty.

A good roundup of HTML and CSS reference sources
posted by adamrice at 7:32 PM on September 27, 2004

Oh yeah: BBEdit. Worth every penny.
posted by adamrice at 7:33 PM on September 27, 2004

Response by poster: Thanks, everyone! Also: Among the things I'd like to do is set up a basic store on the website for my husband's indie record label, where people could order CDs or records via Paypal (or something) and he'd get an automatic email. What should I learn for that?
posted by lisa g at 7:38 PM on September 27, 2004

why pay for things? i still use my old free text editor. it doesn't generate valid code by itself, but as i have to hand-code things i've learned to self-validate. i did use the mozilla activeX plugin hack to force it to preview with gecko rather than IE though. no longer supported, but the new version is flash and pretty much blows. i'm sure there are some fine macOS text editors that will do the job pretty much the same way - all you need really is syntax highlighting. (on second thought, try the java version of the above: abysmally slow on windows, maybe not so bad on a mac. and still free.)

the whole point of CSS is that nobody needs to use a massive WYSIWYG program designed to force tabled layout, etc. like dreamweaver any more. dreamweaver is like using a sledgehammer to drive a thumbtack: it's more than anyone needs, and it isn't the right tool for most people to begin with - half the time you use it right, you still put a hole in the wall on accident.

i second (heartily) a list apart. also, some of my favorite tools are chris pederick's web developer toolbar for firefox/mozilla - built in super-useful tools and instant validation. i also am in love with the netscape DevEdge sidebar for mozilla, because it contains a very nice HTML 4/CSS/DOM quick reference, linked to the W3C spec documents. very handy when stuck on a specific bit of arcane usage or unsure whether a tag will do what you think it will.
posted by caution live frogs at 7:57 PM on September 27, 2004

While there's a place for CSS, please don't turn into a zealot. There are some things that (egads!) can simply be done much better with tables. Until CSS standards are actually adopted by all the browsers, keep using tables for your layout. CSS is wonderful for text-markup, however. Paragraph settings, font settings -- you should never have to use the FONT attribute again.
posted by Civil_Disobedient at 9:50 PM on September 27, 2004

I've heard good things about CSSEdit.
posted by kindall at 10:51 PM on September 27, 2004

A List Apart

Start there. You'll never look back.

And yes tables are good for somethings.. namely laying out information in a table NOT for page layout!

Aspire to some of the designs found in the css Zen Garden.

Me? I still hand code, a little PHP, some Javascript, but ALL CSS and HTML.
posted by snowgoon at 5:17 AM on September 28, 2004

For setting up a web store, you can get as fancy or as simple a you want. I run a web store where the ordering system is "send me an e-mail and tell me what you want." But there are a number of readymade shopping-cart systems (some open-source) that you can install and configure. There are at least a couple listed at Open-source CMS.
posted by adamrice at 6:31 AM on September 28, 2004

It's been mentioned, but as someone who also relies a lot on text-editors for HTML coding, BBEdit is great at bridging the gap between simple line editing and more enhanced coding, giving you features like the color-coding of different tag styles for quick eyeballing. I have yet to find a WYSIWYG editor (though I haven't tried a new one for about two years) that fails to add extra unneeded code, invisible when you're doing it, but a pain in the ass once you want to go back in by hand and fine-tune something.

And having just learned Flash this year, I have an attachment to the belief that it is and will remain useful. So yeah, definitely learn Flash or you're screwed!
posted by soyjoy at 9:37 AM on September 28, 2004