Archive forDiseño web

Dar estilo a nuestro buscador con CSS

Nuestro amigo Victor de mis-algoritmos.com nos enseña una vez más su habilidad para hacer replicas.

Esta vez toca los buscadores como el de msn, digg o yahoo.

Con un simple código como este:

<form class="msn">
    <label for="q">Buscar</label>
    <input type="text" name="q" value="algoritmos" id="text"/><input type="submit" value="Search" id="search"/>
</form>

Y descargando la hoja de estilos css correspondiente, por ejemplo para el de msn como el de abajo seria este código css.

Algunos estilos CSS para las cajas de búsqueda_1193246679327

form.msn *{ margin: 0; padding: 0; }

form.msn{ padding:10px 20px; background-image:url(msn/images/fondo-azul.png); background-repeat:repeat-x; padding:45px 0 0 0; }

form.msn label{ display:none; }

form.msn input{ font-family:MS Shell Dlg; font-size:0.8em; vertical-align:top; }

form.msn input#text{ background-color:#fff; width:320px; height:1.6em; border:1px solid #59990e; padding:4px 4px 2px 10px; }

form.msn > input#text{ margin:1px 0 0 0; }

form.msn input#search{ background-color:#61a11c; background-image:url(msn/images/fondo-boton.png); background-repeat:repeat-x; font-weight:bold; color:#fff; height:2.2em; width:65px; border:1px solid #3f8e00; margin:1px 0 0 6px; padding:0 1px 2px 1px; }

form.msn > input#search{ margin:1px 0 0 6px; padding:-2px 1px 0 1px; }

form.msn input:hover#search{ background-color:#3e8d00; background-image:url(msn/images/fondo-boton-hover.png); }

Noticia original

Comentarios (1)

Seis sugerencias de optimización para los foros

1. El formato es importante cuando hay varios bloques de anuncios
Según hemos observado, la colocación de un skyscraper en la mitad superior de la página, a la izquierda del foro, procura un mejor rendimiento que en cualquier otra posición. Si utilizas varios bloques de anuncios en toda la página, conviene dar prioridad a los skyscraper horizontales. Puedes consultar el Mapa de zonas de interés del foro para obtener información más detallada.

Imagen de foros

2. Muestra tus bloques de anuncios donde los usuarios puedan verlos
Un skyscraper horizontal situado en la parte superior encaja perfectamente con el logotipo, aunque los habituales del foro suelen saltarse el encabezado y van directamente al meollo de la entrada. Por este motivo, resultará más eficaz colocar el bloque de anuncios por encima o por debajo de la primera entrada.

3. Coloca un skyscraper horizontal inmediatamente después de la última entrada
De este modo, los usuarios que lleguen hasta el final de una entrada hallarán un “siguiente paso”, una vez que el contenido llegue a su fin. Si lo colocas después del pie de página, los usuarios pasarán a la siguiente entrada sin ni siquiera haber visto el anuncio.

4. Utiliza bloques de vínculos horizontales
Los bloques de vínculos ofrecen una amplia variedad de temas importantes entre los que pueden buscar los usuarios. Puedes colocar un bloque horizontal en la parte superior del foro, inmediatamente debajo de la cabecera.

5. Publicación de anuncios gráficos
Al aceptar la publicación de anuncios gráficos, estás incrementando la cantidad de anuncios, especialmente los anuncios de coste por mil impresiones (CPM), por los que se realizan ofertas para publicarse en tu sitio web. Dado que los foros suelen tener porcentajes de clics (CTR) inferiores a los de otros tipos de sitios web, los anuncios de CPM pueden incrementar tus ingresos sin necesidad de recibir clics. No obstante, recuerda que los anuncios de CPM se presentan en formato tanto gráfico como de texto.

6. Ten en cuenta a la comunidad de tu foro
Los foros son totalmente interactivos, de modo que recomendamos que seas consciente del tipo de usuarios que frecuentan tu foro a la hora de publicar anuncios de AdSense. Combina los anuncios haciendo uso del buen gusto para que no resulten molestos, pero tampoco los integres de forma tan perfecta que puedan inducir a error a los usuarios. Cada foro es distinto de los demás, y tú eres quien mejor conoce a tu comunidad, de modo que has de utilizar tu propio criterio a fin de ofrecer la experiencia más positiva a tus usuarios.

Via Adsense Blogspot

Comentarios

¿Qué es usabilidad?

¿Qué es Usabilidad?
Usabilidad mide la calidad de la experiencia de un usuario, la forma en la que este interactúa con el sistema (bien sea un sitio web o una aplicación de escritorio). En una forma amplia, dicho concepto se refiere a la facilidad con la que los usuarios pueden aprender a usar el sistema para el alcance de sus metas, y a su vez se debe tener en cuenta el grado de satisfacción de los mismos durante el proceso.¿Qué mide?
Usabilidad no es en ninguna manera un grado unidimensional, es decir, de un solo factor, por lo tanto los factores que en su combinación dan una razón de usabilidad son según el US. Department of Health & Human Services los siguientes:

  • Facilidad de aprendizaje
    ¿Qué tan rápido puede un usuario que nunca ha visto la interfaz y el sistema, aprender lo necesario para cumplir las tareas básicas?
  • Eficiencia de Uso
    Un usuario experimentado ¿qué tan rápido puede cumplir las tareas?
  • Recordación
    Un usuario que ha usado el sistema antes, puede recordar lo suficiente para hacer un uso efectivo del sistema o ¿debe volver a aprender a usarlo desde el inicio?
  • Frecuencia de errores
    ¿Qué tan común es que los usuarios comentan errores utilizando el sistema?
  • Satisfacción Subjetiva
    ¿Qué tanto le gusto el sistema al usuario?

Definición de usabilidad
ISO 9241-11
“La medida en la que un producto se puede usar por determinados usuarios para conseguir objetivos específicos con efectividad, eficiencia y satisfacción en un contexto de uso especificado.”

Para ver otros estándares aplicados a Usabilidad puede remitirse a http://www.usabilitynet.org/tools/r_international.htm

¿Cómo se prueba?
Una prueba de usabilidad se refiere a un espacio de observación, el cuál tiene como participantes a dos grupos claramente definidos. En el primer grupo debemos ubicar a los usuarios representativos del sistema, es decir, aquellos que normalmente realizan las tareas que define el sistema. Y en el segundo grupo tendremos a todo el equipo de desarrollo, incluido el gerente de proyecto. La labor del segundo grupo es observar y tomar notas de la forma en la que el primer grupo interactúa con el sistema.

Este proceso puede realizarse desde los primeros prototipos en papel hasta versiones altamente funcionales.

¿Qué se aprende durante una prueba de usabilidad?
Durante una prueba típica, usted debe procurar responder los siguientes cuestionamientos:

  • ¿Los usuarios participantes pudieron completar las tareas satisfactoriamente?
  • Considerando sólo las tareas completadas, ¿qué tan rápido lo hicieron los participantes?
  • Considerando sólo las tareas completadas, ¿Cuántos clics tomó completar cada tarea?
  • ¿Quedaron satisfechos los usuarios con el sistema?

Via Betancur

Comentarios

Tipo de letra utilizado en carteles de carreteras y autopistas (en España)

En España para la señalización en autopistas, autovías y vías para automóviles, se utiliza el tipo de letra denominado «Autopista»; mientras que para las carreteras convencionales, el entorno urbano y el resto de vías se usará el tipo de letra «Carretera Convencional».

Exiten versiones comerciales de las dos fuentes. La versión del alfabeto Autopista es la fuente Highway Gotic, y del Carretera Convencional es Traffic Type Spain. (Señales de tráfico verticales.)

Via MicroSiervos

Comentarios

Next entries »