2.3 Géneros de Sitios Web

Diseño Web

Ingresar a los siguientes sitios web y reflexionar sobre lo siguiente.

·         www.ugb.edu.sv

•   Genero del Sitio: Educativo

•  Elementos de diseño: Información completa y verás, publicidad, logo de la institución.

•  Análisis: Tiene el principio de la unidad pues todos sus elementos están relacionados entre sí mostrando una buena presentación en cada uno de los elementos que conforman el sitio.

·         www.scotiabank.com.sv

• Género del Sitio: Comercial

• Elementos de diseño: Menú desplegable, slider, imágenes, logo.
• Análisis: Tiene el principio de secuencia porque sus elementos están ordenandos en forma ascendente y es fácil para dirigir la vista.

 www.siman.com.sv

 

• Género del Sitio: Comercial

• Elementos de diseño: Imágenes grandes, menú desplegable.

• Análisis: Carece del principio de contraste ya que solo posee imágenes muy grandes con mucha publicidad lo cual no hace interesante para navegar ese sitio.

    www.citibank.com.sv

• Género del Sitio: Comercial

• Elementos de diseño: Tiene logo, tiene varios menús, tiene información de diversos servicios.

• Análisis: Es un sitio que no tiene el principio de equilibrio y se muestra poco elegante y vistoso al usuario.

2.2 Metodología para la Creación de Sitios Web

Herramientas que apoyan el desarrollo de Sitios Web

• CMS 
  Son las siglas de Content Management System, o lo que viene a ser un sistema de gestión de contenidos. Un CMS es un programa desarrollado para que cualquier usuario pueda administrar y gestionar contenidos de una web con facilidad y sin conocimientos de programación Web

  

CSS 

Es un lenguaje de hojas de estilos creado para controlar el aspecto o presentación de los documentos electrónicos definidos con HTML y XHTML. CSS es la mejor forma de separar los contenidos y su presentación y es imprescindible para crear páginas web complejas.

JQuery 

Es una biblioteca de JavaScript, creada inicialmente por John Resig, que permite simplificar la manera de interactuar con los documentos HTML, manipular el árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con la técnica AJAX a páginas web.

Javascript 

Es un lenguaje de programación, al igual que PHP, si bien tiene diferencias importantes con éste. JavaScript se utiliza principalmente del lado del cliente (es decir, se ejecuta en nuestro ordenador, no en el servidor) permitiendo crear efectos atractivos y dinámicos en las páginas web.

2.1 Principios Básicos del Diseño

·         Unidad

Durante el diseño este es el principio en el cual se complementan todas las partes (logotipo, encabezado, texto, etc.) del sistema entre sí con el fin de producir un efecto general y unificado, es mejor un diseño completo y bien estructurado que la suma de todas sus partes.

·         Armonía

Se da mediante la selección idónea de cada uno de los elementos que serán parte del diseño de manera tal que combinen, puede ser tamaño, forma, textura, etc.

·         Secuencia

Es el orden lógico y ordenado que se da durante el diseño el cual permite poder leer de izquierda a derecha y de arriba hacia abajo con el objetivo de cumplir lo que se pretende con el sistema.

·         Énfasis

Va a depender de lo que se quiera resaltar en el diseño, puede ser el encabezado, el logo o lo que se estime conveniente con la finalidad de que sea lo mas atractivo posible ante la vista de los usuarios.

·         Contraste

Es la parte mas interesante del diseño ya que lleva inmersa ese toque esencial que haga muy interesante de modo que no permita que haya aburrimiento a la hora de explorar el sitio, se hace a través de tamaños, formas, tonos, etc.

·         Equilibrio

Es el control que se logra tener en cada uno de los elementos ya sea en peso, posición que lo constituyen.

-Equilibrio Formal: Los elementos están distribuidos equitativamente de lado a lado.

-Equilibrio Informal: A pesar que los elementos están colocados al azar tienen sentido lógico además tiene efectos que pueden ser distintivos o imaginativos.

UNIDAD 2 GENERALIDADES PARA EL DISEÑO DE SITIOS WEB

• Página Web

Página electrónica o ciberpágina, es un documento o información electrónica capaz de contener texto, sonido, vídeo, programas, enlaces, imágenes, y muchas otras cosas, adaptada para la llamada World Wide Web (WWW) y que puede ser accedida mediante un navegador.

• Sitio Web

Es una colección de páginas de internet relacionadas y comunes a un dominio de Internet o subdominio en la World Wide Web en Internet. Una página web es un documento HTML/XHTML que es accesible generalmente mediante el protocolo HTTP de Internet. Algunos sitios web requieren una subscripción para acceder a algunos o todos sus contenidos. Ejemplos de sitios con subscripción incluyen algunos sitios de noticias, sitios de juegos, foros, etc.

• Diseño Web

Es una actividad que consiste en la planificación, diseño, implementación y mantenimiento de sitios web. No es simplemente la implementación del diseño convencional ya que se abarcan diferentes aspectos como el diseño gráfico web; diseño de interfaz y experiencia de usuario, como la navegabilidad, interactividad, usabilidad, arquitectura de la información; interacción de medios, entre los que podemos mencionar audio, texto, imagen, enlaces, vídeo y la optimización de motores de búsqueda. A menudo muchas personas trabajan en equipos que cubren los diferentes aspectos del proceso de diseño, aunque existen algunos diseñadores independientes que trabajan solos.

1.6 La Web e Internet

•         La Web 2.0

El término Web 2.0 o Web Social comprende aquellos sitios web que facilitan el compartir información, la interoperabilidad, el diseño centrado en el usuario y la colaboración en la World Wide Web. Un sitio Web 2.0 permite a los usuarios interactuar y colaborar entre sí como creadores de contenido generado por usuarios en una comunidad virtual. Ejemplos de la Web 2.0 son las comunidades web, los servicios web, las aplicaciones Web, los servicios de red social, los servicios de alojamiento de vídeos, las wikis, blog. Es la evolución de las aplicaciones estáticas a dinámicas donde la colaboración del usuario es necesaria.

•         La Web 3.0 o Semántica

La web semántica (del inglés semantic web) es un conjunto de actividades desarrolladas en el seno de World Wide Web Consortium con tendencia a la creación de tecnologías para publicar datos legibles por aplicaciones informáticas (máquinas en la terminología de la Web semántica). Se basa en la idea de añadir metadatos semánticos y ontológicos a la World Wide Web. Esas informaciones adicionales que describen el contenido, el significado y la relación de los datos se deben proporcionar de manera formal, para que así sea posible evaluarlas automáticamente por máquinas de procesamiento. El objetivo es mejorar Internet ampliando la interoperabilidad entre los sistemas informáticos usando "agentes inteligentes". Agentes inteligentes son programas en las computadoras que buscan información sin operadores humanos.

•         Web  4.0

La Web 4.0 propone un nuevo modelo de interacción con el usuario más completo y personalizado, no limitándose simplemente a mostrar información, sino comportándose como un espejo mágico que dé soluciones concretas a las necesidades del navegante. Es una capa de integración necesaria para la explotación de la Web semántica y sus enormes posibilidades. Es un nuevo modelo de Internet que nace con el objetivo de resolver las limitaciones de la Red a día de hoy.

•         Internet 2

Internet 2 (I2) o UCAID (University Corporation for Advanced Internet Development) es un consorcio sin ánimo de lucro que desarrolla aplicaciones y tecnologías de redes avanzadas, la mayoría para transferir información a alta velocidad. Una red telemática desarrollada principalmente por universidades estadounidenses que utiliza fibra óptica y provee servicios de red para la investigación y la educación, otorgando una red de prueba segura y un ambiente de investigación. A finales de 2007, Internet 2 comenzó a operar su más reciente Red de Circuito Dinámico (DCN), el Internet2 DCN, una tecnología avanzada que permite la asignación de circuitos de datos en la red de fibra óptica basándose en el usuario. Estas tecnologías incluyen herramientas para la medición y gestión del rendimiento de redes de gran escala, identidad segura y herramientas para la gestión de accesos, así como capacidades para agendar circuitos de alto rendimiento y gran ancho de banda.

1.5 Origen y Como Funciona Internet

1.4 Direcciones de Internet

• Dirección de E-Mail:

Es un servicio gratuito en el que puedes enviar y recibir mensajes de manera instantánea a través de Internet, incluiyendo fotografías o archivos de todo tipo, para crearlo necesitas donde el nombre de usuario que es un nombre elegido por una persona o entidad y el nombre de anfitrión es el proveedor de E-Mail, el símbolo del centro se llama arroba.


Ejemplos:

1- hugofp_@hotmail.com

•  Dirección Web:

Una Dirección web es el nombre de un documento o información electrónica adaptada para la World Wide Web y que puede ser accedida mediante un navegador para mostrarse en un monitor de computadora o dispositivo móvil. Esta información se encuentra generalmente en formato HTML o XHTML, y puede proporcionar navegación a otras páginas web mediante enlaces de hipertexto.

Ejemplos:

1- http://comporsolutions.com/
2- http://www.salud.gob.sv/
3- http://www.ugb.edu.sv/
4- https://www.payless.com/
5- http://www.isdemu.gob.sv/

•  Dirección de Internet:

 Las direcciones de Internet pueden ser simbólicas o numéricas:

Las direcciones simbólicas son las que usualmente utilizamos los humanos porque son más fáciles de recordar que las numéricas. Estas direcciones son cadenas de caracteres separadas por puntos. 

 Ejemplos:

1- www.pizzahut.com
2- www.pollocampestre.com
3- www.dominospizza.com
4- www.coca-cola.com
5- www.pepsi.com 

Las direcciones numéricas son las que usualmente utiliza el software IP. La forma numérica es una secuencia de 32 bits. Para que sea más inteligible, habitualmente se expresa en forma de números decimales separados por puntos (dotted-decimal en inglés), donde cada decimal representa 8 bits (rango 0-255). Por ejemplo, la dirección binaria 10010011. 01010011. 00010100. 00000010 se puede expresar en notación decimal como 147.83.20.2 (que a su vez se corresponde con la dirección simbólica www.upc.es). 
    
 Ejemplos:

1- 23.39.137.33  
2- 192.241.208.213
3-  205.218.22.49
4-  179.51.50.233
5-  179.51.50.234

• Estructura de una URL:

Un localizador de recursos uniforme (conocido por la sigla URL, del inglés Uniform Resource Locator). El URL es una cadena de caracteres con la cual se asigna una dirección única a cada uno de los recursos de información disponibles en Internet. Existe un URL único para cada página de cada uno de los documentos de la WWW, para todos los elementos de Gopher y todos los grupos de debate Usenet, y así sucesivamente.

Ejemplos:

1- https://www.siman.com/elsalvador/ 
2- http://www.superselectos.com/
3- https://shop.pricesmart.com/
4- http://www.walmart.com.mx/#/tecnologia-y-hogar
5- http://www.prismamoda.com/

• Dominios de Nivel Superior:

Un dominio de nivel superior o TLD (del inglés top-level domain) es la más alta categoría de las FQDN que es traducida a direcciones IP por los DNS oficiales de Internet. Los nombres servidos por los DNS oficiales son administrados por la Internet Corporation for Assigned Names and Numbers (ICANN). Alternativamente a los DNS oficiales hay una serie de servicios de DNS alternativos, como es OpenNIC.

Ejemplos:

1- .org 
2- .edu  
3- .gob
4- .net
5- .tv