Fairly simple web design question

Rex Manning

Hi guys, long time reader first time poster (please be gentle!)

Been looking at html, css and a bit of javascript and it seems logical enough, but not sure how to put it into practice. Is it a matter of creating a home/template page, then the css, and then the javascript (adding the css and js lines of code into the header as you go along)?

Thanks,
Rexy

Mimikyu

This post has been deleted.

R3al

Rex Manning wrote: »

Been looking at html, css and a bit of javascript and it seems logical enough, but not sure how to put it into practice. Is it a matter of creating a home/template page, then the css, and then the javascript (adding the css and js lines of code into the header as you go along)?

If you are just starting there are loads of resources on the web for beginners such as http://www.2createawebsite.com/

Axwell

Have a look at www.w3schools.com

Rex Manning

Thanks for the replies guys - the links are pretty interesting.

What i was really trying to ask was how people generally approach the coding themselves - is there a recommended approach such as do all the html first and make sure it's working, then add the css (create the .css, and then add the css coding into the header) and test again before moving onto the javascript.

Sorry for not being as clear as possible:o

Eoin

A lot of this will depend on what the web-site you're developing does. It may not be possible to follow your approach, as testing the layout and design may depend on some JavaScript being in place first (rollovers / AJAX etc). Your page might have different sections that are distinct from each other, in which case it might make sense to work on them until completed, and then move onto the next one.

I tend to write my CSS inline and when I'm done, move it into a CSS file. Mostly laziness so I am only working on one file.

Rex Manning

Cheers Eoin, was thinking that might be the best approach alright

Eoin

I think it really depends on what works for you. Back when it wasn't a crime against humanity to use tables for layout, it was probably easier to do the HTML first, and then just style the tables after. When you're using DIVs, I'm not sure how easy it would be to treat the HTML and CSS as completely different tasks. I'm pretty crap at CSS layouts though.

p

Rex Manning wrote: »

What i was really trying to ask was how people generally approach the coding themselves - is there a recommended approach such as do all the html first and make sure it's working, then add the css (create the .css, and then add the css coding into the header) and test again before moving onto the javascript.

Sorry for not being as clear as possible:o

Not at all. Best to ask all the questions you think are silly now and get them our of the way!

In a commercial company you'll generally start with the design, created using photoshop or another graphic design tool. Once the client is happy with that you'll then build the site in HTML & CSS. Usually that's done at the same time, it rarely makes sense to do all the HTML first, then the CSS, unless you've a specific type of content. Many site do not use Javascript, but since it's adding a layer of behaviour then that would generally be added later. So would server-side programming like PHP, ASP or Java.

Here's a good graph about how HTML, CSS and Javascript fit together.


Also, this is a very good book I recommend for learning HTML & CSS is a good well-rounded way:
http://headfirstlabs.com/books/hfhtml/

For learning I'd just say play with HTML & CSS and try getting stuff up and running and take it from there!

Rex Manning

Thanks again guys, i'm getting a good idea of how they all hang together and how they should be implemented.

The muddy waters are clearing!!!!:D

turgon

p wrote: »

But in general most of your users wont look like james bond.

I do CSS and HTML together in three steps.

Instead of going up and down the page the whole time I just add style="" to all the divs Im styling with CSS. If I need classes I put the <style> tags next to the elements in question, this is bad coding but it works fully so its grand to do it in dev stage. It just makes it quicker. Once its HTML valid in the end thats all that really matters.

I then take all the style="" information and move it to the top, adding id's to the divs as I need.

When Im finally happy I move the CSS externally. Unless the CSS is unique to that page, in which case you save an http request by keeping it together. Might be safer to ignore that last sentance until later