#EscribirEnInternet

Entendiendo a los diseñadores: las claves de su vocabulario

Durante años nos hemos quejado de no entender a los médicos o a los abogados, hoy en día a estas hay que unir nuevas profesiones que han aparecido con las TIC, cada sector con su lenguaje y sus particularidades.

El diseñador web no es solo aquel que diseña y entrega una imagen de cómo ha de ser un proyecto multimedia. El diseño web es una disciplina que exige grandes dosis de creatividad sumadas a un alto nivel técnico. No solo tienen que saber aplicar las bases del diseño de toda la vida: composición, color, tipografía,…  sino que tienen que combinar toda esta base con su aplicación en pantalla: navegabilidad, interactividad, usabilidad, accesibilidad, arquitectura de la información,… y con la interacción de medios como el audio, el texto, la imagen y el vídeo.

Cuando un diseñador web nos comenta su trabajo, o peor aún, cuando dos diseñadores hablan entre ellos, surgen un montón de términos que no conocemos, lo cual dificulta enormemente el entendimiento. Hemos hecho una pequeña recopilación de este lenguaje tan particular con una breve descripción para poder entenderlos:

  • Usabilidad: facilidad de uso de una web por parte de los usuarios.
  • Accesibilidad: acceso universal a todos los contenidos. La accesibilidad intenta mejorar la eficiencia de la web, con el objeto de lograr un contenido global capaz de llegar al mayor número de usuarios con independencia de sus capacidades físicas, técnicas o intelectuales.
  • URL amigables: direcciones web inteligibles, mediante las cuales se puede deducir el contenido.
  • Sitemap: mapa del sitio web.
  • CMS: gestor de contenidos (Content Management System).
  • Avatar: identidad ficticia que individualiza a un usuario en la red, por ejemplo en una aplicación o red social. Puede ser una forma (icono), una imagen (foto), un personaje de comic…
  • Branding digital: imagen de marca en la red. Es el resultado de un conjunto de estrategias y herramientas de marketing y diseño para lograr crear una identidad visual online.
  • Interface: interfaz. La cara visible de un proyecto, lo que nos muestra la pantalla. Además puede referirse a la forma de interrelación entre la máquina y el hombre, actualmente esa interrelación es gráfica, pero se puede tener una interface sonora, por poner un ejemplo.
  • Layout: prototipo gráfico, el boceto de toda la vida. Diseño, boceto gráfico de la web. Aproximación gráfica, simulación a lo que finalmente será la web.
  • Prototipado: Diseño del prototipo en wireframes.
  • Wireframe: Dibujo simple de la estructura de la web, similar en concepto al layout.
  • Crossbrowsing: Comprobar que en todos los navegadores la web se ve bien.
  • Media queries: Proceso que permite definir condiciones específicas en función de los distintos dispositivos o media en los que se ha de visualizar un proyecto.
  • Hojas de estilo o CSS: Cascading Style Sheets, traducido como «hojas de estilos en cascada». Facilidad del HTML que permite crear plantillas de estilo gráfico y aplicarlas a las diferentes páginas de un proyecto, manteniendo elementos comunes en la maquetación como colores, tipografías, tamaños de letras, fondos…
  • W3C: El Consorcio World Wide Web (W3C) es la comunidad internacional de personas que trabajan conjuntamente para desarrollar estándares web.
  • Frames: Es una parte de la programación para web en la que una página puede estar compuesta por distintos frames, marcos, donde cada uno integra un apartado de la web. Por ejemplo, puede haber un frame que integre el menú, en otro el contenido, en otro el pie de página, y la suma de todos ellos es lo que vemos como página web. También puede referirse a un fotograma dentro de una animación, la imagen estática dentro de la serie que integra el proyecto.  Se expresa en fotogramas o frames por segundo (fps).
  • Página estática: Página creada mediante un único archivo html.
  • Página dinámica: distinta de la estática en que su creación se lleva a cabo mediante consultas a base de datos y no directamente a un archivo HTML que contenga el contenido deseado. Son páginas que se generan en el momento en el que un usuario hace una consulta, sumando elementos de diferentes de bases de datos.
  • Footer: pie de página/pantalla. La zona inferior en el diseño de la página donde se suelen poner los datos de contacto, logotipos e información que se repetirá en todas las páginas del proyecto. El equivalente al pie de página en el diseño editorial en papel.
  • Banner: animación publicitaria.
  • Scroll: desplazamiento, descender o ascender, en una pantalla de navegación.
  • Minimación: animaciones en pequeño formato (ancho y alto) con una duración básica, entre 5 y 15 segundos.
  • Microanimaciones: animaciones de elementos del interfaz (botones, menús, etc.).
  • Bitrate: flujo/velocidad de bits (por ejemplo aplicado a la visualización de un video online). Viene del inglés bit rate, ‘tasa de bits’,  y define el número de bits que se transmiten por unidad de tiempo, es la velocidad de transferencia de datos.
  • Webtv: retransmisión de videos online, se asocia a la televisión por internet.
  • Videosharing: sistemas que proporcionan la posibilidad de compartir video, por ejemplo vimeo o youtube.
  • CODEC: códec es la abreviatura de codificador-decodificador. Son tecnologías para comprimir y descomprimir datos.
  • Player de video: reproductor de video.
  • Fullscreen: pantalla completa.
  • Capitular contenidos: dividirlos en capítulos, aplicable también a video.
  • Podcast: sistema de distribución (transmisión por demanda) de archivos multimedia que puede contener subtítulos y notas mediante sindicación de contenidos RSS. También entendemos por podcast un archivo de audio digital.
  • Embeber: insertar un objeto o código de un lenguaje de programación en otro.
  • Plugin: programa que puede introducirse en otro para aumentar las funcionalidades del segundo. En ocasiones, sin el plugin adecuado hay aplicaciones que no funcionan.
  • Fade in: incremento paulatino de volumen y de imagen.
  • Lightbox:Sistema de visualización de galerías de imágenes. Se caracteriza por el uso de efectos (físicas) y modos de ver las imágenes de una forma más atractiva al usuario.
  • Loading: Descargando.
  • Página Home: primera página o página principal de un proyecto.
  • Páginas de «error 404»: es la página que nos devuelve el servidor web cuando no encuentra una página concreta por la que hemos preguntado porque no existe. Se pueden diseñar estas respuestas para que sean acordes con el resto del proyecto.
  • Una página se divide en:
    Header: cabecera donde habitan los menus, espacio para los scripts dinámicos, funciones y enlaces a CSS.
    Wrapper: el cuerpo de la web.
    Footer: pie, faldón, de la web.
  • Template: También conocido como plantillas. Es el conjunto de actores/cosas que forman parte de todo el interface gráfico de un sitio web. El template está formado principalmente por los estilos del sitio CSS y la estructura HTML.
  • Intersticial: tipo de banner que ocupa toda la pantalla del ordenador.
  • Tags: Etiquetas, se usa tanto para el código (HTML, CSS, etc.) de las páginas como para el contenido (palabras clave).
  • Breadcrumbs: (Migas de pan)  Guía textual que nos ayuda a navegar por la web y nos muestra la profundidad de la misma. Esas palabritas que nos van diciendo donde estamos en la web. Es un sistema de navegación alternativa a los menús.
  • Download: Descarga.
  • Mapping: Seleccionar una zona de una imagen y convertirla en interactiva. En 3D aplicar texturas sobre un elemento.
  • Pop Up: Tipo de acción en la que un elemento gráfico salta o flota sobre el interfaz gráfico en una ventana aparte. Vamos, esas ventanitas que saltan y que nos vuelven locos a todos.
  • Hot spot: Zonas puntuales calientes. Espacios, selecciones muy puntuales de una imagen que se convierten en botón (invisible).
  • DIV: Capa o zona en la que se subdivide el diseño del interfaz gráfico de una web. Todos los elementos que componen una web hecha con HTML están dentro de divs. Estos se anidan unos con otros (Divs, dentro divs, dentro divs, padres, hijos, etc.) provocando un tremendo lío en forma de árbol que va desplegando sus ramas y que en realidad forman la estructura, el esqueleto de las páginas web.
  • Html5: Última actualización del lenguaje html.
  • JQuery: Framework para java script.
  • Framework: Conjunto de tecnologías que ayudan a otra para un mejor desarrollo.
  • Botón: Elemento que sirve para interactuar y nos permite pasar de un contenido a otro por medio de él.

Seguro que hay un montón más de ejemplos que se podrían añadir. ¿Cuáles se te ocurren?

Valora esta recomendación

1 Star2 Stars3 Stars4 Stars5 Stars

¡Hola!

¿Has buscado tu consulta?

Si no la encuentras, rellena nuestro formulario: