validationurlsrcw3c-validationpercent-encoding

iframe src URL W3C validation error


Every time I get an error when validating:

<iframe class="forecast" src="http://forecast.io/embed/&num;lat=-26.201560&amp;lon=28.038995&amp;name=Johannesburg,%20ZA&amp;text-color=&num;ffffff&amp;color=&num;ffffff&amp;font=Helvetica&amp;units=ca"></iframe>

Error (screenshot): http://postimg.org/image/5h1kvzzuh/

I escaped the characters, but it didn't works. Thanks.


Solution

  • W3C validator maintainer here. Short answer is, use instead the following:

    <iframe class="forecast" src="http://forecast.io/embed/%23lat=-26.201560&amp;lon=28.038995&amp;name=Johannesburg,%20ZA&amp;text-color=&num;ffffff&amp;color=%23ffffff&amp;font=Helvetica&amp;units=ca"></iframe>
    

    That is, the fix is just to replace &num; with %23 (the percent-encoding of the # character).

    Explanation

    The specific problem in that URL is the &num; character references it contains.

    &num; is # (the “number-sign” or “hash” character), which is not a valid URL code point per the URL Standard, and so it’s not allowed in a URL.

    The # character is only ever allowed in an absolute URL with fragment or relative URL with fragment—and then, explicitly allowed only after the part the URL spec defines as the actual URL.

    And for the purposes of URLs, &num; and # are exactly the same.

    Hence, you must use it as %23 (that is, percent-encoded).


    P.S. I plan to get the URL checker in the validator updated to actually report the particular illegal characters it finds in URLs but it will be a while yet before I can get that refinement made.