Desarrollo de tesis

Sistemas de Concursos

Capítulo 1. Internet


Probar cada enlace

No hay nada más desagradable que encontrarse con un enlace que no funciona, para evitar esto dispone de programas que realizan esta operación automáticamente. No cometer faltas ortográficas.

Use un procesador de textos con corrección ortográfica para escribir el texto que va a publicar, además con el uso de un procesador de textos le resultará más cómoda la escritura.

Poner las páginas en contexto

Recuerde que el lector puede llegar a su página desde cualquier sitio, por lo tanto es muy recomendable que se le dé un contexto definido. Recuerde las preguntas básicas. ¿Qué? ¿Quién? ¿Cómo? ¿Cuándo?

Escriba páginas para cualquier navegador

No realice páginas que solo se vean bien en un navegador o en una resolución concreta, incluyendo etiquetas exclusivas de algún navegador. Si usa los estándares propuestos por el W3C sus páginas se visualizarán correctamente en todos los navegadores.

Responda a la gente

Aunque solo sea por cortesía responda a la gente que le hace comentarios sobre sus páginas, aunque no esté de acuerdo con sus opiniones.

Evite que la pantalla parpadee. Existen personas que son fotosensiblemente epilépticas.
<BLINK> y <MARQUEE> no están definidas en ningún estándar de W3C así que no las use.

Formatos como PDF, Shockwave, Flash, etc. Requieren aplicaciones especificas o conectores "plug-ins". Muchos de estos formatos no son accesibles y debería proporcionarse contenido equivalente a estos.

Los elementos como scripts y applets deben ser directamente accesibles o compatibles con tecnologías accesibles.

Tipografía

Una buena tipografía es tan importante en una página Web como en cualquier otro medio escrito. El problema que se presenta en las páginas Web es que se ha de visualizar correctamente en diferentes sistemas y multitud de ordenadores, use los estilos con moderación.

Si quiere resaltar algo use las negritas o el tipo cursiva, pero no abuse de ellos porque si todo está resaltado, el cerebro se acostumbra y deja de parecerle destacado.

El texto pierde fuerza si todas las palabras están resaltadas.

El texto pierde fuerza si todas las palabras están resaltadas .

Use etiquetas del tipo <FONT SIZE=+1> a las de tipo <FONT SIZE=12>

Cada persona puede tener definido un tamaño de letra por defecto distinto. Por ejemplo, si posee un monitor de 14" posiblemente tenga por defecto un tamaño de letra 10, con lo que las etiquetas <FONT SIZE=+1> y <FONT SIZE=12> tendrán el mismo efecto. Pero si posee un monitor de 17", es posible que usted tenga configurado el navegador con un tamaño de letra 14 con lo que <FONT SIZE=+1> aumentaría el tamaño, pero <FONT SIZE=12> lo disminuiría.

  BASE FONT 10 BASE FONT 14
Mal Palabra que se desea aumentar Palabra que se desea aumentar
Bien Palabra que se desea aumentar Palabra que se desea aumentar

Capitalización

Cuando leemos lo primero que observamos es la forma general de las palabras. De manera que un titular con la primera letra de cada palabra en mayúscula es mas atractivo visualmente que todo el titular en mayúsculas.



La mayor cantidad de la información reside en la parte superior de las letras, la vista está acostumbrada a fijarse en la parte superior de las letras por lo que si capitalizamos todas las palabras estaremos obligando a realizar un esfuerzo superior que puede resultar molesto.



La parte superior contiene más información.

Los tamaños de las fuentes son distintos en diferentes ordenadores

No debería ser así pero el hecho es que la misma fuente del mismo tamaño no se representa de igual forma en un sistema basado en Windows que en uno basado en Mac.

No todo el mundo posee las mismas fuentes

Cuando especifica el tipo de fuente con una etiqueta FONT FACE="" ha de saber que puede haber personas que no dispongan de ese tipo de letra. Afortunadamente, usted puede especificar varios tipos de letra alternativos.

En una página impresa la resolución de impresión es muy alta por lo que esos pequeños elementos decorativos en los pies de las letras quedan muy bien definidos. Pero por el contrario en una pantalla de ordenador la resolución todavía no es muy alta y la tipografía con "serif" produce efectos en las letras que hacen dificultosa su lectura.

Serif

Prueba de tipografía

      

Sans Serif

Prueba de tipografía

Como puede comprobar la frase con tipografía "sans serif" se lee mejor, por eso no recomendamos usar no usar tipografías de tipo "serif" si la fuente en menor a 12 pixels.

Distintas tipografías

Una vez que ha seleccionado la tipografía para el cuerpo del texto, considere la opción de usar alguna otra fuente diferente, en los periódicos, usan una tipografía para el contenido del articulo pero usan otra distinta para los titulares. Además usan la misma para todos los titulares. Es importante mantener la coherencia de tipografía en todo el sitio Web.

Muchas tipografías distintas en una misma página provocaría una especie de confusión.

Gráficos

Las imágenes son mucho más impactantes y pueden transmitir un mensaje mejor y de una forma más clara y rápida que el texto.

Introducir gráficos en las páginas incrementa de una manera notable la presentación de las mismas, pero hay que tener en cuenta que mientras 1K de texto puede llenar toda la pantalla, este pequeño gráfico ocupa 12Ks.

Incluya el atributo ALT="descripción" en todas las imágenes

Piense que no todas las personas poseen un navegador gráfico o que aún poseyéndolo, no tienen activada la opción de carga automática de imágenes. Para estar personas es de vital importancia que ponga una descripción de la imagen. Incluso los navegadores gráficos visualizan dicho texto hasta que la imagen es cargada.

Indicar el tamaño de la imagen enlazada

Cuando cree un enlace a una imagen, es altamente recomendable que indique el tamaño de la imagen, también es de gran ayuda que cree un pequeño icono en el que se vea el contenido de la imagen. De esta manera:


hojas.jpg
146Kb

Imágenes de fondo

Evite en lo posible usar imágenes de fondo en sus páginas Web, pero si desea usar imágenes de fondo elija unas que contengan poca información visual, de manera que el texto se pueda leer con facilidad. Como puede observar el texto

se puede ver lo q ue esta escrito

Cuando use imágenes de fondo use el formato JPEG con alta compresión, aunque la pérdida de calidad es notable, tenga en cuenta que al ser una imagen de fondo, la persona no presta prácticamente ninguna atención a la imagen.

Otra recomendación de utilidad es elegir un color de fondo que se asemeje al color de la imagen de fondo, así mientras esta todavía se está cargando la imagen se puede leer el texto con comodidad.

Acelerar la visualización

Limite el uso de gráficos meramente decorativos. Recuerde que los gráficos tardan en cargarse o que el usuario puede tener la opción de carga automática de gráficos desactivada. Si usa de manera indiscriminada gráficos decorativos, su página puede parecer extraña y confusa si no se visualizan dichos gráficos.

Limite el tamaño total de todas las imágenes a 50Kbs

El tiempo que tarda la página en cargarse completamente es de gran importancia, recuerde que el usuario no va a esperar mas de 15 segundos a que la página termine de cargarse.

Tamaño Velocidad
  14400 bps 28800 bps 56600 bps
50 kbs 30 seg 15 seg 7 seg
100 kbs 60 seg 30 seg 14 seg
Tiempo optimista de carga.

Usar los atributos HEIGHT y WIDTH cuando inserte una imagen en la página

Esto produce que el navegador sepa el tamaño de la imagen antes de que empiece a cargarla, lo que le permite reservar espacio en la página. De esta manera la página se dibuja con los espacios vacíos que serán rellenados con las imágenes cuando estas se carguen. Con lo que se consigue que la página se visualice completa antes, sin tener que esperar a la carga de las imágenes.

Aprovéchese de las opciones de carga progresiva que disponen los formatos gráficos

Esto permite que se pueda visualizar una imagen incompleta del gráfico mientras este todavía se está cargando. Esta característica en los formatos GIF y PNG se llama entrelazado y en el formato JPEG se llama progresivo.

Secuencia de carga progresiva, formato GIF


Usar la misma imagen tantas veces como le sea posible

De esta manera aprovecha la característica que disponen la mayoría de navegadores de almacenar en la caché las imágenes ya cargadas. Por consiguiente acelerará notablemente la carga de las páginas.

Formatos gráficos

Una misma imagen puede almacenarse en diferentes formatos. Los formatos más extendidos en Internet son GIF y JPEG (Joint Photographic Experts Group). La organización W3C recomienda el uso del formato PNG (Portable Network Graphic) para cubrir ciertas lagunas que dejan los otros formatos, dicho formato es de reciente aparición y todavía no es soportado por todos los navegadores.

GIF

GIF es el acrónimo de Graphic Image File Format. Fue desarrollado para el intercambio de imágenes en Compuserve y tiene como particularidad que el algoritmo de compresión es propietario, aunque se permite el uso a cualquier persona.

Las características de esto formato son:

Número de colores: 2, 4 , 8, 16, 32, 128 ó 256 de una paleta de 24 bits.
Compresión basada en el algoritmo de compresión LZW.
Formato de compresión sin pérdida.
Características añadidas en la versión 89a:
Carga progresiva.
Máscara de trasparencia de 1 bit.
Animación simple.

JPEG

JPEG es el acrónimo de Joint Photographic Experts Group. Fue diseñado para la compresión de imágenes fotográficas, basándose en el hecho de que el ojo humano no es perfecto y no es capaz de captar toda la información que se puede almacenar el una imagen de 24 bits. El formato JPEG intenta eliminar la información que el ojo humano no es capaz de distinguir, por eso se dice que posee un formato de compresión con pérdida, porque elimina información.

Las características de este formato son:

Número de colores: 24 bits color o 8 bits B/N
Muy alto grado de compresión.
Formato de compresión con pérdida.
No permite trasparencia, ni canal alfa.
No permite animación.

PNG

PNG es el acrónimo de Portable Network Graphics. Fue diseñado para reemplazar al formato GIF por ser este último más simple y menos completo. El objetivo de este formato es proporcionar un formato compresión de imágenes sin pérdida para cualquier tipo de imagen.

Las características de este formato son:

Color indexado hasta 256 colores y TrueColor hasta 48 bits por pixel.
Mayor compresión que el formato GIF (+10%)
Compresión sin pérdida.
Visualización progresiva en dos dimensiones.
Canal alfa. (Transparencia variable)
Detección de errores.
No permite animación.

Comparativa de formatos gráficos

Selección del formato

Uno de los grandes dilemas a la hora de incluir gráficos en sus páginas Web es elegir el formato adecuado para cada tipo de imagen, en esta sección vamos a intentar guiarle en la selección de este formato.

Imágenes fotográficas

Imágenes obtenidas a través de fotografías de personas o lugares. Para este tipo de imágenes el formato más recomendado es el JPEG porque consigue una gran compresión con una mínima perdida de calidad.

JPEG

GIF

PNG


6.565 bytes
24 bits


25.522 bytes
256 cols

No todos los navegadores soportan PNG
52.361 bytes
24 bits

Imágenes renderizadas

Este tipo de imágenes son las obtenidas por un programa de generación de imágenes sintéticas mediante algún proceso de trazado de rayos o similar. Se caracterizan por degradados suaves y líneas muy bien definidas.

Para este tipo de imágenes es recomendable usar el formato PNG. Tenga presente que el formato PNG es el más reciente y puede no estar soportado en todos los navegadores.

JPEG

GIF

PNG

No todos los navegadores soportan PNG

No todos los navegadores soportan PNG

Imágenes sencillas

Para las imágenes sencillas con pocos colores y con formas muy delimitadas, el formato más recomendado es el GIF, ya que se puede adaptar al número de colores de una imagen. Con el paso del tiempo puede que el formato PNG desbanque al GIF ya que el primero es más avanzado, pero como su uso todavía no está muy extendido recomendamos el formato GIF.

JPEG

GIF

PNG


4.974 bytes


2.394 bytes

No todos los navegadores soportan PNG
1.613 bytes

Realizar pruebas

Las recomendaciones dadas anteriormente no son indiscutibles, son recomendaciones basadas en la experiencia. Puede que para según que casos, no sean del todo acertadas, así que le recomendamos que pruebe a grabar las imágenes en distintos formatos y seleccione el que le parezca más adecuado.

Formato

Imágenes

JPEG
24Bits


Baja compresión
6028 bytes


Media compresión
2761 bytes


Alta compresión
1815 bytes

GIF


256 Colores
12230 bytes


16 Colores
4304 bytes


255 Col. + Trans.
8703 bytes

PNG

No todos los navegadores soportan PNG
24 Bits
29070 bytes

No todos los navegadores soportan PNG
256 Colores
11640 bytes

No todos los navegadores soportan PNG
255 Col. + Trans.
8795 bytes

Terminología sobre banners

Banner

Imagen usada en Internet para hacer publicidad sobre algo. Anuncio o Spot publicitario basado en una imagen gráfica que se muestra al cargar una página Web.

Ejemplo

Encuentra trabajo !!!
Ayude a mantener este web gratis, visite los patrocinadores.

Impresión

Medida de las veces que un banner es mostrado. Cada vez que un banner es mostrado, se incrementa en uno la impresión.

CTR (Click-through ratio)

Método para medir las veces que un banner es pinchado respecto a las veces que es visualizado. El CRT es el número de veces que un banner es visualizado dividido por el número de veces que es pinchado. Por ejemplo, si un banner tiene un CRT de 20:1 indica por cada 20 veces que el banner es visualizado una vez es pinchado, es decir el banner es pinchado un 5% de las veces. Cuanto mayor es este ratio mejor es el banner.

CPM

Coste por mil impresiones. Es una manera de medir el precio de un anuncio mediante banners. Si el precio de un anuncio es de 3000 pts por CPM indica que por 3000 pts su banner será visualizado 1000 veces.

Diseño de banners

Banners grandes

El tamaño de un banner es importante, está demostrado que cuanto mayor es la superficie que ocupa un banner, es mayor la probabilidad de que alguien pulse sobre él. Muchas veces estamos restringidos por los tamaños que nos imponen aquellos que nos permiten poner nuestros banners en sus páginas.

Tamaño

Ejemplo

 468x60 

Encuentra trabajo !!!
Ayude a mantener este web gratis, visite los patrocinadores.

 440x40 

 88x62 

 88x31 

Carga rápida

La carga del banner es crítica, cuanto antes se cargue el banner mejores CTR obtendremos. Por eso debemos minimizar el tiempo de carga del banner. En el siguiente gráfico podemos apreciar la relación entre el tamaño del banner y el CTR.

Animación

Al cerebro humano le atraen las cosas que se mueven, hay estudios que verifican que añadir animación a un banners aumenta el CRT en un al menos en un 15% y que en algunos casos puede llegar al 40%, tampoco conviene abusar de la animación, puesto que aumenta el tiempo de carga del banner y esto último es perjudicial..

Interacción

Impulse a la gente a interactuar, una manera sencilla es incluyendo una pregunta en el banner de esa manera conseguirá involucrar a la gente y el CRT ratio aumentará.

Palabras que venden

No sabemos por qué pero existen palabras que nos atraen más que otras. Podemos aprovecharnos de esa situación incluyendo algunas de esas palabras en nuestro banner. Es altamente recomendado . Incluyendo algunas de estas palabra aumentaremos nuestro CTR, quizás las más comunes de todas y las más efectivas son las de " click here ".

Algunas de estas palabras o frases con gancho son las siguientes: Último día, gratis, nuevo, entre, sexo, click here, free.

Los banners se queman

Si un banner se ha visualizado tres veces y no se ha pinchado sobre él, el lector no pinchará nunca sobre él. Estudios han concluido que tras 200.000 impresiones el banner está quemado y hay que cambiarlo.

La naturaleza de la Información

Uno de los objetivos principales al planear un sitio Web es reducir, o eliminar por completo, el ruido que pueda perturbar su capacidad de comunicación, Si el publico malinterpreta lo que usted le representa, o si no lo entiende. El sitio Web es un fracaso, El primer paso es hacer que la información sea relevante para el publico, es decir, debe atraer y mantener la atención, al mismo tiempo que comunica por completo el mensaje. Esta es la primera ley de la comunicación en Web.

El contenido también debe presentarse en forma lógica. Cualquier medio de comunicación debe presentar un avance lógico o proceso de pensamiento que pueda identificarse. Los sitios mal planeados fracasan debido al arreglo ilógico de su contenido. El contenido debe ser intuitivo, tal y como el publico espera encontrarlo.

En los documentos tradicionales, el orden lógico se crea con la presentación de los párrafos, oraciones y palabras, así como en el flujo del texto. La hipermedia es un poco diferente debido a que usted puede disponer las paginas en gran variedad de formas, y puede inserta texto, gráficos, sonido y otras cosas en cualquier forma que desee, se debe tener cuidado de que su contenido siga un avance lógico a lo largo de todo el sitio y de las paginas que este contenga.

El avance lógico dentro de las paginas surge como y que tan bien emplee los gráficos, los elementos multimedia y las ayudas de navegación.

Debe usar gráficos y otros elementos de medio solo para realzar, complementar, aclarar o completar lo que trata de decir con las palabras. El efecto general de tales paginas es menos estimulante y muchas veces confuso.

Se centra en la navegabilidad y la linealidad, para el publico es importante poder profundizar con eficiencia en la información del sitio, así como poder regresar al punto de partida. A muchos usuarios los desalienta la dificultad de navegar por un sitio que cuenta con un complicado sistema de navegación, los usuarios salen del sitio sin respuesta a las cuestiones que intentaron resolver, el usuario no solo vino a navegar, vino por el contenido.

Información no transitoria

Antes del Web, todos los medios físicos de distribución de información (Libros, CD, etc) tenían un ciclo de vida relativamente estable y no transitorio, la gente podía aceptar el tiempo necesario para desarrollarlos, los libros de puro texto contienen por lo general información que permanece estable por un periodo de seis meses a un año. Este tipo de información puede clasificarse como información no transitoria, este tipo de información cambia o se vuelve obsoleta en un ciclo de entre nueve y doce meses.

Información transitoria

Hoy en día presenciamos un ritmo de cambio exponencial en la información que manejamos cotidianamente. Cuando se refiere a la computación, la información cambia a diario (casi a cada hora); esto es información transitoria. La publicación y desarrollo en World Wide Web destaca por ser dinámica, por poder cambiarse o adaptarse rápidamente, y soportar las exigencias de la información transitoria. Es fluida y puede desarrollarse en tiempo real

La información transitoria tiene un ciclo de vida corto, ya que cambia o se vuelve obsoleta en periodos menores en tiempo real.

Conforma Web se desarrolla hasta el punto de soportar totalmente capacidades multimedia (video pantalla completa, audio de calidad digital, etcétera) será vital que las empresas trasladen su foco de atención, que dejen de ser elaboradoras de productos y se conviertan en proveedores de información, información cada vez depende mas de Web como medio de comunicación, debido a la naturaleza cada vez mas fluida de la información.

El proceso de desarrollo Web puede establecerse en forma de procedimientos. El fracaso de muchos sitios se debe a la mala planeación y peor diseño.


Análisis de Contenido

El éxito del Desarrollo Web se basa en la eficiencia con la que el contenido y los gráficos se comunican un mensaje al usuario. El mal contenido nunca puede disfrazarse, aunque se utilizara excelentes gráficos, el contenido seguiría siendo malo. Asimismo un buen contenido no puede comunicar nada con eficiencia si tiene malos gráficos. El atractivo visual es un aspecto importante del medio de comunicación. Para desarrollar una buena herramienta de comunicación es analizar el contenido que tratamos de trasmitir.

Los sitios Web se establecen par informar, persuadir, educar o entretener al publico, el aspecto de su sitio variara dependiendo de cual de estas tareas de hacer.

Autoria

Habrá ocasiones que usted querrá proporcionar información que alguien de la compañía ya creo. La mayoría de los sitios Web que se están desarrollando son transformaciones de información que ya existía. Asegurarse de que la información se quiere presentar a través de su sitio Web, realmente pertenece a la compañía.

Debido a los aspectos legales de propiedad intelectual y derechos de autor, no puede colocar en su sitio Web.

Debe establecer a quien pertenecen los derechos de autor del material de que usted quiera presentar y obtener la autorización adecuada para hacerlo.

Análisis del Publico

Uno de los aspectos mas promisorios del desarrollo Web es la capacidad de adecuar el sitio al publico. Los buenos sitios Web se centran al publico al que van dirigidos.

Edad

Los primeros factores que determinan en gran medida la forma en que usted debe presentar la información es la edad. Por ejemplo, si la edad del publico al que dirige su información es inferior a los 20 años, se deberá utilizar algún ingenioso dispositivo que sirva para captar su atención; pero si el publico es mayor de 20 años, los dispositivos podrían repelerlo e incluso ofenderlo.

Antecedentes

Para desarrollar su sitio debe considerar también los antecedentes culturales o nivel de educación de su publico; por ejemplo, una discusión técnica acerca de un concepto complicado podrá ser buena para algunos miembros, pero quedaran excluidos quienes no tengan los antecedentes necesarios para asimilar la información que se les presenta. De otra forma si se colocan vínculos con otros sitios Web en los que el publico podría obtener los conocimientos necesarios sobre el sitio que esta visitando seria otra solución.

Nivel de Capacidad

Si usted planea un contenido que requiere un plug-in especifico o una aplicación auxiliar, ¿ tendrá su publico la capacidad necesaria para encontrar e instalar dicho elemento?. Para usted estas tareas pueden ser sencillas pero para un usuario pueden significar un obstáculo irremontable, por lo que usted debe ofrecer los vínculos para que el usuario obtenga los plug-ins y los programas auxiliares, e incluso las instrucciones para su instalación.

Nivel Profesional

Se debe considerar el nivel profesional de los individuos que visitaran su sitio, lo cual tendrá que ver con el tono del sitio y con la edad.

Usted podrá aportar un enfoque moderado tanto en la presentación del contenido como en las ayudas de navegación y de esta forma nos iremos por el nivel conservador en vez del vanguardista, lo cual se recomienda ampliamente.

 

 

Mapa de Sitio | Privacy Policy | Contactame | ©2004