PERIODO 1

  PÁGINAS WEB Y LENGUAJE DE MARCADO HTML.


Páginas web

Que es un sitio web?

Un sitio web es un lugar virtual en la red que guarda contenido para que la gente tenga acceso a él, así de simple. Se conforma por varios documentos que se acomodan de manera organizada para que sea atractivo visualmente, dichos documentos se llaman páginas web. Por lo tanto, un sitio web es la compilación organizada y estructurada de un determinado número de páginas web.
Las páginas web de las que se conforma el sitio deben estar desarrolladas bajo un código llamado HTML y estar alojadas a un dominio que, en palabras simples, será el lugar que hará que el sitio web pueda visualizarse en cualquier tipo de navegador web (hosting).



                                                     IMAGEN 1:sitios web

Resultado de imagen para que es un sitio web

Fuente:la web

Que es una pagina web?
Se conoce como página web al documento que forma parte de un sitio web y que suele contar con enlaces (también conocidos como hipervínculos o links) para facilitar la navegación entre los contenidos.

                                                      IMAGEN 2:pestañas web
Resultado de imagen para que es una pagina web

Fuente:la web


       Que es una página web estática?
Las páginas web estáticas son básicamente informativas y están enfocadas principalmente a mostrar una información permanente, donde el navegante se limita a obtener dicha información sin poder interactuar con la página visitada. En las páginas web estáticas no se utilizan bases de datos ni se requiere programación.
Página:http://www.buyto.es/general-diseno-web/que-es-una-pagina-web-estatica-para-que-sirve-una-pagina-web-estatica.html  

                                          IMAGEN3:sitio web estatico
Resultado de imagen para que es una pagina web estatica

                                                            Fuente:la web
Que es una pagina web dinámica?

Los sitios web dinámicos son aquellos que permiten crear aplicaciones dentro de la propia web, otorgando una mayor interactividad con el navegante. Aplicaciones dinámicas como encuestas y votaciones, noticiarios, foros de soporte, libros de visita, envío de e-mails inteligentes, reserva de productos, pedidos on-line, atención al cliente personalizada ... donde el administrador dispone la opción de gestionar dichos apartados, agregando, editando o eliminando contenidos.
La gran ventaja de los sitio web dinámicos es la versatilidad, apunta a la personalización de la información mostrada. Permite la toma de decisiones y muestra selectiva de información en función de criterios deseados.
Es útil para mostrar una imagen de empresa más sólida y profesional ya que permite guardar información en la computadora del navegante y mostrar en forma personalizada la página web de la empresa así como la información adecuada al tipo de navegante.

                                                     IMAGEN4:sitio web dinamico
Resultado de imagen para que es una pagina web estatica
Fuente:la web
EXTENSIONES DE UNA PAGINA WEB?
Las llamadas extensiones de los dominios de internet se conocen como "dominios de primer nivel" o TLDs (top level domains) y supuestamente deben escogerse según el uso que se le vaya a dar al dominio, aunque para muchas extensiones no hay restricciones de registro ni de uso.
Dominios .com: Dominio usado para actividades comerciales. Definitivamente la extensión más popular.
Dominios .net: Originalmente para proveedores de servicios Internet, pero ahora su uso es general.
Dominios .org: Organizaciones sin fines de lucro. También de uso general.
Dominios .info: Para publicar información de cualquier tipo.
Dominios .biz: Ideado para ser usado por/para negocios ("biz" se entiende en inglés como "business").
Dominios .co: Dominio de la República de Colombia. Los dominios .co son considerados en la actualidad una buena alternativa a los .com, por su parecido, simplicidad y referencia a las palabras COmercio, COmpañía, COmpany, etc.
Dominios .es: Dominio de España. Usado también para alojar páginas con contenido en idioma ESpañol. 
Dominios .mx: Dominio de los Estados Unidos Mexicanos (México).
Dominios .us: Dominio de los Estados Unidos de América. Es obligatorio que el registrante tenga un nexo con ese país. Por ejemplo, que sea residente o ciudadano americano.
Dominios .pe: Dominio de la República del Perú.
Dominios .cl: Dominio de la República de Chile.
Dominios .ar: Dominio de la República Argentina.
Dominios .bo: Dominio de Bolivia.
Dominios .cc: Dominio de las Islas Cocos o Islas Keeling (Australia). Las mencionamos porque en su momento fueron usados como alternativa a los .comDominios .tv: Dominio de Tuvalu. Es un país insular ubicado en el Océano Pacífico, a mitad de camino entre Hawái y Australia. Lo mencionamos porque en la actualidad es usado popularmente por negocios relacionados con el mundo de la TeleVisión.
Dominios .xyz: Dominio genérico, fácil de recordar. No corresponde a ningún país en particular. 

                                                                     WIX
Wix fue fundado en el año 2006 por Avishai Abrahami, Nadav Abrahami y Giora (Gig) Kaplan. 
Los hermanos Abrahami y Kaplan, su amigo, desarrollaron la plataforma de Wix como resultado a la frustración generada por las complejidades que presenta la creación de sitios web. Juntos encontraron una manera revolucionaria en la que tanto personas particulares como empresas, pudieran crear y administrar sus propios sitios web. 
Wix ofrece la única plataforma HTML5 para crear sitios web con la función de arrastrar y soltar; además de cientos de plantillas diseñadas por profesionales, alojamiento de alto nivel, innovadoras aplicaciones y miles de funciones totalmente gratis. En fin, brindamos servicios de primera calidad y nuestro modelo de negocio nos permite proporcionar sitios completamente funcionales para todos de forma gratuita. 
Paginahttps://support.wix.com/es/article/la-historia-de-wix
                                                 video 1:como crear una pagina web
Página:https://www.youtube.com/watch?v=lJI1q8TzQ6E
                               LENGUAJE DE MARCADO HTML
HTML son las siglas de Hypertext Markup Language o lenguaje de marcación de hipertexto, el más utilizado en la Web, un lenguaje sencillo basado en etiquetas, que permite mostrar la información de las páginas Web en el monitor del usuario a través de los navegadores.
NOTA:
Cuando un usuario solicita una página Web desde su ordenador a un servidor de Internet, el documento HTML se descarga al disco duro y luego se muestra en el monitor.
En los inicios del diseño Web, para crear una página había que conocer inevitablemente HTML.
Se necesitaba además un editor de texto convencional para escribir el código y luego comprobar el resultado. Los editores eran entonces relativamente simples y poco prácticos para escribir documentos HTML.
La primera versión de HTML tenía un etiquetado primitivo que sólo permitía definir el tamaño de letra, definir los enlaces  e incrustar las imágenes.
La aparición de nuevos navegadores en el mercado obligó a definir una versión estándar de HTML con nuevas formas para hacer un diseño eficaz.
A mediados de los 90 comenzaron a desarrollarse los primeros editores visuales WYSIWYG (What You see is what you get; en castellano: lo que ves es lo que obtienes) que permitieron la producción de páginas Web sin tener conocimientos de HTML.
LENGUAJES DE MARCADO
Un lenguaje de marcado o lenguaje de marcas es una forma de codificar un documento que, junto con el texto, incorpora marcas que contienen información adicional acerca de la estructura del texto o su presentación.
El lenguaje de marcas más extendido es el(HyperText Markup Language, lenguaje de marcado de hipertexto), fundamento del World Wide Web (entramado de comunicación de alcance mundial).                                                         IMAGEN5: lenguaje demarcado html





                                                                                                                                                                                                   Fuente:wikipedia

ABREVIATURA ML

LENGUAJE DE MARCAS
Las páginas web ofrecen la posibilidad de tener, además de texto, estructura de la página (columnas), formatos de fuente (colores, subrayados, negritas...), imágenes, enlaces, tablas, listados, etc. Y, sin embargo, todas las páginas web están constituidas por texto plano, o sea, texto sin más. ¿Cómo hacemos para incluir todos estos elementos adicionales y que el navegador sepa diferenciar que es contenido y qué no lo es? La solución es utilizar un lenguaje de marcas. Los lenguajes de marcas no son lenguajes de programación como Scratch (aquí no hay sentencias que ejecutar); son lenguajes que mediante marcas añaden riqueza sintáctica y semántica a un texto. 
Página:http://formacion.intef.es/pluginfile.php/52814/mod_imscp/content/5/qu_es_un_lenguaje_de_marcas                                                  IMAGEN6:lenguaje html
Resultado de imagen para lenguaje de marcas


Fuente:la web

HTML HYPERTEXT           
HTML es un lenguaje de marcado que se utiliza para el desarrollo de páginas de Internet. Se trata de la sigla que corresponde a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto, que podría ser traducido como Lenguaje de Formato de Documentos para Hipertexto.
                                                          IMAGEN7:html

Resultado de imagen para lenguaje de marcas


                                                           Fuente:la web

QUE SON LAS ETIQUETAS Y TIPOS



Una etiqueta (términos a veces reemplazados por el anglicismo tag) es una marca con clase que delimita una región en los lenguajes basados en XML. También puede referirse a un conjunto de juegos informáticos interactivos que se añade a un elemento de los datos para identificarlo (Oxford English Dictionary). Esto ocurre, por ejemplo, en los archivos MP3 que guardan información sobre una canción así como sobre el artista que la ha cantado o compuesto.

TIPOS

<HTML> … </HTML>

Delimita y engloba toda la página web, que consta de cabecera y cuerpo.

<HEAD> … </HEAD>

Delimita y engloba la cabecera de una página, que contiene un conjunto de informaciones que no se muestran en la ventana, entre ellas el título de la página, pero que pueden ayudar a los navegadores y a los buscadores para interpretar o a encontrar correctamente la página.

<TITLE> … </TITLE>

Dentro de la cabecera (HEAD), lo que se incluye aquí se muestra en la barra del título de la ventana del navegador.

Metadatos

La cabecera admite otras muchas etiquetas (ver apuente 6 y 6.1.)

<BODY> … </BODY>

Delimita y engloba el cuerpo de la página, que son el conjunto de informaciones (texto e imágenes) que se muestran en la página, así como las indicaciones de cómo deben mostrarse.
Admite atributos (ver jac 8 y apuente 5.3 y 14.3).

Formatos de párrafo

El texto de la página se puede estructurar en encabezamientos de los diferentes apartados de la página, que pueden tener distintos niveles de 1 a 6 (siendo 1 el más importante) y párrafos normales.

<H1> ... </H1> o <H2> ... </H2> (hasta 6)

Párrafos que son encabezamientos (con distintos niveles).

<P>... </P>

Párrafos normales.

<P align="center">... </P>

El atributo align permite alinear el texto del párrafo. Se puede aplicar igual a las etiquetas <H1>, <H2>, etc ...

<BR>

Permite partir un párrafo empezando una línea nueva pero sin dejar espacio.

<HR>

Pone una linea horizontal de separación. (admite atributos) (ver apuente 11.1).

<BLOCKQUOTE>…</BLOCKQUOTE>

Sangra el párrafo.

Formatos de texto

El formato de caracteres permite cambiar tanto el tipo de fuente como su tamaño y aspecto.
Se pueden utilizar varias etiquetas HTML para dar distintos formatos a un grupo de caracteres:

Formatos Físicos:

  • Negrita:        <B>…</B>
  • Cursiva:        <I>…</I>
  • Subrayado:        <U>…</U>
  • Teletipo:        <TT>…</TT>
  • Tachado:        <STRIKE>…</STRIKE>
  • Grande:        <BIG>…</BIG>
  • Pequeña:        <SMALL>…</SMALL>
  • Superíndice:        <SUP>…</SUP>
  • Subíndice:        <SUB>…</SUB>

Formatos Lógicos:

  • Cita:            <CITE>…</CITE>
  • Código:        <CODE>…</CODE>
  • Definición:        <DFN>…</DFN>
  • Énfasis:        <EM>…</EM>
  • Grueso:        <STRONG>…</STRONG>
  • Palabras clave:    <KEY>…</KEY>
  • Ejemplos:        <SAMP>…</SAMP>
  • Usuario:        <KBD>…</KBD>
  • Variables:        <VAR>…</VAR>
  • Ejemplo literal:    <XMP>...</XMP> (ignora las etiquetas HTML de dentro)
Posibilidad de combinar etiquetas (anidándolas, esto es, una dentro de otra):
  • <B>…<I>…</I>…</B>            (Correcto)
  • <B>…<I>…</B>…</I>            (Incorrecto)

<FONT COLOR="red"> ... </FONT>

Indicación expresa del tipo de letra a usar, en este caso el color (ver jac 8.2)

<FONT SIZE="+1"> ... </FONT>

Indicación expresa del tipo de letra a usar, en este caso el tamaño (ver jac 8.1-segunda parte)

La etiqueta FONT permite combinaciones cualesquiera de los atributos COLOR, SIZE y FACE


Caracteres especiales

Existe una serie de caracteres del ISO-LATIN-1 que no se pueden representar directamente en un documento HTML, puesto que forman parte del propio vocabulario del lenguaje, como por ejemplo los símbolos <, >, &, etc.
Adicionalmente, las vocales acentuadas y algunos signos de puntuación deben ser especificados de forma distinta, puesto que los navegadores pueden no entender el código del carácter utilizado y convertirlo a otro diferente.
Los caracteres especiales más usados son:
  • &aacute;        á
  • &eacute;        é
  • &iacute;        í
  • &oacute;        ó
  • &uacute;        ú
  • &agrave;        à
  • &ntilde;        ñ
  • &lt;            <
  • &gt;            >
  • &amp;            &
  • &ccedil;        ç
  • &quot;            “
  • &nbsp;            espacio en blanco
(ver apuente 10.1)

Listas

(ver apuente 7)

<UL> ... </UL>

Lista numerada.

<OL> ... </OL>

Lista no numerada.

<LI> ... </LI>

Elementos de una lista.

Enlaces

Sirven para acceder desde una página a otra página o a otro recurso disponible (ver apuente 15).

<a href="http://servidor/recurso.html">texto del enlace</a>

Enlace absoluto a una página

<a href="recurso.html">texto del enlace</a>

Enlace relativo a una página

<a name="marcador"> ... </a>

Marcador (enlace interno) dentro de una página

<a href="#marcador">texto del enlace</a>

Enlace a un marcador de la misma página

<a href="recurso.html#marcador">texto del enlace</a>

Enlace a un marcador de otra página (que puede darse con dirección absoluta o relativa)

<a href="recurso.html" target="_blank">texto del enlace</a>

Enlace a otra página (absoluta o relativa, con o sin marcador) que se abra en otra ventana.

Imágenes

<img src="nombre.gif">

Muestra una imagen, que normalmente es de tipo GIF o JPG
Admite atributos (ver apuente 14).

Tablas

Permite organizar la información en tablas.
También sirve para maquetar (dar forma general) al aspecto de la página.
Página:https://www.uv.es/cerveron/paginasweb/notashtml.html

                                                     VIDEO2:tutorial de html

No hay comentarios:

Publicar un comentario