Can I start using Html 5 on our websites? Or is it too early to use it?
I see that Google is using Html 5 for their images site. If google can use it, I guess, we too can.
HTML5 is many things. If you're asking, "Is every feature of HTML5 ready for the web?" then the answer is and will be no for a long time.
Instead, if you're asking "Can I use these cool HTML5 things like <section> elements, canvas, CSS3, custom fonts, and local storage?" then the answer is yes. The best source to guage support of HTML5 features is caniuse.com, which also includes links to shims or polyfills for browsers which don't support the feature.
The answer is: yes, you should.
Please read here, and here.
"Depending on who you ask, HTML5 is already ready, or it won't be ready until 2022" this was quoted from Google developer advocate Mark Pilgrim at the WWW2010 conference..
you can have a look at this post also this post and read some info about HTML5 whether ready or not
Related
I've got plenty of experience in HTML, CSS, JavaScript, Jquery, etc. but I've yet to make the plunge into HTML5.
In trying to get my head around HTML5, I've become a bit confused. So it's a relatively new standard and my uninformed brain tells me it's not well supported. Is this true?
I've got a vague idea that there are some 3rd party scripts that improve HTML5 compatibility, again am I right?
Any good tutorials on getting to grips with the basics of HTML5 for an experienced developer?
Ok a lot of questions there but:
HTML5 is quite well supported on most modern browsers nowadays and it's generally safe enought to use as is.
Scripts to improve compatibility? you mean Javascript that detects how old your browser is and depending on the answer show you HTML 4.01 or 5? well maybe but again, it's at the point when it is not required anymore.
Yes: w3schools has a cool one.
All of that said bare in mind that HTML 5 is still in development and not a done deal. Some areas are still being implemented but at the speed things are take this is not an issue for starting to develop your pages in HTML 5.
This website - html5 doctor is a very usefull resource that you can browse looking for what's implemented where and how things are generally going.
I also found this link to be particularly useful when figuring out what's available for each browser and what's not.
Another subject that goes well with HTML5 is CSS3. Check them both out and maybe come back with specific questions ;)
the HTML5 buzzword is being used a lot, but people mostly use it to describe different things.
HTML5 is the newest (and as of yet, unfinished) iteration of the HTML standard, as presented by W3.org.
Purely, HTML5 is the markup language, but it is usually referred to as to include CSS3, and JS (in the form of the canvas element).
In the HTML area, HTML5 boasts some new element tags that should help developers add semantic meaning to their markups(e.g. header, footer, aside) , and also some useful functional elements (progress-bar, video, audio)
In the CSS area, there are some new properties that allow you to animate your elements, and orient them more easily.
In the JS area, you can read up on the Canvas element, which is a good competitor to Flash. It allows you to draw both using vectors, and bitmap data.
As for good references to HTML5, you can use http://html5doctor.com/ or http://www.html5rocks.com/en/
Hope this helps.
Please note that w3schools isn't such a good reference anymore. Although for just looking at the possibilities it's fine I guess.
I recommend the tutorial from Lynda, but there are other sites. Just search at google. It's also possible to buy a book, since there have been written a few already.
Fallback/polyfill Scripts & libraries like Modernizr,Javascript Libraries can help you take care of older browsers. (backwards compatible)
As for the browsers. Use chrome, it supports most of the functions. Look at sites like findmebyip for more information about what is supported.
HTML 5 support is not yet fully integrated in all browsers. They are still in development stage. For studying the HTML 5 the best medium would be w3schools
They have introduced new elements in HTML5 which has reduced our overhead for html. New Elements
CodePlayer
Videos for HTML 5
I defied all conventional knowledge, and wrote my HTML5 site first. Now I am writing the HTML4 site and adding a script which detects old browsers. The question I have is mainly regarding web safe fonts. I am aware that it is best practice to use HTML instead of images of pretty text, for the benefit of SEO. However, since the HTML5 website exists with the HTML in the headers, I wonder if it is safe to use images to represent those headers in the HTML4 version of the site. Simply put, will my web client's indexing suffer? I feel that the HTML5 version will ensure good ranking, but I wanted to put it to the community and get an opinion.
Second question, should I create the more accessible version in HTML4 or XHTML?
Finally, is there a simpler way to make a new site backwards compatible, and still be able to make use of newer technology?
After a fair amount of research, I found that it is not so unusual to create a site in HTML5, and implement items for the purpose of graceful degradation.
At this site: spacebug.com/gracefully-detect-old-browsers-and-fallback-from-html5/, the authors recommend not using PHP user agent variables to detect browser capability. It says that there are too many user agents and that headers change, etc. Check out the link for their in-depth explanation. It offers that the right way to do it is to use javascript to check for certain capabilities. Since my purpose is to either render it in HTML5 or render it in XHTML, this makes my life pretty simple.
Once I found that javascript was the way to go, a simple Google search led me to this site: diveintohtml5.info/detect.html. This offers a number of methods for detecting browser functionality as it relates to HTML5.
For those who are not as savvy with the code, or for those who are looking for a quick solution, the second website also offers a link to modernizr.com, which is an "open-source MIT licensed javascript library that detects support for many HTML5 and CSS3 features."
So, thank you all for your input. I have learned a great deal from this experience, and I am hoping it will make everything much more user friendly and efficient.
Happy developing!
Kat
My question is borne out of my confusion on (still incomplete, with existing features still evolving?) HTML5 support in different browsers, all the resources available on how to implement existing features and simple practicality.
1) How do you go about implementing HTML5 only features in your web-site? Do you do some kind of browser/version check at first access and notify user that he should install some other browser (though cumbersome and uncomfortable to the user)?
2) Is there a way to check availability of HTML5 features in user's browser dynamically (version X of Chrome does not support it, next might and it should work then) and easily without some significant computing overhead and significant coding?
3) Assuming the answer to 2) is yes, what to do about changes in spec that might occur in the future? (The check would say fine, the browser does implement e.g. WebGL, but my implementation would run into errors as there would be some changes between the spec I had used during development and spec that was enhanced in the W3C process and would make my implementation incompatible)
to start using html5, make sure that the first line in your html is <!doctype html> this tells the browser that you are speaking in the language of html5
this google-hosted html5 shiv helps to ensure that the new html5 tags work in older browsers and as someone already pointed out, you can and dare I say it, should use modernizr to test the browser's CSS rendering capabilities
This is just something you need to keep abreast of yourself unfortunately ;) The way I look at it, if the spec changes in a big way, lets say they decided to remove the <article>, there will be a lot of chatter online and you are likely to read about it
I recommend that you take a look at html5-boilerplate. It's a A rock-solid default for HTML5 awesome.` It's a starter kit with template html, CSS and Javascript files for building an html5 website.
This is useful: http://www.modernizr.com/
As for 3: I think that's just a risk of using a technology before it's out of spec.
Take a look at modernizr, it's a js library that will do various feature detection tests and gives you a way to query whether or not to use a particular feature. You can also load specific js files with modernizr.load based on whether a feature is supported in the browser.
http://www.modernizr.com/
Tutorial: http://www.alistapart.com/articles/taking-advantage-of-html5-and-css3-with-modernizr/
I have a client who wants a none flash website very similar to the following template:
http://www.templatemonster.com/flash-templates/34056.html
I am always willing to learn, but I want to know first of all if this would be possible to create in HTML5. I realize this would only work on latest versions of IE, Firefox or Chrome.
Thanks guys!
Creating such a website with all the flashy effects and transitions can be a real pain for beginners. In this case you would have to deal with either CSS3 transitions or javascript (jquery) and do a lot of extra work, just to get that special effect.
To get you started with HTML5, have a look at Dive into HTML5
If you want a good backwards compatibility for html5 features, have a look at: http://afarkas.github.com/webshim/demos/ or http://html5boilerplate.com/
Yes it is possible. Everything on that page can be done with HTML5/CSS3/Javascript. Though some of it more easily than other parts.
Yes, html5, javascript, jquery, css3 are your best friends. Check http://processingjs.org/ for a very powerful canvas lib. They've just released their 1.3.0 version.
/Richard
I've seen entire games developed with <canvas> element. I think this is doable, albeit a fair amount of work. But do promise to leave the annoying guitar riffs out... :)
Some combination of:
http://flowplayer.org/tools/demos/overlay/multiple.html (click "open all")
and the shaking effect from:
http://jqueryui.com/demos/effect/
Would be pretty similar. If you're going to be learning HTML5 from scratch, make use of JQuery - a lot of people that have been doing this a lot longer have already tackled a lot of the common requests.
there is a flash-like tool from HTML5 called Hype .... check this video
I created this question as community wiki in the hope that it and its answers will be edited as the situation with HTML5 changes.
Time to use HTML5?
This question gets trotted out about once a year, so I might be beating a dead horse, but is it finally time (in the summer of 2010) to use HTML5 when developing a brand new web site?
Related HTML5 Questions on Stack Overflow
Is it time to start developing with HTML5? ('09 edition)
Is it time to start using HTML5? ('08 edition)
Any reason not to start using the HTML 5 doctype?
Is there any pros to use HTML 5 doctype <!DOCTYPE html> even if i’m not using any new HTML 5 tag?
Is valid HTML5 OK to use now
Is it too early to use HTML5
Edit as a follow on
Is it a mixed bag: i.e. use these tags safely but stay away from x, y, z?
We are far far away, see:
When can i use...
But you can dive into it by following:
Progressive enhancement
Graceful Degradation
for the moment :)
I think you'd probably get better feedback if you clarified what you mean by 'use html5'. That covers a lot of different functionality, some of it not even finalized. Are you planning on using it all... or just certain pieces (like the tag?) Whether its a good idea to use it now is going to depend on what pieces of HTML5 you are talking about.
It depends what you mean by HTML 5. You can use the doctype now, and many of the features are backward-compatible, so you can use them now and they will fallback gracefully. Other tags just won't work, and so you have to be more judicious.
Not until 2022 (if they stay on schedule).
http://en.wikipedia.org/wiki/HTML5#cite_note-techrepublicref-8
Regarding the "When can I use" link posted by Sarfraz - wow, that's an awful lot of extra work, waste of time, and consideration that could all be avoided if you just drop HTML5 and use Silverlight, Flex, or JavaFX. Any virtual machine based solution is going to beat fighting an endless battle with browser wars.
Is your site ready to abandon half the internet?
Yes, it's time! By two reasons:
It already works
It speeds up development of HTML5 compatibility
Use it with caution though! Using the simplified doctype and the new semantic markup tags will not hurt, but just do good. Using canvas and the media tags with no fallback might be a couple of years too early.
I wish! Wouldn't that be great! I guess if you have a site that has a high enough demand that people will upgrade their browsers then go for it. It seems like people are more attached to their old browsers than super glue is to fingers.
According to readwriteweb, as of May 2010, 46% of users use browsers with html5 support. So, maybe we are over 50% now. But it really comes down to your audience - if you are targetting the general population, I would say it's a definitely too early. But if you are targetting a more tech-savvy audience, maybe not. Of course, degrade as gracefully as possible.
Link: http://www.readwriteweb.com/archives/46_of_internet_users_ready_for_html5.php
EDIT: Yes, the study mentioned in the readwriteweb reference was done by Chitika, and was based on HTML 5 video support. Chrome, Safari 3 and up, and Firefox 3.5 and up were consider "HTML 5".