Saturday, July 21, 2012

[Gd] NPAPI plug-ins in Windows 8 Metro mode

| More

Chromium Blog: NPAPI plug-ins in Windows 8 Metro mode

We recently announced initial support for Chrome in Windows 8 Metro mode. One thing that early testers may have noticed is that some existing plug-ins don't work. These plug-ins are built using a technology called NPAPI, which, like ActiveX, is not compatible with Windows 8 Metro mode.

Note that because Adobe Flash Player and Chrome’s PDF viewer have both been bundled as Pepper plug-ins running in a sandboxed environment in Chrome, these two widely-used plug-ins will continue to work in Windows 8 Metro mode on all websites.

We’ve noticed that other than Flash and PDF, usage of plug-ins has been steadily decreasing over the past few years, to the point where a relatively small percentage of our users load any of these plug-ins at all. The following table shows some well-known plug-ins along with the percentage of active Chrome users who instantiated that plug-in during a 28-day window:

Plug-in namePercentage
Flash Player 99.9%
Chrome PDF Viewer58%
Windows Media Player2%

This data came from more than 20 million Chrome users who have opted in to share non-identifying usage statistics with Google, which are aggregated to understand how Chrome features are used.

We expect NPAPI plug-in usage to continue declining over time, especially since plug-ins can’t run on most phones and tablets. If the trends continue, we look forward to the day when NPAPI can retire peacefully to the countryside.

Posted by Carlos Pizano, Software Engineer and Metro Gnome

[Gd] Fridaygram: Web Lab, holey Mars, Earth opposite

| More

Google Developers Blog: Fridaygram: Web Lab, holey Mars, Earth opposite

Author Photo
By Scott Knaster, Google Developers Blog Editor

Since the 1970s, people have been hooking up various wacky things to the Internet. The newest and possibly coolest instance of this wonderful tradition launched this week. The Web Lab is physically located in the Science Museum in London, but thanks to the web, it’s virtually everywhere. Web Lab includes 5 experiments that can be controlled from your browser, including Universal Orchestra, which lets you play music with people around the world on instruments in the museum or online.

When you’re done remotely controlling the experiments in London, you can ponder the awesome mystery of the hole in Mars. This remarkable image was taken by the Mars Reconnaissance Orbiter and shows an opening to a cavern. This discovery raises many fascinating questions. How long has it been there? Why is there a round crater around the hole? Where is the giant pencil that fits inside?

For those of us back here on Earth, take a moment this weekend to locate your opposite point on the globe, using the Earth sandwich find the opposite tool. And if you try to dig directly there, that would make a crazy cavern.

Each week we publish Fridaygram, featuring cool things from Google and elsewhere that you might have missed during the week. Fridaygram items aren't necessarily related to developer topics; they're just interesting to us nerds. This week we offer a Fridaygram tip of the cap to Mike Pegg for pointing out the Earth Opposite tool.

Thursday, July 19, 2012

[Gd] Let’s Hear It From Your Users!

| More

YouTube API Blog: Let’s Hear It From Your Users!

Over the past few years we’ve heard two specific pieces of feedback from the YouTube API community:
  1. Developers have clamored for years for a way of embedding a webcam YouTube upload widget on their web pages, similar to the webcam upload tool available at
  2. Developers who have used YouTube Direct in the past have asked for a simpler solution that doesn’t require the same level of technical expertise to set up and manage.

Knowing about this demand made us particularly excited for our Google I/O announcements of the YouTube Upload Widget that supports webcam uploads, and YouTube Direct Lite, both of which are now available for public use.

YouTube Upload Widget
Using the YouTube Upload Widget on your site is as simple as adding an <iframe> to your HTML, like so:

<iframe id="widget" type="text/html" width="640" height="390" src="" frameborder="0">

Developers who want more control over the uploads experience can use a full JavaScript API to initiate the widget, and listen for events related to the upload.

YouTube Direct Lite
YouTube Direct Lite is a complete rewrite of the existing YouTube Direct platform. The goal of the project remains the same: make it possible to solicit videos from your users and then moderate those submissions into standard YouTube playlists for display. The difference is that YouTube Direct Lite is implemented purely in client-side HTML, JavaScript, and CSS, and unlike with YouTube Direct, no Java App Engine deployment is needed. You can download the YouTube Direct Lite code, customize it, and deploy it on your own web server along with the rest of your site’s content. To make things even easier, we’re hosting a canonical deployment of YouTube Direct Lite that you could include on your pages without having to deploy anything at all—just add the appropriate <iframe> tag to your page.

You can find a live example of YouTube Direct Lite integration, including the use of the YouTube Upload Widget, on this sample page. Feel free to use that page to submit a video letting us know how you plan on using the new tools.

Bringing the YouTube Upload Widget and YouTube Direct Lite to web developers and community maintainers will give you new tools to hear from (and see!) your community, and who knows what great things will come from that!

—Eric Lundberg, Jeff Posnick and Vladimir Vuskovic, YouTube API Team

[Gd] Beta Channel Update

| More

Chrome Releases: Beta Channel Update

The Beta channel has been updated to 21.0.1180.49 for Windows, Mac, Linux and ChromeFrame platforms

  • Several crash fixes (Issues: 134550129446)
  • Fixed Autofill does not work in Incognito mode (Issue: 137100)
  • Fixed Legitimate Pop Up is blocked when Pepper Flash is used (Issue: 134959)
  • Fixed Disappearing Tabs On Windows 8 (Issue: 135304)
  • Fixed parental controls related problems on mac (Issue: 134311)
  • Fixed Chrome never stops blocking power save features once blocked on KDE (Issue: 137538)
  • Fixed Linux users experiencing slowdown due to accessibility being turned on (Issue: 137537)
    More details about additional changes are available in the svn log of all revisions. 

    If you find new issues, please let us know by filing a bug at

    Karen Grunberg
    Google Chrome

    [Gd] Getting Your App Ready for Jelly Bean and Nexus 7

    | More

    Android Developers Blog: Getting Your App Ready for Jelly Bean and Nexus 7

    [This post is by Nick Butcher, an Android engineer who notices small imperfections, and they annoy him.]

    We are pleased to announce that the full SDK for Android 4.1 is now available to developers and can be downloaded through your SDK Manager. You can now develop and publish applications against API level 16 using new Jelly Bean APIs. We are also releasing SDK Tools revision 20.0.1 and NDK revision 8b containing bug fixes only.

    For many people, their first taste of Jelly Bean will be on the beautiful Nexus 7. While most applications will run just fine on Nexus 7, who wants their app to be just fine? Here are some tips for optimizing your application to make the most of this device.


    Giving Nexus 7 its name, is the glorious 7” screen. As developers we see this as around 600 * 960 density independent pixels and a density of tvdpi. As Dianne Hackborn has elaborated, this density might be a surprise to you but don’t panic! We actively discourage you from rushing out and creating new assets at this density; Android will scale your existing assets for you. In fact the entire Jelly Bean OS contains only a single tvdpi asset, the remainder are scaled down from hdpi assets.

    To be sure the system can successfully scale your hdpi assets for tvdpi, take special care that your 9-patch images are created correctly so that they can be scaled down effectively:

    • Make sure that any stretchable regions are at least 2x2 pixels in size, else they risk disappearing when scaled down.

    • Give one pixel of extra safe space in the graphics before and after stretchable regions else interpolation during scaling may cause the color at the boundaries to change.

    The 7” form factor gives you more space to present your content. You can use the sw600dp resource qualifier to provide alternative layouts for this size screen. For example your application may contain a layout for your launch activity:

    To take advantage of the extra space on the 7” screen you might provide an alternative layout:

    The sw600dp qualifier declares that these resources are for devices that have a screen with at least 600dp available on its smallest side.

    Furthermore you might even provide a different layout for 10” tablets:

    This technique allows a single application to use defined switching points to respond to a device’s configuration and present an optimized layout of your content.

    Similarly if you find that your phone layout works well on a 7” screen but requires slightly larger font or image sizes then you can use a single layout but specify alternative sizes in dimensions files. For example res/values/dimens.xml may contain a font size dimension:

    <dimen name="text_size">18sp</dimen>
    but you can specify an alternative text size for 7” tablets in res/values-sw600dp/dimens.xml:

    <dimen name="text_size">32sp</dimen>

    Nexus 7 has different hardware features from most phones:

    • No telephony

    • A single front facing camera (apps requiring the feature will not be available on Nexus 7)

    Be aware of which system features that you declare (or imply) are required to run your application or the Play Store will not make your application available to Nexus 7 users. Always declare hardware features that aren't critical to your app as required="false" then detect at runtime if the feature is present and progressively enhance functionality. For example if your app can use the camera but it isn’t essential to its operation, you would declare it with:

    <uses-feature android:name="" 

    For more details follow Reto Meier’s Five Steps to Hardware Happiness.


    Nexus 7 ships with Jelly Bean and its updated suite of system apps are built to take advantage of new Jelly Bean APIs. These apps are the standard against which your application will be judged — make sure that you’re keeping up!

    If your application shows notifications then consider utilizing the new richer notification styles. If you are displaying immersive content then control the appearance of the system UI. If you are still using the options menu then move to the Action Bar pattern.

    A lot of work has gone into making Jelly Bean buttery smooth; make sure your app is as well. If you haven’t yet opted in to hardware accelerated rendering then now is the time to implement and test this.

    For more information on Android 4.1 visit the Android Developers site or join us Live.

    Join the discussion on +Android Developers

    Wednesday, July 18, 2012

    [Gd] Zoho Office + Google Drive

    | More

    Google Apps Developer Blog: Zoho Office + Google Drive

    Editor’s Note: This blog post is authored by Naveen Venkat, from Zoho. We've welcomed many of Zoho's apps in the Google Apps Marketplace and are happy to see them join the Drive developer community as well. -- Steven Bazyl

    About Zoho

    Zoho is a suite of online applications targeted at small and medium sized businesses. We offer over 25 services ranging from the basic productivity suite all the way up to business applications like CRM, project management, invoicing, custom app building platform and much more. We’ve just rolled out Zoho Office integration with Google Drive.

    Zoho's applications can be broadly classified into 3 categories: Productivity, Business and Collaboration apps. Productivity apps are the basic needs of an office environment and include the likes of a word processor, spreadsheet, presentation tool, calendar etc. Business apps include CRM, projects, custom application building platform, invoicing and bookkeeping services. Collaboration tools facilitate real time collaboration across geographical locations. Email, chat, discussions, docs wiki etc are what round out this category of services.

    How it all began

    We have many Google and Google Apps customers using Zoho applications through Google Apps Marketplace, Google Chrome Webstore or directly using "Sign in using Google" on our login page. Tightly integrating Zoho's applications with Google's services is very crucial for us. During the launch of Google Drive, Google announced the availability of a SDK and the related Google Drive APIs that would facilitate third party apps to integrate with the service. We used this opportunity and initially started integrating Zoho Show (presentation tool) with Google Drive. At that time, we felt that the APIs are very extensive and pretty straight forward. This inspired us to integrate our entire Zoho Office Suite with Google Drive. In just a couple of weeks, we were able to integrate Zoho Writer (word processor), Zoho Sheet (spreadsheet tool), and Zoho Show (presentation tool) with Google Drive.


    Some of the goals that we had in our mind when we started our integration were, to be able to :

    • Create a new Zoho document from Google Drive’s UI
    • Edit an existing document in Google Drive using Zoho’s editor
    • Import a Google document into Zoho Office's UI
    • Collaborate in real time on the same document from Google Drive in ZOffice's editor.

    Above all, we also focussed on enabling SSO to login into Zoho with Google accounts without having to provide any extra information.

    Google APIs console - Register your app

    The first step in integrating an app with Google Drive is to register the app in the Google APIs console. Because we have three different apps, we created three different projects - Writer, Sheet and Show so that they would be listed separately in the contextual menu of Google Drive. In the console, we also have to enable Drive APIs and SDK to get access to Drive APIs for the App ID. The console then prompts you to create OAuth 2.0 client ID for authenticating the user with the app. Once this is done, we had to provide Google some basic information about our app such as brand icons, default and secondary mime types, authorization scopes etc.

    Google Chrome Web Store - Distribution channel for Drive apps

    The next step is to create a Google Chrome Web listing which allows users to install your app in Google Drive. Since we already have Zoho apps listed in the Chrome Web Store it was easy for us to make a few changes in our existing listing. We’ve added the following code in the manifest files to enable Drive for our apps.

    "container" : "GOOGLE_DRIVE",
    "api_console_project_id" : "<APP_ID>",

    APP_ID is the application’s ID which can be found in the Google APIs console.

    This makes the Chrome Web Store listing Drive enabled, so now users simply have to install our Chrome Web Store apps and the Drive features will be enabled:

    Zoho Writer, Zoho Sheet and Zoho Show’s Chrome Web Store apps

    Authentication & Authorization

    Google Drive apps are required to use OAuth 2.0 for authorization and are strongly encouraged to use OpenID Connect for authentication. Our Zoho Office Suite already supported OpenID authentication, so it was easy for us to implement it for the Z Writer, Sheet and Show apps for Google Drive.

    To enable authentication for Drive users on our Zoho app we’ve added the following scopes to our Drive apps’ configuration page in the Google APIs Console:


    This will make sure access to the authentication information of the user is granted alongside access to the Drive API allowing us to access Google’s OpenID Connect endpoints.

    Our previous outings with GData APIs introduced us to OAuth2.0. OAuth 2.0 takes care of the authorization flow for a new user and smoothly transitioning the user to the Zoho application environment.

    How the integration works

    Users can create a new document from Google Drive’s UI or edit their existing Google Drive documents with Zoho’s editors. And when the user hits save, the modified document will be saved in Google Drive as a new document, thereby leaving the original Document untouched. This new document comes with extensions recognized by Zoho's apps. For example, a text document, Test.doc, from Google drive, when edited in Zoho Writer and saved, will be saved as Test.zdoc in Google Drive.

    Zoho Writer integration in the Drive UI

    Users can invite their Google contacts to collaborate on their Google Drive documents and edit them using Zoho editors.

    One of the main challenges that we faced during the integration was when multiple users need to collaborate on the same document in Zoho's editors.

    In the recently launched Drive version v2 Google supports Permissions Feed to manage resource sharing. Based on the document permissions, we’ll allow the user to access the document for collaboration. Thus the Google users with whom the document has been shared can collaborate with each other in Zoho’s editor, without having to sign-in with Zoho explicitly. Zoho apps support inline collaboration which facilitates the shared users to collaborate seamlessly.

    Thanks to Google team for their continued support right through the integration.

    Naveen Venkat

    Naveen started his professional career at Zoho in 2004. He is now a Product Manager at Zoho responsible for integrating various Zoho applications with Google Products and also making sure that Zoho has the best possible integration with various third party applications. When not working, he can usually be found playing Chess or ping pong.


    [Gd] Google Developers Expert: recognizing and rewarding top developers

    | More

    Google Developers Blog: Google Developers Expert: recognizing and rewarding top developers

    Author PhotoBy Amir Shevat, Developer Relations Program Manager

    Google Developers Expert (GDE) is a new program from our Developer Relations team that recognizes and rewards outstanding developers. Our inaugural group includes 26 honorees with deep technical expertise in specific areas who are major contributors to the developer community.

    Google Developers Expert logo

    The status of Google Developers Expert is awarded yearly to experts who contribute to the communities around Android, Cloud, HTML5, Chrome, and Google Maps. Members of the program develop close connections to the respective Google product team, gain early access to developer releases, and are invited to an annual summit at Google headquarters. In addition, members are authorized to use a domain-specific badge which links to their member directory listing for use in promoting their services.

    sample GDE badges

    All of the Experts listed in the member directory provide a link to their Google+ accounts so you can add them to your circles and follow their latest news. Service to the developer community is an important criterion for selection in this program, so you can find members answering questions on developer forums such as Stack Overflow or speaking at technical conferences.

    How to become a member

    Candidates are nominated by members of the Google Developer Relations team and a committee approves a small number each year. Criteria include a highly technical skill set in one of the program's product areas, a strong online presence within that product’s developer community, and experience presenting to technical audiences. If you're interested in becoming a Google Developers Expert, please send your name, email, country of residence, area of expertise, and how you contribute to the developer community to You can learn more about the program at the official program page.

    Amir Shevat works with developers and startups. He promotes Google technologies as well as open source software and open standards in the Israeli market and worldwide.

    Posted by Scott Knaster, Editor

    Tuesday, July 17, 2012

    [Gd] Develop in the cloud with eXo’s Cloud IDE

    | More

    Google App Engine Blog: Develop in the cloud with eXo’s Cloud IDE

    Today’s post comes from Mark Downey of eXo, creator of Cloud IDE. Cloud IDE is an online IDE for Java, Python, PHP, Ruby or Javascript, and for nearly two years it has been used by developers to build applications for a number of PaaS environments. They recently added support for deploying code to Google App Engine.

    Since eXo started the Cloud IDE project back in 2010, our objective has been to make developers more productive in building and deploying cloud-based apps. We’ve made it easy to import, build and debug code from Github and to deploy it to a PaaS. We have tried to make the development workflow as painless as possible by providing a smooth integration with popular Cloud services from source control to application hosting, and now we’re bringing that integration to the Google App Engine world.

    Developers can now use Cloud IDE to build, debug and deploy App Engine apps without having to install and configure the App Engine SDK or any traditional desktop IDE. Everything happens right in the browser.

    It’s easy to get started. Once you have a Cloud IDE account, start a new project and select a Google App Engine app (Java or Python) as the project type. Confirm that you want to deploy to Google App Engine, and you will then be asked to create an app with your App Engine account.

    This opens the App Engine admin console in a new browser tab, where you get to choose your app ID (which will define the URL of your application). Upon completion, a callback in the URL automatically updates your appengine-web.xml with your app ID, inside Cloud IDE. 

    That’s it! From there, just click deploy and enter your credentials to build and deploy your app on Google App Engine.

    In Java, you can use auto-completion (alt+space) and have access to all the Google App Engine libraries. Many keyboard shortcuts are also available to help you develop efficiently (Help > Show Keyboard Shortcuts).

    To run and debug your app on a development server, press Debug in the Run menu, and set your breakpoints. Your app will run in another browser tab and you’ll be able to inspect variables at runtime.

    To re-deploy, just go to the App Engine menu in Project > PaaS > Google App Engine, and click Update Application.

    The Google App Engine menu also enables you to view and update your App Engine services such as Indexes, PageSpeed, Queues, DoS, Resource Limits, Crons or Backends.

    With eXo Cloud IDE, you can run, debug and deploy App Engine apps without having to install and configure the App Engine SDK or the Google Plugin for Eclipse (or, for that matter, Eclipse itself). Because everything related to your development activities is taking place on the Cloud IDE servers, your initial setup time is dramatically reduced. In a couple minutes you can be focusing on the things that matter most: coding and refining the app itself.  

    - Contributed by Mark Downey, product manager for eXo Cloud Services @marksdowney

    [Gd] Dev Channel Update

    | More

    Chrome Releases: Dev Channel Update

    The Dev channel has been updated to 22.0.1207.1 for Windows, Mac, Linux and Chrome Frame. This release contains the following changes:

    All Platforms Windows
    • Fix new installation suffix in [r146217]. Users who installed dev-channel from scratch (i.e. not updating from stable/beta) between July 9th and July 16th might have two Google Chromes show up in “Default Programs” (uninstalling/reinstalling will fix this).
    The full list of changes is available in the svn revision log. You can find out how to change to the Dev channel, or any channel, on If you find a new issue with this release, please shoot us a bug report.

    Jason Kersey
    Google Chrome

    Monday, July 16, 2012

    [Gd] On web semantics

    | More

    Official Google Webmaster Central Blog: On web semantics

    Webmaster level: All

    In web development context, semantics refers to semantic markup, which means markup used according to its meaning and purpose.

    Markup used according to its purpose means using heading elements (for instance, h1 to h6) to mark up headings, paragraph elements (p) for paragraphs, lists (ul, ol, dl, also datalist or menu) for lists, tables for data tables, and so on.

    Stating the obvious became necessary in the old days, when the Web consisted of only a few web sites and authors used tables to code entire sites, table cells or paragraphs for headings, and thought about other creative ways to achieve the layout they wanted. (Admittedly, these authors had fewer instruments at their disposal than authors have today. There were times when coding a three column layout was literally impossible without using tables or images.)

    Up until today authors were not always certain about what HTML element to use for what functional unit in their HTML page, though, and “living” specs like HTML 5 require authors to keep an eye on what elements will be there going forward to mark up what otherwise calls for “meaningless” fallback elements like div or span.

    To know what elements HTML offers, and what meaning these elements have, it’s necessary to consult the HTML specs. There are indices—covering all HTML specs and elements—that make it a bit simpler to look up and find out the meaning of an element. However, in many cases it may be necessary to check what the HTML spec says.

    For example, take the code element:

    The code element represents a fragment of computer code. This could be an XML element name, a filename, a computer program, or any other string that a computer would recognize.

    Author-controlled semantics

    HTML elements carry meaning as defined by the HTML specs, yet ID and class names can bear meaning too. ID and class names, just like microdata, are typically under author control, the only exception being microformats. (We will not cover microdata or microformats in this article.)

    ID and class names give authors a lot of freedom to work with HTML elements. There are a few basic rules of thumb that, when followed, make sure this freedom doesn’t turn into problems:

    Advantages of using semantic markup

    Using markup according to how it’s meant to be used, as well as modest use of functional ID and class names, has several advantages:

    • It’s the professional thing to do.
    • It’s more accessible.
    • It’s more maintainable.

    Special cases

    “Neutral” elements, elements with ambiguous meaning, and presentational elements constitute special cases.

    div and span offer a “generic mechanism for adding structure to documents.” They can be used whenever there is no other element available that matches what the contents in question represent.

    In the past a lot of confusion was caused by the b, strong, i, and em elements. Authors cursed b and i for being presentational, and typically suggested a 1:1 replacement with strong and em. Not to stir up the past, here’s what HTML 5 says, granting all four elements a raison d’être:

    b “a span of text to be stylistically offset from the normal prose without conveying any extra importance, such as key words in a document abstract, product names in a review, or other spans of text whose typical typographic presentation is boldened” <p>The <b>frobonitor</b> and <b>barbinator</b> components are fried.
    strong “strong importance for its contents” <p><strong>Warning.</strong> This dungeon is dangerous.
    i “a span of text in an alternate voice or mood, or otherwise offset from the normal prose, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, a thought, a ship name, or some other prose whose typical typographic presentation is italicized” <p>The term <i>prose content</i> is defined above.
    em “stress emphasis of its contents” <p><em>Cats</em> are cute animals.

    Last but not least, there are truly presentational elements. These elements will be supported by user agents (browsers) for forever but shouldn’t be used anymore as presentational markup is not maintainable, and should be handled by style sheets instead. Some popular ones are:

    • center
    • font
    • s
    • u

    How to tell whether you’re on track

    A quick and dirty way to check the semantics of your page and understand how it might be interpreted by a screen reader is to disable CSS, for example using the Web Developer Toolbar extension available for Chrome and Firefox. This only identifies issues around the use of CSS to convey meaning, but can still be helpful.

    There are also tools like W3C’s semantic data extractor that provide cues on the meaningfulness of your HTML code.

    Other methods range from peer reviews (coding best practices) to user testing (accessibility).

    Do’s and Don’ts

    Don’t Do Reason
    <p class"heading">foo</p>
    For headings there are heading elements.
    <p><font size="2">bar</font></p>

    p { font-size: 1em; }
    Presentational markup is expensive to maintain.
    <td class="heading">baz</td>
    Use table elements for tabular data.
    <div class="newrow">foo</div>
    <div class="newrow">bar</div>
    Use table elements for tabular data.
    foo bar.<br><br>baz scribble.
    <p>foo bar.</p>
    <p>baz scribble.</p>
    Denote paragraphs by paragraph elements, not line breaks.

    Written by , Senior Web Architect, Google Webmaster Team