Archive for the ‘Design’ Category

Its Facebook, Twitter, Linkedin and …

Monday, February 8th, 2010

Businesses today are compelled to have active presence in popular social media sites. And when we say social media, its Facebook, Twitter and Linked in. Facebook has some 100 million users and its pretty easy to spread the word virally. Twitter is convenient for sharing news and real time events. Linkedin enhances professional identity and reputation. In addition to Facebook page, Linked in profile and Twitter updates, Ning community is also becoming mandatory for businesses.

What is Ning?

Ning is an online platform for creating social networks. More than 2.5 million networks have been created so far and there are 41 million registered users. The number of people visiting Ning sites  in a month come to around 92 million. Similar to Facebook, Twitter and Linked in, Ning also does not have a direct competitor. However Crowdvine, KickApps, CollectiveX, ONESite and few more companies offer similar services. Let us capture few of the features that Ning provides.

1. White Label - Ning allows its platform users to customize it with their own brand. There is no fixed frame or color scheme which has to be followed. The entire site can be created in the user’s interests.

2. Domain Name - There’s more than just vanity URLs in Ning. It provides options to create new  domain names and map already existing ones. Community links for most of the companies in their website are mapped to the Ning site.

3. Even More Social Experience - Ning provides a deeper social experience. Interaction with brands, celebrities, musicians go to the next level here: Personal profiles, events, forums, chats and many more.

4. Ads and Other Premium Features - Best of all, Ning platform also allows its network creators to generate money from their networks through ads. Premium features like virtual gifts also does the same.

None of the popular social networks offer all of the above features. It convinces us to conclude that Ning stands in a different dimension without aligning itself along any other already existing social networks and therefore compel businesses to be a part of it. Let us also look at a few networks created in Ning.

Ning Networks

(a) Gaither

Gaither.com is the official website of the Gaither vocal band. The band has a Ning network for its community. The community has sub-groups, micro blogging, forums, latest events and many more for their fans. The Connect section in the snapshot below shows links to various social media links from the Gaither website including Ning.

(b) Ellen Degenres show

One of the popular show in the United States, the Ellen Degeneres Show has many active members in its Ning community. The sub domain http://community.ellen.tv is being mapped to the Ning network.

The above snapshot is taken from the Ellen official website. We can see the links to Twitter, Facebook, Ning (community) along with the other main links .

(c) Techcrunch (Zorapcrunch)

Techcrunch, one of the leading reporters of web developments and happenings are also having their presence in Ning.

(d) Content Wrangler

Content Wrangler is a popular destination for communication professionals seeking information about content management. This is an initiative of Scott Abel, a content management strategist. The screen shot below shows the community created in Ning where a global network of content professionals from around the world meet and collaborate.

Similar to these communities, there are more than 2.5 million networks created so far. Celebrities,  politicians and established organizations have already made their presence. For more information on Ning, visit Ning Help.

The Much Awaited Apple’s iPad Tablet Unveiled.

Thursday, January 28th, 2010

After months of anxiety and speculation Apple has finally launched their latest creation, the iPad Tablet. Apple’s CEO, Steve Jobs, unveiled the breakthrough product in a grand meet held at San Francisco on 27th Jan 2010. Apple’s iPad is developed for people on the go to ease their online usage and other PC related tasks.The iPad is neither an iPhone nor a PC but a gadget that bridges the gap between the two. With its small size and touch screen technology, Apple’s iPad  is all set to create a new era of Tablet Computing. Although the device lacks complex functionalities when compared to a PC, it is equipped with much desired functions like web browsing, delivering media, capsuling literature, video gaming etc.
The 9.7 inch device with half an inch thickness weighs just 1.5 pounds. It features a touch screen and is available in 16, 32 or 64 gigabytes of flash memory storage. (more…)

Video and the Web

Wednesday, September 30th, 2009

With the increasing number of video formats, the complexity in identifying the best format has also increased.  Compatibility, size, quality and affordability together determine the format that best suits for any requirement in the web.

A video format used in the web should be compatible with major browsers and Operating Systems. Major browsers include Internet Explorer, Mozilla Firefox, Opera, Google Chrome and Safari. Major Operating Systems include Windows, Macintosh, and Linux. When it comes to size, the smaller, the better. And when it comes to quality, the higher, the better. The cost factor also plays an important role. I have summarized below, few recognized and used formats in the web with their pros and cons. Proper analysis of our requirement with the capability of the video format will help us to identify the best format for the requirement. These formats are developed and backed up by giants who continuously update and keep them to standards.

  • WMV:

Windows Media Video (wmv) is developed and controlled by Microsoft. The video file is based on Microsoft Advanced Systems Format (ASF) container format and is compressed with Windows Media compression. The quality of the video is good and the file is also of low size. One major drawback is that the file runs only on Windows. Neither does it support Flash nor Synchronized Multimedia Integration Language (SMIL) standard.

  • Quick Time:

Quick time (.mov) is developed by Apple Inc. The latest released version is 10.0. QuickTime is particularly suited for editing. It contains one or more tracks, each of which contains abstract data references for the media data. QuickTime also supports key standards for web streaming, including HTTP, RTP, and RTSP. Also, QuickTime supports every major file format for images, including JPEG, BMP, PICT, PNG, and GIF. QuickTime also features built-in support for digital video, including MiniDV, DVCPro, and DVCam camcorder formats, as well as support for AVI, AVR, MPEG-1, and OpenDML.

  • Real Media:

Real media was the first streaming technology on the market. However, Real media still trails Flash when it comes to smooth playback of high-impact interactive multimedia. Web developers have begun to use the Real System G2 and SMIL to stream synchronized multimedia presentations over the Web. This in turn is promoting a wider usage of real media by the developers in the web.

  • Macromedia Flash:

Flash is often referred to as the best solution to web media. However, its unfriendliness with search engines has always left it behind. Flash generates high-impact web multimedia with short sound effects and loops. Formerly called as Future Splash, the Flash company was later acquired by Macromedia in 1997. With Flash, users can also draw their own animations or import other vector-based images.

  • MPEG-4:

Developed in 1998, MPEG-4 was specially designed to play streaming media file with high quality in the web. MPEG stands for Moving Picture Experts Group and is managed by ISO (International Organization for Standardization). MPEG-4 is a proprietary technology; it requires licensing in order to be used. AT&T claims to have the patent rights for MPEG. But Apple and a number of other video content providers are continuously working on MPEG along with their technologies.

Stay tuned for my next blog in which, I plan to explain the different methods that are available to deliver these formats on the web.

HTML 5.0 – A glance at new elements

Thursday, June 11th, 2009

WhatWG (Web Hypertext Application Technology Working Group) was formed in 2004 with focus on HTML and APIs for web applications.  Specification document for HTML 5.0 is in progress.  The document gets updated on a regular basis.  Check out the document at http://dev.w3.org/html5/spec/Overview.html.  Getting our head into the document is tedious and cannot be made to fit into one page.  So here we will glance over a few new elements to get a picture of how HTML 5.0 is going to be.

Div Element

Header, footer, nav, aside, article and section are new elements that will replace div.  The complexities of div have paved way for these elements.  Instead of having so many div tags inside the code, HTML 5 gives the capability to use separate element for each purpose.  During modifications, identifying a particular portion thus becomes easy. These two snapshots will give an idea of how the simplification is going to work.

Audio Video Elements

Recently, audio and video have mass migrated to Internet.  HTML 5 provides the ability to treat audio and video as web pages without the need for plug-ins to play them. That is, audio and video will be natively supported by the HTML 5 compliant browsers.  The debate on whether to use a standard format or to support all formats is still on.  These elements are expected to contain textual content for every video, audio brought in the web page.  Such a provision will enable information to be conveyed through non-supportive browsers.  Internet users with debilities will also have the accessibility to web content.  Here is a lookup.

<audio src=”Martinluther.mp3″>

<p>I am happy to join with you today in what will go down in history as the greatest demonstration for freedom in the history of our nation.</p>

…</audio>

Few More Elements

Time element will help browsers,  search engines and web crawlers identify time from web pages.  Images are brought through the figure element.  Captions of the image are always associated with the image.  This will allow the user agents to understand more about the image.  Dialog is a another new element and it comes up with 2 sub tags: dt, dd.  dt will indicate the speaker and dd will indicate the dialog.  Here is an example:

<dialog>

<dt>Fay</dt>

<dd>Jerry, could you show me how to hold the racket?</dd>

<dt>Jerry</dt>

<dd>Sure Fay, it’s just like shaking hands. Hold your hand out as though you were going to shake my hand… </dd>

<dt>Fay</dt>

<dd>Do you mean like this?</dd>

<dt>Jerry</dt>

<dd>Right, like that. Then put the racket in your hand, like this. </dd>

</dialog>

There is more in HTML 5.  Seeing by the way developers are contributing to its specification, we can sure expect fascinating behaviors in web pages soon. Most importantly, you can contribute too. Here’s how:

Subscribe to the WhatWG mailing list: http://www.whatwg.org/mailing-list

Participate in discussions: http://forums.whatwg.org/

Comment and post blogs: http://blog.whatwg.org/

Links to articles on HTML 5:

http://radar.oreilly.com/2009/05/google-bets-big-on-html-5.html

http://www.webmonkey.com/blog/How_HTML_5_Is_Already_Changing_the_Web

WCAG 2.0

Wednesday, May 27th, 2009

Going through the number of times WCAG is mentioned in Twitter and blogs, I find that it has not got the publicity it deserves. Most developers tend to think of accessibility as a luxury they cannot afford. Consequently it finds its place way down in their priority list. However, as we shall see, making a site accessible will not cost you a lot. And accessibility is not only aimed at addressing the needs of disabled, but people who use text browsers, low resolution monitors etc. Thus if your site is designed with accessibility in mind, you will surely see more traffic to your site.

World Wide Web Consortium (W3C) is responsible for developing Web Content Accessibility Guidelines (WCAG) documents. The first version, WCAG 1.0, was published in May 1999. The latest WCAG 2.0 was released on 11th December 2008. The primary intent to publish these documents was to make web content easily accessible to everyone irrespective of any disabilities. WCAG 2.0 is designed in such a way that it is simpler and easier to understand for the web developer community. The document is built on four foundational principles. Then, there are few guidelines provided under each principle. Each guideline is challenged by different testable success criteria. Satisfaction of all these criteria will make the web site conform to WCAG. Let us go through the four principles in brief.

Perceivable

The first principle implies that any content that is displayed on the website must be perceivable. The dictionary meaning of the word perceivable means ‘To achieve understanding of’, ‘To become aware of directly through any of the senses, especially sight or hearing’. In our context, it means that anyone who accesses the web for content should be able to apprehend the information that is presented.

There are four guidelines furnished to illustrate this principle. The first two coerce to provide text alternatives for non-text content and time-based media. This would enable the user to enlarge or render in whatever tactile form as needed. The third guideline focuses on the structure and presentation of the content. A simple design that complies to the standards will reduce the complexities when there is a requirement to extract content and present to debile users. Sometimes distinguishing foreground information from background can become difficult. The fourth guideline helps avoid this conflict and focuses on making information distinguishable. Success criteria are determined on color, contrast, background audio, text images and many more.

Operable

The second principle deals with the operability of the user interface components. Users can come across situations where they are not able to interact with the content due to issues in links, user controls and other navigation.

The first guideline under this principle recommends making all the functionality of the content available from a keyboard. This does not outweigh the use of mouse and other interfaces. On the contrary, it means that complete dependence on these devices must be forgone. The guideline also cautions of keyboard traps and advices methods to keep the user away from them. The other guidelines focus on ensuring that the users will be able to complete the tasks required by the content with their own individual response times. For every time limit automatically set by the content, it requires the user to have options to turn it off, adjust and also extend the limit. They also caution the design about seizures mainly occurring due to excessive use of Flash. The last guideline recommends helping the users in their navigation to find content. There are 10 success criteria listed to check whether a user is properly guided.

Understandable

Understandability is the next issue the document addresses. The principle mainly targets the people in the lower part of the intellectual group. It compels the developer to make the content easily available in predictable ways and also help the user avoid and correct mistakes.

The first guideline stresses on making the content readable and understandable. Success criteria are set on languages, abbreviations and pronunciations. It also speaks about restricting unusual words or phrases including idioms and jargon. The other guidelines show light on making the pages predictable and providing assistance to the user in mistake-prone sections. Using instructional labels and help pages can assist the user in different areas.  Detecting errors and reporting immediately, as and when the user is inputting information is also a better method of assistance. These together form the success criteria for this principle.

Robust

The last principle is the most important of all the four. It checks the robustness of the content. Accessibility by user agents is checked here. There is only one guideline and it speaks about the compatibility of the content with the current and future technologies. Avoiding deprecated features of W3C technologies makes the site more compatible. Success criteria are designed for custom user interfaces to check compatibility.

Adhere to the guidelines suggested in WCAG 2.0 will bring in more traffic. Therefore it is essential from the developers’ point of view to know these standards and make them a part of our work.

Link for further study:
http://www.w3.org/TR/WCAG20/