Errors validation W3C HTML5 img noscript facebook.com

Asked 20/2, 2016 at 14:50 Answered 15/2, 2018 at 14:58

I am trying to validate my page as HTML 5 (W3c). And I have the following error: The "img" element is not allowed here (as a child of the "noscript" element). The "noscript" element, when a child of "head", must contain only the following child elements: "link", "style", and "meta".

On site https://developers.facebook.com/docs/ads-for-websites/conversion-pixel-code-migration recommendation for my code: "Copy and paste the upgraded code snippet between <head>; and </head>; in the HTML code of your website where you want to track conversions. For example, to track registrations, place the code on your 'registration completed' web page."

please see the source code:

<head>
<script type="text/javascript">
var fb_param = {};
fb_param.pixel_id = '1234567890';
fb_param.value = '10.00';
fb_param.currency = 'USD';
(function(){
  var fpw = document.createElement('script');
  fpw.async = true;
  fpw.src = '//connect.facebook.net/en_US/fp.js';
  var ref = document.getElementsByTagName('script')[0];
  ref.parentNode.insertBefore(fpw, ref);
})();
</script>
<noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/offsite_event.php?id=1234567890&value=10.00&currency=USD" /></noscript>
</head>

Is it possible to modify this code and pass validation (in head section)?

Spectacled answered 20/2, 2016 at 14:50 Comment(1)

You cannot put content in the head. However, you can move the noscript to the body. – Halftruth 20/2, 2016 at 15:15

W3C’s HTML5 specification defines the content model of a noscript element in the head element like this:

[…] in any order, zero or more link elements, zero or more style elements, and zero or more meta elements.

As you can see, it cannot contain anything else than link/style/meta elements. So no, it’s not possible to modify anything to allow an img inside of a noscript element inside of the head element.

But you can have an img inside of noscript if you place the noscript element in the body, as the content model is in that case:

transparent, but there must be no noscript element descendants.

Transparent means that it has the same content model as its parent element. So for example, if the noscript is inside a div, it may contain anything that a div may contain (except of another noscript).

Peaslee answered 21/2, 2016 at 0:10 Comment(0)

-1

As @Aplet123 and @unor say, you can move the <noscript> element to the body. I've done this on my pages, and it appears to work without ill effect.

To check, I've used the Facebook Pixel helper from Chrome, and it behaves exactly the same as the previous version of my page with the <noscript> element in the head as per the Facebook sample code.

Finally, to keep the HTML validator happy, you will also need to add an alt="Facebook pixel" or similar to your <img> element.

Peplum answered 15/2, 2018 at 14:58 Comment(0)

Recommended topics

Hot tags