wal Posted August 23, 2012 Share Posted August 23, 2012 Hi Members I am continually adding code and updating my website. I find myself constantly mixing code on my website. Can someone please point the way to a link or give advice as to the drawbacks of mixing HTML and CSS code together on the same web page? At times I find the proper code to utilize is written in HTML and other times CSS. I am more fluent in HTML than CSS but find good use for CSS code at times. Have a look at my site:http://education.hel...reed/index.html Thanks and have a great day! Quote Link to comment Share on other sites More sharing options...
Ice IT Support Posted August 23, 2012 Share Posted August 23, 2012 If there is CSS code that you use across multiple pages, I would recommend creating a css file (.css) and linking it in your HTML pages (this goes in the head section). <link href="/path/to/document.css" rel="stylesheet" type="text/css"> That way, if you want to update CSS for multiple pages, you only have to change one file. CSS code you only use for one page is fine in the same document. Of course there aren't any rules that say you can or can not have CSS and HTML on the same page, it is up to how you want to manage your websites. Hope this helps! Quote Link to comment Share on other sites More sharing options...
Shinryuu Posted August 24, 2012 Share Posted August 24, 2012 Personally I prefer internal stylesheets, but if you want the same CSS to be used across several pages use ICE's link method, for an internal stylesheet add <style> </style> tags in the <head> section of your page and put your style rules in the style section. For example: <!DOCTYPE html> <html> <head> <style> p { color: #ca8; background-color: #000;} </style> </head> <body> <p>Hello World!</p> </body> </html> Quote Link to comment Share on other sites More sharing options...
MadFish Posted September 6, 2012 Share Posted September 6, 2012 Since the beginning developers realized that separation of concerns is a powerful strategy. Keep things small, simple and compartmentalized. That principal can be seen in many tools and ideas: keep code separate from data, keep bussiness logic separate from presentation, keep server logic separate from client logic, etc. HTML and CSS help to separate concerns. HTML is a vehicle to structure your data. CSS is a tool to present (color or pretify) that structure. Think of a document that you create in Word. Think of a technical book that you read. When you write a book like that, you trying to add your thoughts into structure that can help your reader to understand your ideas. You put your thoughts into sentences. You group the sentences into paragraphs to help reader. You group paragraphs into sections giving them heading 3. You group those sections into chapters (heading 2). You group chapters into parts (heading 1). You mark some parts of your text as "example" or "things to remember" or "side note". Ideally you do not think how it will look on the paper at that time. Should I bold my examples or all cap them? At that point most writers care about getting their thought down, so it is clear. Mark examples as "examples" and move on. Than you can apply style. You can say all heading 1 is bold 12pt and all examples italic all caps. The same in web world. HTML is your thoughts, your data in a structured format. It can have IDs and references to class (this chunk is example or side note), but it should not have fonts and colors. That's where CSS come to help. CSS is all about presentation: any thing marked as side note should be in a floating box on right with border around. In some companies HTML and CSS done by 2 different people. Even if you not planing to reuse your styles between the pages it is a good practice to separate concerns. Create separate CSS, define your presentation there and reference it from HTML. For more best practices: http://net.tutsplus.com/tutorials/html-css-techniques/30-html-best-practices-for-beginners/ Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.