Subscribe: Niall Kennedy's Weblog
http://www.niallkennedy.com/blog/index.xml
Added By: Feedage Forager Feedage Grade B rated
Language: English
Tags:
content  google  graph protocol  graph  markup  mobile  open graph  open  page  protocol  smartphone  story  twitter  web 
Rate this Feed
Rate this feedRate this feedRate this feedRate this feedRate this feed
Rate this feed 1 starRate this feed 2 starRate this feed 3 starRate this feed 4 starRate this feed 5 star

Comments (0)

Feed Details and Statistics Feed Statistics
Preview: Niall Kennedy's Weblog

Niall Kennedy



Niall Kennedy's home on the web



Updated: 2013-03-10T18:12:34Z

 



Google adds experimental proxy to Chrome for Android

2013-03-10T17:49:28Z

Google Chrome 26 for Android includes an experimental setting to proxy all http scheme requests through Google servers over a SPDY connection backed by Page Speed optimizers for HTML, CSS, JavaScript, and image content.
(image)

Google Chrome 26 for Android includes an experimental setting to proxy all http scheme requests through Google servers. Chrome for Android opens a SPDY connection to a Google server running a Page Speed proxy which performs a DNS lookup, converts all images to WebP, and compression and minification of HTML, CSS, and JavaScript.

HTTPS traffic and incognito tabs bypass the proxy. The original IP address of the device is exposed through the X-Forwarded-For HTTP header.

Google Chrome 26 for Android is the current com.chrome.beta release.




Nike+ Accelerator

2013-03-10T18:12:34Z

Nike partnered with TechStars to attract ten startup companies to Portland, Oregon for three months to create new experiences and companies based on the Nike+ APIs.

Nike partnered with TechStars to attract ten startup companies to Portland, Oregon for three months to create new experiences and companies based on the Nike+ APIs. The Nike+ Accelerator offers accepted startup companies $20,000, access to Nike executives and an outside mentor network, office space, and free server hosting. TechStars receives 6% equity in each participating company.

The corporate accelerator seems like a pretty good trial as Nike tries to expand its role in digital devices. Total cost to Nike is unreleased but assuming $200,000 plus access to executives might be a similar cost as running developer days in multiple cities.




Twitter Card markup in expanded Tweets

2012-12-10T19:28:57Z

Twitter now supports story summaries in an expanded Tweet view powered by Twitter Card markup. I wrote a PHP generator and WordPress plugin to help your content look good on Twitter. Associate your page with a Twitter account, display images in timeline, and more.

Twitter now supports story summaries in an expanded Tweet view powered by Twitter Card markup. Twitter looks for special elements inside linked pages to classify content and build a story summary. Twitter Cards fall back to Open Graph protocol markup to complete a story when no Twitter-specific exists. Publishers may associate a page with an author and site Twitter account to encourage new followers. Twitter plans to syndicate parsed story summaries with the Tweet data, allowing a viewer to browse basic story information in a mobile client before following the link. Anyone can add Twitter Card markup to their pages; Twitter is currently whitelisting domains for special treatment within timeline (request inclusion here).

I wrote a Twitter Card generator for PHP and a Twitter Card WordPress plugin if you would like to add Twitter Card markup to your site.

Card types

Twitter supports three types of story summaries: summary, photo, and player.

Summary

All pages are considered a “summary” by default. Twitter wants to see a canonical URL, page title up to 70 characters, and a description up to 200 characters. You may optionally provide an image Twitter will crop and resize to a 120×120 pixel square.

Photo

Photo cards place an image at the top of the story summary expanded up to the full width of the expanded Tweet display area. Photos must be at least 280 pixels wide and 150 pixels tall to meet the minimum viewing area of mobile phone client. Twitter will resize your image up to a maximum width of 560 pixels while trying to maintain your original aspect ratio.

Player

A player card features inline video through an HTML > or a directly linked MP4 file with a H.264 Baseline Level 3.0 video track and AAC LC audio track up to 640×480 pixels. All video assets are expected to be served over HTTPS to avoid any mixed content issues with a parent Twitter HTTPS timeline.




Google recommendations for smartphone-optimized websites

2012-06-06T19:34:46Z

Google updated its webmaster recommendations for smartphone-optimized websites. You may need to change your site HTML and server headers to help Google's various crawlers find your smartphone content and better associate the same pages optimized for various screen sizes.Google updated its webmaster recommendations for smartphone-optimized websites. You may need to change your site HTML and server headers to help Google’s various crawlers find your smartphone content and better associate the same pages optimized for various screen sizes. Google recommends responsive web design with CSS media queries for smartphone-optimized websites. Recommended changes vary based on your site’s approach to smartphone optimized content: responsive design, content negotiation, or redirects to mobile-specific URLs. Responsive web design Google will download your page CSS and evaluate viewport width ranges specified as media queries. Google considers sites optimized for a 640 pixel width as smartphone-optimized and may look for other resolutions “that can be reasonably expected to refer to smartphone screen resolutions.” If your site uses responsive web design make sure your CSS and JavaScript assets specifying such behavior are not blocked by robots.txt rules. Content negotiation by User-Agent Does your site look for strings such as “iphone” or “android” in a User-Agent string to trigger a smartphone-specific template? Add a Vary HTTP header value of “User-Agent” to encourage Google to revisit your page with a smartphone User-Agent string. Separate mobile site Do you redirect incoming requests to a mobile-specific URL (e.g. mydomain.com to m.mydomain.com? Google wants you to define your viewport targets on your main site page and in your sitemaps, define a on your mobile page referencing the equivalent main page, and include a Vary HTTP header in the response. On your main (desktop-focused) page add a new scoped with a media query specifying the minimum and maximum target widths of your mobile site(s). In your sitemap files add the same markup with an xHTML namespace + prefix definition: xmlns:xhtml="http://www.w3.org/1999/xhtml" + Adding a canonical link to your mobile page helps collapse references to the same content across your different URLs; the link references for your mobile and desktop versions of the same page can be combined, helping your pages appear more relevant when competing with other content for a high result placement. Summary Google crawls the web with many different search agents including Googlebot and Googlebot-Mobile. Make sure your server is configured to properly speak to both, encourage follow-up visits from more task-specific crawlers, and rank higher in search results by better describing your page, its content, and the relationship between pages with proper HTTP headers, sitemaps, and page markup.[...]



Nielsen U.S. smartphone statistics

2012-05-16T17:45:39Z

Research firm Nielsen released updated statistics on smartphone application usage in the United States. The average Android and iOS user installs 41 applications and uses these applications 39 minutes each day.

Research firm Nielsen released updated statistics on smartphone application usage in the United States.

There are a combined 84 million Android and iOS users in the United States. The average user spends an average of 39 minutes inside one of their 41 smartphone applications each day. Facebook is the top application not already bundled with the operating system.




LinkedIn engineering’s client-side template evaluation

2012-01-25T21:40:24Z

LinkedIn shares their evaluation process for choosing a client-side templating solution from 18 different options across 15 formal metrics.

LinkedIn shares their evaluation process for choosing a client-side templating solution from 18 different options across 15 formal metrics. They ultimately chose dust to replace their Java Servlets and JSP.

[W]e found that for any non-trivial view, none of the templating options worked well across client and server unless the server could also execute JavaScript.

A useful read when evaluating dynamic HTML templates.




Map input autocomplete types in Chrome 15+

2012-01-25T20:33:10Z

Chrome 15 and above supports mapping input fields to specific types of data to improve the accuracy of autofill tools. The new WHATWG autocompletetype attribute proposal from Ilya Sherman of Google proposes 36 mapped tokens and two sections for autofill agents entering name, address, contact, credit card, business, or birthday data in a web browser.

Chrome 15 and above supports mapping input fields to specific types of data to improve the accuracy of autofill tools. Typically an autofill tool, either bundled with the browser or a third-party add-on, scans the page’s s and attempts to derive some meaning from the field’s name attribute and new HTML5 input type attribute values such as email or tel. The new WHATWG autocompletetype attribute proposal from Ilya Sherman of Google proposes 36 mapped tokens and two sections for autofill agents entering name, address, contact, credit card, business, or birthday data in a web browser.

Name
Email
Credit card

Google Chrome 15+ (November 2011 stable channel and later) parses an “x-autocompletetype” attribute from an and attempts to match the proposed standard tokens with a list of Chrome autofill types stored locally (and possibly on Google’s autofill servers). If the current user has entered their name, email, and credit card number into their browser’s autofill storage your webpage might receive very accurate pre-populated fields.

I added x-autocompletetype attributes to this post’s comment fields if you would like to try it out.




Open Graph protocol 1.1

2012-01-24T19:20:25Z

Open Graph protocol is a set of HTML+RDF markup elements used to summarize webpages on the public Internet when those pages are shared on Facebook, Google+, mixi, LinkedIn, and more. In this post I will summarize Open Graph protocol markup for easy inclusion in your site templates. Facebook completed its rollout of Timeline profiles and Open Graph activity aggregation last week, completing a set of changes announced at their f8 developer conference in September. Facebook also switched over to a new version of Open Graph protocol, the metadata language used to connect web pages in the public Internet with the sharing activity happening inside Facebook’s walls. In this post I will highlight some of the major features of Open Graph protocol 1.1 affecting how your web pages display and rank inside Facebook news feeds, Google+ streams, Mixi social streams, and LinkedIn shared stories. What is Open Graph protocol Semantics Populating a basic story template Images Title, site name Type URL Multimedia Video Audio Special type attributes Generate markup, validate PHP generator Validator Official tools Summary What is Open Graph protocol? When someone shares a URL on a social networking site such as Facebook the site tries to create a summary of the page: title, description, thumbnail image, metadata, and more. Open Graph protocol defines elements placed in the of a web page’s HTML markup summarizing the contents of the page. Fallbacks to HTML standard elements sometimes exist; Open Graph protocol is an explicit definition of those elements and more. Open Graph protocol markup informs Facebook shared stories, Google +Snippets, mixi check, and other social sites using explicit sharing markup and content classification. I will reference Facebook consumption of Open Graph protocol for the rest of this post as they are the main proponent of the specification and typically the main target of web page publishers including Open Graph protocol markup on their pages. Open Graph protocol markup affects pages shared with the “Like Button” social plugin, messages sent between Facebook users, links posted to a profile or news feed, and possibly search results returned by Facebook. The new Timeline activity groupings are based on Open Graph protocol defined web content when available. A link shared without Open Graph protocol markup relies on HTML fallbacks to generate a shared story summary. The content receives the most generic content classification of “website“ and may be de-emphasized in Multifeed rankings in favor of a more diverse set of stories. A link shared with additional metadata provided by Open Graph protocol markup generates a full story summary with a preview image, embedded video, special categorization, and more behind-the-scenes data used to search and rank shared content. Semantics Open Graph protocol 1.1 is based on RDFa Core 1.1 markup. The examples below use compact URI expressions (CURIEs) based on scoped prefixes first defined by a parent element such as . Populating a basic story template When a Facebook user pastes a link into their status update Facebook requests the document, parses the result, and displays a story preview in the status update composition box. The webpage title, description, and thumbnail images are displayed immediately in this preview template. The fully published story may include additional metadata and viewing actions depending on the rendering context: profile, news ticker, or social news feed. Images An image thumbnail displayed next to a shared story boosts engagement in the social news feed. It’s possible to explicitly define image thumbnails you would like to appe[...]



Google searches smartphone web as an iPhone

2011-12-15T21:41:17Z

Google's mobile search engine crawler now uses an updated User-Agent string designed to trigger iPhone-specific renderings of web pages.

Google’s mobile search engine crawler now uses an updated User-Agent string designed to trigger iPhone-specific renderings of web pages. The Googlebot-Mobile crawler is building a smartphone web index based on iOS 4.1 responses including redirects. Webmasters with smartphone-specific content may finally have a reason to generate mobile sitemaps. Googlebot will skew your iOS usage numbers if not properly treated as a robot.

Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_1 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Version/4.0.5 Mobile/8B117 Safari/6531.22.7 (compatible; Googlebot-Mobile/2.1; +http://www.google.com/bot.html)

Google mobile search acts like an iPhone, not an Android.




Windows 8, plugin-free browsing, and UA spoofing

2011-09-15T19:39:50Z

Microsoft released a developer preview of Windows 8 at this week's BUILD conference including a preview release of the next version of Internet Explorer. The new browser runs in two modes: with and without plugins. Microsoft is bundling a special compatibility view list to spoof iPhone, iPad, or even Firefox User-Agents to trigger special views on websites designed for a plugin-free or full-screen experience.

Microsoft released a developer preview of Windows 8 at this week’s BUILD conference including a preview release of the next version of Internet Explorer. Windows 8 will include a “Metro style browser,” a simplified appliance-like view based on Windows Phone tiles. The Metro interface is powered by Internet Explorer (Trident, Chakra) behind-the-scenes in a special “immersive” full-screen runtime without support for browser plugins such as Adobe Flash Player. Microsoft is bundling a special compatibility view list with a uaStringImmersive attribute to spoof an iPhone, iPad, or even Firefox User-Agent to trigger special views on websites designed for a plugin-free or full-screen experience.


youtube.com
tv.slashgear.com
mashable.com

Sites using feature detection at runtime helps avoid assuming the same features for desktop Internet Explorer and Metro’s “immersive” Internet Explorer. The application/x-shockwave-flash handlers present in one version of the browser may not be present in the next. Assuming Internet Explorer cannot handle XMLHttpRequest or display H.264 video with AAC audio inside a could land your hostname in the Compatibility View penalty box.

The Internet Explorer 9 compatibility view list is available online in XML format including existing featureSwitch handlers.

Feature detect at runtime or update your content negotiation User-Agent matchers for Internet Explorer 10 before Microsoft decides to spoof its User-Agent for iPad treatment.