HTML5 Tests for Summer 2011

A new set of browsers were released  this summer from  all the major browser vendors. So its time toithese new browsers are included in these tests using the revised HTML5Test.com 450 item benchmark. The browsers are ranked by their compliance  scores with Google Chrome the best and Microsoft IE 9 and 10 the worst.

Browser HTML5 Compliance Rankings
Browser	HTML5 Test Results
Chrome  14.0885	341/450 +13 bonus points
Firefox 7.01	313/450 + 9 bonus points
Safari 5.1	293/450 + 9 bonus points
Opera 11.50	286/450 + 7 bonus points
IE10 2nd preview	231/450 + 6 bonus points
IE9.0.8182	141/450+ 5 bonus points

Most disturbing are  1)all the vendors are not close to full compliance and 2)Microsoft lags way behind. The IE10 revision 3 runs only in Windows 8 preview and so far we have not been able to get that to work properly on our old Windows Vista machine.

Iframes in Blogger

This will attempt to add an iframe to blogger:



Hope this works as You tube provides iframe code for its videos.

W3CSchools jQuery Tutorials

Let me suggest that the new jQuery JavaScript tutorials at W3schools are the place to be for doing quick jQuery script testing. W3schools has jQuery 1.42 at your disposal [just slightly behind the recent upgrade to jQuery 1.5]. But the Edit + Test facilities are perfect for trying out snippets of jQuery code. For example, the jQuery Pocket Reference by David Flanagan- O'Reilly Press is packed with excellent jQuery code snippets - and this is just the place to check them out.

Tableizer: Spreadsheet Data to HTML

Tableizer is a online conversion utility that converts Excel, iCalc, OpenOffice and other  spreadsheet data into a HTML table. It is online and dead dsimple to do. Just select and copy the data you want [including column and row headers as desired] using CTRL+C or your spreadsheets copy function and then paste into the Tableizer  textarea[see screen shot above]. Press the Tableize It! key and for a 20 columns x 80 columns of data Tableizer was done in less than 2 seconds as seen below:

As you might suspect Tableizer did not convert embedded images, charts and other objects. The data used above is from the Federal Reserve data on $3.3Trillion bailout money - in this case the $200Billion++ that made AIG Insurance whole. Also note that Tableizer does not provide for scrolling in either the columns or rows axises. But the amout of grunt work Tableizer eliminates, makes it well worth the while.

A Beastly Browser Market

Depending on who is doing the counting Microsoft's IE Browser is starting to drop below 50% market share for all its versions - IE9, IE8, IE7,  IE6 and IE5. This has been long overdue since IE has been one of the worst browsers for the past 8++ years. Only now does  IE9 comes close to matching the features and  HTML+CSS+DOM standards achieved many years ago by  all of the other browsers.

Microsoft:The Borgia's of a Beastly Browser Market
Microsoft entered the browser market in 1996 with a proprietary and "perpetually" free plus "promised-to-be" standards compliant versions of IE and its IIS web server. Ye Editor uses quotes on "perpetually" because to date IE has remained free but IIS is the key feature in the more expensive Pro versions of Windows 2000, XP and Windows  7. Likewise waiting for 10++ years for IE9 to implement standards promised years ago is simply a travesty committed on the Web development community that has had to develop hacks and workarounds for deficient Microsoft IE and other web software. Unfortunately the proprietary and standards defying tradition of Microsoft appears to have spread to the wider browser development community, especially in HTML5.  The degree of fragmentation and proprietary subsystems in HTML5 is very alarming - check here for the gaps around key features like multi-touch UI, Web SQL Database, Indexed Database, Web Forms 2, SVG Inline, plus audio and video codecs.

World wide usage share of browsers for December 2010
Source - I.E. Firefox Chrome Safari Opera Mobile
Net Apps - 57.08% 22.81% 9.98% 5.89% 2.23% 3.45%
StatCounter - 46.94% 30.76% 14.85% 4.79% 2.07% 4.10%
W3Counter - 41.3% 30.3% 13.5% 5.9% 2.0%
Wikimedia - 42.12% 28.82% 11.18% 5.70% 3.67% 6.4%
Median - 44.53% 29.56% 12.34% 5.80% 2.15% 4.10%
from Wikipedia

ComputerWorld tells an intriguing  story of what is happening of late. Chrome  and Safari , whose latest versions have very fast JavaScript engines, have risen to new heights of usage. Safari appears to be propelled by increased Mac sales. But Opera continues to stay in the doldrums along with Firefox.

The Beast of Browser Usage

Since 2002 IE has had the worst browser in terms of compliance with W3C standards like HTML, DOM, and CSS. Since 2005, IE has had the weakest feature set in terms of themes, extensions and other browser conveniences. Since 2007, IE added the worst JavaScript performance to its already worst record for  JavaScript version  with omissions, non-standard compliance and proprietary extensions. Yet during this 9 year period IE has managed to retain greater than 50% marketshare.

Admittedly, IE9 is a vast improvement , especially over IE6 and IE7 for standards compliance and JavaScript performance. But the number of extensions and themes, JavaScript standards compliance, and cross platform capabilities of IE9 are distinctly worse than all the other browsers. Also, unlike the all the other browsers,  IE9 does not have a mobile version for use with iPad, Android or even its own new Windows Phone 7. Finally, unlike all the other major browsers, IE9 is not cross platform being only available for Vista and  Windows and not Windows XP or any other earlier versions of Windows.

But watch, IE9 will probably out do the Opera browser in market share when it launches later this Spring. This is very fickle because the Opera has for the past 9 years had more features, better standards compliance and now has a superior JavaScript engine which powers all of the latest Web 2 features used on most websites.

And Opera has been a pioneer in such features as mobile web browsing, touchscreen operations, gestures, and voice activation. Indeed, many of the latest new ideas will be seen on Opera first. Also the Opera  browser is free and a fast, easy down load and install. Finally, the latest Opera 11 gets very good reviews; still the Opera browser barely nudges past 3% in market share. Truly, the browser market is a strange beast as decided by fickle users when an innovative browser like Opera gets largely ignored. But even worse, with HTML5 the browser market will be fragmenting just as browsers[including  IE9 finally], reached a reasonably high standard of cross browser compliance.

HTML5 Fragmentation

Everybody and Steve Jobs are saying the new HTML5 is the way to go. Ye editor believes HTML5 is a Trojan Horse. True, there are many attractive features in HTML5 such as CSS3,  Canvas bitmap manipulations, Web Database, SVG supporting robust vector graphics, multi-touch screen operations,  offline operations and other long overdue plus other very helpful features. The problem is that full and complete implementations of the just named features among the browsers is not months but years away. This new fragmentation will set Web and mobile development back in similar fashion to the Microsoft deliberate freeze on IE features for 6 years from 2001-2006. In sum, browser development is on the cutting edge of software delivery, and as such proprietary continues to win over standards. Neil Mcallister at Infoworld echoes this sentiment. Browser usage is , and continues to be, a beast.

Summary

Ever since Microsoft entered the browser market in 1996 with a proprietary and "perpetually" free plus "promised-to-be" standards compliant versions of IE and its IIS web server[ see the sidebar for details]; the browser market has been a bete noir - a black beast of a market. Look at the evidence:
1)IE continues to control 50% market share despite being the worst browser  for 8++years;
2)Opera, one of the major browser innovators and leading browsers, is "rewarded" with a dribble, a continuing  2-3% market share;
3)Proprietary continues to win over standards based browser operations despite the clear advantage of  open and interoperable on the Web;
4) The latest move to mobile phones and tablets also marks a major fragmentation of HTML5 and other Web  standards.
So the next time you hear a Finance, Business, or Economics professor praising the efficiency and effectiveness of  business markets, ask them to explain the bete noir that is the still dysfunctioanl Web browser beast of a market.

Google Blogger: Operational Design Excellence

Google's Blogger is a powerful tool for free blogging  - yes, as close to absolutely free website and blogging that one can get on the Web. There are a few other very good free services like WordPress.com, Weebly.com and Wix.com but Google gives you the most free storage and bandwidth resources among this elite group of no-cost Website and blogging services.

Design Strengths of Blogger

Now one thinks naturally enough of Blogger as just a blog service - Wrong! Blogger allows users to create  Web pages so that a user can create a  professional grade website for an art gallery, or a baseball team or a small business. But if you want to include a blog on your website, users can do both.  And the design tools make it easy to do. See here for how to sign-up and create your first website on Blogger.

Once you have created your Hello World Website in blogger you are invited to choose a template for its overall design. What Google does not tell you explicitly is how easy it is to change that original blog design and styling. That is what this posting is about.- how to redesign your Google Blogger website.

Getting into Redesign Mode

UnlikeWordPress, Blogger has its menus and admin navigation scattered all over the place so here is the basics:
1)Go to your blog;
2)Sign in [using the upper right corner command ];
3)Click the Design button   which will  take you here:

 You want to click on the Template Designer. This is a new addition to Blogger and has all the power of such programs Artiseer which allow extensive editing and control of blog designs and layout. Clicking the Template Designer button will bring up the following Blogger Template Designer.

Now you are ready to redesign your website/blog. You can make as many or as few changes as you want. The Blogger Template Designer will constantly preview the changes in the look and styling of your blog immediately below the design area. Nothing is finalized until you click the Apply to Blog button at the top right of the screen [not shown in the screenshot above]. But even after that it is so simple to change the layout and all stylings, one does not have to worry about the Website design when using Blogger. This post will show all the control users have over their design using the Blogger Template Designer.

The first design choice [see the tabs in the left column of the screensot above] is what template you want to use. If you are happy with your  just click on your next choice. However, if you do want to change your overall design you have 6 major templates to choose from and then 3-8 specific styling variations. In the screenshot, I have chosen a dark look with a dramatic, semi-transparent  background.. But even this background can be changed as  shown below.

Even more important to blogger users is the capability to use literally thousands of free template  designs  available for free on the web. Btemplate is typical . They offer dozens of free Blogger Templates and have the instructions on how to load a selected free template into your Blogger site; it is a fairly easy 3 step process. WordPress has this capability for its full blog; but not yet for its free WordPress.com site.

Template Designer: Background Change


The background tab allows the user to choose the background image from about10- 50 pre-designed WebTemptationsbackground images [as done in the screenshot] per category, or upload your own image.Given there are 20 categories, users have hundreds of choices for a background image.However, there is not an ability to have a separate background image for the header part of your template as in WordPress.com. But users do also have a selection of color palettes to choose from for a simple color background. The next choice is Layout.


Template Designer: Layout

Clicking on the Layout option allows users to choose the basic body and footer design for their blog. One can have the sidebar on the left or right or on both sides with two sidebars. The sidebars themselves can be one or two column side bars. Likewise the user gets to choose between 1, 2 or 3 column footers.

The content of the sidebars and footers is done in the main Blogger Design window where a set of default gadgets may be replaced by user selections. These gadgets or widgets provide awealth of options for customizing your website with Search capabilities, Facebook+Twitter connections, Recent Posts summaries and over 1000 other options. With the capability of adding your own widgets or simple HTML+JavaScript blocks, Blogger goes well past WordPress.com in user refinement of their free blog. And the Layout tab allows the user to get a better layoutdesign to accommodate all those gadgets.

Template Designer: Adjust Widths

One of the simplest of the Template Designers options, the Adjust Widths tab allows users after they have chosen a layout to then set the widths of the sidebar[s] and overall body of the website/blog. This seems trivial but in many systems from Drupal to Wordpress, this task is such a bloody mess to do - almost inevitably it means messing around with CSS templates files - and sometimes not a simple one entry change.

So to have sliders and an immediate preview of what it will look like in The Template Designer is a god send. Lots of hacking work is avoided. Strangely, the final Template Designer tab, Advanced, does the same thing - it allows users to make a bunch of CSS and HTML changes to your Blog's detailded formating in one place and fairly simply as seen below.

Template Designer: Advanced Tab

Blogger users that are fanatic about the formatting of their blog, will love the advanced tab and all its options. Users can change the font, its styling and size for just about every element in a Blogger template. The screenshot shows how the Tab Text is being changed . So users will quickly learn that although there are many options to control, the way to change them is very similar and pretty simple. Other Website tools have this capability but either it is limited or requires CSS+HTML smarts. Blogger makes format and styling changes routine.

Summary

Blogger's Template Designer really brings a robust design and styling capability to completion for the system. True, users can import external designs. And if they are CSS+HTML savvy they can hack and control just about every detail of their blog's design. But the Template Designer brings styling to just about any user. And the options are fast and easy to use. This is  no small advantage to the overall worth of Blogger in general.

Microsoft's Web Matrix

Microsoft's Web Matrix is a powerful set of Web development tools derived primarily  from the Visual Studio base with some extra SQL Server Tools and other development tools added to the mix. This package is not for the beggining developer or even  the professional graphics designer. There simply are too many options and a huge learning curve despite the fact that these are the Express versions of the base Visual Studio and other Developer tools.


Also there is a patina of openness such as open source tools like PHP, MySQL, and several open blogging services like WordPress and Drupal are supported.  -Unfortunately that "openness" turns out to be a facade. The underlying