Tutorial básico de HTML desde cero - Video 1: Introducción.
Summary
TLDREste video tutorial ofrece una introducción al diseño web, enseñando desde los fundamentos cómo crear un sitio web utilizando HTML. Aprenderemos a usar el lenguaje de marcado de hipertexto, construir páginas básicas y ver en tiempo real los resultados de nuestro trabajo. Se destaca que HTML es la base de la mayoría de los sitios web y que, aunque crear sitios más complejos requiere más esfuerzo, el proceso es simple y se puede hacer desde cero con un editor de texto y un navegador. Se menciona también que, aunque existen múltiples tecnologías, HTML es esencial para avanzar en el aprendizaje de CSS, JavaScript y otros lenguajes.
Takeaways
- 🌐 Aprenderemos a crear sitios web desde sus fundamentos utilizando HTML en este videocurso.
- 📝 HTML es el lenguaje de marcado de hipertexto y es la base de casi todos los sitios web.
- 🎨 El diseño y desarrollo web son divertidos ya que puedes ver en tiempo real el resultado de tu trabajo.
- 💻 Para crear un sitio web, solo necesitas un editor de texto y un navegador web.
- ✍️ Un editor de texto es un programa para crear o modificar texto plano, como el Bloc de Notas en Windows o TextEdit en Mac.
- 📁 Al guardar un archivo, asegúrate de usar la extensión .html para que se reconozca como una página web.
- 🌐 Un navegador web es un programa que permite ver sitios web y navegar por Internet.
- 🔄 Para ver los cambios en tu sitio web, debes refrescar el navegador para que cargue la versión más reciente del archivo.
- ⏫ Al trabajar con HTML, es común utilizar el atajo del teclado para refrescar la página (Ctrl + R en Windows, Cmd + R en Mac).
- 🔧 Crearás y editarás documentos HTML en los próximos tutoriales, aprendiendo paso a paso sobre cada parte del desarrollo web.
Q & A
¿Qué se aprenderá en el videocurso mencionado en el guion?
-Aprenderemos desde sus fundamentos cómo usar el Hypertext Markup Language (HTML) y progresaremos para construir páginas web básicas.
¿Por qué es importante aprender HTML para el diseño y desarrollo web?
-HTML es la base de casi todos los sitios web, independientemente de su tamaño, y aprenderlo te preparará para avanzar con otras tecnologías como CSS y JavaScript.
¿Qué es un editor de texto y qué tipos se mencionan en el guion?
-Un editor de texto es un programa para crear o modificar texto plano. Se mencionan el Bloc de Notas para Windows y TextEdit para Mac.
¿Por qué es recomendable usar un editor de texto simple en lugar de programas más avanzados como Microsoft Word?
-Los programas avanzados pueden agregar estilos y formatos adicionales que no son visibles y que pueden hacer que el archivo HTML no funcione correctamente.
¿Cómo se guarda un archivo HTML según el guion?
-Se guarda con una extensión .html, y en el ejemplo se guarda como 'index.html.bak.bak' en una carpeta específica para los archivos del curso.
¿Qué es un navegador y qué navegadores se mencionan en el guion?
-Un navegador es un programa que permite ver sitios web y navegar por Internet. Se mencionan Internet Explorer para Windows, Safari para Mac, y se mencionan alternativas como Google Chrome y Firefox.
¿Cómo se abre un archivo HTML en el navegador según el procedimiento descrito?
-Puedes ir al menú principal del navegador, seleccionar 'archivo', luego 'abrir' y elegir el archivo, o simplemente hacer doble clic en el archivo HTML para abrirlo con el navegador predeterminado.
¿Qué sucede si deseas hacer cambios en tu texto HTML después de haberlo visualizado en el navegador?
-Abres el editor de texto nuevamente, haces los cambios en el archivo HTML, guardas el archivo y refrescas el navegador para ver los cambios actualizados.
¿Qué atajo del teclado se puede usar para refrescar una página en Windows y Mac?
-En Windows se usa Control + R y en Mac se usa Comando + R.
¿Cuál es la importancia de refrescar el navegador al editar páginas web?
-Al refrescar el navegador, se actualiza la página para mostrar la versión más reciente del archivo, permitiendo ver los cambios realizados en el código HTML.
Outlines
🌐 Introducción al Diseño Web con HTML
Este primer párrafo presenta un curso de video para aprender a crear sitios web desde cero utilizando HTML. Se menciona que el curso cubrirá desde los fundamentos del lenguaje de marcado de hipertexto hasta la construcción de páginas web básicas. Se destaca la capacidad de ver resultados en tiempo real en el navegador, lo cual es emocionante para los principiantes en diseño y desarrollo web. Además, se enfatiza que HTML es la base de casi todos los sitios web y que el aprendizaje de esta tecnología abrirá puertas para aprender otras como CSS y JavaScript. Se sugiere que incluso si alguien nunca ha creado un sitio web antes, este curso lo hará posible. Para comenzar, se recomienda un editor de texto simple y un navegador web, y se da un breve tutorial sobre cómo crear y guardar un archivo HTML con contenido básico como 'Hola mundo'.
🔄 Editar y Ver Cambios en Sitios Web
El segundo párrafo continúa explicando el proceso de edición y visualización de cambios en un sitio web. Se describe cómo, si se desea hacer cambios en el texto de una página web, se debe volver a abrir el archivo HTML en el editor de texto, realizar los cambios y guardar el archivo. Luego, se puede refrescar el navegador para ver los cambios reflejados. Se da un consejo práctico sobre el uso del atajo de teclado para refrescar la página (Ctrl + R en Windows, Comando + R en Mac), lo que ahorra tiempo y es útil a medida que se avanza en la creación y edición de documentos HTML. El párrafo concluye con una promesa de explorar en detalle cada parte del proceso de creación de sitios web en futuras lecciones del curso.
Mindmap
Keywords
💡Sitio web
💡HTML
💡Editor de texto
💡Navegador
💡Hola mundo
💡Extensión .html
💡CSS
💡JavaScript
💡Refrescar
💡Atajo del teclado
Highlights
Aprenderemos desde sus fundamentos cómo usar el Hypertext Markup Language (HTML).
Se explorarán todos los detalles técnicos en el uso de HTML y se construirán algunas páginas básicas.
El aprendizaje en diseño y desarrollo web es divertido ya que se pueden ver resultados en tiempo real.
HTML es la base de casi todos los sitios web, independientemente de su tamaño.
Después de aprender HTML, se estará listo para seguir adelante con otras tecnologías como CSS y JavaScript.
No existe una sola tecnología que permita crear sitios web modernos, sino una variedad de tecnologías que se combinan.
Para crear un sitio web, se necesita un editor de texto y un navegador.
Un editor de texto es un programa que permite crear o modificar texto plano.
Se debe usar un editor de texto simple para evitar problemas con el formato del archivo HTML.
Se puede usar el Bloc de Notas en Windows o TextEdit en Mac para crear archivos HTML.
Guardar el archivo con la extensión .html es esencial para que se reconozca como una página web.
Un navegador es un programa que permite ver sitios web y navegar por Internet.
Se pueden usar diferentes navegadores como Internet Explorer, Google Chrome, Firefox o Safari.
Los cambios en el archivo HTML se pueden ver reflejados en el navegador después de refrescar la página.
Se puede usar el atajo de teclado Control + R en Windows o Comando + R en Mac para refrescar la página rápidamente.
El vídeo brinda un pequeño tip para refrescar la página de manera eficiente durante el desarrollo web.
Se aprenderá más sobre HTML en los siguientes videotutoriales, explorando cada parte de la creación de un sitio web detalladamente.
Transcripts
Entonces tú quieres crear un sitio web
pero no tienes ninguna idea de cómo
hacerlo en este videocurso Vamos a
aprender desde sus fundamentos Cómo usar
el hypertext markup Language o como
comúnmente lo conocemos html mientras
avancemos en el videocurso aprenderemos
todos los detalles técnicos en el uso de
html y construiremos algunas páginas
básicas algo que hace muy divertido el
aprendizaje en el diseño web y
desarrollo web es que podemos ver en
tiempo real el resultado de nuestro
trabajo Incluso si nunca antes has
realizado un sitio web o tocado código
html creo que te sorprenderás de qué tan
simple es hacer que tu contenido
aparezca en un navegador html es
prácticamente la base de casi todos los
sitios web no importando Qué tan grande
o pequeño sea así que cuando termines de
aprender html te encontrarás listo para
seguir adelante con otras tecnologías
como css ya Script y muchas otras como
aprenderemos no existe una tecnología o
lenguaje individual que nos permita
crear sitios web modernos o aplicaciones
web más bien existe una variedad de
tecnologías que combinadas nos permiten
crear un sitio web muy completo si nada
de lo que he dicho antes tiene sentido
para ti no te preocupes Vamos a ir paso
a paso después de este vídeo vamos a
iniciar con una introducción más
profunda sobre html como lenguaje Pero
antes de eso vamos a ver rápidamente
Cómo Funciona en la práctica y crearemos
nuestra primera página web para crear un
sitio web todo lo que necesitas es un
editor de texto y un navegador vamos a
iniciar con el editor de texto un editor
de texto es simplemente un programa que
tiene la capacidad de crear o modificar
texto plano y todas las computadoras
vienen con un editor de texto Si usas
Windows entonces puedes usar el bloc de
notas Si usas Mac puedes usar Tex edit
el cual lo encontrarás en el directorio
de aplicaciones pero debes tener cuidado
ya que un editor de texto más avanzado
Como por ejemplo Microsoft Word o page
and Mac van a colocar reglas de estilo
extras en el texto y otro tipo de
información que no podemos ver eso hará
que tu archivo html no funcione
correctamente de modo que debes
asegurarte en usar un editor de texto
simple como hemos dicho el bloc de notas
en Windows y el text edit en Mac
funcionan correctamente para nuestro
propósito una vez tenemos el editor de
texto abierto puedes añadirle contenido
como lo harías normalmente vamos a
colocar por ejemplo la frase Hola mundo
que es una frase muy usada para hacer
pruebas luego guardaremos nuestro
archivo en un lugar donde no nos
olvidemos que lo tenemos y vamos a
asegurarnos de guardarlo con la
extensión
html Así que vamos a guardar nuestro
archivo en este caso le he creado una
carpeta para para todos los archivos que
vamos a ir creando en este videocurso y
para guardarlo voy a colocar el nombre
de index.html.bak.bak
dejar el editor de texto abierto ya que
lo vamos a necesitar nuevamente ahora
vamos a hablar sobre el navegador un
navegador es un programa que te permite
ver sitios web y navegar por internet Si
usas Windows el navegador que trae
preinstalado es Internet Explorer
existen otros navegadores alternativos
que puedes usar como por ejemplo Google
Chrome o mochilla firefox pero
hablaremos de esto después si te
encuentras en Mac el navegador que traes
preinstalado se llama Safari el
navegador que yo usaré probablemente sea
diferente al que tú usas pero si la
página web no tiene errores de código
Entonces se verá similar en la mayoría
de navegadores de hecho como lo
descubriremos Eso es parte de la belleza
del diseño web vamos ahora a entrar en
nuestro navegador en mi caso usaré
mozilla firefox nuevamente te recuerdo
de que puedes usar el navegador que más
te guste o el que uses regularmente una
vez tengas tu navegador abierto puedes
ir hacia la opción de abrir que en este
caso se encuentra en el menú principal
de firefox en la parte superior damos
clic en archivo luego en abrir y
seleccionamos nuestro archivo para abrir
nuestra página también podemos
simplemente ir a nuestro archivo html y
dar doble clic sobre él eso también
abrirá nuestro archivo en el navegador
que tengamos por defecto en tu navegador
debes poder ver el texto que hemos
colocado anteriormente en el editador de
texto eso fue muy fácil verdad podrás
notar que crear páginas web html más
grandes es un poco más complejo que esto
pero en general y especialmente en los
días en los que el internet se
encontraba aún en pañales un sitio web
simplemente era una colección de
archivos en html archivos similares a
cualquier otro documento o archivo en tu
computadora dentro del navegador serás
capaz de seleccionar el texto pero no
podrás modificarlo Entonces qué pasaría
si deseo hacer un cambio en mi texto Eso
es en realidad muy simple si cerraste
antes tu editor de texto Ábrelo
nuevamente y abre el archivo html en el
que estábamos trabajando primero vamos a
Añadir otro texto que dirá esta vez mira
lo que puedo hacer y luego vamos a
guardar nuestro archivo nuevamente ahora
vamos a regresar al navegador y todo lo
que tengo que hacer es dar clic en el
botón de refrescar al dar clic en el
botón de refrescar le estamos diciendo
al navegador que cargue nuevamente el
archivo de de modo que nos muestra la
versión más reciente de nuestro archivo
de modo que si hacemos cualquier cambio
refrescar el navegador nos permite ver
los cambios que hemos realizado antes de
terminar este vídeo deseo darte un
pequeño tip cuando damos clic en
refrescar podemos ver los cambios que
hemos realizado reflejados en el
navegador en el transcurso de los
siguientes videotutoriales en los que
crearemos y editaremos documentos html
podrás notar que usamos mucho la función
de refrescar el navegador para ver nu
nuestros cambios y será bueno para
ahorrarnos algo de tiempo usar el atajo
con el teclado para realizar el
refrescado de la página si te encuentras
usando Windows puedes refrescar la
página presionando control + r si te
encuentras en Mac puedes presionar
Comando + r esto
refrescarán y de esta forma has logrado
realizar tu primera página web hacer que
nuestro propio contenido aparezca en el
navegador es muy fácil pero claramente
crear sitios web más complejos requerirá
un poco más de trabajo y Como he
mencionado anteriormente vamos a ver
cada una de las partes de la creación de
un sitio web una por una con detalle en
el siguiente vídeo aprenderemos un poco
más sobre
[Música]
html
[Música]
[Música]
ah i
Weitere ähnliche Videos ansehen
5.0 / 5 (0 votes)