When Written: June 2013
Recently there have been some interesting developments within the Microsoft application development arena. Followers of this area will know that previously Microsoft has put a lot of work into XAML which is their solution for rich application interfaces and in direct competition with Flash. Like Flash, XAML required a proprietary player called Silverlight; however no amount of announcements by Microsoft that they were supporting all other platforms could convince the web community that it will be ever be for anything other than used for windows desktop, phone or perhaps intranet development.
The problem that I have with them is that as soon as you try to do anything ‘Real World’ when you start to customise the auto-generated application to do your will, the fight begins and the honeymoon is soon over. Customisation can involve so much editing of code that it is easier often to write your own from scratch, at least that way you tend to understand how it works. Products like Lightswitch can be useful for prototyping or building an internal application but too often by the time you have wrestled with it and learnt yet another way of building apps I think that you are better off with coding from scratch. Thankfully nowadays even when coding from scratch if you choose your development tools well then you still have lots to help you.
Here we return as promised to Visual Studio 2012. Now, we all know about its excellent and extremely helpful Intellisense which prompts you with the correct syntax for most languages that you care to use, but the latest version takes this hand holding even further. When in the HTML editor view, there are now what is called ‘Smart Tasks’, with these if the code has a Smart Task available then a small rectangle with a blue border appears under the start of your code line. Clicking on this opens a dialog box with a lot of configuration options in it which can make building up the code for such items as data grids so much quicker.
Smart Tasks make code that bit easier for many controls
Previously in order to access these dialogs, you would have to go to design view, find the object that you wanted to access, and this sometimes is not easy as it may be hidden as it only appears in the user logged in view or behind other objects. It is so much better that you can now stay in code view and work on the object, safe in the knowledge that it is the correct one.
Further welcome improvements are the support for the WAI-ARIA accessibility standard (http://www.w3.org/WAI/intro/aria) . If you were not aware of this and thought that to make your web site accessible all you had to do was to add a few ‘alt’ tags to some of your images, then think again. The idea behind WAI-ARIA is to make the whole structure of the page understandable to devices like screen readers by describing the purpose of objects on the web pages with terms like ‘menuitem’. The aim is to describe Ajax and similar dynamic controls in such a way that the tools that are available to disabled users can interpretate them and offer a usable alternative. Expanding tree controls and drag and drop functionality are two such areas that give problems to disabled users who are unable to use a mouse for example. Without some way of being able to describe such controls on a web page it is up to the screen reader to ‘best guess’ and this obviously can lead to variable results. As more applications are being written using web technologies and the ability to use these is becoming a vital part of modern living it becomes even more important that a significant part of our community is not excluded. To show how this works in practice, let’s take a simple menu item. These are usually built using the list tag <li> but of course this HTML tag is also used to display a bullet list so to tell the screen reader that we are using it to define a menu we add to the tag:
It’s as simple as that, and Visual Studio 2012 has full intellisense for this as well being able to describe visual effects like ‘disabled’ and ‘busy’, these can be applied to <div> tags so that it is now finally possible to make a web page semantically readable, which has been an aim of many for some time now. There are many other enhancements to Visual Studio all of which are designed to make code writing faster and less error prone which is always welcome. For me a feature that is most welcome is the addition of ‘Page Inspector’. This tool renders the web page that you are working on as if it was being viewed in a browser without you having to run your application fully. In this view you can then edit the code and the CSS and immediately see the effect on the final rendered page just as if it was viewed in a browser and your changes can then be written back to your style sheets using the CSS sync option in Page Inspector. It really makes design changes to a web page very easy to do and it is at last very close to the design tool that I have been wishing for for some time now ( see PcPro passim ). You still don’t have a full WYSIWIG developing environment with drag and drop like we had in Visual Basic 3, but Page Inspector is more like a worthwhile enhancement to the developer view you now get in most browsers, it’s a move in the right direction but still far from there yet.
Article by: Mark Newton
Published in: Mark Newton