title: Custom attribute with data-* prefix or without?
body: <p>The HTML5 spec define how to set custom attributes using data-* prefix,
  like:</p>
  
  <pre><code>&lt;div data-attr="somedata"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>But what would be the difference if we write just:</p>
  
  <pre><code>&lt;div attr="somedata"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>And I actually prefer the second way since it's shorter.<br>
  I can access both attributes using the <code>getAttribute()</code> method.</p>
  
  <p>So is that wrong not using data-* prefix? I tested it only on chrome and IE11, so maybe there are other browsers to worry about?</p>