Como crear tu primera página web
Páginas: 7 (1711 palabras)
Publicado: 25 de septiembre de 2015
Como crear tu primera página web, método paso por paso
1- El código HTML elemental
Para comenzar sigue los siguientes pasos:
➔ Crea en el Escritorio una carpeta llamada sitio y dentro de ella crea un nuevo documento de texto, renómbralo a index.html, asegúrate de que no tenga la extensión de archivo .txt.
Se supone que tienes desactivado en el Panel de Control -> Opciones de Carpeta -> Ocultarlas extensiones de archivo, si no te será imposible.
➔ Arrastra el archivo creado index.html encima del Bloc de notas y suéltalo, en el pegarás el código que se muestra en esta página a continuación.
Cada vez que pegues algo nuevo, guarda los cambios y ejecuta (dos clics) el archivo, que se abrirá con tu navegador instalado, de esa manera podrás comprobar como se ve tu página.
Copia y pega elsiguiente código:
Mi Primera Pagina
Esta es mi primera página web
Ya tienes tu primera página web.
Una sencilla explicación del código anterior.
Cada elemento que va entre los signos < y > es un tag o etiqueta, donde quiera que hay un tag algo sucederá en la representación del documento, algunas veces visualmente y otras de maneraoculta.
• La etiqueta le indica a tu navegador que tu documento es una página web y debe representarla como tal.
• Las etiquetas encierran el título de la página, es imprescindible su uso, se muestra en la barra superior del navegador.<br />
• Los elementos que se encuentran entre las dos etiquetas <head> que es el encabezado, contiene datos e información para el funcionamiento la página,que el usuario no ve.<br />
• En el espacio comprendido entre las etiquetas <body> es el que contiene todo el contenido que quieres visualizar.<br />
<br />
<br />
2- Agregarle un título o encabezado a la página web<br />
<br />
Ahora vamos a agregarle un titulo en letras grandes y un subtitulo, copia y pega por supuesto en la siguiente línea después del <body>:<br />
<h1>Mi Página</h1><br />
<h3>Esta es mi primera página web</h3> <br />
<br />
3- Agregarleuna imagen a la página web<br />
<br />
Ahora insertas una imagen que copiaste previamente en tu carpeta sitio y la renombraste imagen.jpg:<br />
<img src="imagen.jpg" alt="Esta es mi casa"> <br />
<br />
4- Agregarle un link o vínculo a un sitio web<br />
<br />
Ahora un vínculo que te llevara a Google o el lugar que especifiques, ponlo en la parte del <body> que gustes:<br />
Para ir a Google<br />
<br />
5- Agregartexto o contenido al cuerpo de la página<br />
<br />
Ahora le toca el texto con el contenido de la pagina (con el tag <p> le estas indicando que es un párrafo):<br />
<p>Aqui todo lo que quieras escribir.</p><br />
Despues una pequeña lista de menú con vínculos a otras páginas que crearás después en tu sitio:<br />
<ul><br />
<li>Otra pagina</li><br />
<li>Otra mas</li><br />
<li>Acerca de mi</li><br />
</ul><br />
<br />
<br />
6- Agregar el estilo CSS a la página<br />
<br />
El estilo CSS son instrucciones para darle un estilo preciso a cualquiera de los elementos que componen la página. Es posible modificar el tamaño del texto, los colores, el tipo de fuente, como se muestran las imágenes, etc.<br />
Para eso se incluyen algunas líneas encerradas entre dos etiquetas <style><br />
En este ejemplo seincluyen algunos comentarios (encerrados entre los caracteres /* */ ), solo para que se comprenda que significan los valores y se puedan modificar.<br />
<style> <br />
body{background:#b7e5ff; /*el color del fondo*/ <br />
font-size:20px; /*tamaño del texto en pixeles*/ <br />
color:black; /*color de las letras*/ <br />
padding:20px; /*el espacio entre el borde y el contenido*/ <br />
border:6px solid white; /*tamaño, forma y colordel borde de la pagina*/ <br />
} <br />
h1{color:red;} /*color del encabezado*/<br />
</style> <br />
<br />
6- Agregar la declaración<br />
<br />
Ya está casi lista la pagina solamente pegaremos el DOCTYPE al comienzo para que sea compatible con todos los navegadores y especificaremos que se debe mostrar en idioma español:<br />
<!DOCTYPE html><br />
<html lang="es"><br />
La etiqueta <br> indica un salto de línea.<br />
Finalmente rectifica como queda... <div class="paper-body__gradient paper-body__gradient--bottom paper-body__gradient--bottom-abs"></div>
<div class="center paper-body__cta--mod paper-body__cta-no-bg">
<a class="button button--large button--orange" onclick="upgradeRedirect()" rel="nofollow">
Leer documento completo </a>
<p class="ash-gray text-s">
Regístrate para leer el documento completo. </p>
</div>
</div>
</div>
</div>
</article>
</main>
<script>(function(d){var domain='buenastareas.com';if(d.referrer.match('^https?\:\/\/(|www\.)'+domain.replace('.com',"")+'\.com(.*)')){d.getElementById('stm-hero').className+=' stm-hero';d.getElementById('emptyTopicsList').innerHTML=(document.getElementById("topicsList"))?d.getElementById('topicsList').innerHTML:'';d.getElementById('text-header').innerHTML='';var sec=d.createElement('div');sec.className='section no-padding margin-2';var p=d.createElement('p');p.className='text-s uppercase ash-gray';p.innerText='Vista previa del texto';sec.appendChild(p);d.getElementById('text-header').appendChild(sec);}else{d.getElementById('stm-hero').className='';d.getElementsByTagName('article')[0].className='row no-border';}})(window.document);</script><div class="advertBox center margin-2 leaderboard_btf">
</div>
<a href="/content/access" rel="nofollow"></a>
<section class="row ">
<div class="columns position-relative
large-12">
<div class="">
<h2 class="heading-m padding-top-1 margin-2">
Estos documentos también te pueden resultar útiles </h2>
</div>
<section class="">
<ul class="unstyled">
<li class="essayPreview">
<div class="card">
<a class="heading-s black" href="/ensayos/Como-Crear-Un-Pagina-Web/30747443.html"
title="como crear un pagina web">
<h6 class="heading-s">
como crear un pagina web </h6>
</a>
<div class="card__content-footer-container ">
<p class="card__content text-s ">
...¿Qué es el credito?
El termino crédito proviene del latin creditium de creeré tener confianza. Aun cuando no existe una definición generalmente aceptada se puede definir la operación de crédito según el señor Emilio Villaseñor fuente <b><i>como</i></b> entrega de un valor actual sea dinero mercancías o servicios .sobre la base de la confianza a cambio de un valor equivalente esperando en un futuro pudiendo exixtir adicionalemente un interés pactado.
Etimológicamente y... </p>
<div class="row card__footer-links ">
<div class="columns small-6">
<a href="/ensayos/Como-Crear-Un-Pagina-Web/30747443.html"
title="como crear un pagina web"
class="card__footer text-xs">
<span>
Leer más </span>
</a>
</div>
<div class="columns small-6">
<div class="card__caption card__caption weight-300 mid-gray text-s align-right">
<div class="essay-details no-margin--bottom">
<span class="essay-details__item">503 Palabras</span>
<span class="essay-details__item">3 Páginas</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="essayPreview">
<div class="card">
<a class="heading-s black" href="/ensayos/Como-Crear-De-P%C3%A1ginas-Web-y/82208833.html"
title="Como Crear de páginas Web y">
<h6 class="heading-s">
Como Crear de páginas Web y </h6>
</a>
<div class="card__content-footer-container ">
<p class="card__content text-s ">
...<b><i>Como</i></b> <b><i>Crear</i></b> de <b><i>páginas</i></b> <b><i>Web</i></b> y/o Blogs
3 Servicios básicos para <b><i>crear</i></b> una <b><i>página</i></b> <b><i>web</i></b>
1. Registro de Dominio
El Dominio (o Domain en Inglés) es el nombre en internet que registras y reservas para tu negocio. Es un nombre único ya que nadie más a nivel mundial puede registrar el mismo nombre de dominio. Si se compara con el registro del nombre del negocio en tu ciudad o población, es el equivalente... </p>
<div class="row card__footer-links ">
<div class="columns small-6">
<a href="/ensayos/Como-Crear-De-P%C3%A1ginas-Web-y/82208833.html"
title="Como Crear de páginas Web y"
class="card__footer text-xs">
<span>
Leer más </span>
</a>
</div>
<div class="columns small-6">
<div class="card__caption card__caption weight-300 mid-gray text-s align-right">
<div class="essay-details no-margin--bottom">
<span class="essay-details__item">695 Palabras</span>
<span class="essay-details__item">3 Páginas</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="essayPreview">
<div class="card">
<a class="heading-s black" href="/ensayos/Como-Crear-Una-Pagina-Web/4910375.html"
title="Como Crear Una Pagina Web">
<h6 class="heading-s">
Como Crear Una Pagina Web </h6>
</a>
<div class="card__content-footer-container ">
<p class="card__content text-s ">
...PONTIFICIA UNIVERSIDAD CATÓLICA
DEL ECUADOR SEDE ESMERALDAS
DISEÑAR <b><i>PÁGINA</i></b> <b><i>WEB</i></b> CON DREAMWEAVER
Dreamweaver es un programa para diseño de <b><i>páginas</i></b> <b><i>web</i></b>, es una versión muy sencilla para
personas que desean diseñar su propia <b><i>página</i></b> <b><i>web</i></b> de manera fácil.
A continuación presento la forma <b><i>como</i></b> <b><i>cree</i></b> mi <b><i>página</i></b> en donde oferto el producto polvo
de cacao UONCRE.
... </p>
<div class="row card__footer-links ">
<div class="columns small-6">
<a href="/ensayos/Como-Crear-Una-Pagina-Web/4910375.html"
title="Como Crear Una Pagina Web"
class="card__footer text-xs">
<span>
Leer más </span>
</a>
</div>
<div class="columns small-6">
<div class="card__caption card__caption weight-300 mid-gray text-s align-right">
<div class="essay-details no-margin--bottom">
<span class="essay-details__item">615 Palabras</span>
<span class="essay-details__item">3 Páginas</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="essayPreview">
<div class="card">
<a class="heading-s black" href="/ensayos/Como-Crear-Una-Pagina-Web/1731179.html"
title="Como crear una pagina web">
<h6 class="heading-s">
Como crear una pagina web </h6>
</a>
<div class="card__content-footer-container ">
<p class="card__content text-s ">
...VALPARAISO
INFORMATICA
¿<b><i>COMO</i></b> ELABORAR UNA <b><i>PAGINA</i></b> DE INTERNET HTML?
EINABEL BELTRAN GONZALEZ
VALPARAISO, ZAC., 14 DE OCTUBRE DE 2010
INTRODUCCION
En este ensayo veremos <b><i>como</i></b> hacer una <b><i>página</i></b> <b><i>web</i></b> paso a paso.
Con cada uno de sus elementos y sabremos que utilidad tiene cada aspecto.
Veremos <b><i>como</i></b> dar publicidad a la <b><i>pagina</i></b> y muchas cosas mas de utilidad para nuestro beneficio.... </p>
<div class="row card__footer-links ">
<div class="columns small-6">
<a href="/ensayos/Como-Crear-Una-Pagina-Web/1731179.html"
title="Como crear una pagina web"
class="card__footer text-xs">
<span>
Leer más </span>
</a>
</div>
<div class="columns small-6">
<div class="card__caption card__caption weight-300 mid-gray text-s align-right">
<div class="essay-details no-margin--bottom">
<span class="essay-details__item">643 Palabras</span>
<span class="essay-details__item">3 Páginas</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="essayPreview">
<div class="card">
<a class="heading-s black" href="/ensayos/Como-Crear-Un-Pagina-Web/1767029.html"
title="Como crear un pagina web">
<h6 class="heading-s">
Como crear un pagina web </h6>
</a>
<div class="card__content-footer-container ">
<p class="card__content text-s ">
...Edo Aragua
Metodología para elaborar una <b><i>Pagina</i></b> <b><i>Web</i></b>
Alumna:
Daniela Lizardo #02
4°B
Prof. Carli Zambrano
Informatica.
Diciembre, de 2010.
Introducción
Una <b><i>página</i></b> <b><i>Web</i></b>, es un documento electrónico adaptado para la <b><i>Web</i></b>, que generalmente forma parte de un sitio <b><i>Web</i></b>. Su principal característica son los hipervínculos de una <b><i>página</i></b>, siendo esto el fundamento de la... </p>
<div class="row card__footer-links ">
<div class="columns small-6">
<a href="/ensayos/Como-Crear-Un-Pagina-Web/1767029.html"
title="Como crear un pagina web"
class="card__footer text-xs">
<span>
Leer más </span>
</a>
</div>
<div class="columns small-6">
<div class="card__caption card__caption weight-300 mid-gray text-s align-right">
<div class="essay-details no-margin--bottom">
<span class="essay-details__item">1144 Palabras</span>
<span class="essay-details__item">5 Páginas</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="essayPreview">
<div class="card">
<a class="heading-s black" href="/ensayos/Como-Crear-Una-Pagina-Web/59409426.html"
title="como crear una pagina web">
<h6 class="heading-s">
como crear una pagina web </h6>
</a>
<div class="card__content-footer-container ">
<p class="card__content text-s ">
...<b><i>Como</i></b> <b><i>crear</i></b> una <b><i>página</i></b> <b><i>Web</i></b>
en muy poco tiempo (básica)
1. <b><i>Crear</i></b> <b><i>páginas</i></b> <b><i>Web</i></b>
2. Insertar una imagen en la <b><i>página</i></b> principal
3. Para <b><i>crear</i></b> un hipervínculo a partir de una imagen
4. <b><i>Crear</i></b> una estructura de exploración
5. Conclusión
6. Bibliografía
En el siguiente tutorial explicaremos <b><i>como</i></b> se puede <b><i>crear</i></b> una... </p>
<div class="row card__footer-links ">
<div class="columns small-6">
<a href="/ensayos/Como-Crear-Una-Pagina-Web/59409426.html"
title="como crear una pagina web"
class="card__footer text-xs">
<span>
Leer más </span>
</a>
</div>
<div class="columns small-6">
<div class="card__caption card__caption weight-300 mid-gray text-s align-right">
<div class="essay-details no-margin--bottom">
<span class="essay-details__item">722 Palabras</span>
<span class="essay-details__item">3 Páginas</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="essayPreview">
<div class="card">
<a class="heading-s black" href="/ensayos/Como-Crear-Pagina-Web/3713569.html"
title="Como crear pagina web">
<h6 class="heading-s">
Como crear pagina web </h6>
</a>
<div class="card__content-footer-container ">
<p class="card__content text-s ">
...<b><i>Cómo</i></b> <b><i>crear</i></b> una <b><i>página</i></b> <b><i>Web</i></b> usando FrontPage
FrontPage es una aplicación de Microsoft Office que sirve para generar <b><i>páginas</i></b> <b><i>Web</i></b>. La interfaz para generar estas <b><i>páginas</i></b> es muy similar a Word. En FrontPage se puede escribir contenido, importar imágenes y <b><i>crear</i></b> ligas a otras <b><i>páginas</i></b> de Internet. A continuación, se describe <b><i>cómo</i></b> iniciar la creación de una... </p>
<div class="row card__footer-links ">
<div class="columns small-6">
<a href="/ensayos/Como-Crear-Pagina-Web/3713569.html"
title="Como crear pagina web"
class="card__footer text-xs">
<span>
Leer más </span>
</a>
</div>
<div class="columns small-6">
<div class="card__caption card__caption weight-300 mid-gray text-s align-right">
<div class="essay-details no-margin--bottom">
<span class="essay-details__item">1011 Palabras</span>
<span class="essay-details__item">5 Páginas</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="essayPreview">
<div class="card">
<a class="heading-s black" href="/ensayos/C%C3%B3mo-Crear-Una-P%C3%A1gina-Web/7429211.html"
title="Cómo Crear Una Página Web">
<h6 class="heading-s">
Cómo Crear Una Página Web </h6>
</a>
<div class="card__content-footer-container ">
<p class="card__content text-s ">
... Guía para <b><i>crear</i></b> una <b><i>página</i></b> <b><i>web</i></b> Introducción Para iniciar la creación de una <b><i>página</i></b> <b><i>web</i></b>, considero primordial conocer el concepto de lo que es una <b><i>página</i></b> <b><i>web</i></b>. Quizá muchos de nosotros conocemos lo que es, mas no conocemos un concepto claro o una definición específica. Podemos empezar definiendo <b><i>página</i></b> <b><i>web</i></b>. Una <b><i>página</i></b> <b><i>web</i></b>, no es más que un... </p>
<div class="row card__footer-links ">
<div class="columns small-6">
<a href="/ensayos/C%C3%B3mo-Crear-Una-P%C3%A1gina-Web/7429211.html"
title="Cómo Crear Una Página Web"
class="card__footer text-xs">
<span>
Leer más </span>
</a>
</div>
<div class="columns small-6">
<div class="card__caption card__caption weight-300 mid-gray text-s align-right">
<div class="essay-details no-margin--bottom">
<span class="essay-details__item">972 Palabras</span>
<span class="essay-details__item">4 Páginas</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</section>
</div>
</section>
<section class="row ">
<div class="columns position-relative large-12">
<section class="section no-border">
<div class="container">
<div class="row">
<div class="columns ">
<div class="section-heading ">
<h2 class="align-left margin-2 heading-m">
OTRAS TAREAS POPULARES </h2>
</div>
</div>
</div>
<div class="row" id="popular-tags-visible">
<div class="small-12 columns tag-block columns-small-1 columns-medium-2 columns-large-2">
<ul>
<li class="margin-1">
<a href="/ensayos/Macroeconom%C3%ADaconceptos-1/79239352.html" title="Macroeconomíaconceptos_1" class="mid-gray brand-primary--hover">Macroeconomíaconceptos_1</a>
</li>
<li class="margin-1">
<a href="/ensayos/Ley-Nacional-De-Tr%C3%A1nsito-y-Seguridad/79239361.html" title="Ley nacional de tránsito y seguridad vial" class="mid-gray brand-primary--hover">Ley nacional de tránsito y seguridad vial</a>
</li>
<li class="margin-1">
<a href="/ensayos/Antisemitismo-Durante-Operacion-Margen-Protector/79239367.html" title="antisemitismo durante operacion margen protector" class="mid-gray brand-primary--hover">antisemitismo durante operacion margen protector</a>
</li>
<li class="margin-1">
<a href="/ensayos/Balance-General/79239391.html" title="balance general" class="mid-gray brand-primary--hover">balance general</a>
</li>
<li class="margin-1">
<a href="/ensayos/Rincon-Lubricante-11-14/79239397.html" title="rincon_lubricante_11_14" class="mid-gray brand-primary--hover">rincon_lubricante_11_14</a>
</li>
<li class="margin-1">
<a href="/ensayos/Laminado-y-Forjado-Expo/79239424.html" title="LAMINADO Y FORJADO_EXPO" class="mid-gray brand-primary--hover">LAMINADO Y FORJADO_EXPO</a>
</li>
</ul>
</div>
</div>
</div>
</section>
</div>
</section>
<div class="advertBox center margin-1"></div>
<section class="section no-border brand-primary--bg">
<div class="row">
<div class="columns center">
<h3 id="banner_title" class="heading-l white">Únete a millones de otros estudiantes y comienza tu investigación</h3>
<h4 class="text-m white">Conviértase en miembro formal de Buenas Tareas</h4>
<a class="button--bg-color__white button-fullwidth" onclick="upgradeRedirect()" rel="nofollow">
INSCRÍBETE - ES GRATIS
</a> </div>
</div>
</section>
<footer class="section section--footer">
<div class="row">
<div class="medium-3 columns"><div class="copyright-block">
<p class="copyright-block__logo">
<i class="icon icon-sm-logo copyright-block__logo__icon"></i>
<span class="copyright-block__logo__span">Buenas Tareas</span>
</p>
<p class="copyright-block__social">
<a rel="nofollow" href="http://www.facebook.com/BuenasTareas">
<span class="copyright-block__social__circle">
<i class="copyright-block__social__circle__icon icon icon-ui-24-social-fb icon-ui-social-fb"></i>
</span>
</a>
<a rel="nofollow" href="https://twitter.com/buenastareas">
<span class="copyright-block__social__circle">
<i class="copyright-block__social__circle__icon icon icon-ui-social-tw"></i>
</span>
</a>
</p>
<small class="copyright-block__copyright text-s">
©2024 BuenasTareas.com </small>
</div>
</div>
<div class="medium-3 columns"><div class="vertical-nav-list">
<h6 class="vertical-nav-list__heading heading-xxs">Productos</h6>
<ul class="vertical-nav-list__container">
<li class="vertical-nav-list__item">
<a class="vertical-nav-list__item__anchor text-m" href="/ojear/">Documentos de investigación</a>
</li>
<li class="vertical-nav-list__item">
<a class="vertical-nav-list__item__anchor text-m" href="/resumen-de-libros/">Notas de libros</a>
</li>
<li class="vertical-nav-list__item">
<a class="vertical-nav-list__item__anchor text-m" href="/generador-de-citas/">Generador de citas</a>
</li>
</ul>
</div>
</div>
<div class="medium-3 columns">
<div class="vertical-nav-list">
<h6 class="vertical-nav-list__heading heading-xxs">Empresa</h6>
<ul class="vertical-nav-list__container">
<li class="vertical-nav-list__item">
<a class="vertical-nav-list__item__anchor text-m" href="/about.php">Empresa</a>
</li>
<li class="vertical-nav-list__item">
<a class="vertical-nav-list__item__anchor text-m" href="/advertise-with-us.php">Haz publicidad</a>
</li>
<li class="vertical-nav-list__item">
<a class="vertical-nav-list__item__anchor text-m" href="/legal.php">Legal (actualizado 9/9/14)</a>
</li>
<li class="vertical-nav-list__item">
<a class="vertical-nav-list__item__anchor text-m" href="/sitemap.html">Mapa del sitio</a>
</li>
</ul>
</div>
</div>
<div class="medium-3 columns"><div class="vertical-nav-list">
<h6 class="vertical-nav-list__heading heading-xxs">Ayuda</h6>
<ul class="vertical-nav-list__container">
<li class="vertical-nav-list__item">
<a class="vertical-nav-list__item__anchor text-m" href="/help.php">Ayuda</a>
</li>
<li class="vertical-nav-list__item">
<a class="vertical-nav-list__item__anchor text-m" href="/about-us/contact">Contáctanos</a>
</li>
</ul>
</div>
</div>
</div>
</footer> </div>
<!-- global JS -->
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/labjs/2.0.3/LAB.min.js"></script>
<script type="text/javascript">
$LAB
.script("//cdnjs.cloudflare.com/ajax/libs/aja/0.4.1/aja.min.js")
.script("//cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js")
.script("//cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0/handlebars.runtime.min.js")
.script("//cdnjs.cloudflare.com/ajax/libs/jquery.payment/1.3.2/jquery.payment.min.js")
.script("//assets.buenastareas.com/234d3b97ed2b88737e66b0e02a8e5aa593c7f7c0/_assets/bts/92c1d4e847bc6d93ba58214aa322ee6c.js")
;
</script>
<script type="text/javascript">
window.SM2_DEFER = true;
function downloadJSAtOnload() {
$LAB
.script("//assets.buenastareas.com/234d3b97ed2b88737e66b0e02a8e5aa593c7f7c0/_assets/bts/76aff662ad8b32c9348bfa0fa9cb8f91.js")
.wait(function() {
});
}
// Check for browser support of event handling capability
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>
</body>
</html>
1- El código HTML elemental
Para comenzar sigue los siguientes pasos:
➔ Crea en el Escritorio una carpeta llamada sitio y dentro de ella crea un nuevo documento de texto, renómbralo a index.html, asegúrate de que no tenga la extensión de archivo .txt.
Se supone que tienes desactivado en el Panel de Control -> Opciones de Carpeta -> Ocultarlas extensiones de archivo, si no te será imposible.
➔ Arrastra el archivo creado index.html encima del Bloc de notas y suéltalo, en el pegarás el código que se muestra en esta página a continuación.
Cada vez que pegues algo nuevo, guarda los cambios y ejecuta (dos clics) el archivo, que se abrirá con tu navegador instalado, de esa manera podrás comprobar como se ve tu página.
Copia y pega elsiguiente código:
Esta es mi primera página web
Ya tienes tu primera página web.
Una sencilla explicación del código anterior.
Cada elemento que va entre los signos < y > es un tag o etiqueta, donde quiera que hay un tag algo sucederá en la representación del documento, algunas veces visualmente y otras de maneraoculta.
• La etiqueta le indica a tu navegador que tu documento es una página web y debe representarla como tal.
• Las etiquetas