Should you add style in HTML or CSS, which is preferred?

I am wondering: is it better to “style” your site in HTML or CSS?

I am doing a course Web Design course at Udemy to help me with this course, but it seems the instructor strongly emphasis that ALL STYLING should be done in CSS and that it is a BAD IDEA to do any styling in HTML. However, I notice here there is a lot of styling taking place in HTML.

My Questions:

(1) Is this just a matter of taste and opinion, or is there something significant behind it?

(2) Can you give me some references that discuss this matter specifically?

(3) Whic one is better for using Wordpress?

Your info is appreciated.

Definitely CSS. There are lots of reasons. readability and manageability being the main ones.

I recommend taking a basic course in CSS and maybe HTML.

have a look at these, one of them might suit your style of learning and will be a day or three well spent.

http://learn.shayhowe.com/

Look at net ninja’s CSS Tutorials for beginners and HTML tutorials for beginners.

Good luck :thumbsup:

4 Likes

Definitely in CSS, it’s cleaner code and better to maintain in the future.

3 Likes

tl;dr: Use CSS

When you talk about putting styles into your html, are you talking about placing a <style> tag at the top of the page and writing your CSS there, or do you mean individually styling elements using the style="" attribute?

If you mean styling elements individually, the downside is immediately obvious, you have to style the elements individually, which makes your code difficult to maintain. You also lose the power of being able to create a CSS class and apply that class to a selection of elements.

If you are talking about placing all of your CSS at the top of your HTML file, it becomes less of an issue. Some people (myself included) like to break the program down into a small of pieces as possible, where each piece has it’s own job. This is why I put my CSS in its own file. I also assume that if you have a team, and one person is writing CSS and one writing HTML, having CSS and HTML in separate files will lead to less merge conflicts on your VCS. That might not be true (I don’t have much experience with collaboration), but it seems possible.

There is also the fact that you can’t use a preprocessor, such as SASS or LESS, with inline styles. They need to be in their own files to be converted to CSS.

3 Likes

Also google insights does like certain parts of your css to be in the head of the html page… which complicates things. I tend not to worry about that at this stage though because almost everything I have made so far has been “above the fold” anyway.

2 Likes

I was referring to using the style="" attribute. I got a little confused because here in FreeCode they seem to use and teach it in the challenges, but in the course I am taking at Udemy the instructor warns against the practice. From self-learning, I have always used CSS to modify my WordPress themes and so when it came to start formal learning like here at FreeCode and Udemy, HTML editing was something a bit alien to me. Still have a lot to learn. Thanks for the detailed reply.

1 Like

Thanks for the link and the info.

Thank you for the straight-forward reply. Appropriated!

Alright guys, hope all is well. I decided to back and re-craft my Tribute Page after reviewing Bootstrap more carefully. I feel this time I got it! Here is the link: http://codepen.io/jjbrooks/full/WoPqyJ/

Thanks for all of your insights.