Framework CSS

¿Qué es un Framework?

Un framework, entorno de trabajo​ o marco de trabajo​ es un conjunto estandarizado de conceptos, prácticas y criterios para enfocar un tipo de problemática particular que sirve como referencia, para enfrentar y resolver nuevos problemas de índole similar.

En el desarrollo de software, un entorno de trabajo es una estructura conceptual y tecnológica de asistencia definida, normalmente, con artefactos o módulos concretos de software, que puede servir de base para la organización y desarrollo de software. Típicamente, puede incluir soporte de programas, bibliotecas, y un lenguaje interpretado, entre otras herramientas, para así ayudar a desarrollar y unir los diferentes componentes de un proyecto.

Representa una arquitectura de software que modela las relaciones generales de las entidades del dominio, y provee una estructura y una especial metodología de trabajo, la cual extiende o utiliza las aplicaciones del dominio.

Responsive Web Design

En lugar de construir una website para cada tipo de dispositivo (smartphone, tablet, ordenador desktop, laptop e incluso, hoy en día, para smart TV), se crea una sola website utilizando CSS3 media queries y un layout con imágenes flexibles. De esta forma, la website detecta desde qué clase de dispositivo está accediendo el usuario y muestra la versión más optimizada para ese medio, reorganizando los elementos de la web e incluso discriminando algunos de ellos (menos imágenes, más ligeras, redistribución de las columnas en el diseño, menos texto, etc.).

Ventajas de un Framework

Las principales ventajas que nos aporta son las siguientes:

• Acelera el desarrollo de las páginas web, ya que conociendo un poco el framework CSS, se pueden desarrollar las páginas de una manera más rápida que si lo hacemos desde cero.
• Facilita el trabajo en equipo, ya que si hemos desarrollado una página y sus estilos usando un framework, si posteriormente otra persona necesita modificarlos y conoce ese framework, puede mantener la misma línea de desarrollo de las hojas de estilo y esa página web.
• Garantiza que todo lo que se desarrolle sea compatible con todos los navegadores, lo que si tuviéramos que hacer nosotros mismos supondría más tiempo y esfuerzo.
• Los frameworks son mantenidos y evolucionados por la comunidad, por lo que los posibles errores son corregidos y sus funciones van ampliándose.

Desventajas de un Framework

A la hora de utilizar un framework no todo son ventaja, ya que hay una serie desventajas que hay que tener en cuenta. Las principales son estas:

• Al emplear un framework estamos utilizando muchos estilos y muchas librerías y no las estamos empleados todas. Este uso de una gran cantidad elementos hace que nuestra página web pese más y tarde más en descargarse.
• Si utilizamos un framework CCS, salvo que lo personalicemos, lo que requiere más conocimientos, nuestra página web se va a parecer mucho a millones de páginas web diferentes que se han hecho con el mismo framework.
• Un framework CSS tiene una curva de aprendizaje, por lo que si queremos utilizarlo primero tenemos que aprender a hacerlo.
• Otra desventaja muy importante, aunque pueda no parecerlo, es que si utilizamos un framework sin haber aprendido CSS, no vamos a saber hacer cualquier modificación sin el framework, ya que vamos a desconocer la base sobre la que funciona.

Frameworks más utilizados

• Boolstrap
• Foundation
• Bulma
• Milligram
• UI
• Semantic UI
• Materialize
• Pure.css
• Kube

Boolstrap

El framework de desarrollo más conocido y más utilizado en la actualidad, este framework proporciona una gran cantidad de componentes y estilos preestablecidos, un grid responsive de 12 columnas para que organices los componentes de tu sitio web, y una documentación extensa, clara y completa.

Ventajas

• Bootstrap es soportado por la mayoría de navegadores web.
• Framework apoyado por una gran comunidad de desarrollo detrás.
• Muchas plantillas y componentes disponibles están creadas en Bootstrap.
• Buena documentación.

Desventajas

• Utiliza clases CSS no semánticas que “ensucian” tu HTML.
• Tiene la necesidad de utilizar jQuery.
• Si no personalizas tu sitio, se parecerá a muchas webs que utilizan este framework, debido a que es el framework más utilizado en estos momentos.

Foundation

Foundation fue durante mucho tiempo, el rival directo de Bootstrap, actualmente la adopción de este framework no es tan alta como lo es la de Bootstrap, pero esto no significa que Foundation no sea un framework CSS a tener en cuenta.

Ventajas

• Gran cantidad de componentes muy personalizables.
• Extensa y detallada documentación con tutoriales en vídeo en algunas secciones.
• Las clases CSS utilizadas son semánticas, por lo que no ensucian tu HTML.

Desventajas

• La comunidad de Foundation no es tan grande como la de Bootstrap.
• No hay tantos recursos externos disponibles para Foundation.
• Es más complejo que otros frameworks disponibles.

Bulma

Bulma CSS es un framework de desarrollo relativamente nuevo, pero ya ha capturado la atención de una gran número de desarrolladores, Bulma CSS se centra en crear un framework CSS ligero y simple utilizando Flexbox para su sistema de rejilla.

Ventajas

• Una sintaxis semántica, hace que nuestro código sea más comprensible.
• Es un framework ligero, por lo que tu web se verá recompensada a la hora de cargar con rapidez.
• Fácil de usar.
• Muy personalizable y modular, con la posibilidad de exportar solamente los componentes que necesites.
• Un grid responsive basado en flexbox.

Desventajas

• Al ser relativamente nuevo la comunidad que lo apoya no es muy grande, pero crece con fuerza.
• Debido a su temprana edad falta corregir algunos bugs.
• No es una buena opción para navegadores Internet Explorer(pero a quién le importa Internet Explorer).

Milligram

El framework CSS Milligram, con un estilo minimalista y limpio, dice tener un tamaño de solo 2kb, su objetivo es ofrecer un rendimiento alto debido a su tamaño, con una alta productividad, al no tener la necesidad de añadir muchas clases a los elementos HTML para aplicar los diferentes estilos disponibles.

Ventajas

• Un diseño limpio y minimalista.
• Tamaño de solamente 2kb.

Desventajas

• Falta de personalización en los elementos.
• Comunidad pequeña.

UIKit

El siguiente en la lista es UIKit, con un tamaño pequeño, modular, como lo es Bulma CSS y con un estilo minimalista y limpio. UIKit es una buena opción, a tener en cuenta cuando se trata de frameworks CSS en el 2018 para crear tus proyectos web.

Ventajas

• Modular.
• Un tamaño ligero.
• Aspecto cuidado sin necesidad de añadir tu propio CSS.
• Muy Personalizable.

Desventajas

• La nomenclatura de las clases no es muy elegante.
• Falta de una comunidad más grande.

Semantic UI

Semantic UI como su propio nombre indica, está enfocado en un código de programación legible para el programador. En mi opinión Semantic UI es para los desarrolladores que deseen un diseño elegante por medio de un código de programación con un lenguaje natural.

Ventajas

• Carga solamente los elementos que necesitas.
• Amplia gama de elementos muy personalizables.
• Clases realmente semánticas.
• Diseño elegante.

Desventajas

• Un tamaño de archivos demasiado grande comparándolo a su competencia.
• Uso excesivo de Javascript.

Materialize

Si el proyecto con el cual estás involucrado, desea un diseño al estilo material desing como el que tiene Android, no hay ninguna duda de que tu elección debe ser el framework CSS Materialize.

Ventajas

• Gran librería de componentes con un diseño Material Desing.
• Facilidad de uso.
• Buena documentación.

Desventajas

• Un tamaño de archivos grande.

Pure.css

Para diseños web simples una de las opciones disponibles es Pure.css. Todos sus componentes tienen como denominador común la simplicidad, Lo que no es para todos los públicos, Pero no hay duda que si buscas una opción con un tamaño reducido y un estilo sencillo, Pure.css es un buen candidato.

Ventajas

• Una fácil personalización.
• Un tamaño ligero.

Desventajas

• Documentación un poco confusa.
• Falta de estilos en sus componentes, esto puede ser una ventaja o desventaja, depende del gusto de cada uno.

Kube

Kube no es un framework CSS muy usado, pero su estilo me parece muy refinado, por lo que decidí añadirlo a esta lista rodeado de los mejores, y de esta forma dispones de alguna opción más con un diseño diferente a los nombrados más arriba.

Ventajas

• Los archivos CSS son de un tamaño reducido.
• Proyecto estéticamente sólido.

Desventajas

• La comunidad es realmente pequeña, por no decir que no existe.

CSS

¿Qué es CSS3?

El nombre hojas de estilo en cascada viene del inglés Cascading Style Sheets, del que toma sus siglas. CSS es un lenguaje usado para definir la presentación de un documento estructurado escrito en HTML o XML (y por extensión en XHTML).

¿Para qué sirve?

El CSS sirve para definir la estética de un sitio web en un documento externo y eso mismo permite que modificando ese documento (la hoja CSS) podamos cambiar la estética entera de un sitio web, el mismo sitio web puede variar totalmente de estética cambiando solo la CSS, sin tocar para nada los documentos HTML o jsp o asp que lo componen. 

CSS es un lenguaje utilizado para dar estética a un documento HTML (colores, tamaños de las fuentes, tamaños de elemento, con CSS podemos establecer diferentes reglas que indicarán como debe presentarse un documento. Podemos indicar propiedades como el color, el tamaño de la letra, el tipo de letra, si es negrita, si es itálica, también se puede dar forma a otras cosas que no sean letras, como colores de fondo de una pagina, tamaños de un elemento (por ejemplo el alto y el ancho de una tabla. 

Formas de Aplicar CSS

En linea

Esta forma se basa en utilizar el atributo style que las etiquetas HTML permiten. Dentro de este atributo style se colocaría nuestro código CSS3. Ejemplo:

Interna

Para dar solución a los problemas del estilo online, se empezó a generalizar el uso de la etiqueta style. La etiqueta style permite poner en su interior todo el código CSS3 que necesitamos. Puede ser colocada en cualquier parte de nuestro documento HTML y será interpretada por los navegadores, pero tiene que colocarse en nuestro head.

Externo

La etiqueta link sirve para informar de muchas cosas en nuestro HEAD, una de ellas es para indicar al navegador web que tenemos un código CSS3 en un fichero externo que debe ser utilizado para pintar nuestra página.

Con esto conseguimos la independencia entre el HTML y el CSS3, de forma que podemos utilizar el mismo fichero .css para múltiples páginas HTML y cualquier cambio en este fichero CSS se aplicaría a todas las páginas a la vez.

Comentarios en CSS

CSS permite incluir comentarios entre sus reglas y estilos. Los comentarios son contenidos de texto que el diseñador incluye en el archivo CSS para su propia información y utilidad. Los navegadores ignoran por completo cualquier comentario de los archivos CSS, por lo que es común utilizarlos para estructurar de forma clara los archivos CSS complejos.

El comienzo de un comentario se indica mediante los caracteres /* y el final del comentario se indica mediante */, tal y como se muestra en el siguiente ejemplo:

/* Este es un comentario en CSS */

Los comentarios pueden ocupar tantas líneas como sea necesario, pero no se puede incluir un comentario dentro de otro comentario:

/* Este es un
   comentario CSS de varias
   lineas */

Modelo de Cajas en CSS

El modelo de cajas o "box model" es seguramente la característica más importante del lenguaje de hojas de estilos CSS, ya que condiciona el diseño de todas las páginas web. El modelo de cajas es el comportamiento de CSS que hace que todos los elementos de las páginas se representen mediante cajas rectangulares.

Las cajas de una página se crean automáticamente. Cada vez que se inserta una etiqueta HTML, se crea una nueva caja rectangular que encierra los contenidos de ese elemento. La siguiente imagen muestra las tres cajas rectangulares que crean las tres etiquetas HTML que incluye la página:

Los navegadores crean y colocan las cajas de forma automática, pero CSS permite modificar todas sus características. Cada una de las cajas está formada por seis partes, tal y como muestra la siguiente imagen:

Elementos en Linea y de Bloque

Los elementos de bloque ("block elements" en inglés) siempre empiezan en una nueva línea y ocupan todo el espacio disponible hasta el final de la línea. Por su parte, los elementos en línea ("inline elements" en inglés) no empiezan necesariamente en nueva línea y sólo ocupan el espacio necesario para mostrar sus contenidos.

Propiedades Abreviadas en CSS3

Propiedades abreviadas son propiedades CSS que permiten asignar el valor de muchas otras propiedades de CSS al mismo tiempo. Usando una propiedad abreviada ('shorthand'), se pueden escribir hojas de estilo más concisas (y a menudo más legibles), ahorrando tiempo y energía.

Herencia, Cascada y Especificidad en CCS

Herencia

La herencia en CSS es el mecanismo mediante el cual determinadas propiedades de un elemento padre se transmiten a sus hijos. De hecho, se parece mucho a la herencia genética. Si los progenitores tienen los ojos azules, los hijos seguramente también tendrán los ojos azules.

Cascada

CSS significa cascading style sheets (hojas de estilo en cascada) y, por lo tanto, no debería extrañarnos que la cascada sea un concepto importante. Es el mecanismo que controla el resultado final cuando se aplican varias declaraciones CSS contrapuestas al mismo elemento.

Especificidad

La especificidad es algo que todos los autores de CSS deben comprender y tener en cuenta. Puede considerarse una medida de cuán específico es el selector de una regla. Un selector de especificidad baja puede dar como resultado muchos elementos (como *, que da como resultado todos los elementos del documento), mientras que un selector con una especificidad elevada puede que sólo dé como resultado un único elemento de una página (como #nav, que sólo da como resultado el elemento con una id de nav).

Minificar Recursos en CSS

Se entiende por "minificación" el proceso mediante el cual se eliminan datos innecesarios o redundantes de un recurso sin que se vea afectada la forma en que los navegadores lo procesan. Por ejemplo, eliminar comentarios y formato innecesario, retirar código que no se usa, emplear variables y nombres de funciones más cortos, etc.

FlexBox en CSS30 

Hasta hace relativamente poco, podríamos incluso decir “todavía” si tu desarrollo requiere de una alta compatibilidad en versiones antiguas de navegadores, maquetar módulos adaptables para web tales como listados en filas de N bloques suponía crear una larga lista de estilos css que cambiaban según la resolución de los diferentes dispositivos. En ocasiones “flotábamos” los elementos y nos las veíamos con los márgenes laterales, en otras aplicábamos “inline-block” y utilizábamos alguna técnica extraña para no contar con la separación que se creaba entre capas por arte de magia, añadíamos una capa vacía al final del listado para poder justificar el conjunto, y un largo etcétera de desventajas que Flexbox viene a solucionar.

 

Qué es Flexbox y cómo se utiliza.

Flexbox viene de “Flexible Box Layout“, que se puede traducir como “Diseño de caja flexible“, y nos aporta una magnífica solución para todos nuestros desarrollos “responsive”. Lo que nos permite es crear un conjunto de elementos flexibles que se adaptan automáticamente a su contenedor y con el que podemos controlar parámetros tales como la alineación, dirección (horizontal/vertical), ajuste de la fila según tamaños y multitud de posibilidades que vamos a presentar en este artículo.

En cuanto a compatibilidad, Flexbox es actualmente compatible con los navegadores web más importantes y diferentes versiones de los mismos, si bien en algunos debemos utilizar prefijos css para su buen funcionamiento (ver en caniuse.com). Si tenéis problemas con algunas versiones antiguas, podéis probar a utilizar “Autoprefixer“. En los siguientes ejemplos utilizaremos el código css tal cual, sin añadidos, así que espero que vuestro navegador esté actualizado.

La última definición conocida sobre Flexbox del W3C es del 26 de Mayo de 2016 en el momento de escribir este artículo. En el enl

Fundamentos Web

Red de Computadoras

Una red de computadoras (también llamada red de ordenadores, red de comunicaciones de datos o red informática) es un conjunto de equipos nodos y software conectados entre sí por medio de dispositivos físicos o inalámbricos que envían y reciben impulsos eléctricos, ondas electromagnéticas o cualquier otro medio para el transporte de datos, con la finalidad de compartir información, recursos y ofrecer servicios. Como en todo proceso de comunicación, se requiere de un emisor, un mensaje, un medio y un receptor. La finalidad principal para la creación de una red de ordenadores es compartir los recursos y la información en la distancia, asegurar la confiabilidad y la disponibilidad de la información, aumentar la velocidad de transmisión de los datos y reducir el costo. Un ejemplo es Internet, el cual es una gran red de millones de ordenadores ubicados en distintos puntos del planeta interconectados básicamente para compartir información y recursos.

Internet

Red informática de nivel mundial que utiliza la línea telefónica para transmitir la información. El nombre Internet procede de las palabras en inglés ”Interconnected Networks”, que significa “redes interconectadas”. Internet es la unión de todas las redes y computadoras distribuidas por todo el mundo, por lo que se podría definir como una red global en la que se conjuntan todas las redes que utilizan protocolos TCP/IP y que son compatibles entre sí. 

Página Web

Una página web, o página electrónica, página digital, 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 web. Esta información se encuentra generalmente en formato HTML o XHTML, y puede proporcionar acceso a otras páginas web mediante enlaces de hipertexto. Frecuentemente también incluyen otros recursos como pueden ser hojas de estilo en cascada, guiones (scripts), imágenes digitales, entre otros. Es frecuente ver a personas referirse con "página web" a un sitio web completo. Siendo rigurosos, esto es incorrecto ya que "página web" se refiere a una página concreta, con una URL específica y no a un sitio completo compuesto por múltiples páginas web con diferentes URL.

Sitio Web

Un sitio web, portal o cibersitio es una colección de páginas web relacionadas y comunes a un dominio de internet o subdominio en la World Wide Web dentro de Internet.

A las páginas de un sitio web se accede frecuentemente a través de un URL raíz común llamado portada, que normalmente reside en el mismo servidor físico. Los URL organizan las páginas en una jerarquía, aunque los hiperenlaces entre ellas controlan más particularmente cómo el lector percibe la estructura general y cómo el tráfico web fluye entre las diferentes partes de los sitios.

Clasificación de los Sitios Web

Por Dinamismo

• Interactivos: El usuario puede influir sobre el contenido del sitio que variará en función de cada usuario y de los objetivos de éste. Normalmente, las páginas se generan cuando el usuario las solicita, personalizando la información que se le ofrece.
• Estáticos: Los usuarios no pueden modificar o añadir nada al sitio, de cuyos contenidos se encargan exclusivamente sus diseñadores.

Por Apertura

• Estructura Abierta: Todos los documentos disponen de su dirección y los usuarios pueden acceder a cualquier punto del WebSite.
• Estructura Cerrada: Limita el acceso a unos pocos puntos de entrada (incluso a uno sólo). Un ejemplo sería un sitio que requiere un registro previo para entrar, el usuario siempre tendría que pasar primero por el registro antes de poder acceder al resto de la página.
• Estructura Semicerrada: A medio camino entre ambas, obliga a los usuarios a acceder por unos puntos específicos, cómo por ejemplo sólo la página principal y las páginas de entrada a las secciones más importantes.

Servicios del Internet

Hoy en día, a través de Internet, es posible realizar muchas operaciones y actividades, ya que son muchos los servicios que ofrece la red. Desde enviar mensajes de correo hasta tener una charla cara a cara, pasando por conversaciones en línea con personas ubicadas en cualquier parte del mundo. Internet nos ofrece una gama de posibilidades que permite mantenernos en contacto e intercambiar información con cualquier persona, sin importar dónde se encuentre. Los servicios en Internet pueden dividirse en dos grandes grupos: los que se ofrecen en tiempo real o síncrono y los que se ofrecen en tiempo diferido o asíncrono. 

• Buscadores
• Correo Electrónico
• Chats
• Foros
• Intercambio de Archivos
• La Videoconferencia

Dominio

Extensión o dominio de Internet es un nombre único que identifica a un sitio web en Internet.

El propósito principal de los nombres de dominio en Internet y del sistema de nombres de dominio (DNS), es traducir las direcciones IP de cada activo en la red, a términos memorizables y fáciles de encontrar. Esta abstracción hace posible que cualquier servicio (de red) pueda moverse de un lugar geográfico a otro en la Internet, aun cuando el cambio implique que tendrá una dirección IP diferente.1​

Sin la ayuda del sistema de nombres de dominio, los usuarios de Internet tendrían que acceder a cada servicio web utilizando la dirección IP del nodo (por ejemplo, sería necesario utilizar http://172.217.10.110/ en vez de http://google.com). Además, reduciría el número de webs posibles, ya que actualmente es habitual que una misma dirección IP sea compartida por varios dominios.

Partes de un Dominio

Se compone de dos partes: el nombre de la web y la extensión del dominio.

Nombre de la Web

Es el nombre con el que quieres identificar a tu web. Puedes elegir el nombre que quieras para tu web, siempre que esté disponible en al menos una de las extensiones de dominio.

Extensión del Dominio

La extensión del dominio es lo que va después del nombre de la web. Hay muchas extensiones de dominio, y cada vez están saliendo más de nuevas, pero la más conocida y la extensión por excelencia sigue siendo “.com”.

Y es la primera opción que tendrías que tener en cuenta a la hora de comprar tu dominio, porque sirve para cualquier tipo de web, porque es la extensión más recordada y porque es la extensión por excelencia en internet.

Tipos de Dominio

Dominios de Nivel Superior Genéricos , (gTLD, generic Top-Level Domain)

Este tipo de dominios son los de uso común y más utlizados a nivel mundial, no se ajustan a un país determinado y sus terminaciones definen el concepto para el cual se utilizan:

• .com = Sitio comercial
• .net = Empresa de servicios de Internet
• .org = Organización sin fines de lucro
• .info = Sitio informativo
• .biz = Sitio de negocios

Dominios de Nivel Superior Geográfico, (ccTLD, country code Top-Level Domain)

Son conocidos también como dominios territoriales y son usados por países o territorios dependientes; se componen de 2 caracteres. Algunos ejemplos de dominios territoriales son:

• .ar - Argentina.
• .br - Brasil.
• .ca - Canada.
• .gt - Guatemala.
• .hk - Hong Kong.
• .jm - Jamaica.

Formas de Almacenar Sitios Web

Hosting

El hosting es un servicio en línea que te permite publicar tu sitio web o aplicación web en Internet. Cuando te registras para un servicio de hosting, básicamente alquilas un espacio en un servidor en el cual puedes almacenar todos los archivos y datos necesarios para que tu sitio web funcione correctamente.

Un servidor es una computadora física que funciona ininterrumpida para que tu sitio web esté disponible todo el tiempo para cualquier persona que quiera verlo. Tu proveedor de hosting es el responsable de mantener el servidor en funcionamiento, protegerlo de ataques maliciosos y transferir tu contenido (texto, imágenes, archivos) desde el servidor a los navegadores de tus visitantes.

Reseller Hosting

Haciendo una traducción simple, podríamos llamarlo como un revendedor de Hosting. Se trata de una persona que contrata un servicio de buena calidad para hospedar  varios sitios web.

VPS

Un servidor virtual privado (VPS, del inglés virtual private server) es un método de particionar un servidor físico en varios servidores virtuales (máquinas virtuales con tareas de servidor) de tal forma que todo funcione como si se estuviese ejecutando en una única máquina. Cada servidor virtual es capaz de funcionar bajo su propio sistema operativo y además cada servidor puede ser reiniciado de forma independiente.

Almacenamiento de la Nube

Almacenamiento en la nube (o cloud storage, en inglés) es un modelo de servicio en el cual los datos de un sistema de cómputo se almacenan, se administran, y se respaldan de forma remota, típicamente en servidores que están en la nube y que son administrados por un proveedor del servicio. Estos datos se ponen a disposición de los usuarios a través de una red, como lo es Internet.

Al hablar de almacenamiento en la nube, se busca mantener las ventajas principales de un sistema en la nube, como son: elasticidad en el espacio que puedes usar, y que sea un servicio por demanda, que en este caso se maneja por bloques de información, por ejemplo puedes contratar 5GB, 10GB, 30GB o 100GB, pero no intermedios.

Google Cloud

Google Cloud (Nube de Google), es una plataforma que ha reunido todas las aplicaciones de desarrollo web que Google estaba ofreciendo por separado. Es utilizada para crear ciertos tipos de soluciones a través de la tecnología almacenada en la nube y permite por ejemplo destacar la rapidez y la escalabilidad de su infraestructura en las aplicaciones del buscador.1​

Google Cloud se refiere al espacio virtual a través del cual se puede realizar una serie de tareas que antes requerían de hardware o software y que ahora utilizan la nube de Google como única forma de acceso, almacenamiento y gestión de datos.

Amazon Web Services (AWS)

Amazon Web Services (AWS abreviado) es una colección de servicios de computación en la nube pública (también llamados servicios web) que en conjunto forman una plataforma de computación en la nube, ofrecidas a través de Internet por Amazon.com. Es usado en aplicaciones populares como Dropbox, Foursquare, HootSuite. Es una de las ofertas internacionales más importantes de la computación en la nube y compite directamente contra servicios como Microsoft Azure y Google Cloud Platform. Es considerado como un pionero en este campo.

Microsoft Azure

Microsoft Azure (anteriormente Windows Azure y Azure Services Platform) es un servicio en la nube ofrecida como servicio y alojado en los Data Centers de Microsoft. Microsoft Azure es una plataforma general que tiene diferentes servicios para aplicaciones, desde servicios que alojan aplicaciones en alguno de los centros de procesamiento de datos de Microsoft para que se ejecute sobre su infraestructura (Cloud Computing) hasta servicios de comunicación segura y federación entre aplicaciones.

Tecnologías Utilizadas para Construcción de Sitios Web

HTML

HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se trata de la siglas que corresponden a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto. Prácticamente es el que enseña la información.

CSS

CSS, es una tecnología que nos permite crear páginas web de una manera más exacta. CSS son las siglas de Cascading Style Sheets, en español Hojas de estilo en Cascada. En este reportaje vamos a ver algunos de los efectos que se pueden crear con las CSS sin necesidad de conocer la tecnología entera. Prácticamente es para el diseño.

JavaScript

JavaScript (abreviado comúnmente JS) es un lenguaje de programación interpretado, dialecto del estándar ECMAScript. Se define como orientado a objetos,​ basado en prototipos, imperativo, débilmente tipado y dinámico.

Se utiliza principalmente en su forma del lado del cliente (client-side), implementado como parte de un navegador web permitiendo mejoras en la interfaz de usuario y páginas web dinámicas​ aunque existe una forma de JavaScript del lado del servidor (Server-side JavaScript o SSJS). Su uso en aplicaciones externas a la web, por ejemplo en documentos PDF, aplicaciones de escritorio (mayoritariamente widgets) es también significativo.

Tecnología Cliente-Servidor

La arquitectura cliente-servidor es un modelo de diseño de software en el que las tareas se reparten entre los proveedores de recursos o servicios, llamados servidores, y los demandantes, llamados clientes. Un cliente realiza peticiones a otro programa, el servidor, quien le da respuesta. Esta idea también se puede aplicar a programas que se ejecutan sobre una sola computadora, aunque es más ventajosa en un sistema operativo multiusuario distribuido a través de una red de computadoras.

Introduccion a Base de Datos

¿Qué es una base de datos?

Una base de datos es una colección de datos organizados y relacionados entre sí, y los fragmentos de datos pueden ser seleccionados rápidamente usando un programa de un ordenador. Una DB (Base de datos en inglés Data Base) también puede ser considerado un almacén el cual permite almacenar grandes cantidades de datos para luego ser encontrados y utilizados de manera más sencilla 

Dato vs Información

Dato

Un dato es una representación simbólica, ya sea numérica, alfabética, algorítmica, etc. También puede ser un atributo o característica de una entidad. Los datos describen entidades, sucesos o hechos empíricos.

Información

En general información es un conjunto de organizado de datos ya procesados, los cuales dan como resultado un mensaje que cambia el estado de conocimiento del sujeto o sistema que recibe dicho mensaje

12 reglas de Codd

Edgar Frank Codd nació en Inglaterra en 1923 e inventó el modelo relacional, por lo cual se le considera el padre de las bases de datos relacional.12 reglas fueron establecidas por él para definir que requiere un sistema de administración de base de datos.

Regla 0: Regla de Fundación. El sistema debe ser relacional, por lo tanto debe ser capaz de dirigir y administrar sus bases de datos enteramente por con sus capacidades de relación.

Regla 1: Regla de la Información. Toda información almacenada en una DB debe ser representada unidireccionalmente por valores en posiciones de las columnas dentro de las filas de tablas. Por lo tanto, la información es representada de manera lógica de una manera, con valores en tablas.

Regla 2: Regla del Acceso Garantizado. Todos los datos deben de ser accesibles sin hesitación o ambigüedad. Cada valor escalar individual en la DB debe ser lógicamente direccionable, especificando el nombre de la tabla, la columna que lo contiene y la llave primaria.

Regla 3 Regla del Tratamiento Sistemático de Valores Nulos. El sistema de DB debe permitir campos nulos. Debe tener una forma de representar "la información que falta y de la información inaplicable" que sea sistemática y distinta de los valores regulares.

Regla 4 Catálogo Dinámico en Línea Basado en el Modelo Relacional. El sistema debe soportar un catálogo en linea, el catálogo relacional, el cual da acceso a la estructura de la base de datos y que debe ser accesible a los usuarios autorizados. 

Regla 5 Regla Comprensiva del Sublenguaje de los Datos. El lenguaje debe de soportar por lo menos un lenguaje relacional que: 

• Tenga una sintaxis lineal.
• Pueda ser utilizado de manera interactiva.
• Tenga soporte de operaciones de definición de datos, operaciones de manipulación de datos, control de la seguridad e integridad y operaciones de administración de transacciones.

Regla 6 Regla de Actualización de Vistas. Todas las vistas que pueden ser actualizadas, deben de ser actualizadas por el sistema.

Regla 7 Alto Nivel de Inserción, Actualización y Borrado. El sistema debe permitir la manipulación de alto nivel en los datos, sobre conjunto de tuplas (tupla es una lista ordenada de elementos), lo cual significa que los datos no solo se pueden recuperar de una base de datos relacional a partir de filas múltiples y/o tablas múltiples, sino que también pueden realizarse inserciones, actualizaciones y borrados sobre varias tuplas y/o tablas al mismo tiempo y no solo sobre registros individuales.

Regla 8 Independencia Física de los Datos. Los programas de aplicación y actividades del terminal permanecen inalterados a nivel lógico aunque realicen cambios en los métodos de acceso o en las representaciones de almacenamiento.

Regla 9 Independencia Lógica de los Datos. Los programas de aplicación y actividades del terminal permanecen inalterados a nivel lógico aunque se realicen cambios a las tablas base que preserven la información. La independencia de datos lógica es más difícil con aplicaciones existentes.

Regla 10 Independencia de la Integridad. Las restricciones de integridad se deben especificar por separado de los programas de aplicación y almacenarse en la base de datos. Debe ser posible cambiar cambiar las restricciones sin afectar innecesariamente a las aplicaciones existentes.

Regla 11 Independencia de la Distribución. La distribución de porciones de DB en distintas localizaciones debe ser invisible a los usuarios de la DB. Los usos existentes deben seguir funcionando con éxito.

Regla 12 La Regla de la No Subversión. Si el sistema proporciona una interfaz de bajo nivel de registro, aparte de una interfaz relacional, esa interfaz de bajo nivel no debe permitir su utilización para subvertir el sistema. 

Motor de Base de Datos 

Un motor de DB es el servicio principal para almacenar, procesar y proteger los datos, ya que proporciona acceso controlado y procesamiento de transacciones rápido para cumplir con los requisitos de las aplicaciones consumidoras de datos. 

SGBD Sistema de Gestión de Base de Datos

Un SGBD es un conjunto de programas que permiten el almacenamiento, modificación y extracción de la información en una base de datos. Los usuarios pueden acceder a la información por medio de herramientas de consulta y de generación de informes.

Bases de Datos Más Utilizadas

Los siguientes gestores de base de datos:

De pago:

• Oracle
• SQL Server

De acceso libre:

• MySQL
• FireBird

Clasificación de DB según su variabilidad

Base de Datos Estáticas

Son DB únicamente de lectura, utilizadas principalmente para almacenar datos históricos que posteriormente puede estudiar el comportamiento de un conjunto de datos a través del tiempo, realizar proyecciones, tomar decisiones y realizar análisis de datos para inteligencia empresarial.

Base de Datos Dinámicas

Son DB donde la información almacenada se modifica con el tiempo, permitiendo operaciones, como actualización, borrado, y edición de datos, además de las operaciones fundamentales de consulta. Por ejemplo: DB utilizada en un supermercado.

Modelos de Bases de Datos

Modelo Jerárquico

En este modelo los datos son organizados en una estructura parecida a un árbol. La estructura permite a la información que se repite y usa relaciones Padre/Hijo. Lo cual implica que un Padre puede tener varios Hijos, pero un Hijo puede tener solo un Padre, o cada registro tiene solo un Padre 

Modelo en Red

Es una base de datos conformada por una colección o set de registros, los cuales están conectados entre sí por medio de enlaces en una red. Un registro es una colección o conjunto de campos (atributos), donde cada uno de ellos contiene solamente un único valor almacenado.

Una estructura de base de datos de red, llamada algunas veces estructura de plex, abarca más que la estructura de árbol: un nodo hijo en la estructura red puede tener más de un nodo padre. En otras palabras, la restricción de que en un árbol jerárquico cada hijo puede tener sólo un padre, se hace menos severa.

Modelo Relacional

Este modelo considera la base de datos como una colección de relaciones. De manera simple, una relación representa una tabla que no es más que un conjunto de filas, cada fila es un conjunto de campos y cada campo representa un valor que interpretado describe el mundo real. Cada fila también se puede denominar tupla o registro y a cada columna también se le puede llamar campo o atributo.

Modelo Orientado a Objetos 

En una base de datos orientada a objetos, la información se representa mediante objetos como los presentes en la programación orientada a objetos. Cuando se integra las características de una base de datos con las de un lenguaje de programación orientado a objetos, el resultado es un sistema gestor de base de datos orientada a objetos (ODBMS, object database management system). Un ODBMS hace que los objetos de la base de datos aparezcan como objetos de un lenguaje de programación en uno o más lenguajes de programación a los que dé soporte. Un ODBMS extiende los lenguajes con datos persistentes de forma transparente, control de concurrencia, recuperación de datos, consultas asociativas y otras capacidades.

Modelo Documental

Una base de datos documental está constituida por un conjunto de programas que almacenan, recuperan y gestionan datos de documentos o datos de algún modo estructurados. Este tipo de bases de datos constituyen una de las principales subcategorías dentro de las denominadas bases de datos NoSQL. A diferencia de las bases de datos relacionales, estas bases de datos están diseñadas alrededor de una noción abstracta de "Documento".

¿Qué es una Relación?

La relación representa una asociación establecida entre campos comunes (columnas) en dos tablas. Existen tres tipos de relaciones, que son: uno a uno, una a varios y varios a varios.

Uno a Uno

En una relación uno a uno (Figura 3), cada registro de la Tabla MATERIA sólo puede tener un registro coincidente en la Tabla PROFESOR y viceversa.

En este ejemplo se está representando que cada materia solamente puede ser dada por un profesor.

Uno a Varios

En este modelo ser representa que mas de un PROFESOR puede dictar la misma MATERIA.

En la relación uno a varios un registro de la Tabla MATERIA puede tener muchos registros coincidentes en la Tabla PROFESOR, pero un registro de la Tabla PROFESOR sólo tiene un registro coincidente en la Tabla MATERIA.

Varios a Varios

En una relación varios a varios, un registro de la Tabla A puede tener muchos registros coincidentes en la Tabla B y viceversa. Este tipo de relación sólo es posible si se define una tercera tabla (denominada tabla de unión), cuya clave principal consta de al menos dos campos; y que además, estos campos, correspondan a las claves externas de las Tablas A y B.

Diseño de Base de Datos

Diseño Conceptual

Durante esta fase, plasmaremos nuestras entidades y las relaciones que existirán entre ellas. Cada entidad la identificaremos con un rectángulo y dentro de este colocaremos su nombre. A cada entidad le colocaremos sus respectivos atributos y resaltaremos el atributo principal, aquél atributo que identificará cada registro de manera única. Y por último crearemos las relaciones que existen entre dichas entidades.

Diseño Lógico

En esta fase, debemos pensar en cómo normalizar nuestras tablas para evitar duplicidad de información y para ahorrar espacio de almacenamiento. Para este proceso, las herramientas de modelado te ayudan bastante a ver las relaciones de las tablas.

Diseño Físico

En esta última fase ya debemos revisar a detalle los tipos de datos que utilizaremos, sus dominios (qué valores va a permitir), cuales índices debemos crear para optimizar las consultas, entre otros.

Ventajas y Desventajas de Base de Datos Relacional

Ventajas

• Provee herramientas que garantizan evitar la duplicidad de registros.
• Garantiza la integridad referencial, así, al eliminar un registro elimina todos los registros relacionados dependientes.
• Favorece la normalización por ser más comprensible y aplicable.

Desventajas

• Presentan deficiencias con datos gráficos, multimedia, CAD y sistemas de información geográfica.
• No se manipulan de forma manejable los bloques de texto como tipo de dato.
• Las bases de datos orientadas a objetos (BDOO) se propusieron con el objetivo de satisfacer las necesidades de las aplicaciones anteriores y así, complementar pero no sustituir a las bases de datos relacionales.

Elementos de una Base de Datos Relacional

• Los datos se organizan en relaciones compuestas por tuplas de atributos. Si convertimos esta definición a tablas tenemos que los datos se organizan en tablas compuestas por filas (registros) y columnas (campos).
• A cada tabla se le asigna un nombre único.
• Una tabla tiene 0 o más filas, y cada fila contiene la información de un determinado ‘sujeto’ de la relación.
• Las filas en un principio están desordenadas.
• La lista de los atributos dispuestos en un orden específico de izquierda a derecha y que forman la definición de una tabla se denomina esquema de la tabla, mientras que los valores concretos de los datos que están almacenados en la tabla se llaman ocurrencias.
  

¿Qué es normalizacion de Base de Datos?

La normalización de bases de datos es un proceso que consiste en designar y aplicar una serie de reglas a las relaciones obtenidas tras el paso del modelo entidad-relación al modelo relacional. 

Las bases de datos relacionales se normalizan para:

• Evitar la redundancia de los datos.
• Disminuir problemas de actualización de los datos en las tablas.
• Proteger la integridad de datos.

En el modelo relacional es frecuente llamar tabla a una relación; para que una tabla sea considerada como una relación tiene que cumplir con algunas restricciones:

• Cada tabla debe tener su nombre único.
• No puede haber dos filas iguales. No se permiten los duplicados.
• Todos los datos en una columna deben ser del mismo tipo.

Formas Normales

Las formas normales son aplicadas a las tablas de una base de datos. Decir que una base de datos está en la forma normal N es decir que todas sus tablas están en la forma normal N.

En general, las primeras tres formas normales son suficientes para cubrir las necesidades de la mayoría de las bases de datos.

Primera Forma Normal:

NO repetir campos en las tablas (atributos atómicos).

Segunda Forma Normal:

Se debe aplicar la 1FN. Cada campo de la tabla debe depender de una clave única, si tuviéramos alguna columna que se repite a lo largo de todos los registros, dichos datos deberían atomizarse en una nueva tabla.

Tercera Forma Normal:

Se debe aplicar la 1FN y 2FN. Los campos que NO son clave NO deben tener dependencias.

Cuarta Forma Normal:

Se debe aplicar la FNBC. La 4FN aplica únicamente para relaciones M a M, y nos ayuda a eliminar la redundancia de información generada por dicho tipo de relación.

¿Qué es SQL?

SQL es un lenguaje específico del dominio utilizado en programación, diseñado para administrar, y recuperar información de sistemas de gestión de bases de datos relacionales​. Una de sus principales características es el manejo del álgebra y el cálculo relacional para efectuar consultas con el fin de recuperar, de forma sencilla, información de bases de datos, así como realizar cambios en ellas.

Lenguaje de definición de datos (DDL)

Permite crear y modificar la estructura de una base de datos.

Lenguaje de manipulación de datos DML(Data Manipulation Language)

Permite recuperar, almacenar, modificar, eliminar, insertar y actualizar datos de una base de datos.

Lenguaje de control de datos (DCL)

Permite crear roles, permisos e integridad referencial, así como el control al acceso a la base de datos.

Lenguaje de control Transaccional (TCL)

Permite administrar diferentes transacciones que ocurren dentro de una base de datos.

ACID

En bases de datos se denomina ACID a las características de los parámetros que permiten clasificar las transacciones de los sistemas de gestión de bases de datos. Cuando se dice que es ACID compliant se indica -en diversos grados- que éste permite realizar transacciones.

En concreto ACID es un acrónimo de Atomicity, Consistency, Isolation and Durability: Atomicidad, Consistencia, Aislamiento y Durabilidad en español.

Cloud Computing

La computación en la nube (del inglés cloud computing),1​ conocida también como servicios en la nube, informática en la nube, nube de cómputo, nube de conceptos o simplemente "la nube", es un paradigma que permite ofrecer servicios de computación a través de una red, que usualmente es Internet.

BIG Data

Big Data es un término que describe el gran volumen de datos, tanto estructurados como no estructurados, que inundan los negocios cada día. Pero no es la cantidad de datos lo que es importante. Lo que importa con el Big Data es lo que las organizaciones hacen con los datos. Big Data se puede analizar para obtener ideas que conduzcan a mejores decisiones y movimientos de negocios estratégicos.

ACTIVIDAD 6

Agrupar y Utilizar Botones de Opción en GUI de Java

Si se quieren botones de selección única, los conocidos como botones radio, que tienen la particularidad de que solamente puede haber uno seleccionado, hay que crearse un grupo de botones, añadiendo botones a ese grupo uno a uno. Pero, Swing permite que cualquier AbstractButton pueda ser añadido a un ButtonGroup.

 

La figura muestra los grupos de botones con la apariencia correspondiente a Swing.

Cargar Datos a un Componente JTable Utilizando DefaultTableModel

A la hora de asignar un dato a una componente tipo JTable, se realiza de la siguiente manera:

DefaultTableModel lista = new DefaultTableModel();

lista.addElement("Se puede asignar un String y un Int");

ArrayList

La clase ArrayList en Java, es una clase que permite almacenar datos en memoria de forma similar a los Arrays, con la ventaja de que el numero de elementos que almacena, lo hace de forma dinámica, es decir, que no es necesario declarar su tamaño como pasa con los Arrays.

¿Cómo se utiliza?

AWT vs SWING

¿Qué es Java AWT?

La Abstract Window Toolkit (AWT, en español Kit de Herramientas de Ventana Abstracta) es un kit de herramientas de gráficos, interfaz de usuario, y sistema de ventanas independiente de la plataforma original de Java. AWT es ahora parte de las Java Foundation Classes (JFC) - la API estándar para suministrar una interfaz gráfica de usuario (GUI) para un programa Java.

¿Qué es Java Swing?

Swing es una biblioteca gráfica para Java. Incluye widgets para interfaz gráfica de usuario tales como cajas de texto, botones, listas desplegables y tablas.

Ventajas y Desventajas de Swing

Ventajas: 

• La portabilidad, debido a que los componentes de swing están hechos solo con java, estos funcionan  en casi cualquier otra plataforma.
• Comportamiento, permite un rango de comportamiento más amplio ya que no están limitados a los sistemas en los que se ejecutan.
• Características, soporta el uso de icono y tool-tips.
• Soporte, Sun hace gran esfuerzo para hacer Swing más robusto.
• Apariencia, los componentes de swing automáticamente pueden tomar la apariencia de cualquier plataforma.

Desventajas:

• Portabilidad de Applets, la mayoría de los navegadores no incluyen las clases de Swing ANSI que se debe de instalar un plugin de java; para que funcionen los applets con swing.
• Desempeño, los componentes de Swing son generalmente más lentos y con más problemas que AWT.

Ventajas y Desventajas de AWT

Ventajas:

• Velocidad, el usar el sistema nativo como base hace que el desempeño de lo componente sea más rápido.
• Portabilidad de applets, casi todo los navegadores soportan las clases AWT así  que applets construidos con AWT puede ejecutarse sin necesidad de plugin de Java.
• Apariencia, los componentes AWT se parecen más al sistema en el que se están ejecutando.

Desventajas:

• Portabilidad, el uso del sistema en el que se ejecutan los componentes. AWT crea algunas limitaciones. Algunos componentes pueden no funcionar en todas las plataformas.
• Los grandes creadores de componentes se han inclinado por el desarrollo de componentes Swing y no AWT, esto hace que el conjunto de componentes AWT se aún más pequeño.
• Características, los componentes AWT no soportan características como íconos y tool-tips.

Principales componentes AWT

Interfaz Gráfica de Usuario (GUI)

¿Qué es una Interfaz de Usuario?

La interfaz de usuario es el medio con que el usuario puede comunicarse con una máquina, equipo, computadora o dispositivo, y comprende todos los puntos de contacto entre el usuario y el equipo.

Normalmente suelen ser fáciles de entender y fáciles de accionar, aunque en el ámbito de la informática es preferible referirse a que suelen ser "usables", "amigables e intuitivos" porque es complejo y subjetivo decir "fácil".

La interfaz de usuario es el espacio donde se producen las interacciones entre seres humanos y máquinas. El objetivo de esta interacción es permitir el funcionamiento y control más efectivo de la máquina desde la interacción con el humano.

Las interfaces básicas de usuario son aquellas que incluyen elementos como menús, ventanas, contenido gráfico, cursor, los beeps y algunos otros sonidos que la computadora hace, y en general, todos aquellos canales por los cuales se permite la comunicación entre el ser humano y la computadora.

El objetivo del diseño de una interfaz es producir una interfaz que sea fácil de usar (explicarse por sí misma), eficiente y agradable para que al operar la máquina dé el resultado deseado.

¿Qué es una Interfaz Gráfica de Usuario?

Es un programa informático que actúa de interfaz de usuario, utilizando un conjunto de imágenes y objetos gráficos para representar la información y acciones disponibles en la interfaz. Su principal uso, consiste en proporcionar un entorno visual sencillo para permitir la comunicación con el sistema operativo de una máquina o computador.

16 Recomendaciones para crear una GUI amigable

• Consistencia. Con una buena interfaz de usuario, se debe requerir la misma secuencia de acciones en situaciones similares. Del mismo modo, se debe usar la misma terminología en cuadros de diálogo, menús y ventanas.
• Rapidez. Se debe procurar que usuarios frecuentes puedan usar atajos, para aumentar el ritmo de interacción. Combinaciones de teclas, accesos directos, comandos ocultos, etc., son de mucha ayuda para un usuario experto.
• Información. Cada operación debe ir acompañada de algún tipo de feedback del sistema en forma de mensajes cortos.
• Estética. Una interfaz atractiva hace que el uso de la interfaz sea más agradable y aumente la satisfacción del usuario final.
• Revocación de acciones. Una buena interfaz no debe castigar al usuario por los errores que comete, sino que debe ofrecerles la posibilidad de ponerles remedio. Al permitir fácil anulación de acciones, por ejemplo mediante un botón de “deshacer”, el usuario se relaja y tiende más a explorar otras opciones del programa.
• La regla de los dos segundos: Idealmente, el usuario no debería tener que esperar más de dos segundos para cambiar o cargar una aplicación. Si por algún motivo, este proceso va a tardar más, es conveniente incluir una pantalla previa con una barra de estado para gestionar las expectativas del usuario. En general, cuanto más rápida sea la carga, mejor será la experiencia.
• La regla del tercer clic: El usuario debería acceder a la información que necesita en dos clics (o deslizamientos de dedo en el caso de pantallas táctiles) o tres como máximo. Si debe hacer más clics, lo más probable es que abandone la página o aplicación.
• La ley de la pirámide invertida: Se trata de aplicar este mismo principio periodístico al diseño de páginas web, de tal forma que la información más general y básica se sitúe al inicio de la página y los detalles más abajo. Así el usuario decide con qué profundidad quiere navegar dentro de la página.
• Coherencia: la coherencia consigue algo muy importante; que toda la aplicación se comporte siempre de manera predecible, tanto en el diseño y ubicación de sus elementos como en su funcionamiento.
• Atajos: los usuarios más frecuentes deben poder utilizar atajos (p.e. mediante cookies, grabando información personal, guardando el carrito de la compra anterior, etc.).
• Diálogo: es importante comunicarse con el usuario a través de mensajes de texto, ya sean de error, alerta o confirmación. Deben estar correctamente redactados, ser precisos y dar la oportunidad de cancelar o deshacer una acción. También conviene ofrecer feedback en todo momento, p.e. en procesos de compra guiados y mostrar barras de estado y progreso que informen claramente al usuario de su proceso.
• Control: el usuario debe tener siempre el mando y una sensación de que controla el proceso, es decir, debe poder modificar sus datos personales, cambiar la dirección de envío de una compra, etc. Es fundamental que tenga la certeza de que puede utilizar la aplicación sin correr peligros ni riesgos. Es decir, que no es posible equivocarse sin que el sistema le advierta antes ni cometer un error sin poder restaurar el estado del proceso. Para ello hay que situar los botones “fatales” en lugares protegidos, nunca en sitios de paso, dotarles de un aspecto acorde a su función y diseñarlos de tal forma que soliciten confirmación.
• Proximidad: las funciones principales deben aparecer inmediatamente, mientras que otras más avanzadas pueden situarse en un lugar menos visible para los nuevos usuarios. Además, los usuarios deben tener siempre a mano las funcionalidades más utilizadas.
• Familiaridad: es importante que la interfaz no exija una formación específica y pueda utilizarse directamente. Esto se consigue basándose en conocimientos previos, conceptos e imágenes de la vida real del usuario. Asimismo, resulta interesante emplear las convenciones habituales de las aplicaciones informáticas en general, ya que el usuario aprovecha sus conocimientos previos en esta área.
• Sencillez: una interfaz llena de funciones avanzadas sólo consigue distraer a los usuarios. Los controles, los elementos y sus relaciones deben tener un significado obvio y comprensible, de tal modo que se entiendan de un solo vistazo.
• Atractivo: la interfaz debe ser visualmente atractiva y utilizar colores fríos o cálidos que estén en consonancia con el objetivo que se desea alcanzar o las sensaciones que se quieren transmitir.