How to fix the font issue in HTML? - html

I have Html (hello.html) like bellow
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Test</title>
</head>
<body>
<div>
¿Hola cómo está?
</div>
</body>
</html>
It shows out as "¿Hola cómo está?" when run in browser
Is there any solution to get correct out put without altering the
hello.html file?
I hope that, it is in Spanish language but i looking for any other solution like as change the encode type or font in browser or editor.

Edit: Just noticed the requirement. But some Spanish characters require Unicode and you have to declare that in your html file.
Put this in your head.
<meta http-equiv="content-type" content="text/html;charset=utf-8" />

I don't see whats wrong, if you are refering to the font type in the html and the webpage is different is because of your editor, if you really want to change the font you will need to set the font tag around your text or even better define it in the CSS

Based on the clarification in the comment section to your question....
If you are using Google Chrome, and your computer is set to an English locale, load the page, then right click on the body, and select "Translate to English."
Sounds like an interview trick question, rather than a programming one.

No.
You cannot do this without altering the html file.

Place this <meta> tag in your Head Section
<meta charset="UTF-8">

Related

<Title> doesn't behave like it should (I think) in HTML5

I am learning HTML5 (so don't judge me) and I came across something that doesn't make much sense to me.
How come that when I put the title after the meta bit like this, it doesn't become a title and somehow acts like it is in the body and not the head. If I put the title before the meta bit like this, it works as it is supposed to.
Hope you didn't have a stroke reading this as I am a beginner and not even close to good at explaining things. I'm also new to this website btw.
Many thanks,
Nathan
Its just a typo in your code, and kindly add your code in text format and refrain from adding pictures of your code.
Just close the meta tag on line 5 of your code and you're good to go.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="This is an awesome website">
<title>Welcome!</title>
</head>
<body>
<h1>POG WEBSITE!</h1>
</body>
</html>

How can I show following text in html textarea?

I have a String like the following. Please take a look:
I put it as a image, this is not displaying in here too. If I put that String here it becomes the following:
21154537878887GHE\u0044\u0045
Now my question: is there any way to put the original String into an HTML <textarea> without changing the encoding?
I think you must define your char set in the head.
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>untitled</title>
<meta name="generator" content="TextMate http://macromates.com/">
<meta name="author" content="denis kohl">
<!-- Date: 2014-09-04 -->
</head>
<body>
Try adding the attribute accept-charset="UTF-8" to the HTML form element that contains the textarea. Then parse the encoded value via JavaScript. For example:
HTML:
<form accept-charset="UTF-8">
<textarea id="textBox"></textarea>
</form>
JavaScript:
document.getElementById("textBox").value = "21154537878887GHE\u0044\u0045";
<textarea name="Input" cols="36" rows="5" wrap="virtual">
Could you try to define the wrap method, you can choose:
wrap: off, virtual, hard, physical, soft
The Textarea formatting looks nothing like they originally intended. Typically, all the Textarea text will squashed into a single paragraph with none of the original line breaks or spacing in evidence.
The reason for this is that the CGI program (to handle the text in the textbox) has to specify a MIME Type when they are preparing the email or other document and many of these programs elect to use a MIME Type of "text/html" so that they can use HTML formatting to make the email or document more presentable. The problem with this approach is that the contents of an HTML Textarea input box require the use of a MIME Type "text/plain" otherwise the Textarea formatting will not display properly in the final output.
<meta http-equiv="Content-Type" content="text/plain; charset=utf-8">
Knowing the above I hope this will help you to find the solution.
Do this:
<textarea>211&#001c;545&#001c;378887GHE\u0044\u0045</textarea>
Note that what happens when this is rendered is that all the characters that can be displayed in the chosen (in css) font are displayed normally, while most browsers fall back to the Unicode BMP Fallback Font (http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&item_id=UnicodeBMPFallbackFont) which simply fills in the gaps in whatever font you might be using. The exact result will be browser-dependent.

Sticky Header position multi language site

I messed up something on a multilingual site in the css (?) files so that the header of repucom.net/de , repucom.net/fr and repucom.net/pt is no longer on the top. On the english and japanese sites, repucom.net and repucom.jp, it stays on top.
I have no clue how I messed this up and would gratefully appreciate any help whereabout I should start digging into.
Fiddle for the working site (not sure if I did this right, if I should change anything - please let me know): http://jsfiddle.net/bn85y/1/
Fiddle for the non-working site: http://jsfiddle.net/zBbw5/
Html Example non working site:
<head profile="http://gmpg.org/xfn/11">
<title>REPUCOM</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="http://repucom.net/de/wp-content/themes/repucom-de/style.css" />
<div id="header">
<div id="branding">
</div><!-- #branding -->
</div><!-- #header-->
You need to save your file encoded as as UTF-8 without BOM, and that's gonna solve the issue. You'll probably find that option in your text editor.
For example if you're a Sublime Text user you'll find the option going to File>Save with Encoding>UTF-8.
You can always detect this kind of things running the W3C validator:
http://validator.w3.org/check?uri=repucom.net%2Ffr
Please, check that right after the opening <body> tag there is an empty string. If you remove it, the header will position itself correctly.

Is title tag position relevant in html pages?

I'd like know if having the title tag positioned at the end of <head> tag or in any other position, always inside the <head></head>, can lead to some kind of problem, I'm not talking about SEO stuffs, I'm talking about standards, browser rules, web application rules, or something like this.
I'd like to load a page from two different php file like this, is it a wrong way?
<!-- file1.php -->
<html>
<head>
....
<!-- file2.php -->
<title><?php echo($var)?>
</head>
<body>
...
<head> tag is not closed, because with e second file I dynamically add the <title>
tag
The title must be in the <head>
If you use non-ASCII in it then it really should be after any <meta> that specifies character encoding.
Since it is important, it is probably a good idea to put it near the top of the <head> so it gets picked up by tools that only grab the first $n bytes of the document.

HTML5 Validation Error: body start tag seen but an element of the same type was already open

I was hoping that someone may know how to resolve this HTML5 validation error. When I try to validate my page: http://blog.genesispetaluma.com using http://validator.w3.org, it gives me the following error code:
Error Line 90, Column 63: An body start tag seen but an element of the same type was already open.
<body class="home blog single-author two-column right-sidebar">
I interpreted this error to mean that I have two body tags in the code. However, I have searched everywhere and can only find one <body> (the one referenced by the error) and one </body>. Can anyone please tell me how to resolve this error?
I had a similar problem but with <head>, giving the following W3C markup error:
A head start tag seen but an element of the same type was already open
I had this code:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<head>
When it was supposed to be:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
I knew that was wrong but it's hard to spot sometimes, as you're just so used to the header code being correct 99% of the time. I obviously cut n pasted some code and that ended up in the wrong place.
This isn't specific to your question, I know, as your error relates to the <body> tag, but this is the kind of thing you're looking for. Maybe you have a <link> or <meta> tag in your body somewhere, that's meant to be in the <head>. Without seeing your code, it's hard to give you a perfect answer.
Possibly it's because:
<div id="wrapFix">
<div id="drawLogo1">
<div id="drawLogo2">
<img src="http://genesispetaluma.com/img/logoNew.png" alt="Genesis Fitness G stylelogo">
</div>
</div> <!-- end of drawLogo1 -->
Is between your closing head tag and opening body tag. I.e. lines 81-87
One of the widgets (the facebook like button I believe) you're using is inserting HTML into the page and part of that HTML is a body tag. Not sure if there's anything you can do about this, but I think that's what's throwing the error. Looks like this:
<body class="plugin transparent_widget ff4 win Locale_en_US">
</html>
</iframe>
I got this error:
A head start tag seen but an element of the same type was already open
I read this post and then i noticed my tag listed before the head like this.
<title>Home</title>
<head>
</head>
it should have been
<head>
<title>Home</title>
</head>
It happens in below said scenarios as per my knowledge -
When you mistakenly choose <head> thinking <header> tag.
When your <header>, <nav>, <section> or <footer> tag(s) are outside of <body> tag.
So, after creating your page, you can validate these changes here.
I got the same error message : check out if any body-inside <element> is displayed between the <head> and <body>, like said above.
My error was caused by a <div> tag, with absolute position, to display some page information during the development - simply a line on a false position in the code.
Hi in my case hgroup tag is the reason why I'm having validation error I, remove this tag from head tag and put it inside after body tag after this the document is now valid.
Just for the record, I had exactly the same problem and it seems that including some php files within the head element was strangely giving the problem, even if the view-source of Firefox was not printing such php code nor tags
<head>
<? include("./file.php"); ?>
<title><? echo $title ?></title>
</head>
solved using:
<? include("./file.php"); ?>
<!DOCTYPE html>
<html>
<head>
<title><? echo $title ?></title>
</head>
<body>
...
...
If Your problem With head and body both are show validate error just remove displaying text from head and keep it in body..
I have been faces the problem recently.
For Example You have text to display in header inside head just remove header from head and keep it in body ......Problem solved...Thanks
In my case it was the facebook tag
<div id="fb-root"></div>
which was inside the page's <head>.
Moved that to the <body> of the relevant page (not required globally) sorted it. So yes, the answer supplied above by Emil H was correct.
Also bear in mind, if you copy/paste your code from things like slack, etc. they will have 'special characters' for formatting (that are usually invisible) which may cause that issue.
Here is a video to demonstrate: https://drive.google.com/file/d/1OJS15zmSvzhVXVLcQGGhePZGNCxWHocN/view
This error can happen if you put into <head> tag that restricted to be there. For example:
<head>
<audio preload="auto" class="menu-beep" id="sound-01">
<source src="sound-01.mp3">
</audio>
</head>
In this case, the tag will be immediately opened in the browser memory. But later the browser will find the body tag that opens the page. This is how it turns out that there is a second body tag.
I had similar problem with <head> tag. I use https://validator.w3.org
Look at few examples how to solve this problem:
<script> should be inside <head>
css should be inside <head>