COMO CREAR UNA PAGINA WEB MEDIANTE UN BLOC DE NOTAS

HOLA CHICOS Y CHICAS EN ESTE NUEVO APARTADO HABLAREMOS DE LA COMO SE CREA UNA PAGINA WEB A TRAVES DE UN BLOC DE NOTAS

PARTE 1 CREACION DE UN DOCUMENTO

PASO 1. Haz clic en el logo de Windows en la esquina inferior izquierda de la pantalla. Aparecerá el menú Inicio.

PASO 2. Para buscarlo, escribe bloc de notas. En la parte superior del menú Inicio aparecerá una lista de los resultados que coincidan con tu búsqueda.

PASO 3. Es el ícono azul que está en la parte superior de la lista de resultados de búsquedas. Haz clic en esta aplicación para abrir una página en blanco en el Bloc de notas.

PASO 4. Está en la esquina superior izquierda de la ventana del Bloc de notas. Al hacer clic en esta opción, se abrirá un menú desplegable.

PASO 5. Es una de las opciones del menú desplegable. Se abrirá la ventana "Guardar como".

PASO 6. Este menú está en la parte inferior de la ventana. Dirá "Documentos de texto (*.txt)". Al hacer clic en él, se abrirá un menú desplegable.

PASO 7. Es una de las opciones del menú desplegable. De este modo, tu archivo se guardará como un documento HTML.

PASO 8. En el lado izquierdo de la ventana, selecciona el nombre de la carpeta donde quieras guardar el documento.

Por ejemplo, para guardar el documento en el escritorio, desplázate hacia arriba y haz clic en Escritorio en la barra lateral izquierda.

PASO 9. Haz clic en el cuadro de texto "Nombre de archivo".Luego escribe el nombre que quieras ponerle al archivo seguido de .html que es la extensión de archivo para un documento HTML.

Por ejemplo, si quieres que tu página web se llame OFERTAS DE PRODUCTOS, entonces escribiras ofertasdeproductos.html

PASO 10.HAZ CLIK EN

PARTE 2 AGREGAR CODIGO ESTRUCTURAL

PASO 1. La primera etiqueta que deberás agregar es la etiqueta de lenguaje. Esto le dice al navegador web que se trata de un documento HTML y que el lenguaje que se utiliza es HTML. Escribe lo siguiente en el Bloc de notas en la parte superior de la página:

PASO 2. La sección "head" de un documento HTML contiene los metadatos de la página web. Esta información no se muestra en tu navegador web. Puede contener información como el título de la página, hojas de estilo (CSS), scripts y más. Por ahora, simplemente escribe <head> abajo de la etiqueta "<html>", presiona Enter dos veces para dejar un espacio en blanco. Luego agrega </head>.

Cada elemento HTML tiene una etiqueta de apertura y cierre. Cuando agregamos un nuevo elemento, como la etiqueta "<head>" para abrir el encabezado, también debemos agregar una etiqueta de cierre. Para la cabeza, esta es la etiqueta "</head>".

PASO 3. El título va dentro de la sección "head" del documento HTML, por lo que deberás ingresarlo entre la etiqueta de apertura "<head>" y la etiqueta de cierre "</head>< /nowiki>". Para agregar un título, escribe la etiqueta de título de apertura, que es {{kbd|<nowiki><title>"}}. Luego escribe el texto de su título. Agrega la etiqueta de título de cierre inmediatamente después, que es </title>. Por ejemplo, si quisieras titular tu página web, "Mi sitio web", ingresaría lo siguiente:

PASO 4. Todo el código de tu página web debe ir entre estas etiquetas, que van debajo de la etiqueta "</title>":

PASO 5. La última etiqueta del documento debe ser la etiqueta de cierre de HTML para indicar el fin de la página. Escribe </html> debajo de la etiqueta "</body>" para cerrar la etiqueta HTML.

PASO 6. Ahora, tu documento deberá verse así:

```
<!DOCTYPE html>
<html>

<head>
<title>Mi sitio web</title>
</head>

<body>

</body>

</html>
```
PASO 7. Para guardarlo, presiona Ctrl+G. Ahora puedes proceder a agregar otros elementos de la página web como, por ejemplo, los párrafos y encabezados.

PARTE 3 INSERTAR LOS DATOS A LA PAGINA

PASO 1. Todos los elementos, ya se etiqueta "<body>" y antes de "</body>"

PASO 2. Escribe <h1></h1> entre las etiquetas "body" y luego escribe el encabezado principal que quieras ponerle a tu página web entre las etiquetas "<h1></h1>". Por ejemplo, para crear una página web con el encabezado "Bienvenido", tendrás que escribir lo siguiente:

PASO 3. Escribe las etiquetas de párrafo "<p></p>" y luego escribe el texto que quieras entre esas etiquetas. El resultado final deberá verse así:

PASO 4. Si quieres agregar más espacio entre párrafos o encabezados escribe <br> después de la línea de cierre. Por ejemplo, para insertar un salto de línea después de un párrafo, tu código deberá verse similar al siguiente:

PASO 5.Dale formato al texto. Puedes poner cualquier palabra, oración o bloque de texto en negrita, cursiva o subrayado (también como subíndice o superíndice), siempre y cuando el texto esté entre las etiquetas de párrafo:

PASO 6. Revisa el aspecto de tu página web. Si bien los elementos de la página pueden variar, tu documento deberá verse similar al siguiente:

AQUI LES DEJARE EL USO DE 20 ETIQUETAS

<body> para el contenido
<head> para información sobre el documento
<div> división dentro del contenido
<a> para enlaces
<strong> para poner el texto en negrita
<br> para saltos de línea
<H1>…<H6> para títulos dentro del contenido
<img> para añadir imágenes al documento
<ol> para listas ordenadas, <ul> para listas desordenadas, <li> para elementos dentro de la lista
<p> para parágrafos
<span> para estilos de una parte del texto

<body> </body>

Indica la parte del cuerpo del contenido de un documento HTML. Es una etiqueta esencial para cualquier documento ya que indica donde empieza el contenido visible del documento.

<head></head>

La parte superior del documento HTML, es donde podremos indicar los metadatos: título del documento, hojas de estilos, javaScript, CSS…

<div> </div>

Un elemento que es usado mayoritariamente para agrupar otros elementos y actuar como plantilla de otros controles. La etiqueta <div> nos ayuda a estructurar el documento en secciones.

<a> </a>

Es una etiqueta que nos ayuda a poder crear un enlace a una página web. El atributo principal de la etiqueta HTML es href, donde pondremos el enlace al que queremos conectar. Otro atributo muy usado es target, el cual nos sirve para indicar si el enlace se abrirá en una nueva ventana o en la misma.

Ejemplo HTML:

Pulsa <a href=”https://www.nombredelaweb.com/” target=”_blank”>aquí</a> para visitar DonDominio.

<strong> </strong>

Si tienes mucho texto, es importante poder dar énfasis a una parte en concreto, con la etiqueta strong

Con esta etiqueta HTML le podemos decir al navegador que viene un salto de línea. Nos sirve para hacer el texto más leíble.

<H1> </H1> …. <H6> </H6>

Hay diferentes niveles de títulos, del 1 al 6. Las etiquetas <H + número> nos permiten indicar la importancia del título y para estructurar el contenido, de esta forma ayudamos a los bots a entender la importancia del contenido.

<IMG> </IMG>

Usamos la etiqueta IMG para mostrar imágenes dentro del contenido. Necesita el atributo src para funcionar, ya que será donde indicaremos desde donde tiene que mostrar la imagen.

<OL> <li></li> <OL> | <UL> <li></li> <UL>

Las etiquetas OL y LI nos sirven para crear listas, OL para listas ordenadas y UL para listas sin orden. Dentro de las listas, los elementos se identifican con la etiqueta LI.

Ejemplo HTML:

<ul>

<li>Primer elemento</li>

<li>Segundo elemento</li>

<ul>

<P> </P>

Etiqueta que nos sirve para agrupar texto dentro de un parágrafo. El propósito es poder hacer el contenido más fácil de leer y organizado.

2 PROGRAMAS PARA LA CERACION DE PAGINAS WEB

Blogger.
Canva

Buscar este blog

SISTEMAS OPERATIVOS