Niveles

Inexperto - Empezar


Recursos (Windows)

1. Para empezar, lo primero es conseguir un Editor de páginas Web, gratuito. El mejor se llama Visual Estudio Code (VScode), lo descargas pulsando aquí, lo instalas, si a todo y a empezar. Vídeo de VScode, aquí.

2. Conseguir un Internet local en tu ordenador, se llama servidor local, y solo funciona en tu PC. Sugiero la aplicación llamada xampp, lo descargas aquí, lo instalas, lo abres, y pulsas en "Star" - Apache, y ya lo tienes. Video de xampp, aquí.

Todo archivo que pongas en el directorio "C:\xampp\htdocs" funcionará en tu server local, solo en tu PC. Internet en tu PC sirve para crear páginas, y cuando estan listas, subirlas al Internet mundial.

3. Hacer tu primera página web, funcional. (Hola Mundo)
En el navegadors escribes "Localhost/index.html", y tiene que aparecer tu página.

Da igual que no entiendas nada, sigue las indicaciones, y ya veras que facil es empezar. Sobre todo empezar por el vídeo de VScode.

Tu primera página con solo una línea que diga "Hola Mundo", es el principio y la puedes ir mejorando hasta niveles muy altos. Podrás crear tus enlaces, tu página de contraseñas, tus fotos, tus notas, tus vídeos, lo que quieras..


Tarea inicial

Vas al directorio "C:\xampp\"

Arrastras la carpteta "xampp" al editor VScode, y ya te aparece en la columna de ficheros (Izquierda), con todos los ficheros que haya en esa carpeta.

En VScode creas el fichero "index.html" y pegas el siguiente código.

<html>
<head>
<title>Mi página</title>
</head>
<body
Hola Mundo. (Aquí el contenido visible)
</body>
</html>

En tu navegador escribes "localhost/index.html" y ya debe aparecer tu primera página Web.

En el editor VScode, con un poco de práctica escribiras esta estructura Web (Mas completa) con solo pulsar la tecla "!". Facilísimo.


Enlaces (Links)


Enlaces
<a href="https://pagina2.html">Texto visible</a>

A fichero en otra carpeta
<a href="https://carpeta/pagina3.html">Texto visible</a>

Salir de carpeta, a fichero base "index.html"
<href="https:../index.html">Texto visible</a>

Enlace externo, en otra ventana
<a href="https:youtube.com" target="_blank">Youtube</a>

Ruta absoluta es https.. Pulsa para ir a Youtube
Ruta relativa es sin el https.. "carpeta/fichero.html"

En el editor, solo pulsar la tecla "a" + Intro, ya aparece el texto completo de enlace, solo hay que añadir la dirección (Url).

Imágenes

En editor Vsc, pulsas "img" y ya aparece el código

Recomendado

Vídeo de html5

Web de w3School html5

A Practicar y estudiar.. Hasta que salga casi de memória.