After more than 3 weeks of debate on this issue, google changed the home page; the link to privacy policy has been added to google’s home page.

Marissa Mayer, Vice President of Google announced it today in its corporate blog about the changes. She said that Google’s founders told her the word privacy could only be added to the home page if another word was deleted, leaving the page at 28 words. So the copyright notice at the bottom of the page was changed from “©2008 - Google” to “©2008 - Privacy“.

Firefox 3 claims to have more than 15,000 improvements and is faster, safer, and smarter than before. Some of the cool new features include one-click bookmarking where users can click on the star icon in the address field to bookmark a page. Users should enjoy faster site performance by way of the browser’s improved memory management capabilities, etc. which will allow pages to load faster. The browser also comes with a full page zoom feature that allows users to see entire web pages.

Inspite of these improvements, firefox 3 crashed on my laptop for one time.

In case if have not downloaded Firefox 3 then you can download firefox 3 right now.

And don’t forget to have your firefox download certificate.

1. Using span tag to style the first letter
2. Using pseudo element :first-letter

1. Using span tag to style the first letter

<!--
  .firstletter {
    display:block;
    float:left;
    margin: -0.63em 0.5em 0 -0.56em;
    height : 4.5em;
    color:#aaa;
  }
 
  .firstletter span {
    font-size:200%;
    line-height:1.0em;
  }
  .firstletter + span{
    margin-left  : -0.5em;
  }
-->

You might be interested to know about + sign in above CSS code. It is adjacent-sibling selector that was introduced in CSS 2. Adjacent-sibling targets an element directly after another element with the same parent.

How to Use it?

<span class="firstletter">
  <span>W</span>
</span>hen was the first time drop caps first letter introduced in newspaper, magazine? But its been a quite while the trend of drop cap used in web business. First letter drop cap can be achieved in many ways.

You can view Live Demo here.

2. Using pseudo element :first-letter

Most of the sites use span technique for the drop cap first letter. With invent of CSS 2, the :first-letter pseudo-element was introduced for this purpose. It’s easy creating drop caps with :first-letter. Most of the latest browsers supports :first-letter pseudo element.

<!--
   p:first-letter {
     font-size:400%;
     display:block;
     float:left;
     margin: 0.06em 0 0;
     height:3.5em;
     color:#ccc;
   }
-->

How to Use it?

When was the first time drop caps first letter introduced in newspaper, magazine? But its been a quite while the trend of drop cap used in web business. First letter drop cap can be achieved in many ways.

You can view Live Demo here.

Inside the STYLE tag, we added style for paragraph, and suffix it with the code :first-letter, and whatever declarations that follow will be applied to the first letter of that paragraph.

Some fix might be needed for cross browser compatibility.

Both IE8 and FF3 are going neck to neck on luring more users with more interface enhancements. Needless to mention that Firefox is more popular in developers community and is growing among home users as well. With IE8 beta and Firefox 3 beta passing Acid test 2, the battle for browser supremacy is on. Users can expect more sophisticated feature in future.

Its worth to mention that neither of the previous version of IE and FF passed Acid test.

Till date, Opera and Safari(webkit engine - r31342) are only browsers to claim to have scored 100/100. But the end users of Opera and Safari is hapless. Contrarily IE8 and Firefox results are worse on the Acid3 test, with IE8 scoring 18/100 and Firefox 3 scoring 80/100.

IE8 lately passed Acid 2 and IE8 developers are working on Acid 3 test. In fact Internet Explorer 8 Beta (8.0) does better on the Acid2 test than Firefox 2 (2.0.0.12) does.

Screenshots of Firefox and IE 8 taking Acid test 2

Screenshots of IE 8 taking Acid test 3

Firefox in action rendering with Acid test 3

Acid3 is a test page from the Web Standards Project that checks how well a web browser follows certain web standards, especially relating to the DOM and JavaScript.

What’s next if might have to spend part of our fortune fixing on bugs? Is this affordable to The Third World Countries? Is Open Source Software Hope or Despair to & Third World Countries?

Of course, He is not only the one I met who wants to battle and dominate proprietary software. There are so many enthusiastic peoples and organizations that supports open source and wants to wash up the dominance of proprietary software. I have heard “open source is the only phenomenon to achieve technical independence for cash-strapped countries like ours” in several seminars and workshops. Low and affordable Cost, technical promises of open software, free of charge were some issues that are attractive and most talked about in the seminars and workshops.

However, in my opinion open source is not always free and the products and services advertised as open source don’t always seem to be open. For instance, Web Meeting’s regarded as open source but only in a sense that source code was available to purchasers of sets in blocks of 100 and at a price of close to $40,000 per block. For a third world countries where per capita income is less than the price of the computer this price does not seem like a price of open source software.

Also, the price of an Open Source Software critically depends on the number of users. What about the cost if there are only few? We cannot say that open source software is bug free. What’s next if might have to spend part of our fortune fixing on bugs? Is this affordable to The Third World Countries? Is Open Source Software Hope or Despair to & Third World Countries?

Below are list of one line CSS. One line CSS mentioned below may or may validate web standards and web accessibility rules.

1. Set default margin and padding to all elements

* {margin: 0; padding: 0}

Every element that have not assigned margin or padding will have default value of above.
Some CSS designers argue that this is not necessary at all because all CSS element at the end will have their assigned value.

2. Set image border to zero

img { border: 0; }
a img { border: 0; }

This can be used to prevent any linked images from displaying borders.

3. Remove Firefox’s link border

a:active, a:focus { outline: 0; }

This removes dotted outline from focused or active links on firefox.

4. Scrolling Render IE

html { background : url(null) fixed no-repeat; }

5. Prevent line breaks in links, over sized content to break

a{ white-space:nowrap;}
element { overflow:hidden; }

This trick prevents line breaks on links.

6. Centering block elements horizontally

element { margin:0 auto; }

This one line CSS horizontally centers a block level element.

For IE less than 7, following line should be added though.

element { text-align: center; }

7. Show Firefox scrollbar

html{ overflow:-moz-scrollbars-vertical; }

8. Remove textarea scrollbar in IE

textarea{ overflow:auto; }

Web accessibility refers to the practice of making websites usable by people of all abilities and disabilities. When sites are correctly designed, developed and edited, all users can have equal access to information and functionality.
Excerpts taken from Wikipedia

1. Structural HTML

Most developers pay attention to the graphical presentation and often neglect the structure of document. An HTML document marked up structurally can adapt to different environments. Hence, an HTML document must be structured in such a way that it can be read without stylesheet.

2. Anchors and Links

Links are what made the web The Web. One should provide meaningful links and should make sure that links are accessible in text based browsers as well.

e.g

<a title="My Page" href="mypage.html">My Page</a>

3. Alternative text for non-textual data

To provide text alternative for non-text data like images you can use ALT attribute for briefly describing meaning. You can also make use of LONGDESC attribute for long descriptions.

e.g

<img longdesc="long desc" src="banner.gif" alt="Alt Text" />

Similarly, one should be careful using Image links. Without text equivalent, screen readers will not be able to display the link. Son Use of ALT attribute can allow screen readers to access link text.

4. Tables

Following tips should be kept in mind when using tables for layout:

1. The WIDTH attribute on TABLE, TD, or TH elements is usually unnecessary and can hinder a document’s accessibility. So, one should control all attributes using CSS.
2. Row and column headers should be distinctly visible. For column headers, TH is preferred rather than TD. Providing CAPTION or TITLE to describe the contents of table makes more meaningful.

5. Client Side Scripting

Client Side Scripting like JavaScript is not supported by all browsers and sometimes users can disable it. Hence one should make sure that web page is usable even scripts are not supported or turned off.
One should not rely on Client side scripting to navigate or view content. When JavaScript is used, it should not be relied upon.

6. Colors

Some old browsers do not support color names. Colors should always be specified with a hexadecimal triplet in the form #rrggbb or #RRGGBB. We should make sure that information presented through the use of color is available without it.

e.g

<!--
 body{
   color: #000000;
   background: #ffffff;
}
-->

7. Text-based browsers

Simulate the web page on text-based browser such as Lynx to see how document would look like in absence of graphics.

8. Validation

Validation of HTML documents is most important part. A validator checks the document’s HTML against a document type definition to ensure that the syntax of the HTML is correct. Validate your document to check for errors.

1. Webpage Validation Service by W3C
2. Section 508 Web Accessibilty