DISEÑO Y APLICACIONES WEB
Este diseño web y las aplicaciones incluyen los estándares para la creación de paginas web, incluidos HTML, CSS, SVG, API de dispositivos y demás tecnologías para aplicaciones web. Además de información con la cual sabremos como hacer accesibles las paginas para personas con discapacidades.
Pagina Ejemplo:
Sitio web: http://www.insor.gov.co/home/
Características:
HTML y CSS
Según los estándares:
HTML es el lenguaje para describir la estructura de las páginas web. HTML da a los autores los medios para:
- Publique documentos en línea con encabezados, texto, tablas, listas, fotos, etc.
- Recupere información en línea a través de enlaces de hipertexto, con el clic de un botón.
- Diseñar formularios para realizar transacciones con servicios remotos, para usar en la búsqueda de información, hacer reservaciones, ordenar productos, etc.
- Incluya hojas de cálculo, videoclips, clips de sonido y otras aplicaciones directamente en sus documentos.
Ejemplo:
CSS es el lenguaje para describir la presentación de las páginas web, incluidos los colores, el diseño y las fuentes. Permite adaptar la presentación a diferentes tipos de dispositivos, como pantallas grandes, pantallas pequeñas o impresoras. CSS es independiente de HTML y se puede utilizar con cualquier lenguaje de marcado basado en XML. La separación de HTML de CSS hace que sea más fácil mantener los sitios, compartir hojas de estilo en las páginas y adaptar las páginas a diferentes entornos.
Ejemplo:
API WEB DE JAVASCRIPT
Las API estándar para el desarrollo de aplicaciones web del lado del cliente incluyen aquellas para Geolocalización, XMLHttpRequest y widgets móviles. Los estándares W3C para modelos de documentos (el "DOM") y tecnologías como XBL permiten a los proveedores de contenido crear documentos interactivos a través de secuencias de comandos.
Ejemplo:
GRÁFICOS
La Web es algo más que texto e información, también es un medio para expresar creatividad artística, visualización de datos y optimizar la presentación de información para diferentes audiencias con diferentes necesidades y expectativas. El uso de gráficos en los sitios web mejora la experiencia para los usuarios, y W3C tiene varias tecnologías diferentes y complementarias que trabajan junto con HTML y scripting para proporcionar a los creadores de páginas web y aplicaciones web las herramientas que necesitan para ofrecer la mejor representación posible de su contenido.
Ejemplo:
Como observamos la pagina trae imágenes en formato .png
AUDIO Y VÍDEO
El audio y el vídeo se utilizan para mejorar la experiencia con las páginas web (por ejemplo, el fondo de audio) para el servicio de música, vídeos familiares, presentaciones, etc. Las pautas de accesibilidad del contenido web recomiendan siempre ofrecer alternativas para los medios basados en el tiempo, como subtítulos, descripciones, o lenguaje de señas.
Ejemplo:
ACCESIBILIDAD
La Iniciativa de Accesibilidad Web del W3C (WAI, por sus siglas en inglés) reúne a personas de la industria, organizaciones de discapacidad, gobierno y laboratorios de investigación de todo el mundo para desarrollar pautasy recursos para ayudar a que la Web sea accesible para personas con problemas auditivos, cognitivos, neurológicos, físicos, del habla. y discapacidades visuales.
Ejemplo:
WEB MÓVIL
En los últimos años, W3C ha desarrollado una serie de tecnologías web que tienen en cuenta explícitamente las características específicas de los dispositivos móviles:
- CSS Mobile , un perfil del lenguaje de hojas de estilo en cascada que coincide con la necesidad de los autores web móviles
- SVG Tiny , un perfil del formato de gráficos vectoriales escalables de la web que se adapta bien a las capacidades de los dispositivos móviles
- XHTML para móviles , que define un subconjunto de XHTML para móviles
Los navegadores móviles de última generación son capaces de utilizar tecnologías web más avanzadas, incluidas las funciones de HTML5 , CSS 2.1 y 3 , una serie de API de JavaScript enriquecidas , que abren el camino para las aplicaciones móviles basadas en web (incluidos los widgets ).
Ejemplo:
A continuación dos imágenes que contienen como se ve la pagina desde una dispositivo móvil.
Pantallazo #1
Pantallazo #2








No hay comentarios:
Publicar un comentario