Cómo crear una página web sencilla usando solo un editor de texto
Aprende a construir tu primera página web desde cero usando únicamente un editor de texto básico y código HTML.
- Qué necesitas para empezar. Solo necesitas dos cosas: un editor de texto básico (como Bloc de notas en Windows o TextEdit en Mac) y un navegador web (Chrome, Firefox, Safari). El editor de texto te servirá para escribir el código, y el navegador para ver cómo se ve tu página. No necesitas conexión a internet para crear y probar tu página en tu propia computadora.
- Crear tu primer archivo HTML. Abre tu editor de texto y escribe esta estructura básica: <!DOCTYPE html> seguido de <html>, luego <head> con <title>Mi primera página</title> y </head>, después <body> con <h1>¡Hola mundo!</h1> y <p>Esta es mi primera página web.</p>, y finalmente cierra con </body> y </html>. Guarda el archivo con el nombre 'mipagina.html' asegurándote de que termine en .html, no en .txt.
- Abrir tu página en el navegador. Una vez guardado tu archivo, busca donde lo guardaste en tu computadora. Haz clic derecho sobre el archivo 'mipagina.html' y selecciona 'Abrir con' seguido del nombre de tu navegador preferido. Tu página aparecerá en el navegador mostrando el título y el texto que escribiste. ¡Felicidades, acabas de crear tu primera página web!
- Agregar más contenido a tu página. Regresa a tu editor de texto para añadir más elementos. Puedes agregar más párrafos con <p>, hacer listas con <ul> y <li>, insertar enlaces con <a href='dirección'>texto del enlace</a>, o añadir imágenes con <img src='nombre-imagen.jpg'>. Cada vez que hagas un cambio, guarda el archivo y refresca la página en tu navegador para ver los cambios.
- Darle estilo básico a tu página. Para que tu página se vea más bonita, puedes agregar estilos básicos dentro de la sección <head>. Añade <style> y dentro puedes escribir reglas como 'body { font-family: Arial; }' para cambiar la letra, o 'h1 { color: blue; }' para cambiar el color del título. No olvides cerrar con </style>. Experimenta con diferentes colores y tamaños hasta que te guste cómo se ve.
- Revisar y corregir errores. Si tu página no se ve como esperas, revisa que todas las etiquetas estén bien escritas y cerradas correctamente. Cada etiqueta que abres con < debe cerrarse con </, por ejemplo <p> se cierra con </p>. Si ves texto extraño en lugar de tu página, verifica que guardaste el archivo con la extensión .html y que lo abriste con el navegador, no con el editor de texto.