I feel stupid... my desire is to write HTML5 using XML and I can't get ANYTHING to work, for instance:
<!DOCTYPE html>
<html>
<head><title>ABC</title></head>
<body>DEF</body>
</html>
actually shows ABC on the browser canvas!
What am I doing wrong? (using FireFox 3.5.8)
You need to declare a namespace on the root element. For HTML that is http://www.w3.org/1999/xhtml. A DOCTYPE is not needed in XML.
I’m on Firefox 3.5.2. I saved the code in your question as a file (abc.html) and opened it in Firefox. “ABC” didn’t show on the browser canvas.
What mimetype are you serving it with? What file extension?
Related
Just created a simple html file in TextEdit on Mac. It looks like this.
<html>
<head>
<title>My First Web Page</title>
</head>
<body>
<h1>Welcome to My First Web Page</h1>
<p>This is an HTML page that I created in TextEdit.</p>
</body>
</html>
Afterwards I saved it using an .html extension, and tried to open this file in multiple browsers.
However, instead of displaying the correct layout, I got this same code on web page again: see the pic below.
The result persisted across all browsers and after refreshing the page, too. Though if I first saved the document as an RTF file, and later changed the extension manually to HTML, browsers displayed some stuff, but not as expected and shown in a textbook. Below the second result.
The intended result is from the textbook and is shown on the next picture.
Any ideas why doesn't Safari (or Firefox, Opera, Chrome, DuckDuckGo likewise) show the file correctly?
My first instinct is to make line 1 read <!DOCTYPE HTML> to see if that would make your webbrowser read the code as HTML instead of a plain text. Not sure if that would work, but I would try it.
The problem must have been with TextEdit, since it worked immediately and as expected after I copied the same text to Brackets.
A ascii-encoded text file is not the same as a TextEdit file. TextEdit will be using RTF by default which is more similar to a Word document doc type format than raw text. When you save the file, TextEdit is actually saving it to a RTF file containing your HTML text.
TextEdit can edit HTML but, in default mode, it writes the HTML for you from how you format the text in the editor (You might hear this called WYSIWYG)
You can change the TextEdit settings to edit the HTML file as text in TextEdit -> Settings but I feel you would be far better to find a more appropriate programmers editor to edit text. On macOS, you have the command line programs installed by default:
vim and nano or you can install a GUI based editor such as Sublime Text
There are a few properties you are missing, which should be included to enable browsers to parse the file correctly.
The following is a minimal snippet, passing https://validator.w3.org/
<!doctype html>
<html lang=en>
<head>
<meta charset=utf-8>
<title>Your Title</title>
</head>
<body>
<p>Your Content</p>
</body>
</html>
the doctype is a declaration informing the browser in which version of html the document is written in, by default html5
head is a container for metadata
meta charset=utf-8 specifies the character encoding
the rest are html tags you are probably familar with
Are you using any sort of IDE like VS Code, for instance, to write this html?
I ask because there are other html elements you are missing which the browser - no matter what browser it is - requires in order to fully render a page.
Those details are automatically populated to the minimum extent required to render an html webpage in a browser when you use an html boilerplate. That link will give you more info on WHY you need all the stuff in a boilerplate, but basically it's like a pre-fab template for your html page that already comes with all the basics you need there... just start adding content and you're off to the races.
On VS Code, you can add boilerplate by typing the ! (exclamation mark) and then enter; VS Code will open a dropdown to autocomplete this line to be boilerplate for html5 and when you hit enter, populate the page with that boilerplate.
Then you can simply copy in the content you wrote yourself, remove what is duplicate, and you should be good to go.
I am learning how to use a text editor, and I've just created my first file with it. It previews with the correct output, but when I run it in the browser, it gives me a blank page.
As you can see, the doctype and html tags are in place, as well as the head and body. I am using Visual Studio Code as my text editor. Why will this not display anything in my browser? To be clear, it does preview, just won't display in browser
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>
Are you sure? It does display on mine. Is the file saved as a .html file? Also, try opening it on another browser. If that doesn't work, try creating a new file in Notepad or something similar, save it with a .html file extension and try opening it again.
EDIT:
Try using Notepad. Check if the file is saved with a UTF-8 encoding. If that doesn't work, try installing another browser or using Edge/Safari/Internet Explorer or whatever built-in browser you have.
In case someone is still struggling with this, try saving your files before you open them. That fixed the problem for me.
Possible Reasons:
You might not have saved the changes after writing the code (most likely).
Problem with the browser (load it in another browser)
Check the extension (just for clarification)
There is no problem with !DOCTYPE html tag or html tag.
It loaded on Fire Fox, just not on Google Chrome for some reason. I'm sorry for wasting everyone's time. As I have said, I am unfamiliar with VS Code. Thank you for all of your suggestions.
I had this same baffling problem. I quit Chrome, re-opened, and then I was able to open my .html files (from my Mac's Finder) with Chrome just like I could already open them with Safari or other browsers.
I just had this problem and the solution was very simple, so I´ll give it just in case someone runs into the same silly mistake. I was typing all the code in the wrong file.
Add this line of code inside your head element:
<meta charset="UTF-8"/>
I would recommend to put the right path under the src with the correct file location
<script src="scripts/main.js"></script>
I was facing the same issue and none of the steps mentioned helped.
So I deleted the index.html file I had, opened my project folder in VS Code, created a new index.html file there, pasted my code and clicked on go live.
Then I could see my image on the webpage. And after that I could see the image even by double clicking the index.html file from Finder. Hope this helps.
Save your file in Notepad or whatever text generator you are using and then close it before launching the html file in the browser. Mine would not open if Notepad was still open.
In visual studio code just type in a blank page
html:5
then just press the touch "tab", it will display a basic html 5 structure to start
If anyone still needs help- It worked after saving the file on VS Code!
Just remove "<html>" a the second line it's already set in the first line
<!DOCTYPE html>
<head>
<title>Hello World</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>
Do I need to write <!DOCTYPE HTML> at the top of every page? I don't do it at the moment and everything seems to work fine. What is the purpose of it, if we already have <html>?
It is an instruction to the web browser about what version of HTML the page is written in. The <!DOCTYPE html> is standard for HTML 5. Hope this link help you HTML Declaration
Yes, it is. Otherwise browser will default to Quirks Mode:
References:
Why do I need a doctype? (What does it do)
Why do I need a doctype? (What does it do)
It isn't required as such, world won't end and neither will your code if you don't have it. However, it gives the browser information to what HTML version you are using and not having it can create some issues further on, especially if your sites get larger amounts of code and complexity, and thus is recommended to add to your code.
I wanted to use HTML5 localStorage in IE9 but it does not support local file system (or file://)
So I fallback to use userData behavior.
But I couldn't get it to work.
After all the testing, I figured out that if I remove the <!DOCTYPE html> at the beginning of my html, everything works!
Can someone please tell me why?
and if <!DOCTYPE html> is a must for HTML5 file?
HTML5 is not an official standard yet. If you set a doctype to a given standard, but use commands which are not part of that standard, or you use a doctype the the browser does not know, browser might not interpret these commands.
Maybe the W3C-validator http://validator.w3.org/ can help you
I am writing a simple HTML file. I would like to embed an XML in it. I do this using iFrames. In IE9 the XML is formatted (though it shows activeX warnings). If I run the same code in IE10 I do NOT see the formatting at all. I see only the XML content. However if I open the XML separately I am able to see the formatting.
How do I get the formatting in IE10 inside iframe? Thanks in advance.
Here is my HTML code
<html>
<head>
<title>Test Code</title>
</head>
<body>
<iframe src="sample.xml"></iframe>
</body>
</html>
And my sample.xml is
<?xml version="1.0" encoding="utf-8" ?>
<test>asd</test>
--
Update: Switching the browser to IE8 Standards mode works.
<meta http-equiv="X-UA-Compatible" content="IE=8" />
Is this the only solution or is there an IE10 based better solution for this?
We just had this problem, and found a bunch of questions like this with no answers! Finally we found the answer from Microsoft here: System working as designed :-(
From our friends at Microsoft:
As of IE9, IE has had native support for rendering XML content
including XHTML and SVG. To avoid conflicts with this native support,
the auto-generated tree view for XML was scoped to only apply to
top-level documents. Thus, when XML content is hosted inside an
IFRAME, a tree view will not automatically be generated by default.
However, when the browser is running in Compatibility View, IE tries
to more closely emulate the behavior of previous releases, which is
why the tree view is still displayed under these circumstances.
A php file can read the xml file then compile the xml coloring and output the html code, maybe.