Misplaced relative link (HTML) - html

First post here... I'm working on The Odin Project's Foundation course and I'm having some trouble accessing a relative link. The course instructs the student to create a new directory, "pages", within the existing directory, "odin-links-and-images", and create an html file (second portion of code below) in "pages", that is linked in "odin-link-and-images". For some reason, when I open the first portion of code in my browser, it won't link the pages directory. Not sure if I messed something up when creating the new directory, but as soon as I moved the code to "pages", the link appeared missing or broken
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h1>Homepage</h1>
click me
About
</body>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Odin Links and Images</title>
</head>
<body>
<h1>About Page</h1>
</body>
</html>

Related

Quotation marks inside <pre> element showing as “ or similar character

I'm just trying to post a simple html file consisting mainly of some prose I wrote inside of <pre> elements.
Interestingly, when I view the file on my computer with my browser, the quotation marks display fine. But when I upload it to my website, quotation marks are rendered as something like “ or â€. I have looked around the web for solutions but they were few and in between.
I tried to use the meta tag and included
<meta http-equiv="Content-Type" content="text/html; charset="utf-8" />
to my header but to no avail. Any ideas on how to solve this? It just wouldn't make sense to go back to the content inside the elements and code it into html as the prose is a draft and will go through many changes in the future.

The <!doctype html> tag indicates the file is HTML5 - so the browser will render it as such. lang="en" should be set to the language you are working with. Be sure to use the <meta charset="utf-8"> tag to set the character set in the <head>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Template</title>
</head>
<body>
<pre>This is my stuff</pre>
</body>
</html>
Check your code with the browser's View Source and use the Validator at https://validator.w3.org/ to check the page.

Here what I tried.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<pre>Einstein said,"Once you stop learning, you start dying"</pre>
</body>
</html>
I also tried only this
<body>
<pre>Einstein said,"Once you stop learning, you start dying"</pre>
</body>
Still working

Trying to create a theme for blogspot using WYSIWYG web builder, it runs on https://www.w3schools.com/ but not on blogger HTML theme editor

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Page</title>
</head>
<body>
<div id="wb_Text1" style="position:absolute;left:458px;top:19px;width:156px;height:16px;z-index:1;">
<span style="color:#000000;font-family:Arial;font-size:13px;">This is My First Post</span></div>
<div id="wb_Text2" style="position:absolute;left:338px;top:60px;width:509px;height:32px;z-index:2;">
<span style="color:#000000;font-family:Arial;font-size:13px;">If i am looking at it<br>that means i
am able to create the theme correctly using webbuilder</span></div>
</body>
</html>
it runs perfectly
but fails to run on Blogger
What should i do?

Yes your code is perfect but, in blogger theme design with html you need to add "b:skin and b:section" inside that code.
And this is the sample code for blogger from your code :
Sorry if i wrong but thats all i know :)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Page</title>
<b:skin>
<!-- Your CSS Code Here -->
</b:skin>
</head>
<body>
<b:section id='Unique-Id'>
<!-- Your section content -->
</b:section>

how to encode link to google search results? (ampersand problem)

I'm trying to include a link in my page that will link directly to google search results (as opposed to linking to a predetermined search, as in this question).
I tried this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
click me
</body>
</html>
The ampersand gets mangled, the url comes out as http://www.google.com%26q%3Dsports instead of http://www.google.com&q=sports.
What's the right way to do this?

I think this is format if you want to return results in the correct manner:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
click me
</body>
</html>
But here is the good resource and a duplicate to this question if that's the case - Do I encode ampersands in <a href...>?

I uploaded my website and on of the tabs is in chinese

I uploaded my website and one of the tab(more info) is in chinese for some reason and I dont know why. here is the the url http://bushdid911.net
http://pastebin.com/jFBUV1ga

At very least, you should add
<meta charset="utf-8">
to the html's <head> section.
A (very, very) basic html template you should use is
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Page title</title>
</head>
<body>
</body>
</html>
Another reason could be that Bush did this, too. Just to create another conspiracy theory..

Where can I view my title and meta tags?

I feel really stupid, but I can't for the life of me find my title or meta tags in my source code. It just starts out
<!DOCTYPE html>
<head>
.....
</head>
<body>
...
and then continues like that. I know my title is set, because it's displaying in my tab. This link (https://help.yahoo.com/kb/yahoo-web-hosting/SLN18260.html?impressions=true) tells me the meta tags should be right under the title. So where is the title??? I just want to make sure my meta tags are printing as expected.
UPDATE:
Weird, I just found them like halfway down the page, way outside my <head>. I don't know what they're doing there, but at least I found them.

This is the procedure,
<!DOCTYPE HTML>
<html>
<head>
<title>...</title>
<meta charset="UTF-8">
<meta name="keywords" content=".." /> //if needed
<meta name="description" content=".." /> //if needed
</head>
<body>
.....
</body>
</html>

The <title></title> should be inside the <head></head> block.

Code does not automatically generate tags. Thus, to create a title and meta tag, just initiate them below the head (following convention):
<!DOCTYPE html>
<head>
<title>My Website</title>
<meta charset="UTF-8">
</head>
<body>
</body>

a proper HTML structure should be like..
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>My title</TITLE>
</HEAD>
<BODY>
......
</BODY>
</HTML>
HERE is the reference to get more ideas about HTML.