HTML5 /CSS3 some good new tools.....BUT!

Mar 17th, 2012 at 08:24 AM
User 1964159 Photo

Tonethemoan
Registered User
156 posts

Hello,
On paper at least, there are some great new features available in HTHL5 and CSS3 - <article> <section> <sidebar> and more. I like the look of "box flex" (the box model), which seems to allow for some new ways to layout pages. As usual it is slowly being taken up by all browsers and many have got their own take on the on the subject, so you have to insert loads of conditional markup for webkit, moz and the rest. Its all probably buried in the W3C pages, but is there anywhere else where these scripts might be located? I'm looking forward to using transparency and opacity, but without these scripts, browsers often render pages that are a complete mess. OR IS IT TOO SOON TO BE LOOKING AT THIS STUFF - have we got to wait for the browsers to come on board?
Just a thought.
Tony
tonethemoan
I luv the web
http://www.ajswebdesign.com
http://www.thethatcherstavern.com
http://www.philchambersconsultancy.co.uk
Mar 17th, 2012 at 08:40 AM
User 38401 Photo

Jo Rice
Senior Advisor
10,951 posts

These would be the best places to find your answers short of finding some online courses which are also out there and available. Sitepoint.com comes to mind for some interesting video courses. Here's the 2 main ones you need to look at though:

HTML5
http://www.w3schools.com/html5/default.asp

CSS3
http://www.w3schools.com/css3/default.asp
Jo

http://elementsinwebdesign.com
Mar 17th, 2012 at 09:00 AM
User 122279 Photo

Inger
Senior Advisor
14,624 posts
Online Now

Hi Tony,

I find myself still creating classes for article, aside, hgroup, section and whatsnot. I think it will take some time before all the browsers have caught up. And then there are a lot of people who can't/won't/don't know about upgrading their browsers, so it will be necessary to use css2.1 code for a long time yet.

When I build a site, I try to make it looking the same in all browsers. If that is not possible due to lack of support for new code, I try to make the sites at least decent-looking in older browsers. E.g. the css3 thingie with rounded corners is only supported by IE9, not before that. So those who are still using IE8 or older, will see square corners, but otherwise the contents will look the same.

I recently came across a little programme that is called IEtester, with which you can test your pages as far back as IE5. You find it here: http://www.my-debugbar.com/wiki/IETester/HomePage

Here is a site that tells you what the different browsers support: http://caniuse.com/ .
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Mar 17th, 2012 at 09:36 AM
User 1964159 Photo

Tonethemoan
Registered User
156 posts

Thank you Ladies,
Jo Ann you have narrowed the search for me, (W3C is BIG!).
Inger, It makes sense to provide some CSS2.1 in addition to CSS3, I can see that, because of browsers AND users dragging their feet, but how is that done in practice? I often create seperate style sheets, (rather than in-line), so do I simply link to two style sheets from my HTML page?
I think the web developer's job just got much bigger, which is really quite odd. Now we can use a new <!DOCTYPE html>
<html lang="en"> ........I thought is was going to get much easier Ha! Ha!
Thanks again, I have book-marked the references.
Tony


tonethemoan
I luv the web
http://www.ajswebdesign.com
http://www.thethatcherstavern.com
http://www.philchambersconsultancy.co.uk
Mar 17th, 2012 at 02:46 PM
User 122279 Photo

Inger
Senior Advisor
14,624 posts
Online Now

Yes, you are on the right track by linking two or even more style sheets to your files. Things like this have become quite common:
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
<!--[if IE 6]><link rel="stylesheet" href="style.ie6.css" type="text/css" media="screen" /><![endif]-->

<!--[if IE 7]><link rel="stylesheet" href="style.ie7.css" type="text/css" media="screen" /><![endif]-->


The 'if IE 6' or 'IE 7' will be ignored by other browsers.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Mar 18th, 2012 at 12:16 AM
User 2073552 Photo

SirAGE
Registered User
1,625 posts

http://helpsite.sirage.com is where you can find an Example of an HTML5 and CSS3 site. :D
"An Apple doth not fall far from its tree, yet an orange does."

https://lbwebsitedesign.com - Responsive Web Design & Web Hosting Services.
http://helpsite.sirage.com - HTML5, CSS3 and CC Help Video Blog.
Mar 18th, 2012 at 05:42 AM
User 1964159 Photo

Tonethemoan
Registered User
156 posts

Thanks to each of you, some very helpful stuff here.
Tony
tonethemoan
I luv the web
http://www.ajswebdesign.com
http://www.thethatcherstavern.com
http://www.philchambersconsultancy.co.uk

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.