HTML5’s rel="noreferrer"

Mark Pilgrim at Dive Into HTML5 (which is supposed to be made into a book in which Google Press is involved in) writes:

rel="noreferrer" “indicates that no referrer information is to be leaked when following the link.” No shipping browser currently supports this, but support was recently added to WebKit nightlies, so it will eventually be showing up in Safari, Google Chrome, and other WebKit-based browsers

There’s also a test case for the noreferrer feature. Looks like a useful value, I wonder if there’s any drawbacks to it. Mark’s site also features a very readable overview on HTML5 forms.

HTML5 is not the only draft standard or proposal around for the future of web markup, but if it will be successful in becoming the main specification then it might mean that torch has been passed on from the World Wide Web Consortium (W3C) to the Web Hypertext Application Technology Working Group (WHATWG). In that context, it’s worth noting that not only Mark Pilgrim, but also the editor of community-feedback-powered HTML5, Ian Hickson, work at Google – quite a bit of leverage for the browser/ OS/ phone/ search maker, or what do you think?

Read more »

Google, Apple and Microsoft Showing Off HTML Capabilities

Google has created an (only subtly branded, mostly trying to be neutral looking) HTML5 showcase, presentation and tutorial called HTML 5 Rocks (on a side-note, this site is inaccessible from China).

What exactly HTML5 will be though in popular usage may be decided in new browser and standard battles. Take Apple’s HTML5 showcase, for instance: once you click on the demos using Firefox, a message pops up saying “You’ll need to download Safari to view this demo.” If HTML5 is meant to be a cool cross-browser things solving all our problems, then certainly it would work in more than just Safari, right? (Google too in the first version of their Chrome Experiments showcase site warned you when opening demos in Firefox – which often worked fine – that other browsers than Chrome might cause problems and be risky to use.)

Microsoft, too, is giving developers a taste of their version of the future with the latest preview of Internet Explorer 9. As Ars Technica says, it brings “support for HTML5

Now, if it’s true that browser companies do get together in more standards consolidation, in another area in the meantime – the one of mobile applications, including devices like the iPad – we’re seeing a move away from the open web and towards more fragmented device-specific app store programs. Let’s see if in 2015, when (hypothetically speaking) an element like Video or Canvas finally works in 99% of the browsers, mainstream consumers aren’t already accessing most of their software through walled gardens of Chrome Extensions Web Stores/ Apple Stores/ Geolocation IP-Restrictions/ Facebook apps.

Read more »

Say What!? - An HTML5 speech game

Last thursday I attended Madrid’s Google Devfest and one of the things I liked the most was one of the latest additions to Google Chrome, the speech attribute on the input fields. It allows to fill form fields using the microphone (without Flash!) and Google technology for speech recognition.

I wanted to play a little with the techonology so I created a game as a weekend project. It shows you one random title from a Wikipedia article (using its API) and asks you to read it aloud so it can compare what you said with the given phrase. Since Google speech recognition is far from perfect (specially if you have a non-US accent) the results may vary, but I think it’s funny anyway.

You can try it at nekojs.com/html5/speech.html but you’ll need one of the latest Chrome builds in order to test it (and I think it only works on Mac and Windows right now).

Since I know that some of you like this kind of games on the web I hope you can give me some feedback and ideas for improving.

Read more »

InnerHTML and Select option in IE

Hello. This is my second post.

The non-DOM property innerHTML can't add options to a tag select in Internet Explorer.

Example not working:

document.getElementById("my_select").innerHTML = "not work";

The correct way to insert options in a select is using appendChild or addOption functions. But that's tiring if we are working with Ajax.

Use innerHTML is not the standard but it is very useful.

The function above, will help you to insert options like using innerHTML, in IE, Firefox or Opera.

Updated: now supports option-selected

Using my function:

var inner = "Now work";


select_innerHTML(document.getElementById("my_select"),inner);

The function. Add to your lib.

function select_innerHTML(objeto,innerHTML){
/******
* select_innerHTML - corrige o bug do InnerHTML em selects no IE
* Veja o problema em: http://support.microsoft.com/default.aspx?scid=kb;en-us;276228
* Versão: 2.1 - 04/09/2007
* Autor: Micox - Náiron José C. Guimarães - micoxjcg@yahoo.com.br
* @objeto(tipo HTMLobject): o select a ser alterado
* @innerHTML(tipo string): o novo valor do innerHTML
*******/
objeto.innerHTML = ""
var selTemp = document.createElement("micoxselect")
var opt;
selTemp.id="micoxselect1"
document.body.appendChild(selTemp)
selTemp = document.getElementById("micoxselect1")
selTemp.style.display="none"
if(innerHTML.toLowerCase().indexOf(""
}
innerHTML = innerHTML.toLowerCase().replace(/ selTemp.innerHTML = innerHTML


for(var i=0;i var attrName = spantemp.attributes[j].nodeName;
var attrVal = spantemp.attributes[j].nodeValue;
if(attrVal){
try{
opt.setAttribute(attrName,attrVal);
opt.setAttributeNode(spantemp.attributes[j].cloneNode(true));
}catch(e){}
}
}
//getting styles
if(spantemp.style){
for(var y in spantemp.style){
try{opt.style[y] = spantemp.style[y];}catch(e){}
}
}
//value and text
opt.value = spantemp.getAttribute("value")
opt.text = spantemp.innerHTML
//IE
opt.selected = spantemp.getAttribute('selected');
opt.className = spantemp.className;
}
}
document.body.removeChild(selTemp)
selTemp = null
}

Another solution to innerHTML/Select/IE problem, here

Read more »