Google +1 code validation error: missing attribute - html

My code: <g:plusone annotation="inline"></g:plusone>
I get this error:
there is no attribute "annotation"
element "g:plusone" undefined
Why?

You have two choices
Change to using this style markup <div class="g-plusone" data-size="tall" ... ></div>
Add the XML NS for google's <g: syntax to the <html tag of the document. Now if only Google would share where that xml namespace is located... (So really, just try option 1)

There is no attribute called "annotation" for any element recommended in the W3C standards. Google probably uses it to parse for some backend processing. If you want the +1 element, you cannot have a W3C standards code.
Check this thread. So what if custom HTML attributes aren't valid XHTML?

Related

Meta tag 'there is no attribute “class” ' and 'there is no attribute “property” 'and other attribute error

I tried to validate my website and I get the following error :
there is no attribute "class"
<aside class="left-off-canvas-menu">
element "aside" undefined
<aside class="left-off-canvas-menu">
there is no attribute "property"
<meta property="og:title" content="Growth Scorecard" />
document type does not allow element "div" here
…+' preptimeline timeline-portion" title="'+titles[parseInt(val)-1]+'"></div>');
How can I solve this error please suggest to me. I have less knowledge of XHTML. please let me know. why an error occurs on my website.
You can see validator's error report.
The elements and attributes you are using were introduced in HTML 5.
XHTML 1.0 Transitional is too old to support them.
Use HTML 5 instead. It better reflects what browsers actually support and what you are trying to do.

Attribute cf-hash not allowed on element script at this point in validator W3

When I check my website in the W3C validator, I get this error: "Attribute cf-hash not allowed on element script at this point".
This is my site source code:
<a href="/cdn-cgi/l/email-protection#71121003141403311a140210051e5f121e1c" itemprop="email" class="last-link"><span class="__cf_email__" data-cfemail="2b484a594e4e596b404e584a5f4405484446">[email protected]</span><script cf-hash='f9e31' type="text/javascript">,
The error message tells you everything you need to know: the script element can’t have a cf-hash attribute. The allowed attributes are listed in the specification of the script element.
If you need a custom attribute, use data-* attributes (just like you use them on the a element):
<script data-cf-hash="f9e31" type="text/javascript">

declaring angular directives in markup

What is the best practice for declaring directives on a HTML page. Per the http://angular-ui.github.io/bootstrap/#/pagination the directive is shown as so
<pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false" num-pages="numPages"></pagination>
per this stackoverflow question What are the advantages of using data- rather than x- prefix for custom attributes?
a better way of representing this directive would be as follows & conforms to HTML5 specifications
<div data-pagination data-total-items="totalItems" data-ng-model="currentPage" data-max-size="5" class="pagination-sm" data-boundary-links="true" data-rotate="false" data-ng-change="pageChanged()"></div>
HTML validation isn't all that important. Sometimes they can be safely ignored. However just by adding a 'data-' prefix on all attributes, the editor would stop complaining about invalid html.
read more about it here
Both are the same -> angular directives.
Use the shorter one.
data-ng-model = "user.name" and ng-model="user.name" provide you with the same outcome. You can use either. You can replace 'data' with 'x' and get the same outcome as well. You add the 'data' prefix to have them validated by html5 validators.

addthis & google analytics did not pass HTML validation

These are the errors and warnings I got:
Line 135, Column 134: & did not start a character reference. (&
probably should have been escaped as &.)Rk44QGJO&hl=he"></script><noscript><iframe src="…
Line 135, Column 309: The frameborder attribute on the iframe element is obsolete. Use CSS instead.
…ight="300" width="500" frameborder="0"><textarea name="recaptch…
Line 161, Column 116: Attribute addthis:url is not serializable as XML 1.0.
Attribute addthis:title is not serializable as XML 1.0.
Attribute addthis:description is not serializable as XML 1.0.
Attribute addthis:url not allowed on element div at this point.
Attribute addthis:title not allowed on element div at this point.
Attribute fb:like:layout is not serializable as XML 1.0.
Attribute fb:like:layout not allowed on element a at this point.
and this is the addthis code:
<div class="addthis_toolbox addthis_default_style"
addthis:url="http://www.example.com"
addthis:title="title"
addthis:description="description">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet" lang="en"></a>
<a class="addthis_button_linkedin_counter"></a>
</div>
Does anyone know how to fix these errors?
To fix attribute fb:like:layout, you can actually remove the following: fb:like:layout="button_count"
since the button count is the default layout.
A bit late to the party, but maybe it helps someone else? I haven't actually tried this implementation myself, but reviewing the code it looks like a good "hack" fix to your problem - providing that you're already using jQuery on your site.
I know people will say "don't worry about it, it's not breaking anything", but when you religiously validate your code (which I believe you should, to find missing closing tags that you've forgotten, etc), these kinds of pesky errors just get in the way of validating your code in the quickest possible way.
Anyway, here is the link: http://www.teslina.com/1879/allgemein/addthis-html5-workaround-js-hack/#sthash.4dHK9Zwl.mkBH3Z0g.dpbs

Visual Studio warns me about some invalid html attributes

I have a list of items in an html table. On each row (tr) I'm proceeding like this:
<tr idAffaire="#suite.IdAffaire" idSuite="#suite.IdSuite" class="#suite.Username row droppable">
I used the attributes idAffaire and idSuite for retrieving some infos later. I know the official identification attribute is "id" but in my case I need 2 id. When I compile my code, VS is warning me about some things:
this name contains uppercase characters, which is not allowed.
attribute 'idaffaire' is not a valid attribute of element 'tr'
...
Is it possible to prevent these warnings? Is there a better way of doing?
Thank you.
Yes, in Tools > Options > Text Editor > HTML > Validation > [Untick] Show errors
Ideally, you could use 2 hidden input fields with the id="suite" and value="whatever" to allow you to pick these up in a valid way.
The problem is that you are writing invalid HTML. As you mentioned, id is a valid attribute but idAffaire or idSuite are not. I'm assuming from the fact that you get a warning about uppercase characters, you are using an XHTML doctype. A better way to do this would be to use an HTML5 doctype:
<!DOCTYPE html>
And use custom data attributes for your new attributes:
<tr data-affaire="#suite.IdAffaire" data-suite="#suite.IdSuite" class="#suite.Username row droppable">
I believe you should add name space extension of yours. Then define your newly introduced attributes.
What you are doing is termed as adding custom attributes to html elements, which have a very varying opinion among the experts.
Firstly , using capital in html attributes is not recommended, you can switch to small case.
Secondly , adding custom attributes in XHTML (which i suppose you are using) throws warning, where as this is perfectly valid in HTML5.
there are few option to deal with it -
use Jquery .data() api to store data with java script.
or
follow a specific convention while storing data making it easy to maintain and read.You can follow HTML5 syntax
<ul>
<li data-id='5' data-name='john'></li>
</ul>