Comentarios
No importa lo bien que se vea su página web, a veces es necesario cambiar la fuente. Tal vez haya decidido darle un aspecto más atrevido o tal vez uno más sutil, dependiendo de lo que quiera hacer dentro de su sitio. Cualquiera que sea la razón, poder ejercer la libertad creativa utilizando HTML es una de las principales razones por las que algunos de nosotros decidimos aprender a codificar en HTML para empezar.
En este artículo, vamos a echar un vistazo a algunos de los cambios que puede hacer a la fuente en su página de destino u otras páginas dentro de su sitio y por qué hacer tales cambios puede resultar ser una buena idea. Continúe leyendo para aprender más sobre cómo cambiar las fuentes en HTML.
Hay una serie de razones por las que puede querer cambiar la fuente en HTML, que vamos a discutir ahora. La conclusión es que el cambio de la fuente puede ayudar a hacer que su sitio web sea lo mejor posible para los visitantes y clientes potenciales que a menudo tomarán una decisión sobre si quieren hacer negocios con usted por la impresión que reciben de su sitio web. A continuación se presentan algunas formas más específicas en las que el cambio de fuentes en HTML puede ayudar a su sitio web.
Html cambiar la fuente para toda la página
Configurar las fuentes para los títulos y el cuerpo del texto del sitio web La pestaña “Fuentes y colores” contiene la configuración por defecto de tamaño, peso y color para los títulos y el cuerpo del texto del sitio web. Estos ajustes se aplican por defecto a todos los bloques del sitio web (excepto los Bloques Cero), a menos que se configuren otras opciones de fuente dentro de los bloques.
Configuración de la carga de la fuente Por defecto, el texto de un sitio web se muestra después de que se cargue el archivo de la fuente, esto puede ocurrir con cierto retraso dependiendo de la velocidad de la conexión a Internet.Puede configurar la fuente de reserva del sistema para que se muestre mientras se carga el sitio web en Configuración del sitio → Fuentes y colores → Avanzado. Esto mostrará el texto inmediatamente, pero primero en la fuente de reserva y luego en la fuente de su elección. Esto puede causar un breve parpadeo del texto y el cambio de tamaño de los elementos de texto, así que utilice esta configuración sólo si está seguro de que hará que su sitio web se vea mejor cuando se cargue.
Fuentes web
En el primer artículo del módulo, exploramos las características básicas de CSS disponibles para estilizar las fuentes y el texto. En este artículo iremos más allá, explorando las fuentes web en detalle. Veremos cómo utilizar fuentes personalizadas con tu página web para permitir un estilo de texto más variado y personalizado.
Familias de fuentes recapitulaciónComo vimos en Estilo fundamental de texto y fuentes, las fuentes aplicadas a tu HTML pueden ser controladas usando la propiedad font-family. Ésta toma uno o más nombres de familias de fuentes. Al mostrar una página web, un navegador recorrerá una lista de valores de font-family hasta que encuentre una fuente disponible en el sistema en el que se está ejecutando:
Este sistema funciona bien, pero tradicionalmente las opciones de fuentes de los desarrolladores web eran limitadas. Sólo hay un puñado de fuentes que se puede garantizar que estén disponibles en todos los sistemas comunes: las llamadas fuentes Web-safe. Se puede utilizar la pila de fuentes para especificar las fuentes preferidas, seguidas de las alternativas seguras para la web, seguidas de la fuente del sistema por defecto. Sin embargo, esto aumenta la carga de trabajo debido a las pruebas necesarias para asegurarse de que sus diseños funcionan con cada fuente.Fuentes webPero hay una alternativa que funciona muy bien. (Incluso es compatible con navegadores más antiguos, como la versión 6 de IE). CSS permite especificar archivos de fuentes, disponibles en la web, para que se descarguen junto con el sitio web cuando se acceda a él. Esto significa que cualquier navegador que soporte esta función CSS puede mostrar las fuentes que hayas elegido específicamente. ¡Increíble! La sintaxis requerida es algo así:
Cambiar la fuente en html
A la hora de personalizar el aspecto de tu sitio web, no puedes olvidarte de la tipografía, es decir, de la forma de organizar y dar estilo al texto en la página. Dependiendo de su marca, querrá cambiar el tipo de letra, el tamaño y el color de su fuente para que coincida.
Por ejemplo, si prefieres el gris oscuro al negro en tu esquema de colores, querrás cambiar el color de la fuente por defecto de tu texto. Si te dedicas a los medios de comunicación, puedes optar por una fuente sans serif, que se considera la tipografía más fácil de leer. Pero si te dedicas al ámbito creativo, puedes optar por una tipografía más decorativa. Éstas son sólo algunas de las razones por las que puede querer dar estilo a la fuente de su sitio web.
Para cambiar el tipo de letra puramente con HTML, utiliza la propiedad CSS font-family. Ajústala al valor que desees y colócala dentro de un atributo de estilo. A continuación, añade este atributo de estilo a un elemento HTML, como un párrafo, un encabezado, un botón o una etiqueta span.
Aunque este método sólo requiere que añadas código a tu archivo HTML, en realidad utiliza el lenguaje de estilos CSS. Más concretamente, esta técnica se denomina CSS en línea. CSS en línea significa que tu HTML y CSS se colocarán juntos en la sección del cuerpo de tu documento HTML.