Google Browser Size (Labs)

Hello,

Google project shows when Web content is hiding: http://googlecode.blogspot.com/2009/12/introducing-google-browser-size.html

 

   How Google Browser Size Works 


Google Browser Size is a visualization of browser window sizes for people who visit Google. For example, the "90%" contour means that 90% of people visiting Google have their browser window open to at least this size or larger.

This is useful for ensuring that important parts of a page's user interface are visible by a wide audience. On the example page that you see when you first visit this site, there is a "donate now" button which falls within the 80% contour, meaning that 20% of users cannot see this button when they first visit the page. 20% is a significant number; knowing this fact would encourage the designer to move the button much higher in the page so it can be seen without scrolling.

To view your own Web site with this same visualization overlaid on it, simply type its URL into the "Enter URL here" textbox at the top of the window and click Go. 

Notes:

• You can change the opacity of the overlay by clicking the gray boxes next to the word "Opacity" at the top of the window.
• As you move the mouse around the window, you will see a transparent rectangle following the mouse pointer. This feature allows you to interact normally with the page you're examining even though it has a graphical overlay atop it.
• The sizes represented in this contour are client area sizes, not browser window sizes. This means they represent the size of the browser without the title bar, toolbars, status bars, etc., and thus give a true representation of how much content can be seen by a particular segment of the Web-using population.
• Browser Size works best on web pages with a fixed layout aligned to the left. If the content reflows as the width is adjusted or it is centered, then the results can be misleading. In this case, you can obtain more accurate results by reducing the browser width to a percentage column, e.g. 90% and seeing what content falls below the 90% horizontal line.
• We're actively looking to develop and improve the tool. So if you have comments or suggestions, please feel free to contact us at browser-size-external-feedback@google.com.

 

 

Styling the Button Element in IE

If you’ve ever attempted to style a button inside IE, you know that it can be a huge pain. On most of our projects, we’ve now started using the button element in place of traditional input buttons due to the ease of styling and consistency across browsers. One of the first things you might notice when you bring your nicely styled buttons up in IE is that, for reasons unknown to me, IE decides to stack the padding depending on the width of the content inside the element.

  

After spending some time adding a lot of extraneous CSS to the IE specific style sheets, I realized that two simple lines of code fixes the problem.

button {

  width: auto;

  overflow: visible;

}

Those two lines of code will save you countless hours.

New standard from W3C lets browsers get a grip on files

Hi Guys,

The World Wide Web Consortium has published a draft of an interface that browsers can use to manipulate files better, one of a series of steps aimed at gradually improving the sophistication and polish of Web site interfaces.

The draft File API (application programming interface) defines a number of ways that browsers and Web sites can handle files better.

Some of the features are:
1) Able to select multiple files for upload, such as on photo-sharing sites or Web-based e-mail, a task that often relies on Adobe Systems' Flash today.
2) Files are handled asynchronously, which means the browser won't freeze up while a file is being uploaded or otherwise handled, and the browser reports progress on file transfers.
3) The interface can work in conjunction with various standards including the drag-and-drop support in the HTML 5 now under development and the Web Workers technology that lets browsers better perform multiple operations simultaneously.
4) The interface also can help Web applications process the contents of files like we can provide a playlist file and extract lyrics from it..

Thanks,

Sreekanth

Source