Jugnu Life :-)

CSS3 Speech Module

CSS3 Speech module is now in last call state (Aug 18 , 2011) . Journey for making accessible web standards have come far from WCAG guidelines , SSML (Speech Synthesis Markup Language ) to CSS Speech

Here is the summary of what CSS Speech module provides.

CSS Speech standard specifies how to present the content in way which can be understood by speech synthesizers. Using CSS Speech module we can specify meta data like voice speed , pause information etc for content . This CSS information is used by User agents while rendering and producing final sound output for the content.

Typical usage for this would be

Screen readers
Machine to Human interaction ( e.g incase while you are driving car , car would read content for you online with appropriate pauses , breaks etc or your ebook reader will read the book , exactly the way it is read by humans)

CSS Speech is based on concept of Aural Box Model for content to be rendered in speech form . It is a conterpart for visual box model for visual presentation of content.

See the Visual box model for CSS and Aural Box Model below for similarities

Cue : Cue is small piece of sound which you can insert in between.

Properties and Characteristics which are available include

Pause Properties

pause-before
pause-after

Rest Properties

rest-before
rest-after

Cue Properties

cue-before
cue-after

Speaking Properties

speak
speak-as

Mixing Properties

voice-volume
voice-balance

Voice Characteristics

voice-family
voice-rate
voice-pitch
voice-range
voice-stress

The link below provides the complete summary for each of the above properties

http://www.w3.org/TR/css3-speech/#property-index

Browser share in various markets

Browser share worldwide shows some interesting ideas.

Internet Explorer will slowly fade down to market share of 20%

You can develop with latest standards of CSS3 and HTML5 freely

Ultimately browsers will compete with them selves to retain market share , following latest W3C specifications for CSS and HTML

As a Web Designers / Developers we can recommend our users to use latest browsers which can give best browsing experience

Here are some of the useful website to check the market share statistics for latest browsers

My main point for looking at these websites was something different , i wanted to analyze how various counties fair in terms of riding the latest browsers usage wave. Which country is ahead in using up latest browsers.

Graceful degradation and Progressive Enhancement

Graceful degradation and Progressive enhancement are two different web design strategies

Progressive enhancement

In progressive enhancement you design for bare minimum design standards , generally without any CSS or JavaScript support. In this way webpage will have content that all users can see at least , irrespective of the user agents.

And slowly slowly on the top of baseline design we add on latest standards support for example Latest CSS3 styling.

You can read more about Progressive enhancement at Wikipedia

Graceful degradation

Graceful degradation is very aggressive form of web design in which you are following latest standards and specifications and incase user agent doesn't support them , you don't show latest markup styles. Your webpage just degrades itself to present all what is supported by current user agent.

You can read more about Graceful degradation at Wikipedia

Some of the useful links on the same topic

The Case for Designing with Progressive Enhancement,” by Todd Parker, Maggie Costello Wachs, Scott Jehl, and Patty Toland (www.peachpit.com/articles/article.aspx?p=1586457)
“Progressive Enhancement: What It Is, And How To Use It?,” by Sam Dwyer (www.smashingmagazine.com/2009/04/22/progressive-enhancement-what-it-is-and-how-to-use-it)
“Progressive Enhancement: Paving the Way for Future Web Design,” by Steven Champeon(www.hesketh.com/publications/articles/progressive-enhancement-paving-the-way-for)
“Graceful degradation versus progressive enhancement,” by Christian Heilman (http://dev.opera.com/articles/view/graceful-degradation-progressive-enhance)

Also please share any other useful link you have for the same.

Browser Support for CSS3

Different browsers use different layout engines to render the HTML / CSS markup to the end user. Layout engine is a software which is used by browsers to read the HTML/CSS markup and produce final output on the user screen. It reads all the HTML and renders it onto browser.

You can also read about List of various layout engines and their comparison of layout engines for support of HTML5 and CSS3 standards at wikipedia.

Identifying which browser supports what CSS3 features can be a daunting task. Ultimately we should design around basic principle that irrespective of final user agent our web application should be usable to the end user. Progressive Enhancement design principle says that , make your web page with minimal markup without CSS so that it looks fine without any Javascript or scripting. Then we slowly improves its look by using advanced CSS and Scripting techniques. Designing With Progressive enhancement is an excellent book to learn more about it.

The following websites are helpful in deciding which of the CSS3 properties you can use safely and are supported by browsers.

HTML5 and CSS3 Browser support

Can i Use us wonderful website which tells about browser support for HTML and CSS3 feature you ask for

http://www.standardista.com/css3

http://www.quirksmode.org/css/contents.html

Layout engines

-moz properties support

http://css-infos.net/properties/firefox.php

-webkit properties support

http://css-infos.net/properties/webkit.php

If you are developing some email application then following website would be useful to see CSS3 and HTML5 support for various email clients

http://www.campaignmonitor.com/css/

If you are developing something for Apple world , iPad etc then following Apple developer guide would be useful

http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariCSSRef/Introduction.html

Getting Started with CSS3

CSS3 is next level of CSS2.1 in which lots of new features are being developed.

The interesting thing to be noted for CSS3 is that it is group of various modules which are being developed as part of CSS3 specifications. For example one module deals with how to display tables using CSS and other deals with how to use CSS for displaying images.

The inherent advantage of using modular concept for developing CSS specification is that each module can be developed independently and hence presented in market independently for reviews , comments and usage. The time to market for CSS3 will be reduced by following modular approach than following one big bang change. This gives time to all stake holders from User agents producers to web site owners to adapt to new specifications.

The list of modules present in CSS3 standard and their current status of developed is documented in W3C official CSS3 working group website.

http://www.w3.org/Style/CSS/current-work

The key to read this is as follows

Abbreviation and Full name

WD
Working Draft

LC
Last Call

CR
Candidate Recommendation

PR
Proposed Recommendation

REC
Recommendation

New Google results with Sublinks description

I noticed Google is showing some detailed text snippets for the sub links which it shows for many websites

Along with website text description it is also showing up text description for sub links

Here is the results with simple sublinks

Now Here is what i saw today for one of the website which i was searching

Interestingly this behavior is not consistent. I guess Google is testing some new feature

What are your thoughts on this ?

Web Service Client using Bottom up approach in Eclipse

This post is in continuation to http://jugnu-life.blogspot.com/2011/08/getting-started-with-web-services.html

This post will cover how to Create a new Web Service Client project , bottom up approach of development.

In the Wizard paste the URL of WSDL copied earlier

Sect Axis Runtime as Apache Axis2

Click on Client Project and Enter new New Client Project Name BottomUpWebServiceClient , it will automatically become of type Dynamic Project . Its fine.