Recommendations for learning web design basics using Mac tools?
August 5, 2004 10:07 AM   Subscribe

Any good online tutorials or books to teach web design basics? I need to know things about tables, layout and inserting/formating text. I'd prefer advice that deals with composer or some other free, mac friendly application. Thanks!
posted by elwoodwiles to Computers & Internet (9 answers total)
One of the best things you can do is to look at the source code of a site that does something you're looking for.

As for Mac friendly applications, you'd be better off learning how to code by hand. You'll end up with better results and code that's much more readable and usable. You'll find it's not nearly as difficult as you might think.

And you won't be tied to a particular plaftorm or editing application.
posted by aladfar at 10:25 AM on August 5, 2004 helped me a lot in the early days.

Also, check source code as aladfar suggested, and use Macromedia's Dreamweaver tutorials to get you started.
posted by dhoyt at 10:50 AM on August 5, 2004

Response by poster: So I'd be entering code directly into composer? This sounds okay, something I could figure out, eh?
posted by elwoodwiles at 10:58 AM on August 5, 2004

I would suggest getting a copy of Dreamweaver first. Then, go to your favorite site, copy the source code, and paste it into Dreamweaver. This will help you 1) study the intricacies of the code itself, and 2) see the code "in action" in the Dreamweaver interface. Try selecting a table and note its HTML properties in the code window. Try changing font sizes and note how the HTML is affected. In general, make yourself aware of how the code illustrates what you see in the browser. Dreamweaver will help a lot with this.
posted by dhoyt at 11:11 AM on August 5, 2004

Oh--and during this process it would also help to start coding by hand for practice, just so that Dreamweaver is not a total crutch...
posted by dhoyt at 11:13 AM on August 5, 2004

But do everything in a standards-compliant manner-- no font elements, no tables for layout unless you're really stuck, valid code all the way. Do not, in other words, pretend this is 1999. Dreamweaver and GoLivé can be coaxed into producing such code.

Some reasonable places to start in books are Designing with Web Standards by Zeldman and some of the books that Amazon will link you to from there.

In general, books that teach "Web-design basics" teach outdated, incorrect methods that the authors don't even know are outdated and incorrect. Avoid. avoid. avoid.
posted by joeclark at 12:40 PM on August 5, 2004

Response by poster: Any thoughts about frontpage?

I do take the suggestion, 'learn to code' very seriously. It make sense that using code will give me more control and more opportunity to be creative with the web. I also, however, would like to craft some basic text and picture web pages. I recently was offered server space by a friend and want to utilize this chance to have my very own web page. I'm not looking to be a developer. I'm just a hobbiest.

I bought a ibook a few months back and its loaded with applications I don't quite get, ie photoshop etc, but I want to learn.
posted by elwoodwiles at 2:17 PM on August 5, 2004

You'd be wise to stay away from frontpage - it's absolutely the worst route you can go. You're better off with nearly anything else.

Dreamweaver is an excellent product, and current versions come with Homesite (a text editor) - just try to write the code on your own before letting Dreamweaver do it for you. Once you get the hang of it, you'll find that you can write cleaner code than any WYSIWYG editor. I still maintain, however, that you'll be just find with something simple like notepad, or a free text editor.

And if all you want to do is throw up a few photo galleries, you should definitely learn a bit about style sheets and web standards. It'll make for a good "hello world" type project that you can tinker with at leisure.
posted by aladfar at 8:47 PM on August 5, 2004

I need to know things about tables, layout and inserting/formating text. I'd prefer advice that deals with composer or some other free, mac friendly application

Could you give some more detail about what you're trying to accomplish? If you're just looking to get a site up or do some modifications to an existing site, that's one thing. Dreamweaver is great for that, although it's an incredibly powerful and fairly pricey tool so could be overkill for just a small amateur project.

If you're a interested in beginning to develop some marketable skills, that's another thing. In that case, I recommend NOT learning from others' markup until you've read Zeldman's book and learned the semantics of XHTML. because while any number of editors and the various validators can walk you through syntax problems, technology can't tell when you've misappropriated an h1 just to get big text, blockquote to get a monospaced font, an ol when you need a ul or a dd, etc. Dan Cedarholm's SimpleQuiz series is an excellent resource for learning how to "think semantic" and balance that ideal against practical concerns. He's also got a new book based on that, which I haven't read yet but suspect would be another mighty fine starting point. Then once you have that grounding, yes definitely poke through others' code. You'll be much better prepared to think critically about the different techniques people are using, and to recognize the relative merits of their approaches. That's your shield against acquiring others' ingrained bad habits.

And looking for recommendations for editor software is still another matter. The answer being: it depends on the above. There are plenty of WYSIWY(almost)G editors, but once you get comfortable with XHTML syntax--which really is a pretty easy thing to do, especially since its rules are much more consistent than HTML's--they can quickly start to feel not only like an unnecessary crutch but even a hindrance. "Get out of my way! Stop trying to 'help'!" In that case, consider working from a text editor right from the get-go. There are several that can offer instant visual feedback, when you need it, like BBEdit and SubEthaEdit. IIRC, SkEdit previews in a browser rather than live, but it's also a good choice if you don't need the instant feedback. Man, I used to live my Dreamweaver. It's been gathering dust for years now, because at this point it's easier/faster for me to handcode in "plain text" editor BBedit (plus the godsend that is the Fireworks Web Developer extension) than to use a visual editor and then have to develop an understanding of what the editor chose to translate that to and do the misc cleanup of the bits that weren't quite as intended. (And if you are perchance interested in the professional skills, *ahem* employers are impressed by handcoding skills. For the minority who believe only their favorite visual editor will do, you'll be able to get up to speed on any visual editor right quick. You'd gain a lot more opportunities that the applicant who just knows how to use an app without really understanding what the app is producing.)

Oh, and whatever you do DO NOT TOUCH FRONTPAGE and be cautious about what you learn from any page that bears a FrontPage credit. FP create pages for IE, relying on proprietary stuff that only exists in IE and has nothing to do with the accepted standards like (X)HTML and CSS which are supported across the spectrum of modern browsers. Even if you don't mind giving the finger to people using other web browsers (although it would be prudent to keep in mind that although IE is the indisputable market leader now, Firefox has in the last six months been constistently stealing marketshare from IE, a feat no browser has been able to accomplish for years), keep in mind that many of the whiz-bangy tricks that FP offers also depend on getting a hosting plan that supports "Front Page extensions". That's not hard to find, but since the extensions are notorious security headaches for server admins, your options are somewhat narrower than if you'd used literally anything else. The main upside to FP is that it's free with Office. If you have an IE-only intranet that's already built out in FP and running smoothly, that's a good reason to use it (converting is a pain). Otherwise, stay clear.

On preview: I see you're interested in hobbyist skills, not professional. A lot of this still applies. If you're just concerned with easy, expedient, and "looks right" you can use pretty much any tool that's handy and comes with a manual. If you want to create something that is broadly accessible and practical to scale/maintain over time, then it's worthwhile to be more picky about what you use.
posted by nakedcodemonkey at 11:09 PM on August 5, 2004

« Older Is there a way to view the entries in Safari's...   |   Help me identify this software- is it spyware? Newer »
This thread is closed to new comments.