Googlefonts: cambie la fuente solo para un solo carácter en todo el sitio web

chaz de simoneNo sé cómo sucedió esto, pero cada instancia del ampersand está en una fuente y estilo específicos en mi sitio web (algo así como cursiva de Times Roman). Mi sitio tiene que ver con los símbolos de unión, por lo que este es el más apropiado. Pero no tengo idea de cómo se reemplazaron todos los símbolos de unión con una sola fuente y estilo. Estoy usando un par de fuentes de Google para la mayor parte del texto, pero el ampersand es de una fuente en particular sin importar dónde aparezca.

Lo verás en http://amperart.com

Meses atrás, apareció de repente como un ampersand elegante y rizado (como Garamond Italic) en todas partes del sitio, lo cual fue realmente genial, así que simplemente lo dejé: "si no está roto, no lo arregles". pero ahora es solo un ampersand inclinado romano. Me gustaría recuperar el otro, ya que la fantasía es apropiada. Por supuesto, también tengo curiosidad por saber cómo se puede cambiar un solo carácter a una fuente y estilo en particular en un sitio web. (El tamaño se ajusta al tamaño de letra circundante).

Realmente desconcertado en este caso. He buscado por todas partes. Ustedes son los más grandes. (Soy un tipógrafo de los días de pying - "derramar" para los niños que nunca escucharon el término - tipo de mano en todo el piso de la tienda, pero cuando se "pied" en un sitio web estoy perdido).

Gracias y gracias de nuevo.

Lo más probable es que no esté relacionado, pero su HTML parece tener algunos defectos: validator.w3.org/nu/?doc=http%3A%2F%2Famperart.com%2F

Respuestas (2)

Esta parte de tu código...

.amp {
    font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", "Warnock Pro", serif;
    font-weight: normal;
    font-style: italic;
    font-size: 1.1em;
    line-height: 1em;
}

Controle los símbolos de unión... Observe cómo cambian los símbolos de unión a medida que enciendo y desactivo ese CSS...

ingrese la descripción de la imagen aquí

Si desea cambiar su fuente, cambie esa propiedad CSS. Dado que ninguna de las fuentes indicadas en el CSS son fuentes multiplataforma "seguras" o fuentes web, dependen completamente de las fuentes que el usuario tenga activas en su sistema.

En resumen, tiene ampersand configurados para mostrarse en cualquiera de las 6 fuentes, dependiendo de lo que el usuario tenga en su sistema. Realmente no los estás controlando en gran medida.

Supongo que todos los símbolos de unión están envueltos en un lapso con una clase porque desea controlarlos más.

¡No puedo discutir con eso!

Scott explicó el "por qué"; es porque estás usando fuentes que no todos los usuarios tienen en su computadora. No solo notó una diferencia, sino que probablemente notará más diferencia si prueba algunas plataformas diferentes.

Así es como se ve para mí:

Su texto está en Georgia y el ampersand usa Baskerville (para mí), pero podría usar "Goudy Old Style", "Palatino", "Book Antiqua", "Warnock Pro".

ejemplo

Es fácil de arreglar, incluso tiene una clase css solo para el ampersand; solo necesitará cambiarlo en su hoja de estilo una vez y se actualizará en todas partes.

Si desea que aparezca siempre igual para todos, puede cambiar su clase css ".amp" a una fuente web que le guste. O simplemente elimine las fuentes especificadas para ese .amp si desea que use lo mismo que el resto del cuerpo o la fuente predeterminada de su sitio.

sugerencias de fuentes de google

Lo que necesitas usar:

Incluso si usó una fuente de Google, aún necesita apuntar a su sitio donde la encontrará. De lo contrario, la fuente no funcionará. No se recomienda usar muchas fuentes web. No sé cuál es el estándar de los demás, pero usar 2-3 debería estar bien.

instalar fuentes de google

Incluso si usa " fuente segura ", también tienen alguna diferencia entre ellos y algunos son solo Mac o PC. Si el usuario no tiene ninguna de las fuentes que sugieres, se usará la "sans serif predeterminada" y esta puede ser Tahoma o Ginebra o "sans-serif" (p. ej., tal vez incluso termine con arial), por ejemplo; no tendrás control sobre cuál. Asegúrese de agregar el equivalente a su css.

Ya que eres tipógrafo, ¡quizás quieras controlar este aspecto!

PD: ¿Es TU cabeza en la imagen de ampersand? ¡La mejor foto "biográfica" de la historia!

Googlefonts: cambie la fuente solo para un solo carácter en todo el sitio web
RespuestasAquíPolítica de privacidad1y, 0v