Burke Holland on HTML5 in Tech.Days 2011

On November 15, 2011, Burke Holland presented in Tech.Days 2011 why HTML5 is the biggest and most powerful HTML specification to ever come out of the W3C. He also explained how to add drop shadows to HTML5 objects, how to create rounded corners, how to use custom fonts, and how to animate with CSS.


What are the webfonts?
The licensing, which is one of the biggest problem of using custom fonts, will not be an isuue whenyou are using webfonts. You just need to add a single CSS or script line to your HTML and some configuration and you are all done. Many like WebInk, Typekit, and Fontslive will allow you to use the fonts for a monthly fee. Using these services is very convenient for the casual developer, handing off some of the complications of serving a cross-browser solution. The Google Font API lets you use a small, curated set of freely licensed fonts by just linking to a stylesheet and letting Google handle the cross-browser and performance concerns. The following is a short list of some webfont providers:
1- http://www.fontsquirrel.com
2- http://webfonts.fonts.com
3- http://typekit.com/libraries
4- http://code.google.com/webfonts

Tomorrow Land (aka Mobile)

HTML 5 Useful Resources

Introduction

HTML 5 (HTML+CSS+JS) brings lots of benefits to your web development teams. Each web development consists of at least two groups: Web developers and web designers. Web developers need to know HTML5. They need to know JavaScript and they need to know CSS. Also, web designers need to know mark-up. They need to know HTML5. They need to be able to write CSS and understand web layout and they need to have at least a decent grasp of what JavaScript does and how JavaScript works. Both of these groups need useful training materials, tutorials, samples and demos. This post is introducing 4 main resources to help these groups to learn how or when to use or adopt HTML 5 in their web pages.

Resource 1: HTML 5 Doctor

HTML 5 doctor is a great resource for learning HTML 5. In this website, you see articles relating to HTML5, its semantics, and how to use it right now.
In the “Article Archive” section, a complete list of all HTML 5 related posts grouped accordingly in order to get you started or to help you understand the specification and specific elements a little more.

Resource 2: HTML 5 Cheat Sheet

HTML 5 cheat sheet is a PDF document which includes a list of all currently supported tags, their descriptions, their attributes and their support in HTML 4. ( HTML 5 Cheat Sheet )

Resource 3: HTML 5 Demos

HTML 5 demos is a great selection of HTML 5 demos. Some of the cool demos from this site are listed below:

1- Interactive canvas gradients ( http://html5demos.com/canvas-grad )
2- Geolocation ( http://html5demos.com/geo )
3- Drag and drop ( http://html5demos.com/drag )

Resource 4: HTML 5 Rocks  

HTML 5 rocks contains various samples and demo code. Some of the cool demos from this site are listed below:

1- Video cube ( http://studio.html5rocks.com/#Cube )
2- Page flip ( http://studio.html5rocks.com/#Flip )
3- WebGL Globe ( http://studio.html5rocks.com/#Globe )

Visual Studio 2010 and HTML5

Visual Studio 2010 was originally released without HTML5 support, but VS 2010 SP1 supports HTML5 to some extent. The entire HTML5 specification is not supported but most of the new elements and attributes are. That means you get both intellisense and validation for HTML5 with SP1.

How to turn it on?

After installing SP1 you have to tell Visual Studio to start using the HTML5 schema. Go to Tools -> Options, and then select Text Editor -> HTML -> Validation. You should now be able to select HTML5 or XHTML5 as the target schema or if you have the HTML Source Editing toolbar enabled, you can select it in the target schema dropdown.

CSS3

In SP1 there are a few improvements in the CSS3 support as well, though not as elaborate as with HTML5. The editor now supports the more advanced selectors such as div:nth-child(2n+1) without giving validation errors and the new color values rgba, hsl, hsla and 8 digit hex values are also supported.
Therefore, with Visual Studio today, you can build HTML5 and CSS3 web applications on top of ASP.NET, and with SP1 Microsoft has made it a lot easier for you. All ASP.NET developers are encouraged to start taking advantage of what HTML5 and CSS3 has to offer already today. The Web Platform and Tools team takes web standards very seriously and everybody will see much better support for HTML5 and CSS3 in the future.

Copyright © All Rights Reserved - C# Learners