Tecnología

Inicio

Cómo Mantener Proporción de texto en páginas Web

August 26

Cómo Mantener Proporción de texto en páginas Web


La accesibilidad es un factor importante en el diseño de sitios web en el siglo 21. Con más de 35 millones de sitios para elegir, los lectores que están teniendo dificultad para ver el contenido de un sitio web, se moverán rápidamente sucesivamente. Dado que los navegadores modernos ofrecen al usuario la capacidad de cambiar el tamaño del texto, es más importante que nunca que los propietarios del sitio para mantener las proporciones tipográficos consistentes a través de sus sitios web. Un método aceptado para lograr esto es mediante el uso de CSS (Cascading Style Sheets).

Instrucciones

1 Comience su editor de HTML y abrir la página web que desea cambiar. Encuentra la hoja de estilo asociada con la mayoría de las páginas y haga doble clic en él para abrirlo. Si su editor de HTML no puede abrir el archivo, abrirlo en el Bloc de notas y guardarlo como un archivo ".css" con un nombre diferente, por ejemplo, "myStyleSheet.css."

2 Si la página no tiene una hoja de estilos externa, vaya a la sección <style> (normalmente se encuentra cerca de la parte superior del código HTML) y utilizar en su lugar. Usted debe considerar el cambio a un archivo CSS externo para que las páginas se cargan más rápido.

3 Cambiar los tamaños de las fuentes predeterminadas para una medición relativa, como "em". Por ejemplo, h1 {font-size: 1.5em;}, h2 {font-size: 1.25em;}, p {font-size: .90em;}. No se olvide el período comprendido entre figuras o el punto y coma después de la palabra "em". El tamaño de la fuente em es un valor "relativo", lo que significa que el propio tamaño del texto voluntad tamaño de acuerdo a una medida predeterminada.

4 Modificar todos los tamaños de fuente por defecto, incluyendo cabeceras <h1> a <h6> y <p> a las mediciones relativas. Puede utilizar porcentajes, si lo prefiere, pero no mantener ningún tipo de tamaños fijos tales como "16px;" porque estos no se redimensionará. La mayoría de los navegadores comienzan con un tamaño de fuente de base de 16px (píxeles), que es aproximadamente el mismo que el texto medio.

5 Guarde el archivo en la carpeta de su sitio web cuando se tiene terminado de editar. Volver al editor de HTML y adjuntar la nueva hoja de estilos añadiendo <link href = "myStyleSheet.css" rel = "stylesheet" type = "text / css" media = "pantalla" /> para el código HTML en el <head> sección, reemplazando el nombre de archivo "myStyleSheet.css" con la que eligió usar.

6 Prueba de las páginas en varios navegadores. Las nuevas reglas CSS rendirá la <h1> texto de encabezamiento de un 150% del tamaño de fuente predeterminado del visitante. Si un visitante tiene dificultades para leer texto pequeño que pueden tener su navegador establece en un tamaño por defecto más grande. Por lo tanto, si su texto se inicia en 24px, el valor de tamaño de fuente de 1.5em se ajustará a 36 píxeles que les permite leer fácilmente.

Consejos y advertencias

  • Lo mejor es utilizar una fuente proporcional como parte del diseño global en el diseño de un diseño de página. De esa manera usted puede asegurarse de que la tipografía es una característica integral del diseño y no una ocurrencia tardía.
  • Tenga cuidado al utilizar fuentes proporcionales en un diseño de página mayor, porque el aumento de tamaño puede forzar el texto que se derrame fuera de su contenedor.