Visual Studio 2013 for Web Developers

As promised, the slides that I used for the web dev session in Visual Studio:

Key topics were:

  • Intellisense everywhere: HTML, CSS, JavaScript and Web.Config
  • Building your own Smart Tag
  • Browser Link
  • Voice Commands


Get your SharePoint site on a mobile device using HTML and CSS

Here are my slides that I used for the responsive design session in SharePoint 2013 at SharePoint Saturday. Hope you had as much fun as I did.

Key takeaways are:

  • don’t wait to make your sites available for mobile devices, the time is now
  • device channels is the sharepoint solution when you want to deliver different content and pages to different devices
  • media queries is the solution to deliver the same content to all devices

If you ask me what the best option is, I would go for the media queries.



If you are serious about web development, take a look on modern.IE

Writing cool HTML and CSS code is not always the easiest thing to do, specially if you need to get it working on older browsers. is  Microsofts effort to make this easier for you. is a dev center with free (yes free) tools and resources to spend more time building your web applications instead of testing it on older browsers.

  • Download virtual machines
  • Scan a webpage for common coding issues
  • Test BrowserStack for 3 months.


Use HTML5 to build what you want, where you want it

For all those students who want to download the presentation I gave at the techdays, find them on slideshare:

I had a great time, and I hope that I could inspire you to create awesome windows 8 applications using your HTML, CSS and JavaScript skills.

I also found some pictures that a few of my colleagues took during the session for those who want to have an impression of how it was:

BElxhHQCEAEB_uh d07ba376858a11e2902122000a9e5160_7 BElur79CUAE3Gts


If you also have image sabout the session, please mail them.


Every Web Developer is a Win8 developer presentation on MultiMania

First of all, I had a great time on MultiMania and met a lot of great people over there. People from different worlds. Every day I work mainly in a Microsoft world, developing websites with ASP.NET MVC but I’m also busy in HTML5, CSS3 and the combination is something that I love.

But on MultiMania I had the chance to talk to Adobe people, Game creators, … Some talks were inspirational, other ones were technical and that what it’s all about isn’t it!

On MultiManie Dieter and I gave a presentation on Win8 development and how you can use your existing web skills to build Metro applications.

In case you’ve missed it, here are the slides:

“How to get started with HTML5?” session @ Queaso

Pictures and information about my session @ queaso can be found over here: click.



Hope to see you all on one of the next Queaso meetings.


Building metro style apps with HTML5, CSS and JavaScript

On 21 and 22 of may multi-mania takes place in Kortrijk. Like every year you will be able to follow various of workshops on day 1 and a number of sessions on day 2.

Now, hang on, the best part of it all is: IT’S FREE, NADA, NOTHING, so you don’t have any excuse to stay away.

On day 1: I will be your host together with Dieter De Preester and Frederik Duchi on building metro style applications with HTML5, CSS3 and Javascript.

Learn how you can use your web skills to build Windows 8 Metro style apps using HTML5, CSS3 and JavaScript. In this session you’ll discover how to harness the rich capabilities of Windows 8 through JavaScript and the Windows Runtime.

You will learn about navigation, user experience patterns and controls and the seamless integration with the operating system that will let you create great Metro style apps.

On day 2: Dieter and I will show you that every Web Developer is a Win 8 Developer

HTML5 is a first class citizen inside the windows 8 eco system. In this session you will learn how to create windows 8 metro style applications using HTML5, JavaScript and CSS3.

Off course, you’ll have a bunch of other sessions where you can take a look at. If you are interested in more win 8, join Katrien De Graeve and meet her at the metro.

Metro is the name of the Design Language for applications in Windows 8. Join us for a ride on the key principles behind Metro Design, the inspiration and some great examples as we move into the future with Windows 8 Metro Style Apps.

If you want to see the other sessions or you want to register, visit the multi-mania site

So I, or we really hope to see you there during the sessions or afterwards at the bar.

HTML 5 Validation scripts in ASP.NET MVC

With the arrival of HTML5, you can make use of the cool new form validation features like:

  • email, url
  • number
  • required

Problem with these features, for me, is that each browser uses their own notifications. I prefer that I can use a notification that looks the same in all browsers.

One way to do this is with Javascript and CSS, more info can be found on several sites. Here is an example page that microsoft created: click here.

If you don’t want that the browser validates your form, you can use the novalidate keyword on the form. If you are using ASP.NET MVC you can pass this attribute like so:

@using (Html.BeginForm(null, null, FormMethod.Post,new {novalidate="true"}))

Hope this one helps you in you projects

Live session on Media Queries now on Channel 9

Using HTML5 date element in ASP.NET MVC3

With the arrival of HTML5, a few new elements are introduced:

  • email
  • url
  • datalist

Another pretty useful element is the date element

<input type=”date” />

Unfortunately, this element is not supported by most browsers. Now here is a trick to have a fallback in ASP.NET MVC3. We will use the date control if it is supported and use the jQuery UI Datepicker if it is not supported.

Because we want to do this for all date controls in our project, we will create a DisplayTemplate.

Step1: Create a DisplayTemplates folder in the shared folder of your project

Step2: Add a Partial View with the name of the type, in this case DateTime

Step3: Because I’m a razor fan, we’ll use razor.

@model DateTime

<input type=”date” />
<script type=”text/javascript”>
if (!Modernizr.inputtypes[“date”]) {

Now I’m putting the script in the template, but to reuse it refer to it on your layout page.

Don’t forget references to jQuery UI, Modernizr. Place them in your layout page.

gr k