DISEÑO DE DESARROLLO
MÓDULO DE DISEÑO Y DESARROLLO WEB
Objetivo: Diseñar y construir soluciones web de nivel intermedio con interfaz amigable, empleando herramientas multimedia que permitan promocionar la información e imagen de una organización y/o cliente.
El lenguaje HTML se basa en etiquetas, por eso es importante entender bien la sintaxis de las etiquetas. El siguiente esquema muestra las partes de una etiqueta HTML genérica.
La etiqueta de apertura está delimitada por el signo < "menor que", a continuación el propio nombre de la etiqueta (en este caso p), y opcionalmente, un atributo (en este caso class="fondo"), finalmente el signo > "mayor que".A continuación está el texto del contenido de la etiqueta, lo más frecuente es un texto, pero podría ser otra etiqueta, una imagen, ...
La etiqueta de cierre está delimitada por el signo < "menor que", a continuación la barra inclinada /, el propio nombre de la etiqueta (en este caso p), y finalmente el signo > "mayor que".
Algunas etiquetas no tienen contenido, y se cierran sobre sí mismas, no tienen etiqueta de cierre, se llaman etiquetas vacias, como la etiqueta <br>. En estas etiquetas opcionalmente se puede colocar una barra justo antes del signo >, por ejemplo: <br />. La etiqueta <br> produce un salto de línea. Las etiquetas vacias no tienen contenido pero si pueden tener atributos. Algunas otras etiquetas vacias son <hr>, <img>, <input>, <link>, <meta>, <param> y <source>.
En una etiqueta, la primera palabra que aparece es el nombre de la etiqueta. También podemos encontrar atributos con sus valores, siguiendo el formato <etiqueta atributo1="valor"atributo2="valor">. La forma más correcta es escribir el nombre de la etiqueta y los atributos en minúscula, y los valores entre comillas dobles.
Etiquetas mas utilizadas
<br />:produce un salto de línea en el texto (retorno de carro). Es útil para escribir un poema o una dirección, donde la división de las líneas es significante.
<form>: representa un formulario. ... También pueden agregarse más botones como el de Restablecer que pone el formulario en blanco.
<head>:provee información general (metadatos) acerca del documento, incluyendo su título y enlaces a scripts y hojas de estilos.
<header>:representa un grupo de ayudas introductorias o de navegación. Puede contener algunos elementos de encabezado, pero también otros elementos como un logo, una sección que aglutine secciones de encabezados, una formulario de búsqueda o cosas parecidas.
<!–…–>:Define un comentario
<!DOCTYPE>:Define el tipo de docuemento
<a>:Define un hipervínculo
<abbr>:Define una abreviación
<address>:Define la información de contacto del autor / propietario del documento
<area>:Define un área dentro de un mapa de imagen
<article>:Define un área dentro de un mapa de imagen
¿QUÉ ES UNA PÁGINA WEB?
Una página web es un documento o cualquier tipo de información que se crea en formato HTML (sigla en inglés de HyperText Markup Language o lenguaje de marcas de hipertexto), que es adaptado a la World Wide web (WWW) y que se accede a su contenido a través de algunos de los navegadores existen. Al agrupamiento de páginas web enlazadas bajo un mismo dominio se le denomina como sitio web 
Tipos de páginas web según su construcción
Páginas web estáticas
Este tipo de páginas se caracterizan porque muestran una información permanente en la que el usuario no puede interactuar con la página excepto para leer el contenido. No utilizan bases de datos, sino que la información reside en el servidor, por lo que para modificar el mismo hay que acceder al server y cambiar su contenido. Este tipo de páginas se usan para webs meramente informativas
EJEMPLOS
Curriculum Vitae
WEB QUEST
BLOC O BITÁCORA
Páginas web dinámicas
Al contrario que las páginas webs estáticas, en las webs dinámicas los contenidos pueden ser modificados por parte de los usuarios que las visitan y se les permite crear o modificar el aspecto de la misma a través de la misma navegación con formularios, texto, imágenes, vídeos, etc. Entre estas estarían los foros, blogs, ecommerces con carrito de compra, las diferentes secciones de fichas de producto en el que los usuarios pueden opinar y el resto de páginas en las que los visitantes pueden crear o interactuar con la información mostrada ellos mismos. Estos contenidos interactúan con una base de datos en la que se guardan cada uno de los registros de los usuarios.
EJEMPLOS
NAVEGADOR WEB
Un navegador web (en inglés, web browser) es un software, aplicación o programa que permite el acceso a la Web, interpretando la información de distintos tipos de archivos y sitios web para que estos puedan ser visualizados.
La funcionalidad básica de un navegador web es permitir la visualización de documentos de texto, posiblemente con recursos multimedia incrustados. Además, permite visitar páginas web y hacer actividades en ella, es decir, enlazar un sitio con otro, imprimir, enviar y recibir correo, entre otras funcionalidades más.
¿QUÉ ES PROTOCOLO IP?
El protocolo de IP (Internet Protocol) es la base fundamental de la Internet. Porta datagramas de la fuente al destino. El nivel de transporte parte el flujo de datos en datagramas. Durante su transmisión se puede partir un datagrama en fragmentos que se montan de nuevo en el destino. Las principales características de este protocolo son:
1.Protocolo orientado a no conexión.
2.Fragmenta paquetes si es necesario.
3.Direccionamiento mediante direcciones lógicas IP de 32 bits.
4.Si un paquete no es recibido, este permanecerá en la red durante un tiempo finito.
5.Realiza el "mejor esfuerzo" para la distribución de paquetes.
6.Tamaño máximo del paquete de 65635 bytes.
7.Sólo ser realiza verificación por suma al encabezado del paquete, no a los datos éste que contiene.
¿Qué son las hojas de estilos HTML?
Una hoja de estilo es un archivo de extensión *.CSS (CSS cascading style stheets=Hojas de estilo)
que contempla definiciones de formato (tipo de fuente color de fuente tamaño etc) de las distintas etiquetas que forman una pagina *HTML. La principal ventaja es darle un mismo aspecto a todas las paginas vinculadas a la hoja de estilo.
¿Qué es un software de edición de sitio web?
Es una aplicación diseñada con el fin de facilitar la creación y edición de documentos HTML o XHTML Su complejidad puede variar desde la de un simple editor de texto plano entornos WYIWYG
Hasta editores WYSIWYM.
¿Qué es un publicador de sitio web?
Es una herramienta que permite modificar contenidos del sitio web.Dicha herramienta permite la adopcionista de acuerdo de las necesidades de cada cliente
¿Qué es un servidor web?
Es un servidor web o servidor HTTP es un programa informático que procesa una aplicación del lado del servidor,realizado conexiones bidireccionales o undireccionales o sincronías o asíncronas con el cliente y generando o entendiendo una respuesta en cualquier lenguaje o aplicación del lado del cliente.
:max_bytes(150000):strip_icc()/surfing-the-internet-184146944-57f1a5d65f9b586c35868278.jpg)
Con cada uno de los diseños que nos ofrece diseño pagina web es donde aprenderemos muchos más temas que nos pueden llevar a aprender más.
ResponderEliminar