Developer Contest: Google Desktop Gadgets

•July 2, 2006 • Leave a Comment

The Google Desktop Team just announced a Google Desktop Gadget Contest! The Desktop blog has the details, but here are a few highlights:

  • The contest runs through July 31 (winners will be announced August 21)
  • Everyone who submits a published Gadget will get a limited edition Google Desktop Developer T-shirt (there are other Google-y prizes too)
  • Top prizes: $5,000 for 1st place, $2,000 for 2nd place, and $1,000 for 3rd place
  • Primary judging criteria: popularity, visual appeal, use of new features (such as transparency/animation, Google Talk API integration, personalization, etc.)

And be sure to check out the Google Desktop Gadget Designer, a new IDE and WYSIWYG UI creator for making Google Desktop Gadge

Content Management Systems

•June 29, 2006 • Leave a Comment

A glance toward the past…

As the internet and world-wide web started to emerge as a major repository for storage, retrieval, and display of data, the main avenue for accessing that data was static, hand-coded, HTML (Hyper-Text Markup Language). Static HTML means that each and every web page on a site is created individually; links between content elements are managed by hand; and changes can be made only by a site administrator following a multiple-step process involving the downloading, editing, and uploading of new or modified pages.

For users with moderate technical skills, the creation of web pages using static HTML is fairly easy. But because the content is not separated from the code, a lot of time is spent wrapping the content with HTML code so that it can be presented in a meaningful way. Composing pages in static HTML is time-intensive and can interfere with content; it’s comparable to asking a book author to tackle typesetting, printing, and binding, which would certainly detract from the writer’s primary goal: to provide content.

Challenges of developing and maintaining a static HTML website

Without the separation of code and content, many aspects of managing a static HTML site are difficult. It is complicated to establish the ‘look’ of a site, and not easy to change that look once set. Searching for information on a site, even one with a limited number of pages, is an inaccurate, time-consuming task. It is impractical to collaborate on pages with colleagues unless additional administrative (FTP) accounts are configured or access codes are shared; both scenarios present a security risk.

For many people, HTML editing programs like FrontPage and DreamWeaver present a better approach to website design, implementation, and maintenance. These programs offer tools for defining a site-wide ‘look’ using site templates, as well as additional features to make it easier to create and edit static HTML pages. However, even when using these tools, adding or modifying content still requires a combination of writing and coding, which can be tricky and time consuming difficult to accomplish for anyone with lower than moderate technical skills.

For example typical publication cycle for a static HTML site might follow this pattern: An article is written; then passed to the web maintainer who creates a new page (following the site’s design) either from a template or from scratch. The article is converted to HTML code and pasted into the new page; which, depending on the maintainer’s workload may take several hours or more to be posted on the website. The new page is uploaded to the website and then manually linked to other pages as necessary, with related pages updated as necessary. That’s a lot of time and a lot of work.

In a limited number of contexts, static HTML may be quite suitable for a website. If the content on the site does not get updated frequently, is updated by a limited number of individuals, does not need to be searchable, does not require pleasant presentation, and if there is a technical individual who is willing to edit HTML and download & upload changes, you may not need the advanced features of a Content Management System. However, before you put this book down and walk away, understand this: on the same hardware that runs your static HTML site, you can have a full-featured, easy-to-use Content Management System that makes updating content much easier and allows a huge variety of advanced features that simply were not available with static HTML sites.

This represents a glance toward the past — or maybe this is a look at the way you’re currently doing things, and you have found yourself with too much data to manage effectively. But there is a better way. A way that will allow you create and present meaningful content on your website without downloading, coding, and uploading — from anywhere on the Internet. A way that will allow advanced features — features like site-wide searches, user accounts, private messages, and much more — features that are simply not possible with static HTML.

A Content Management System could be the solution to your problems.

…a step toward the future.

The answer to all the wasted time and effort of maintaining static HTML websites is to use a Content Management System. Static HTML was insufficient for the management of content on even a modest website; it was clearly too much data and too much work. Though HTML editing tools streamlined the procedure for maintaining a static HTML site, a better method of data management was necessary.

Web technology unveiled new competitive scenarios for companies: improved customer interaction, better business-to-business communication, and a more vibrant distribution of internal information. Today, many companies are turning to the web as a new playing field for innovation; tapping a wide variety of content and delivering it instantly to users around the globe. Some of the key goals of a Content Management System (CMS) are to provide users with personalized, transparent access to relevant information inside and outside of the organization; and to allow authors to easily contribute information to the knowledge base by managing content in a reliable, secure, and dependable way.

Dynamic Content Management as the way of the future

Content Management Systems allow content to be handled and updated dynamically and makes it easy for non-technical people to create and modify content. What is ‘dynamic content’? Dynamic content is content that may change frequently, is separated from the display (HTML) code, and is made into an ‘element’ that can be manipulated by the Content Management System. Dynamic content elements are usually stored in a database which is running the website.

Good Content Management Systems are designed so that nearly anyone can publish, browse, and revise information without knowing much more than how to use a browser or a word processor. The technical details are hidden from site users, thus eliminating their need to learn about software programming, HTML, network protocols, or how and where to publish and retrieve files to work on them. With a click of a button, authorized users can contribute any content to areas of the site to which they have been granted access.

Compared with static HTML, Content Management Systems:

  • Separate code from content making it easier to focus on content
  • Offer a consistent, non-technical, easy-to-use interface for both users and administrators. Content contributors log into a secure area of the website, enter the date, title, and body of their news submission, and click submit, and the news article is published to the website with no hassle.
  • The entire look and feel of a website can be changed very easily. Some CMS packages even allow users to customize the way they see a website — everything from language to colors to the on-screen placement of features.
  • Are feature-rich, and support additional, specialized features — forums, galleries, live chat boards, private messaging, local weather, and more.
  • Are searchable because they rely on a database. This feature alone makes CMS an exceptional choice when compared to static HTML.
  • Allow for community involvement and collaboration. While CMS-based sites can be run effectively by one person, the community can easily comment on a website’s content without requiring special access.
  • Gives administrators complete control over what each user or group of users can do within a web site. Administrators can control access to sections of a site, and assign user privileges and permissions to individuals or groups.

Once users have made the transition to a CMS, they will no longer feel incapacitated and unable to contribute to the website community. Often, the availability of all the new features provided by a CMS can be intimidating at first, and the learning curve can appear rather steep when compared to a static HTML page because while a static HTML page does not allow community involvement, CMS readily welcome it. CMS managed sites are simply so much easier to maintain than static HTML sites. To update a CMS site, all you need to do is surf to it and click on links to update the site. So, if you know how to surf the ‘Net, you can maintain the site; very little other work is necessary!

Waiting for Yahoo Mail Beta Invite?

•June 27, 2006 • 1 Comment

Every body may be aware of Yahoo Mail Beta,unless you have been to mars lately that yahoo is testing its new Yahoo mail Version.Here is a little trick to activate the yahoo mail Beta with out waiting for the invite.

step 1:

At first log-in to u’r yahoo mail account using u’r user-name and password.

step 2:

Click on the options on the top right corner of u’r page and select account information

step 3:

you may be asked to confirm u’r password enter u will get u’r account information edit in Member information.

step 4:

select yahoo United Kingdom from u’r existing content preference drop ok and accept the TOA and log-out.

Step 5:

Now when u’r log-in back to u’r mail box u will see yahoo mail beta accept page accept it and viola u have got all new yahoo mail beta.

Note:if u wish u can change back u’r preferred content again but yahoo mail beta will not revert back


•June 25, 2006 • Leave a Comment

CSS is used by both the authors and readers of web pages to define colors, fonts, layout, and other aspects of document presentation. It is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation (written in CSS). This separation can improve content accessibility, provide more flexibility and control in the specification of presentational characteristics, and reduce complexity and repetition in the structural content. CSS can also allow the same markup page to be presented in different styles for different rendering methods, such as on-screen, in print, by voice (when read out by a speech-based browser or screen reader) and on braille-based, tactile devices. Similarly, identical HTML or XML markup can be displayed in a variety of styles, ‘brands’, liveries or colour schemes by using different CSS.

CSS information can be provided by various sources:

  • Author styles (style information provided by the web page author), in the form of
    • external stylesheets, i.e. a separate CSS-file referenced from the document
    • embedded style, blocks of CSS information inside the HTML document itself
    • inline styles, inside the HTML document, style information on a single element, specified using the “style” attribute.
  • User style
    • a local CSS-file specified by the user using options in the web browser, and acting as an override, to be applied to all documents.
  • User agent style
    • the default style sheet applied by the user agent, e.g. the browser’s default presentation of elements.

CSS specifies a priority scheme to determine which style rules apply if more than one rule matches against a particular element. In this so-called ‘cascade’, priorities or ‘weights’ are calculated and assigned to rules, so that the results are predictable.

Advantages of using CSS include:

  • Presentation information for an entire website or collection of pages can be held in one place, and can be updated quickly and easily.
  • Different users can have different style sheets: for example a large text alternative for visually-impaired users, or a layout optimised for small displays for mobile phones.
  • The document code is reduced in size and complexity, since it does not need to contain any presentational markup.

CSS has a simple syntax, and uses a number of English keywords to specify the names of various style properties.

A style sheet consists of a list of rules. Each rule consists of one or more comma-separated selectors and a declaration block. A declaration-block consists of a list of semicolon-separated declarations in curly braces. Each declaration itself consists of a property, a colon (:) then a value.


p {    font-family: "Garamond", serif; } h2 {    font-size: 110%;    color: red;    background: white; } .note {    color: red;    background: yellow;    font-weight: bold; } p.warning{   background: url(warning.png) no-repeat fixed top; } #paragraph1 {    margin: 0; } a:hover {    text-decoration: none; } #news p {    color: blue; }

These are seven rules, with selectors p, h2, .note, p.warning, #paragraph1, a:hover and #news p.

Property values are specified by, for example, color: red, where the property color is given the value red.

In the first two rules, the HTML elements p (paragraph) and h2 (level-two heading) are being assigned stylistic attributes. The paragraph element will be rendered in Garamond font or, if Garamond is unavailable, some other serif font. The level-two heading element will be rendered in red on a white background.

The third rule shown matches those elements that have a class attribute containing the token ‘note’. For example:

<p class="note">This paragraph will be rendered in red and bold, with a yellow background.</p>

The fourth rule shown matches those p elements that have a class attribute containing the token ‘warning’. This is in contrast to the third rule which matched all elements that are marked with a given class attribute. (The earlier rule .note could also have been written as *.note.)

In fact, .class selectors involve a special kind of attribute matching, as opposed to testing for equality. Since the HTML class attribute is defined as a whitespace-separated list of tokens, a class selector is evaluated against each of them separately. For example, <p class="note warning">, would apply both the note and the warning rule.

The fifth rule will match the one and only element in each HTML document whose id attribute is set to paragraph1: It will have no margin within its rendering ‘box’ as its margin width is set to zero.

The sixth rule defines the hover style for a elements. By default in most browsers, a elements are underlined. This rule will remove the underline when the user “hovers” the mouse cursor over these elements.

The last rule matches those p elements that are within an element whose id attribute has the value news; an example of a descendant selector.

A CSS stylesheet can contain comments; the syntax for comments is similar to that used in the C programming language

/* comment */

In CSS, selectors are used to declare which elements a style applies to, a kind of match expression. Here are some examples of selector syntax:

All elements
that is, using the * selector
By element name
e.g. for all p or h2 elements
e.g. for a elements that are descendants of li elements (e.g links inside lists) the selector is li a
class or id attributes
e.g. .class and/or #id for elements with class="class" or id="id"
Adjacent elements
e.g. for all p elements preceded by h2 elements, the selector would be h2 + p
Direct child element
e.g. for all span elements inside p, but no span elements deeper within the hierarchy, the selector would be p > span
By attribute
e.g. for all <input type="text"> the selector would be input[type="text"]

In addition to these, a set of pseudo-classes can be used to define further behavior. Probably the best-known of these is :hover, which applies a style only when the user ‘points to’ the visible element, usually by holding the mouse cursor over it. It is appended to a selector as in a:hover or #elementid:hover. Other pseudo-classes and pseudo-elements are, for example, :first-line, :visited or :before. A special pseudo-class is :lang(c), where the style would be applied on an element only if it is in language “c”.

Selectors may be combined in other ways too, especially in CSS 2.1, to achieve greater specificity and flexibility, see the complete definition of selectors at the W3C Web site.

In the following example, several selectors are grouped using comma separation[1]. The rule sets the font for all HTML headings.

h1, h2, h3, h4, h5, h6 {     font-family: "Arial", sans-serif; }

To use a CSS stylesheet, save the CSS code in a file such as example.css and then either link to it or import it from HTML or XHTML web pages using one of the two following formats:

<link rel="stylesheet" href="example.css" type="text/css" />
<style type="text/css">    @import "example.css"; </style>

In the first example, note that the /> syntax only applies in XHTML; If you are writing HTML, close an empty element such as this with >.

To apply a CSS stylesheet to an XML document, add the following processing instruction, as per the XML example below:

<?xml-stylesheet type="text/css" href="example.css"?>

What is Fjax? Flash Powered Ajax

•June 24, 2006 • 2 Comments

Recently some friends were mentioning about a new tech term called Fjax, but my knowledge was limited to Ajax. First I thought that they were wrongly pronouncing Ajax as Fjax, but I soon realized I need to know more about what Fjax is…

For starters, Ajax is short for “Asynchronous JavaScript & XML” and powers an amazing level of dynamic web interactivity by enabling a browser to retrieve data and load it onto a page without refreshing the browser window e.g. in gmail, Digg spy etc… And when I went searching for Fjax, I “stumbled upon” this recent Webmonkey Q&A on Fjax by Michael Calore.

Fjax works a whole lot like Ajax — it uses an XML file to pass data to a browser — except that it uses a tiny bit of Flash, instead of the browser, to parse the XML. All of that browser-specific code is eliminated, leaving the application more lightweight and putting less of a strain on the browser.”

“Steve McDonald: Fjax is an alternative method for doing the kind of Web 2.0 builds that are currently done in Ajax. The advantage is that it does it in a fraction of the size, and requires no code forking to work in the different browsers. It’s a streamlined way of doing asynchronous content updates with XML.”

“Jay McDonald: The secret is that it’s using Flash (the “F” in Fjax) to act as a speedy little XML parsing engine, instead of handling all of that in JavaScript. But Fjax’s use of Flash is a pretty significant departure from how Flash has historically been used.”

Read their full article. Fjax is in its very early stages of development and I am sure it will revolutionize the web when it is incorporated in web applications by Web 2.0 designers and developers.


Get every new post delivered to your Inbox.