Home Articles Uncategorized Where to start learning Web Design

Where to start learning Web Design

A con­nec­tion on Linked In con­tac­ted me and asked me a ques­tion:

… My ques­tion is: there is so much I want to learn as far as web design. I don’t know where to start first: jquery, CSS, flash, HTML, search en­gine op­tim­iz­a­tion, etc. What would you sug­gest? And what sites would you sug­gest for learn­ing?

I re­spon­ded to her and I thought I’d post my re­sponse here for any­one else:

Start with ba­sic HTML and then CSS:

Here are some sites that will teach you:

  • W3Schools.com
  • Site­Point.com
  • HTM­L5­doc­tor.com
  • Lynda.com (free and paid ser­vices)

And then move to jQuery/Javas­cript

Lynda.com has a paid ser­vice with video tu­tori­als for about $30 a month, no com­mit­ments. jQuery should be the last thing you get in­to after you have a firm un­der­stand­ing of HTML and CSS. Lynda.com also teaches all the oth­er lan­guages as well.

About SEO

Get­ting ranked high in search en­gines has to do with the qual­ity of con­tent, prop­er use of meta tags, how many re­cipric­al links you have, and how well struc­tured your HTML is (which is what you’ll be taught from the above sites). I’m not a SEO ex­pert, but I’ve learned a few tricks over the years from vari­ous art­icles via Google Search.

Flash is for an­im­a­tion and ap­plic­a­tions

Web de­velopers have moved away from Flash be­cause it doesn’t rank to well as do or­gan­ic nat­ive HTML web­sites in search en­gines. HTML, CSS and JavaS­cript are the primary lan­guages a web­site should be coded in. When you use flash, I re­com­mend a pro­gram called Swish­Max which al­lows you to cre­ate an­im­a­tion easi­er than Flash and it’s much cheap­er. Flash isn’t bad it’s just bet­ter to code en­tire sites us­ing nat­ive lan­guages I men­tioned above.

Web De­vel­op­ment Tools

I also for­got to men­tion one tool all web de­velopers use and that is called Web In­spec­tion. In­spec­tion al­lows you to see the code be­hind any giv­en ele­ment on a live web page. These tools are very help­ful es­pe­cially when de­term­in­ing er­rors.

If you’re us­ing Fire­fox, there’s a plu­gin called Fire­Bug that will al­low you to in­spect. Or if you use Google Chrome, it’s already built in. To use the in­spect­or, right-click on any ele­ment, choose In­spect and a win­dow will ap­pear dis­play­ing the code be­hind the ele­ment.

Oth­er web de­vel­op­ment soft­ware in­clude Dream­weaver and Note­Pad++.