Best way to learn website design w/CSS

whitsonp · 09-17-2009, 08:43 PM

Hello warriors,

It's been a long time since coming here, but I know that I can get some good replies.

I have done website design in the past and still do some today, but I wanted to move over to xHTML/CSS and Designing sites in PhotoShop CS3.

Could you guys/gals give me some good resources that can teach me how to do this?

Appreciate all feedback. Thanks.

Patrick Whitson

Richard Whyte · 09-17-2009, 11:55 PM

W3Schools are great as a resource to learn and use as a online command reference. I have that site open in my browser all the time when I am designing.

A lot depends on your current skillset, but you can find many tutorials on Google. Just need to ask the right question.

Still, start with w3schools.com and once most of that makes sense, you will be ready to expand outwards.

Have a Great Day!

Mr.Tambourine · 09-18-2009, 12:31 AM

Head over to Linda.com ... it has some professional tutorials on almost any topic you can think of ..... If you do not want to pay, you can surf around on you tube etc for tutorials ...

Look at nettuts.com and tutvid.com for excellent tutorials .....

jgalty · 09-18-2009, 04:56 AM

I would do all mentioned above and i would also download a template or two that css in it and see how it works. Play around with it and change things to get a feel for it.

cma01 · 09-19-2009, 09:42 PM

The first time I delved into CSS was when I was working on a project and needed to create a list styled menu. I just Googled for tutorials and played around with it until I figured it out. It took me about 8 months until I was really comfortable designing sites completely with CSS.

Deconstructing existing CSS layouts, as jgalty suggested, is a good way to learn. One of the best inspiration sites is csszengarden.com. And whenever I see a cool web site (well I do this for almost all web sites), I look at the source and see how they did it.

Alistapart.com is another good site to follow and I have several books from Sitepoint.

When you design with CSS, you have to look at a design differently than you would if it were designed with tables. If I knew of a book or course that taught the theory behind it . . . how to approach a site for CSS, I would direct you to it . . . but I don't. It's kind of like geometry was for me, you just have to keep practicing until you "get" it.

An absolute must have tool is Firebug for Firefox. I could code a CSS layout without Dreamweaver, but I couldn't do without Firebug.

I also use Aardvark occasionally, particularly if I've fixing a template that's not mine and I'm not familiar with the div structure. You can quickly identify div outlines with it.

When I finish a design in Photoshop, I open Dreamweaver and create a blank html and CSS document and start coding. I go outside to inside and back to front. What is going to be on the body background . . . what divs do I need to work in all the design elements. What can I tie to headings, etc.

joelmutia · 10-10-2009, 03:11 AM

try also killersite.com. they have a great resource. some topics offers free video tutorial.
with CSS you have the full control of the look of your website. how you display it. of course DIV tags play a great role also + ID and CLASS. I studied web design from scratch first from notepad hard tagging with tables tag and some deprecated tags now i let go he table tags and go for DIV tags.

Amelia O · 10-11-2009, 09:57 AM

Lynda.com hands down..

faust1611 · 10-12-2009, 09:52 PM

with all the resources you have over the web. add experience, practice and heart your good!

sanjid112 · 10-12-2009, 09:57 PM

w3school and killersite would be good.
also by download some templates with CSS and make a little experiment with those, it will be great tool to learn.

well, you can go to bookstore or library to find books with that theme. that can be good resources too.

the more important is practice and practice...

DoGGz · 10-13-2009, 01:39 PM

The only site you will ever need hands down net.tutsplus.com

cmaclean · 10-13-2009, 02:47 PM

Check out W3Schools and Lynda.com.

Once you get a decent grasp, you'll learn alot from:

Net.tutsplus.com (as Doggz mentioned)
CSS-tricks.com

jorgemarget · 09-08-2010, 05:29 PM

I would do all mentioned above and i would also download a template or two that css in it and see how it works. Play around with it and change things to get a feel for it.

Scott Henderson · 09-08-2010, 11:16 PM

All of above are great resources for me however the best and easiest is from a book from Head First Labs, Head First Labs from O'Reilly Media, Inc. :: Head First HTML with CSS & XHTML

If is bar far the best course for a newbie I have ever seen. Their unique style of teaching makes learning fun, they mix it up a lot, there are even crossword puzzles you do as part of the process.

suviawilliams · 09-09-2010, 03:56 AM

Hi
My self vijay kumar

you can try also killersite.com. they have a great resource. some topics offers free video tutorial.
I would do all mentioned above and i would also download a template or two that css in it and see how it works.

dominicmarsh · 09-09-2010, 05:47 AM

Yes there are many tutorials online you can go through those and see how much you can grasp.

erinsmith · 09-09-2010, 05:56 AM

W3Schools very useful for and some advantage for newer but many more site give deep tutorials so easy to understand and apply so easy for you

luxl85 · 09-17-2010, 03:40 AM

I suggest you download a CSS note and use DW to practice it.

arvelclinton · 09-27-2010, 03:56 AM

The best way to learn website design is to praticise a lot. Practise makes a man perfect.

dnawize · 09-27-2010, 07:19 PM

Go to YouTube and search for "CSS Tutorials". There are planty all for free.

jacthomas · 09-28-2010, 12:28 AM

To learn website designing, your grasping power should be very strong.If your grasping power is strong then you will easily learn web designing.

Johny2000 · 09-28-2010, 02:23 AM

Quote:

Originally Posted by Richard Whyte

W3Schools are great as a resource to learn and use as a online command reference. I have that site open in my browser all the time when I am designing.

A lot depends on your current skillset, but you can find many tutorials on Google. Just need to ask the right question.

Still, start with w3schools.com and once most of that makes sense, you will be ready to expand outwards.

Have a Great Day!

Thanks for information. I like it

Big Squid · 09-28-2010, 03:57 AM

Gotta agree with Shen on this one... Head First books are very easy to learn and each book has it's own active support forum. I think you can get one used online somewhere for less than $25.

It's worth it.

SiteSmarty · 09-28-2010, 10:40 PM

The easiest way to learn is by using the Thesis WordPress Theme.

Here's why:

In Thesis there is a folder named "custom". There are files inside that folder, two of which let you override the core functions and css of Thesis.

If you're just starting you don't need to touch the custom_functions file. You can create a theme using just the custom_css.

For example:

This is a skin created for Thesis and it's designed just using css

sitesmarty.net/thesis-theme-skin-blue-banner/ << (Copy and paste into our browser address bar)

I've got an easy sales page skin (I'm using it on my signature link) you could use to get your feet wet. Just go between the skin and 3schools to learn the css part in a day or two. You need Thesis to use a skin.

SmartWeb · 09-29-2010, 12:14 PM

Quote:

Originally Posted by cma01

An absolute must have tool is Firebug for Firefox. I could code a CSS layout without Dreamweaver, but I couldn't do without Firebug.

Firbug is great tool for learning CSS. Firebug is a plugin for firefox. and these great tools are free. spend some time in learning firebug, and you can see how each line of css effects the webpage in real time.

adrienngary · 10-04-2010, 10:38 PM

I have no trouble with HTML,CSS,PHP,Javascript programming, although I don't know flash yet, I'm interested only in learning the aesthetic aspects of the design. There are plenty of websites out there that can assist you in learning the basics for websites especially HTML or CSS.

wevo · 10-06-2010, 06:33 AM

Practical learning is best. Code sample sites.

1. Grasp a general idea of HTML + CSS.
2. Design your own simple layouts.
3. Attempt to code your layouts.
4. Found a road block? Google it.

Seriously i code client websites with ease now from pretty much doing the above. You can read as much as you want but you need to put it into practice to learn.

I was in your position a few months ago.

jacthomas · 10-28-2010, 01:51 AM

Learning to build your web sites using HTML will give you far better control over the process and ultimately your web sites. You will have a far deeper understanding of the web, and as a result you will create better web sites quicker - much quicker.

TechGuy1 · 10-29-2010, 05:49 AM

Quote:

Originally Posted by Richard Whyte

W3Schools are great as a resource to learn and use as a online command reference. I have that site open in my browser all the time when I am designing.

A lot depends on your current skillset, but you can find many tutorials on Google. Just need to ask the right question.

Still, start with w3schools.com and once most of that makes sense, you will be ready to expand outwards.

Have a Great Day!

I also learn lot of things from this site so go ahead..................

09-17-2009, 08:43 PM	#1
whitsonp Lapeer Mktg Consultant Join Date: Dec 2005 Location: Otter Lake, MI , USA. Posts: 38 Thanks: 8 Thanked 2 Times in 2 Posts Social Networking Contact Info	Best way to learn website design w/CSS Hello warriors, It's been a long time since coming here, but I know that I can get some good replies. I have done website design in the past and still do some today, but I wanted to move over to xHTML/CSS and Designing sites in PhotoShop CS3. Could you guys/gals give me some good resources that can teach me how to do this? Appreciate all feedback. Thanks. Patrick Whitson

09-17-2009, 11:55 PM	#2
Richard Whyte HyperActive Warrior Join Date: Dec 2008 Posts: 319 Thanks: 12 Thanked 51 Times in 44 Posts Social Networking Contact Info	Re: Best way to learn website design w/CSS W3Schools are great as a resource to learn and use as a online command reference. I have that site open in my browser all the time when I am designing. A lot depends on your current skillset, but you can find many tutorials on Google. Just need to ask the right question. Still, start with w3schools.com and once most of that makes sense, you will be ready to expand outwards. Have a Great Day!
	Richard Whyte - Website Design, Search Engine Optimization and Online Marketing - WebYabber.com, Read my Blog - richard-whyte.com, Easy Sales Page Creator - Power Sales Page Creator

09-18-2009, 12:31 AM	#3
Mr.Tambourine Warrior Member Join Date: Sep 2009 Posts: 27 Thanks: 2 Thanked 2 Times in 2 Posts	Re: Best way to learn website design w/CSS Head over to Linda.com ... it has some professional tutorials on almost any topic you can think of ..... If you do not want to pay, you can surf around on you tube etc for tutorials ... Look at nettuts.com and tutvid.com for excellent tutorials .....

09-18-2009, 04:56 AM	#4
jgalty Active Warrior Join Date: Jul 2009 Location: Canada Posts: 41 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS I would do all mentioned above and i would also download a template or two that css in it and see how it works. Play around with it and change things to get a feel for it.
	Barrie Web Design

09-19-2009, 09:42 PM	#5
cma01 Small Business Advocate War Room Member Join Date: Jun 2008 Location: Houston, Texas, USA. Posts: 366 Thanks: 126 Thanked 106 Times in 78 Posts Social Networking Contact Info	Re: Best way to learn website design w/CSS The first time I delved into CSS was when I was working on a project and needed to create a list styled menu. I just Googled for tutorials and played around with it until I figured it out. It took me about 8 months until I was really comfortable designing sites completely with CSS. Deconstructing existing CSS layouts, as jgalty suggested, is a good way to learn. One of the best inspiration sites is csszengarden.com. And whenever I see a cool web site (well I do this for almost all web sites), I look at the source and see how they did it. Alistapart.com is another good site to follow and I have several books from Sitepoint. When you design with CSS, you have to look at a design differently than you would if it were designed with tables. If I knew of a book or course that taught the theory behind it . . . how to approach a site for CSS, I would direct you to it . . . but I don't. It's kind of like geometry was for me, you just have to keep practicing until you "get" it. An absolute must have tool is Firebug for Firefox. I could code a CSS layout without Dreamweaver, but I couldn't do without Firebug. I also use Aardvark occasionally, particularly if I've fixing a template that's not mine and I'm not familiar with the div structure. You can quickly identify div outlines with it. When I finish a design in Photoshop, I open Dreamweaver and create a blank html and CSS document and start coding. I go outside to inside and back to front. What is going to be on the body background . . . what divs do I need to work in all the design elements. What can I tie to headings, etc.

10-10-2009, 03:11 AM	#6
joelmutia Warrior Member Join Date: Oct 2009 Location: Manama, Kingdom of Bahrain Posts: 5 Thanks: 0 Thanked 0 Times in 0 Posts Social Networking	Re: Best way to learn website design w/CSS try also killersite.com. they have a great resource. some topics offers free video tutorial. with CSS you have the full control of the look of your website. how you display it. of course DIV tags play a great role also + ID and CLASS. I studied web design from scratch first from notepad hard tagging with tables tag and some deprecated tags now i let go he table tags and go for DIV tags.

10-11-2009, 09:57 AM	#7
Amelia O Active Warrior Join Date: Aug 2009 Posts: 59 Thanks: 1 Thanked 4 Times in 4 Posts	Re: Best way to learn website design w/CSS Lynda.com hands down..
	Being Happy & Healthy Is The Key To Success..

10-12-2009, 09:52 PM	#8
faust1611 i'm warrior trader! Join Date: Oct 2009 Location: web Posts: 5 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS with all the resources you have over the web. add experience, practice and heart your good!
	Need web design and development solutions? Drop me pm!

10-12-2009, 09:57 PM	#9
sanjid112 Banned War Room Member Join Date: Oct 2009 Posts: 183 Thanks: 4 Thanked 21 Times in 19 Posts	Re: Best way to learn website design w/CSS w3school and killersite would be good. also by download some templates with CSS and make a little experiment with those, it will be great tool to learn. well, you can go to bookstore or library to find books with that theme. that can be good resources too. the more important is practice and practice...

10-13-2009, 01:39 PM	#10
DoGGz Warrior Member War Room Member Join Date: Dec 2007 Location: , , United Kingdom. Posts: 29 Thanks: 0 Thanked 2 Times in 2 Posts	Re: Best way to learn website design w/CSS The only site you will ever need hands down net.tutsplus.com

10-13-2009, 02:47 PM	#11
cmaclean Active Warrior War Room Member Join Date: May 2009 Location: Vancouver, British Columbia, Canada Posts: 95 Thanks: 7 Thanked 8 Times in 7 Posts Social Networking	Re: Best way to learn website design w/CSS Check out W3Schools and Lynda.com. Once you get a decent grasp, you'll learn alot from: Net.tutsplus.com (as Doggz mentioned) CSS-tricks.com
	Get FREE Access to 30 Hours of High-End un-cut and uncensored Video from the most powerful marketing minds on the planet (presently!)!

09-08-2010, 05:29 PM	#12
jorgemarget Warrior Member Join Date: Sep 2010 Posts: 3 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS I would do all mentioned above and i would also download a template or two that css in it and see how it works. Play around with it and change things to get a feel for it.

09-08-2010, 11:16 PM	#13
Scott Henderson Full Time Warrior War Room Member Join Date: Sep 2009 Location: South Korea - USA Posts: 333 Thanks: 118 Thanked 77 Times in 68 Posts Social Networking Contact Info	Re: Best way to learn website design w/CSS All of above are great resources for me however the best and easiest is from a book from Head First Labs, Head First Labs from O'Reilly Media, Inc. :: Head First HTML with CSS & XHTML If is bar far the best course for a newbie I have ever seen. Their unique style of teaching makes learning fun, they mix it up a lot, there are even crossword puzzles you do as part of the process.
	HOT >> Beyond SEO There's Optimization Overdrive >ALL NICHES< Also Visit Me At My Internet Marketing Blog, Scott Henderson's Wealth Secret's

09-09-2010, 03:56 AM	#14
suviawilliams Warrior Member Join Date: Sep 2010 Location: delhi Posts: 1 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS Hi My self vijay kumar you can try also killersite.com. they have a great resource. some topics offers free video tutorial. I would do all mentioned above and i would also download a template or two that css in it and see how it works.
	watch greys anatomy online \| watch greys anatomy episode

09-09-2010, 05:47 AM	#15
dominicmarsh Warrior Member Join Date: Sep 2010 Posts: 1 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS Yes there are many tutorials online you can go through those and see how much you can grasp.
	Chicago Web Design

09-09-2010, 05:56 AM	#16
erinsmith Warrior Member Join Date: Jul 2010 Posts: 6 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS W3Schools very useful for and some advantage for newer but many more site give deep tutorials so easy to understand and apply so easy for you
	PHP Development India \| Hire PHP Developer

09-17-2010, 03:40 AM	#17
luxl85 Warrior Member Join Date: Sep 2010 Location: London Brooklyn Posts: 6 Thanks: 0 Thanked 2 Times in 2 Posts Social Networking	Re: Best way to learn website design w/CSS I suggest you download a CSS note and use DW to practice it.
	My resource: Laptop battery PR 3 Battery PR3 how can I improve their PR to 4.

09-27-2010, 03:56 AM	#18
arvelclinton Warrior Member Join Date: Sep 2010 Posts: 2 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS The best way to learn website design is to praticise a lot. Practise makes a man perfect.
	Internet marketing new York

09-27-2010, 07:19 PM	#19
dnawize Warrior Member Join Date: Sep 2010 Location: Edison, NJ Posts: 1 Thanks: 0 Thanked 0 Times in 0 Posts Social Networking	Re: Best way to learn website design w/CSS Go to YouTube and search for "CSS Tutorials". There are planty all for free.
	http://marklobrow.com

09-28-2010, 12:28 AM	#20
jacthomas Warrior Member Join Date: Sep 2010 Posts: 2 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS To learn website designing, your grasping power should be very strong.If your grasping power is strong then you will easily learn web designing.
	Website Design Melbourne

09-28-2010, 03:57 AM	#22
Big Squid HyperActive Warrior War Room Member Join Date: Oct 2009 Location: Traveling through Europe Posts: 107 Thanks: 14 Thanked 15 Times in 13 Posts Social Networking	Re: Best way to learn website design w/CSS Gotta agree with Shen on this one... Head First books are very easy to learn and each book has it's own active support forum. I think you can get one used online somewhere for less than $25. It's worth it.

09-28-2010, 10:40 PM	#23
SiteSmarty HyperActive Warrior War Room Member Join Date: Sep 2010 Posts: 285 Thanks: 4 Thanked 70 Times in 58 Posts	Re: Best way to learn website design w/CSS The easiest way to learn is by using the Thesis WordPress Theme. Here's why: In Thesis there is a folder named "custom". There are files inside that folder, two of which let you override the core functions and css of Thesis. If you're just starting you don't need to touch the custom_functions file. You can create a theme using just the custom_css. For example: This is a skin created for Thesis and it's designed just using css sitesmarty.net/thesis-theme-skin-blue-banner/ << (Copy and paste into our browser address bar) I've got an easy sales page skin (I'm using it on my signature link) you could use to get your feet wet. Just go between the skin and 3schools to learn the css part in a day or two. You need Thesis to use a skin.

10-04-2010, 10:38 PM	#25
adrienngary Warrior Member Join Date: Oct 2010 Posts: 4 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS I have no trouble with HTML,CSS,PHP,Javascript programming, although I don't know flash yet, I'm interested only in learning the aesthetic aspects of the design. There are plenty of websites out there that can assist you in learning the basics for websites especially HTML or CSS.
	St. Louis

10-06-2010, 06:33 AM	#26
wevo Warrior Member Join Date: Oct 2010 Posts: 18 Thanks: 0 Thanked 1 Time in 1 Post	Re: Best way to learn website design w/CSS Practical learning is best. Code sample sites. 1. Grasp a general idea of HTML + CSS. 2. Design your own simple layouts. 3. Attempt to code your layouts. 4. Found a road block? Google it. Seriously i code client websites with ease now from pretty much doing the above. You can read as much as you want but you need to put it into practice to learn. I was in your position a few months ago.
	Web Design & Front-end Development Solutions.

10-28-2010, 01:51 AM	#27
jacthomas Warrior Member Join Date: Sep 2010 Posts: 2 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Best way to learn website design w/CSS Learning to build your web sites using HTML will give you far better control over the process and ultimately your web sites. You will have a far deeper understanding of the web, and as a result you will create better web sites quicker - much quicker.
	Website Design Melbourne