Make it a real page · Conviértelo en una página real
This page needs a recent browser (with SharedArrayBuffer support). Please update Chrome, Edge, Firefox or Safari to the latest version. · Esta página necesita un navegador reciente (con soporte para SharedArrayBuffer). Por favor, actualiza Chrome, Edge, Firefox o Safari a la última versión.
English
A real web page
- So far you wrote pieces of HTML. A full page wraps them in a frame.
- That frame is almost the same on every web page in the world.
- Let's meet it once — then it becomes a habit.
Español
Una página web real
- Hasta ahora has escrito fragmentos de HTML. Una página completa los envuelve en un marco.
- Ese marco es casi idéntico en cada página web del mundo.
- Conozcamos una vez — y se convertirá en hábito.
English
The four parts
<!DOCTYPE html>— the first line. It says: this is modern HTML.<html>— wraps the whole page.<head>— hidden information about the page (like its<title>).<body>— everything you see on the page.
Español
Las cuatro partes
<!DOCTYPE html>— la primera línea. Indica: esto es HTML moderno.<html>— envuelve la página completa.<head>— información oculta sobre la página (como su<title>).<body>— todo lo que ves en la página.
Explore · Explorar
The page skeleton as a tree · La estructura de la página como un árbol
Every page is a tree: <html> holds · contiene <head> (setup) and <body> (what you see). · Cada página es un árbol: <html> contiene <head> (configuración) y <body> (lo que ves).
<!DOCTYPE html>
<html>
<head>
<title>My first page</title>
</head>
<body>
<h1>Hello!</h1>
<p>This is a real web page.</p>
</body>
</html>
English
The title shows in the tab
- The
<title>does not appear on the page itself. - It is the name shown on the browser tab and in search results.
- Every page should have one.
Español
El título aparece en la pestaña
- El
<title>no aparece en la propia página. - Es el nombre que se muestra en la pestaña del navegador y en los resultados de búsqueda.
- Cada página debería tener uno.
English
Common mistakes
- A page needs
<html>, a<head>and a<body>. - The tab title comes from
<title>inside<head>.
Español
Errores comunes
- Una página necesita
<html>, un<head>y un<body>. - El título de la pestaña proviene de
<title>dentro de<head>.
English
Now you try
- Notice how
<head>and<body>sit inside<html>. - Add a title, then give a page its doctype line.
Español
Ahora tú prueba
- Fíjate en cómo
<head>y<body>están situados dentro de<html>. - Añade un título, luego proporciona a la página su línea de doctype.
Give the page a title. Add <title>My Page</title> inside the <head>. · Darle un título a la página. Agregar <title>My Page</title> dentro del <head>.
Start this page properly. Add <!DOCTYPE html> as the very first line. · Inicia esta página correctamente. Añade <!DOCTYPE html> como la primera línea.