* 744:1453: ERROR: Start tag of nonvoid HTML element ends with '/>', use '>'.
> `HTML-Proofer found 42 failures!
> Error: Process completed with exit code 1.`
I want to post my .ipynb file on my blog, so I downloaded the .ipynb file as a .md file in Jupyter notebook.
When I put the .md file in the _posts folder and checked the blog through jekyll serve (using jekyll-theme-chirpy), it worked fine.
But when I tried to post that .md file to my GitHub blog,
there was an error (above) in GitHub actions that I can't understand.
how can I solve this problem?
I did:
theme upgrade
I tried some things in window and mac both
I wrote the front matter in a .md file
Check you HTML code. https://rocketvalidator.com explains the message
Self-closing syntax (“/>”) used on a non-void HTML element. Ignoring the slash and treating as a start tag.
A slash character (/), normally used for self-closing tags, has been found in an unexpected place for a tag, and the validator has decided to ignore it and treat is as a start tag instead.
The page also lists possible options and potential mistakes (check the link on top for the examples I left out here):
HTML tags can go in pairs (start tag, end tag) or be self-closing.
In HTML5, the ending slash and the preceding space is optional for self-closing tags so all of these are valid.
A common mistake is including a slash tag on a start tag, as in the following example. If the Nu HTML checker encounters that, it will ignore the slash and just treat the tag as a start tag.
Related
I post this question because I'm having some errors with the w3c validator in my page (Link to validation).
It outputs me a lot of strange errors related with my HTML 5 markup, being this the main error I can't get out of my head:
Line 15, Column 6: An body start tag seen but an element of the same type was already open
I have looked a lot into this problem and I'm not able to find any solutions.
Although there are more strange errors, such as
Line 14, Column 7: Stray end tag head
I'm specially interested in the first exposed one, which I would like you to help me solving this.
Thanks in advance!
Problem solved:
Conclusions:
Never display data into the <head> tag, otherwise, a body tag will be automatically opened.
The <noscript> tag content is considered by the validator as displayable, so It's convenient to take care of what we write into the tag.
The noscript element in the head element contains text output. This is not allowed in the head element; noscript in the head element may contain only link, style, and meta elements (see the spec). Any displayable content implicitly closes the head element and opens the body element (because of their content models and the fact that both opening and closing tags for them are optional).
I'm starting to learn web development and am using pyramid with chameleon. I just took some sites html source as a template in Dreamweaver and then copied the code into a chameleon .pt file.
The html code displays fine in dreamweaver but I get this error when running it in pyramid:
chameleon.exc.ParseError
ParseError: Unexpected end tag.
- String: "</div>"
I have tried dreamweavers cleanup function and it said it removed 2 empty tags but I still get this error. My traceback is all related to errors in the chameleon and doesn't show the specific line its having problems with in my template itself.
Is there a way to identify the actual line where the error is occurring?
I'm not sure if there's a pyramid or chameleon specific solution or if there are general methods to find errors in HTML tag.
Chameleon expects templates to be well-formed, and is less forgiving of unbalanced tags and incorrect attribute markup as DreamWeaver is.
Note that the error doesn't necessarily mean that there is a </div> tag too many. If the opening <div> has a syntax error such as a missing = on an attribute declaration (e.g. <div class"foobar"> then the opening tag is not recognized and the corresponding closing tag is going to be flagged as well.
You could run your template through an XML validator, there are several available online (such as http://www.validome.org/xml/, http://www.xmlvalidation.com/ and http://xmlgrid.net/, Google lists many more). These are bound to give you a slightly more helpful message as to what is wrong with your template.
Never used pyramid/chameleon before, but it looks like you have to go through the code and remove an extra </div> tag. When you get the message that it removed two empty tags, that probably means it removed the open and closing of a set of tags
e.g. <div></div> or <p></p>
Go through your code and for every <div> there should be a </div>.
I have a blog(wordpress based). And try to validate by w3c validator one of my page. The first error is:
Line 1, Column 1: Non-space characters found without seeing a doctype first. Expected <!DOCTYPE html>.
<!DOCTYPE html><!-- HTML 5 -->
Also, DebugBar (http://www.my-debugbar.com/wiki/IETester/HomePage) agree and show two invisible chars before <! when I open the same page from "HTML Check" tab inside this tool. BUT!!
This line of HTML-code come from file header.php in my wordpress theme.
I download this file from my hoster to my local HDD.
The first line of header.php is <!DOCTYPE html><!-- HTML 5 -->
When I open header.php in RJ TextEd (just advanced text editor) it say: current encoding for header.php is UFT-8 without(!) BOM.
When I open header.php in HEX-viewer I see, that byte 0 and 1 is 3c,21 - so it is exactly <!.
So, all things considered, why & where I get these "odd symbols" from?
I found the root of problem. The general rule is:
If any(absolutely any!) file that take part in construction of the
code of final HTML-page(the one to be sended to client) has encoding
with BOM - final HTML-page WILL BE UTF-8-BOM. That is: you whole site
should NOT contain even 1 file with BOM.
In my case I have total 1.3K files that make up my site. Only 4 files was BOMed:
wp-config.php (in root of site)
jquery.query.js (in include folder)
cyr-to-lat.php (in plug-in folder)
footer.php (in theme root folder)
And I was forced to re-save every and all of these 4 files as "UFT-8 without BOM" to get rid of "Non-space characters" validation error. When I did this (re-save files) - error is gone.
I've been editing a lot of HTML pages with basic text editor, notepad.
When I went to validate them the validation service is saying there's a div tag that is not closed. I tend to find automatic error reports such as these don't tend to be too reliable, i.e they will give you a line number and the error but often times the error is actually in another part of the file entirely.
I'm just wondering if there is a way to find the closing tag for an opened HTML tag. For example, you click on a tag then click a shortcut, and the program will jump to the closing tag. I know this functionality is in homesite, but I don't have homesite, and its a bit of a bulky program anyway.
To sum up, I would like to know how to find html tags that don't have closing tags.
If you save your HTML as page.xhtml (instead of page.html), the browser (Firefox/Chrome or Opera) should find the un-closed tags for you without the need for a validator. Just remember to rename them .html before serving them online - IE doesn't support .xhtml files yet.
Edit (3 years later): This post's still getting comments/upvotes so a slight amendment. IE9 and IE10 do now support xhtml files.
Use the firefox view source - wrong code will be in different color
Notepad++ - never had any problems with it and also never had any unclosed html tag with it.
You can just click on any element and see if it has a closing tag. Also you can do this: click on "TextFX"(left from plugins in navigation) -> click on "Text FX HTML Tidy" -> click on lets say hmm "TiDy clean Document - wrap". That should fix your html document, aka close all unclosed elements.
http://validator.w3.org/
Does more than just unclosed tags. Should be used by all front-end developers, IMO.
I am using two online-tool, which work very fine.
jona.ca and tormus.com
CSE HTML Validator Lite is a free lightweight editor (for Windows) that will check your HTML (just press F6) and find missing end tags and other problems. You can also press Ctrl+M on a start tag or end tag and it will take you to the matching start or end tag.
A simple online service that will also do this (and more) is OnlineWebCheck.com. There are other online services but in my opinion the one I just mentioned is the simplest one to use and understand.
Full disclosure: I am the developer of CSE HTML Validator Lite and http://www.OnlineWebCheck.com/ which is based on CSE HTML Validator.
If your code is very messy, not prettified nor indented, v.Nu (as seen at https://validator.w3.org/nu/) will often get confused (for instance if there's an extre closing tag, it may not manage to select the one which is really wrong).
One solution is code folding: by collapsing all the code which is marked as a child of a certain node, you can often easily spot some incorrect hierarchy.
An example of editor which supports code folding is Kate editor: see the arrows on the left in their screenshot.
free lightweight html editors ... online html validation services that can highlight unclosed tags?
Use linter-vnu.
linter-vnu is a package for the Atom editor that uses the Nu Html Checker (v.Nu) to validate HTML or XHTML documents.
Disclosure: I am the developer of linter-vnu.
linter-vnu uses another Atom package, linter, to integrate v.Nu and Atom.
For example, if you open the following test.html file in Atom:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta charset="utf-8"/>
<title>Test HTML document</title>
</head>
<body>
<div>
<p>Lorem ipsum dolor sit amet...</p>
</body>
</html>
(with a deliberately missing closing </div> tag)
then Atom (or rather, linter-vnu, thanks to linter and v.Nu) displays the following error messages:
Unclosed element “div”. at line 8 col 1 in test.html
End tag for “body” seen, but there were unclosed elements. at line 10 col 1 in test.html
and marks those lines in the editor with red dots.
If you click the "at..." (hyperlinked text) in the error message, the editor insertion point moves to the corresponding line, and a popup appears under the line, with the error text ('Unclosed element "div".').
If you save your HTML document with the file extension .xhtml, and open it in Atom, then v.Nu validates your document as XHTML (XML) rather than HTML, with slightly different messages. In this case, just one error message:
required character (found “b”) (expected “d”) at line 10 col 3
where line 10 contains the closing </body> tag. v.Nu was expecting a </div> tag instead; it was happy with </ - it was expecting a closing tag - but it was expecting the element name to begin with "d" for "div", not "b" for "body".
I make the following claims, as of November 2016:
v.Nu is the best option for validating (X)HTML(5).
linter-vnu is the best option for interactively harnessing v.Nu in an editor. linter-vnu itself is trivial; it's just a few lines of "glue" code. What makes it the best option is the Atom editor and the Atom linter package.
I welcome counterclaims and questions about these claims. I'd be happy to be proven wrong and be shown something better. Especially if, like v.Nu and linter-vnu, it's free.
I've got an xhtml page validating under xhtml strict doctype -- but, I getting this warning which I trying to understand -- and correct.
Just, how do I locate this errant "Byte-Order Mark". I'm editing my file using Visual Studio--not sure if that helps.
Warning Byte-Order Mark found in UTF-8 File.
The Unicode Byte-Order Mark (BOM) in UTF-8 encoded files is known to cause problems for some text editors and older browsers. You may want to consider avoiding its use until it is better supported.
The location part of your question is easy: The byte-order mark (BOM) will be at the very beginning of the file.
When editing the file, in the bottom status bar toward the right VS Code shows you what encoding is being used for the current file:
Click it to open the command palette with the options "Reopen with encoding" and "Save with encoding":
Click "Save with Encoding" to get a list of encodings:
Choosing an encoding saves the file with that encoding.
See also this note in the Unicode site's FAQ about the BOM and UTF-8 files. It has no function other than to call out that the file is, in fact, UTF-8. In particular, it has no effect on the byte order (the main reason we have BOMs), because the byte order of UTF-8 is fixed.
Here's how I fixed this:
Download and install Notepad++
Open the file with Notepad++
In the menu select "Encoding" and set it to "Encode in UTF-8 without BOM"
Save the file and the BOM will be gone.
For someone using Visual Studio seeing the annoying red dot on bitbucket on 2018, just go to Visual Studio to "File" -> "File.cshtml Save As..." and select "Save with Encoding...":
Then it will popup a screen so that you can change the Encoding, try and look all the way down in the list until you see "Unicode (UTF-8 without signature) - Codepage 65001":
After this, just overwrite your file and upload it to your repo and the BOM will be gone.
Hope it helps.
Leo.
for intellij idea editor just go to File and File Properties
In Linux:
Open the file with Geany.
In the menu "Dokument" uncheck "Write Unicode BOM".
Save the file.
BOM sometimes is located INSIDE text, not at the beginning - if a file has been assembled some time by php from other files using for example include_once(). To remove it, delete area between at least one character before BOM and at least one character after BOM (just in case). Position of BOM can be located in F12 Developer Tools of the Internet Explorer and probably Edge. It is visualised as a black diamond / rhombus.
Visual Studio and WebMatrix can save files with or without signature (at the beginning).
BOM causes errors during validation ( https://validator.w3.org/#validate_by_upload ) or in consoles - </HEAD> can be treated as orphaned element without <HEAD>, when apparently is present !:
Error: Stray end tag head.
<BODY> as second one <BODY>, when only one <BODY> exists and everything is correct:
Error: Start tag body seen but an element of the same type was already
open.
And entire document can be seen lacking DOCTYPE, when BOM or two BOMS occupy first line and DOCTYPE is in second line, with a message similar to this one:
Error: Non-space characters found without seeing a doctype first.
Expected e.g. <!DOCTYPE html>.
Error: Element head is missing a required instance of child element
title.
Error: Stray doctype.
Error: Stray start tag html.
Error: Stray start tag head.
Error: Attribute name not allowed on element meta at this point.
Error: Element meta is missing one or more of the following
attributes: itemprop, property.
Error: Attribute http-equiv not allowed on element meta at this point.
Error: Element meta is missing one or more of the following
attributes: itemprop, property.
Error: Attribute name not allowed on element meta at this point.
Error: Element meta is missing one or more of the following
attributes: itemprop, property.
Error: Element link is missing required attribute property.
Error: Attribute name not allowed on element meta at this point.
Error: Element meta is missing one or more of the following
attributes: itemprop, property.
Error: Attribute name not allowed on element meta at this point.
Error: Element meta is missing one or more of the following
attributes: itemprop, property.
Error: Attribute name not allowed on element meta at this point.
Error: Element meta is missing one or more of the following
attributes: itemprop, property.
Error: Element title not allowed as child of element body in this
context. (Suppressing further errors from this subtree.)
Error: Element style not allowed as child of element body in this
context. (Suppressing further errors from this subtree.)
Error: Stray end tag head.
Error: Start tag body seen but an element of the same type was already
open.
Fatal Error: Cannot recover after last error. Any further errors will
be ignored.
( https://validator.w3.org/#validate_by_uri )
And stream of messages in IE F12 Developer Tools console:
HTML1527: DOCTYPE expected. Consider adding a valid HTML5 doctype: "<!DOCTYPE html>".
HTML1502: Unexpected DOCTYPE. Only one DOCTYPE is allowed and it must occur before any elements.
HTML1513: Extra "<html>" tag found. Only one "<html>" tag should exist per document.
HTML1503: Unexpected start tag. HTML1512: Unmatched end tag.
Everything caused by one BOM at the beginning. And Debugger shows one black rhombus in the first line.
Files saved with signature, but not assembled by php don't cause such errors and black diamonds are not vissible in IE debugger. So perhaps php transforms BOM somehow. It seems that main php file must be saved with signature to see this.
Those strange characters occur at the beginning and/or on the borders of files merged with include_once() and are not visible when files are saved before without signature. This is why it points at BOM involvement.
I have noticed this everything day before yesterday when started converting my website to HTML5 and validating.
BOM can also create a small indent at the beginning of line. Two files containing identical text but one with indent.