Andrea Carolina RuízJohana Mora Fuentes

BENCHMARKING DE PÁGINAS WEB4° PROYECTO DE INVESTIGACIÓN FORMATIVA

¡ En Busca de

Elementos CooL !

ORIGINALIDADNAVEGABILIDAD

SERVICIOSDISEÑO

www.poli.edu.coDESVENTAJAS DEL PORTAL

www.poli.edu.co

* Tiene poca diversidad de colores y no son llamativos.* La tipografía del menú de contenido es anticuada y muy formal (Serifa)* El contenido de las noticias es extenso y se desaprovecha espacio para más imágenes.* La estructura es cuadriculada, plana, con demasiado texto y encajonada toda a la vez.* La malla curricular de las carreras tiene un diseño tipo excel, no es clara, está incompleta y no es llamativa.

* La disposición de links es desorganizada, no hay cajas de diseño que faciliten el acceso a los diferentes temas de interés.* Al entrar por los perfiles de la comunidad, se repiten las noticias que ya han salido en la página de inicio. Hay demasiado texto y esto distrae el acceso a las páginas.* La opción “Buscar” está muy perdida, es poco visible.* Para ingresar a cualquier tema, hay que “dar mucha vuelta” y hay links repetidos (Consultas de servicios). (Consultas de servicios).

* Hay bastantes servicios y links de interés, por lo que es un laberinto entrar a cada uno.* No hay un espacio donde se puedan encontrar los horarios de los docentes y datos relevantes para encontrarlos.* Los iconos de redes sociales aparecen en el intro. Las personas entran rápido sin verlo y estos iconos pasan casi que desapercibidos.* El Bienestar Universitario es un espacio que da ventaja al Poli, y en la página hay poca información sobre las actividades que ofrece. información sobre las actividades que ofrece.

* El lenguaje del menú de servicios es muy técnico, no es amigable o informal.* Aunque se implementan los banners en flash, no hay un estilo propio del Poli que se aplique a la página, como un personaje, un lenguaje play o un diseño particular.* La información se ve plana, como si fuera un documento en word, no hay cajas tipo banner también para el texto y los links son hipervínculos básicos, sin imágenes.

POLITÉCNICO GRANCOLOMBIANO

www.ucjc.eduDES INTERNACIONALES

www.ucjc.eduUNIVERSID@DES INTERNACIONALESUNIVERSIDUNIVERSIDAD CAMILO JOSÉ CELA

* Facilidad de acceso para estudiantes y visitantes* Pestañas laterales de guía virtual o presencial* Presencia en redes sociales, comunidad 2.0* Lenguaje juvenil y personalizado (Soy) * Noticias: sólo está el título, es más organizado* Hay poco texto, es limpio. La información formal de la U la fortalecen con videos guía, imágenes o links. la fortalecen con videos guía, imágenes o links.* Hay colores llamativos y tipografía moderna,* El acceso por perfil es más claro y cada uno tiene suspropios servicios con imágenes.* La opción de Buscar es fácil de encontrar.

www.dit.ieDES INTERNACIONALES

www.dit.ieUNIVERSID@DES INTERNACIONALESUNIVERSIDINSTITUTO DE TECNOLOGÍA DE DUBLÍN

* Las noticias importantes tienen un sistema slideshare, en donde sale una foto del evento y un titular. Esto despeja la visión, y al dar clic encima sale la descripción detallada de la noticia.* La comunidad 2.0. está siempre visible en todas las páginas del portal de la U.* La opción Buscar es fácil de encontrar* La opción Buscar es fácil de encontrar* El calendario de eventos tiene un historial por años.* La tipografía es moderna (palo seco).

* La información está organizada en un menú horizontal superior y a su vez hay submenús diferenciados por colores llamativos. Estos contienen links de los temas, lo que facilita la navegabilidad a la información detallada deseada.

www.nuigalway.ieDES INTERNACIONALESwww.nuigalway.ie

UNIVERSID@DES INTERNACIONALESUNIVERSIDUNIVERSIDAD NACIONAL DE IRLANDA, GALWAY* Es un portal más audiovisual que textual. Hay videos de los diferentes servicios y actividades que ofrece la universidad (Bienestar), con links a youtube.* Sólo hay links de imágenes o texto en las páginas principales. Es organizado, no hay texto disperso.* La opción Buscar es fácil de encontrar* La tipografía es moderna (palo seco).* La tipografía es moderna (palo seco).* Es fácil navegar entre los links de las páginas, por de botones propios del portal:

* Hay un mapa interactivo del campus, muy útil para nuevos estudiantes.* El contenido es claro y al grano. Aprovechan cada espacio para comunicar.* Es un portal muy original, organizado por banners y videos propios muy profesionales.

www.upla.clDES LATINOAMERICANAS

www.upla.clUNIVERSID@DES LATINOAMERICANASUNIVERSIDUNIVERSIDAD DE PLAYA ANCHA

* Hay botones desplegables de colores que facilitan la navegación a perfiles de la comunidad.* La agenda muestra los eventos del mes y son todos visibles, gracias a que se va desplazando hacia arriba.* Hay links de las diferentes modalidades de educación.* La opción Buscar es fácil de encontrar* La tipografía es moderna (palo seco).* La tipografía es moderna (palo seco).* Hay diferentes banners de información que reemplazan el texto en detalle.

* Hay un espacio en el que se pueden expresar docentes y estudiantes (artículos).* Hay cajas organizadas de sitios relacionados y eventos académicos próximos.* Las noticias relevantes están expuestas organizadas con una imágen y su título.

www.colson.edu.mxDES LATINOAMERICANASwww.colson.edu.mx

UNIVERSID@DES LATINOAMERICANASUNIVERSIDCOLEGIO DE SONORA

* Muestra las convocatorias que son de interés para estudiantes y docentes* Hay un calendario de eventos detallado (Conferencias con fecha, hora y lugar)* Banner directo a la Librería y a la revista en línea* La opción Buscar es visible (con google) * La tipografía es moderna (palo seco).* La tipografía es moderna (palo seco).* Hay una barra de menú con enlaces desplegables, es organizado y de fácil navegación..

* Hay un banner principal que muestras las convocatorias y publicaciones de interés. Es de fácil lectura.* Las cajas de información permiten navegar fácilmente.

www.escuelagastronomicaego.comDES COLOMBIANAS

www.escuelagastronomicaego.comUNIVERSID

www.escuelagastronomicaego.com@

www.escuelagastronomicaego.comDES COLOMBIANASUNIVERSIDESCUELA GASTRONÓMICA DE OCCIDENTE

* Iconos de inicio de fácil navegación con menú desplegable* Slideshare donde muestran los programas que ofrece la escuela y permite entrar a información detallada.* Listado de noticias rotativo* Fotos llamativas en el inicio de las actividades de la escuela* Cajas de información modernas con tipografía y colores llamativos. llamativos.* Manejo de degradados y volumen en las cajas de hipervínuculo* Información detallada, organizada por links de interés.

* Fácil navegación (despejado).* Comunidad 2.0.* Banner donde se destaca estudiantes por buenos resultados

www.artesyletras.com.coDES COLOMBIANAS

www.artesyletras.com.coUNIVERSID@www.artesyletras.com.co

DES COLOMBIANASwww.artesyletras.com.coUNIVERSIDESCUELA DE ARTES Y LETRAS

* Las actividades de Bienestar Universitario son destacadas por pequeñas cajas diseñadas con el logo de cada una.* Es muy original encontrar un diseño del portal específico para cada época que se celebre (Halloween).

* El menú desplegable de la barra de contenidos facilita la navegación desde la página principal. * Las noticias se pueden visualizar en un Slideshare, y se puede navegar entre ellas por botones.* El diseño de contenidos tiene lecturabilidad, es ordenado, sencillo pero llamativo.* La tipografía usada en todo el portal es la misma * La tipografía usada en todo el portal es la misma (palo seco), y contrasta con el contenido.* Cajas de información modernas con degradados. * El reconocimiento por premios y logros de la comunidad es más visible en el banner principal.

www.lasallecollege.edu.coD INTERNACIONAL-COLOMBIANAwww.lasallecollege.edu.co

UNIVERSID@D INTERNACIONAL-COLOMBIANAUNIVERSIDLASALLE COLLEGE INTERNATIONAL

* La forma en que muestra las alianzas internacionales es por una ventana desplegable con transparencia* El menú de contenidos se encuentra en barras sencillas pero de colores llamativos, con degradado y de fácil navegabilidad.

* Es una pagina muy interactiva, dinámica, con un diseño juvenil.* Los Iconos de las carreras que ofrece están en el “Home” y esto facilitat la navegabilidad.* El diseño es principalmente visual, con imágenes y poco texto.* La tipografía usada es moderna (palo seco).* La tipografía usada es moderna (palo seco).* Cajas de información modernas con degradados.* Es original que en el “Home” esté la imágen del campus y los estudiantes están en movimiento.

www.los40.comS DE ENTRETENIMIENTOwww.los40.com

PÁGIN@S DE ENTRETENIMIENTOPÁGINLOS 40 PRINCIPALES

* El portal dispone de una sección llamada “Comunidad”, en donde las personas se pueden identificar con una imágen y nombre de usuario.* Se pueden visualizar grupos de personas, formados según intereses.* Existe un espacio para mostrar blogs de personajes destacados.* Hay un chat y encuestas.

* El diseño es principalmente visual, con imágenes en el “Home” que ubican al usuario y hay poco texto.* La distribución de cajas de información es adecuada porque se aprovecha cada espacio de la página.* Las noticias muestran un link del título y/o imágen, para después encontrar en una página nueva la información detallada.* El diseño de la tipografía y colores es llamativo, moderno.* El diseño de la tipografía y colores es llamativo, moderno.

www.terra.com.coS DE ENTRETENIMIENTOwww.terra.com.co

PÁGIN@S DE ENTRETENIMIENTOPÁGINTERRA

* Las noticias y eventos están distribuidos por temas de interés ( deportes, economía...). Esto facilita la navegabilidad.* Hay espacio para encuestas.* Existe la opción de mirar las noticias más vistas por los usuarios.

* Hay una barra donde el menú tiene ventanas desplegables, esto facilita la navegabilidad.* La opción Buscar es fácil de encontrar.* Hay iconos laterales de los servicios de la página y al pasar el cursor sobre ellos, indica el nombre (e-mail, horóscopo..)* El diseño de la tipografía es moderno y está por varios tamaños para indicar su relevancia. Esto da orden y lecturabilidad. para indicar su relevancia. Esto da orden y lecturabilidad.* Las noticias se encuentran en banners de contenido, donde hay botones que permiten desplazarse entre ellas.

www.nike.com/nikeos/p/nike/es_ES/?ref=PÁGINAS DE ENTRETENIMIENTO

www.nike.com/nikeos/p/nike/es_ES/?ref=NIKE

* Pestañas laterales y superiores desplegables de fácil navegación* La opción buscar es visible* La imagen principal no es animada pero es dinámica* El manejo de los colores y las tipografías de los enlaces son llamativos* No hay saturacion de texto en la pagina principal* No hay saturacion de texto en la pagina principal* La navegación es facíl ya que sus links se dividen en categorías

* En la parte de abajo se encuentran las diferentes categorías que brinda la marca, utilizando una breve descripción de cada una junto con una imagen, lo que lo hace mas entendible y de acceso rápido.

www.thekillersmusic.comPÁGINAS DE ENTRETENIMIENTOwww.thekillersmusic.comTHE KILLERS

*La página principal es dinámica, cuenta con poco texto*El menú es interactivo con rotación de 360° * En la parte superior cuenta con un menú rápido* La tipografia que maneja es delgada para no quitar visibilidad e importancia a la imagen* Al poner el cursor en algún enlace este sobresale con mayor luminosidad con mayor luminosidad

* Al entrar a cualquier enlace se baja la opacidad del fondo pero este no se pierde* La galeria de imagenes es agradable, destaca la imagen cuando se pasa en cursor por encima* El diseño general de la página es original

www.poli.edu.coPROPUESTA PARA MEJORAMIENTO DEL PORTAL DEL POLIEl portal del Politécnico Grancolombiano debería estructurarse de una forma que no se sature con demasiado texto al visitante, sino que se describan los títulos o noticias importantes y se acompañe de imágenes, además de brindar banners que faciliten la navegación por la página. La propuesta para mejorar la navegación y el diseño de la página del Poli, está distribuida así:

• Cuando la comunidad entra con usuario y contraseña, haya un espacio denominado perfil con un avatar y así mismo se permita la visualización de los demás perfiles de los docentes y estudiantes. Los 40• Toda la información sobre la revista, la emisora, el espacio de tv, etc., administrarla en una página que no tenga acceso sólo vía • Toda la información sobre la revista, la emisora, el espacio de tv, etc., administrarla en una página que no tenga acceso sólo vía moodle para los estudiantes o docentes, sino que este visible para visitantes. Escuela de Artes y letras.• Que exista un foro”que se ponga de moda” donde los estudiantes y docentes opinen sobre temas de la U, y así se crean contactos profesionales y de amistad en la comunidad. Los 40• Colocar los links de redes sociales no sólo en el intro del portal, sino en todas las páginas. Como cada persona entra directa y rápidamente a modalidad presencial o virtual, no alcanza a ser visible esa comunidad 2.0. Camilo José Cela• Que haya un espacio especial y más llamativo denominado “Muro de reconocimientos” para la comunidad que obtenga premios. • Que haya un espacio especial y más llamativo denominado “Muro de reconocimientos” para la comunidad que obtenga premios. Que sea un motivador más salir en la página del Poli y que quede historial de esas personas destacadas, no sólo como noticias pasajeras. Instituto de Dublín• Dar mayor relevancia a las carreras que ofrece la universidad con un enlace directo desde la página principal. Colocar el pensum de cada carrera como la tabla de .pdf que uno conoce en admisiones. Playa Ancha• Hacer interactiva la página donde se muestran las carreras con iconos distintivos de cada una. Lasalle College• Que haya un recorrido virtual de la arquitectura del poli más visible y actualizada, con videos más grandes. • Que haya un recorrido virtual de la arquitectura del poli más visible y actualizada, con videos más grandes. The Killers• Para las personas que están interesadas en conocer la Universidad mostrar videos de los diferentes servicios y actividades que ofrece la universidad. Galway

www.poli.edu.coPROPUESTA PARA MEJORAMIENTO DEL PORTAL DEL POLI

¡ GRACIAS!

• Poner un espacio de testimonios o anécdotas de estudiantes, donde cuenten las diferentes actividades que realizan en la universidad a través de foto galerías. The Killers, Galway• Que haya un espacio para colocar los proyectos de los diferentes Dptos de la U. Un espacio de acceso a todos y de fácil acceso, Proyectos como investigación, grupo de publicidad, con los logros que se han conseguido. Escuela de Artes y letras.• Mostrar los convenios que tiene la U con diferentes empresas, gimnasios, etc. Escuela de Artes y Letras• Que hayan menús de contenido que se desplieguen, así se ve más organizado y el acceso es más fácil. Casi todas.• Tener un calendario de eventos más detallado, mostrar la hora y el lugar del evento. • Tener un calendario de eventos más detallado, mostrar la hora y el lugar del evento. Colegio de Sonora• Contar con una librería virtual donde se pueda ver y adquirir los libros. Colegio de Sonora• Contar con un menú de inicio que sea visible y claro. Escuela Gastronómica• En el inicio mostrar las noticias con una imagen y un titular para que este lleve a la ampliación de la noticia. Instituto de Dublín/Los 40• Al entrar a los diferentes enlaces mantener una caja de titulares de noticias que roten automáticamente. Escuela Gastronómica• Los enlaces de comunidad (Aspirante, Docente, Estudiante, Administrativo, Egresado) tengan mayor visibilidad y sean más llamativos. Nike• Que se distingan las diferentes modalidades de educación en la página de programas académicos y los que ofrece cada modalidad• Que se distingan las diferentes modalidades de educación en la página de programas académicos y los que ofrece cada modalidad (Profesionales, tecnología, postgrado, Educación virtual). Playa Ancha/ Camilo José Cela• La página de inicio sea más interactiva, que contenga animaciones. Lasalle College• La página de bienestar contenga iconos donde se muestren las diferentes actividades. Escuela de Artes y Letras• Que haya un mapa virtual interactivo del campus de la U.. Galway. • Que se dispongan de espacios para realizar encuestas a la comunidad estudiantil, docentes y visitantes. Terra/ Los 40• Definitivamente a nivel de diseño, que la tipografía sea moderna (palo seco), tenga diferentes tamaños por relevancia, se manejen• Definitivamente a nivel de diseño, que la tipografía sea moderna (palo seco), tenga diferentes tamaños por relevancia, se manejen colores llamativos, y el diseño de las cajas de información tengan poco texto, más imágenes y degradado. Casi todas.