Help ensure my websites display beautifully now and into the future!

April 16, 2010 1:34 PM

Cross-platform web design / development for the next three years - What exactly do I need to learn, and where can I learn it?

I've spent the past year or so learning CSS and HTML, and a very small bit of PHP for Wordpress development and feel good about my skills in these areas. I'm currently designing and coding websites for small, creative businesses using these skills, and one of the most difficult problems has been making the site look good for old browsers such ie6. Now that i.e.6 is finally really headed out, I'm looking forward to staying compatible with future web and mobile platforms developments.

I want my websites (which are often 'artist portfolios') to look great across browsers AND on new media platforms like the iPad etc. (Particularly as some of my clientele are already buying iPads)

I know that flash is out if that is my goal, so what are the key things I need to learn to make sure sites I build will display well across platforms now, and into near future?

i.e. what are the best ways to do things like mimic the functionality of flash slideshows such as slideshow pro provides (until they release their own alternates). I don't want to go back to old sites to make them work when better options come along, I want them to work now and until people are ready for big site overhauls in a few years.

Also, interested in non-flash audio players, and non-flash vector movies and anything else you can think of I oughta know in this area.

I would love to be pointed to existing solutions that look to be robust into the near future, and what I have to learn if I want to get this right.

I'm interested in articles, online tutorials, but even more interested in real classes I can take in the NYC area.

I'm not interested in becoming a "programmer". I'm most interested in expanding on the coding I do have a grip on, and customizing existing solutions for my needs, and also just knowing what I'm talking about!


Thanks!

posted by bonsai forest to Computers & Internet (9 answers total)

Brush up on your JavaScript and figure out how to use jQuery. Also acquaint yourself with Lightbox2, which is the easiest way to elicit a "wow" from your clients when implementing slideshows and/or galleries.

Immerse yourself in design media, for instruction and inspiration. I recommend Smashing Magazine, A List Apart, and Read Between the Leading.

IE6 may be on the way out, but IE7 is alive and well. If you're working in a Mac environment you might find GEOTEK's IE NetRenderer to be a huge help.
posted by The Winsome Parker Lewis at 1:43 PM on April 16, 2010

+1 to A List Apart, JavaScript, and jQuery (or Prototype). Generally brushing up <canvas>, etc., in HTML 5 seems wise (that's what I've been putting off in my own career). CSS styling by medium (like tagged mobile-specific css) is an underserved but valuable skill that sounds relevant to your interests.
posted by zvs at 1:51 PM on April 16, 2010

Here's a few things I would keep an eye on (or at least be able to speak about intelligently)

• HTML 5
• JQuery
• JQuery UI
• OpenId/OAth
• OData/Json

posted by blue_beetle at 2:05 PM on April 16, 2010

Coding A HTML 5 Layout From Scratch is a decent tutorial.

The current versions of Internet Explorer can't handle HTML5 for layout without a little JavaScript help: HTML5 enabling script.
It's called html5shiv. "Shim" would probably be more appropriate than "shiv," but due to my long and bitter experience with IE I'm glad it's named after something you stab someone with in prison.
posted by kirkaracha at 2:41 PM on April 16, 2010

Also, just accept that however thorough and forward-looking you are in your efforts to be all cross-compatible, browsers will always break your heart.
posted by Zed at 2:56 PM on April 16, 2010

Also, just accept that however thorough and forward-looking you are in your efforts to be all cross-compatible, browsers will always break your heart.

I see you have been programming web sites for a little while.

*sniff*

Seriously, another one voting for jQuery and HTML5...although I'm iffy on canvas and the more advanced features of HTML 5 for the next few years. Yeah, maybe at the end of five years. It's a pleasant dream. But we only just killed (did we?) IE6, people. Let's come back to (the) reality (of building functional cross-platform compatible websites) here folks.

I would say learn Javascript. Learn more Javascript. Learn it well. Read this guy's stuff, particularly this. The old is now new.
posted by dubitable at 9:05 PM on April 16, 2010

Don't write off Flash just yet. Although HTML5+Javascript are absolutely, 100% the way forward, you need to use Flash for now if you want to do video, and support the majority of web users.

Learn the basics of FLV and the JW Player, and you'll be fine. You don't need to buy the Flash IDE from Adobe to do this.
posted by schmod at 10:56 PM on April 16, 2010

If you just want polish and not a lot of structured data, all the animations in jQuery will keep OOH SHINY people happy. Add some rounded corners, transparency, gradients and simulated reflections for extra OOOOH SHINY. jQuery strives for cross platformability, but even it can't hide all the browser quirks; nothing will (in the next 3 years anyway) be truly the same cross-browser.
posted by beerbajay at 8:59 AM on April 17, 2010

Thanks, great answers all!
posted by bonsai forest at 2:15 PM on April 17, 2010