Entrar

Duda sobre tipografías especiales

willy · · Solicitar retirada
Estoy haciendo una página nueva y no sé si es acertado colocar una tipografía especial en los textos (no las fuentes convencionales).Tengo entendido que al no ser tipografías convencionales mucha gente, si no dispone de dicha fuente, visualizará la página con otras tipografías de las familias que coloque en la hoja de estilos. Creo que esto podría ser un problema, desvirtuando el diseño y pudiéndose descontrolar el orden y la buena visualización de la página.

¿Hay alguna forma de colocar tipografías especiales sin que ocurran estos problemas?
Las tipografías son: Amano , Annifont, Handwriting - Dakota (cualquiera de ellas)

Os mando un ejemplo de una página, más o menos la tipografía que quiero poner.

http://www.elpladelsencants.com/castellano#!__castellano/page-2

Gracias y un saludo
Willy
olukarak · · Solicitar retirada
Fíjate en mi firma. Hay un tutorial de CSS3. Ahí se explica cómo poner fuentes que no sean comunes.
willy · · Solicitar retirada
Muy agradecido por vuestra ayuda, aunque soy un novato voy a intentarlo. Es posible que requiera de nuevo vuestra ayuda si me surge algún problema.

Muchas gracias de nuevo.
Willy
willy · · Solicitar retirada
Olukarak, tengo problemas para convertir de .ttf a .eot con este enlace: http://code.google.com/p/ttf2eot que me pasas. ¿Es un convertidor? ¿Quizás con mi Mac no se puede utilizar el programa? Por favor me lo puedes explicar con más detalle. Muchas gracias
Willy
willy · · Solicitar retirada
Gracias Oulukarak, con este enlace sí que he podido convertir con mi Mac de .ttf a .eot sin problemas.

He subido a la red la web en construcción que estoy haciendo y en principio se ve bien con Safari (se visualiza la fuente especial Dakota), pero no en los otros navegadores que se visualiza con Times y además con estos navegadores se me descontrolan los textos y se desplazan de su lugar (dispongo de Explorer 5.2 for Mac, Firefox 12.0, Oprea 6.03)

Te paso el principio de mi CSS, con el código para fuentes especiales que indicas en tu estupendo tutorial, por si puedes ver algún fallo que cause este error en los otros navegadores

* {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
body {font-family: Arial, Helvetica, sans-serif;background-color:#97bf0d;}

@font-face {
font-family: 'Handwriting';
/* Para IE (NO ES NECESARIO APARTIR DE LA V9 BETA) */ src: url('fuentes/dakotaregular.eot');
/* Para los demas */ src: local('dakotaregular'), url('fuentes/dakotaregular.ttf') format('truetype u opentype');}

También te paso el enlace de la página en construcción http://www.octopusgarden.es/queescastellano.htm

Muchas gracias por tu gran ayuda.

Un saludo
Willy
olukarak · · Solicitar retirada
Primero escribe el @font-face (antes del *).
Segundo; en format(''); debes indicar una de dos: truetype u opentype. En este caso sería: format('truetype');
Tercero; incluye la fuente en el font-family del body, si quieres que sea predefinida para todo el cuerpo de la página.

Te recomiendo desinstalar la fuente de tu equipo para comprobar que realmente funcione el código.
Como algo adicional comento que me he descargado la fuente que pusiste en tu servidor y he notado que no acepta los acentos (á, é, í, ó, ú).
willy · · Solicitar retirada
Olukarak, ante todo perdona por no reponder antes pero no sé como tengo configurado mi perfil que no me llegan los mensajes a mi correo local.

Efectivamente con otros ordenadores no se visualiza la fuente Handwriting-Dakota sino una tipo times, con lo cual se me descontrola el menú.

He realizado todos los cambios que me has dicho y he desactivado la fuente en mi equipo, y efectivamente sigue sin funcionar, ahora ni siquiera en mi equipo con Safari.

Hay alguna duda que tengo con el código. Donde pone font-family: 'Handwriting Dakota' o local("Handwriting Dakota"), he probado poner "Handwriting - Dakota" (con un guión en medio como se escribe en realidad la fuente) o poner ahí simplemente el tipo usado (dakotaregular) pero sigue sin funcionar, como si no encontrase la fuente. Es decir, al desactivar la fuente de mi equipo deja de funcionar a nivel local y en la red. Te vuelvo a pasar el principio del código corregido según tus instrucciones para ver si ves algún error.


@font-face {
font-family: 'Handwriting - Dakota';
/* Para IE (NO ES NECESARIO APARTIR DE LA V9 BETA) */ src: url('fuentes/dakotaregular.eot');
/* Para los demas */ src: local('Handwriting - Dakota'), url('fuentes/dakotaregular.ttf') format('truetype');}

* {text-indent:0px ; margin:0px ; padding:0px ; border:0px}

p { color:#008035;font-size:16px; font-family: Handwriting-Dakota; arial, verdana, sans-serif;text-align: justify; line-height: 1.8 }

body {background-color:#97bf0d; font-family: Handwriting-Dakota; arial, verdana, sans-serif;}



Con respecto a los acentos yo no tengo ningún problema y se visualizan bien. Te paso los sitios donde me suelo bajar tipografías gratis (al menos en mi MAC no tengo problemas)

http://www.abstractfonts.com/search/handwriting-dakota-normal
http://www.publispain.com/superfuentes/fuentes/Z/letra_1.html
http://www.puntogeek.com/2009/09/02/25-tipografias-estilo-handwriting/

Te agradezco mucho tu ayuda

Saludos
Willy
olukarak · · Solicitar retirada
Me bajé la fuente y la probé yo mismo. Tiene algún error porque en mi equipo tampoco va, concretamente esa. Si cambio la fuente, pero no toco el código funciona perfectamente.
willy · · Solicitar retirada
Pues no hay manera, he cambiado la tipografía dos veces y en cuanto desactivo esta fuente en mi equipo, deja de verse tanto en mi servidor local como en la red.
Te paso el nuevo código con la nueva fuente (KGMullally), a ver si descubres que puede pasar.

Mil gracias de antemano

@font-face {
font-family: 'KGMullally';
/* Para IE (NO ES NECESARIO APARTIR DE LA V9 BETA) */ src: url('fuentes/KGMullally.eot');
/* Para los demas */ src: local('KGMullally'), url('fuentes/KGMullally.ttf') format('truetype');}

* {text-indent:0px ; margin:0px ; padding:0px ; border:0px}

p { color:#008035;font-size:18px; font-family: KGMullally, arial, verdana, sans-serif;text-align: justify; line-height: 1.8 }


body {background-color:#97bf0d; font-family: KGMullally, arial, verdana, sans-serif;}

#fondo {background-image: url(../objetos/fondooctopus.gif); width: 977px ;height:655px ;margin:70px auto;}

#recuadromenu {background-color: none;width: 106px; height:610px;float:left; margin-left: 71px }

#menu {margin:135px 0px 0px 0px}
#menu li {text-align:center;list-style:none; margin:35px 0px 0px 0px;font-family: KGMullally, Arial, Helvetica, sans-serif; color: #008035 }
#menu li a {letter-spacing: 1px; text-align: center; font-size:17px;
text-decoration:none ; color: #008035; }
Willy
olukarak · · Solicitar retirada
Pues este sí que me funciona. Vamos a probar algo. Al final de tu hoja de estilos agrega:
body {
font-family: KGMullally;
}

A ver si se te ve.
willy · · Solicitar retirada
Pue nada, sigue sin funcionarme. En cuanto desactivo la fuente en mi Mac (catálogo tipográfico) aparece otra fuente (creo que la arial) tanto en el sitio local como en la red. He comprobado en el sitio remoto que efectivamente estuvieran subidas las fuentes. En fin un misterio. Te paso mi hoja de estilos al completo por si puedes descubrir el misterio.

Siento darte tantas molestias.

Mil gracias


@font-face {
font-family: 'KGMullally';
/* Para IE (NO ES NECESARIO APARTIR DE LA V9 BETA) */ src: url('fuentes/KGMullally.eot');
/* Para los demas */ src: local('KGMullally'), url('fuentes/KGMullally.ttf') format('truetype');}

* {text-indent:0px ; margin:0px ; padding:0px ; border:0px}

p { color:#008035;font-size:18px; font-family: KGMullally, arial, verdana, sans-serif;text-align: justify; line-height: 1.8 }


body {background-color:#97bf0d; font-family: KGMullally, arial, verdana, sans-serif;}

#fondo {background-image: url(../objetos/fondooctopus.gif); width: 977px ;height:655px ;margin:70px auto;}

#recuadromenu {background-color: none;width: 106px; height:610px;float:left; margin-left: 71px }

#menu {margin:135px 0px 0px 0px}
#menu li {text-align:center;list-style:none; margin:35px 0px 0px 0px;font-family: KGMullally, Arial, Helvetica, sans-serif; color: #008035 }
#menu li a {letter-spacing: 1px; text-align: center; font-size:17px;
text-decoration:none ; color: #008035; }



#florquees {margin:5px 0px 0px 90px;float:left;}
#flornuestrosplatos { margin:5px 0px 20px 30px;float:left; }
#floractividades { margin:5px 0px 0px 60px;float:left; }

#tituloquees { margin:0px 0px 0px 130px}
#titulonuestrosplatos { margin:0px 0px 0px 80px}
#tituloactividades { margin:0px 0px 0px 110px}

.titulo {font-family: KGMullally, Arial, Helvetica, sans-serif; color: #008035; font-size:30px; }

#flechaarriba {position:relative;top: 80px;left: 575px;}
#flechaabajo {position:relative;top: 525px;left: 575px;}

#fondotextos {
/* Typical fixed height and fixed width example */
width: 350px;
height: 440px;
overflow: auto;
/* IE overflow fix, position must be relative or absolute*/
position: relative;
float:left; margin:50px 0px 0px 10px;
background-color: none;/* color fondo texto*/
margin:70px 0px 0px 0px;
padding:0px 30px 0px 30px;

}

.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;/* posicion barra verde*/}

.vscrollerbase {
width:12px;
border-right: #006633 1px solid; ;
background-color: #efeea6; /* color barra blanca*/}

.vscrollerbar {
width: 12px;
background-color: #97bf0d;/* color barra verde*/}





#firma p {text-align:right;}
.firma2 { color:#008035;font-size:16px; font-family: KGMullally, arial, verdana, sans-serif; line-height: 1.2;font-weight: bold;}




#foto {float:left; margin:85px 0px 0px 60px; }
#logo {float:left; margin:10px 0px 0px 10px; }

a { }
a:link {}
a:visited {}
#menu a:hover {color:orange}
#menu a:active {color: red;font-weight: bold}


body {
font-family: KGMullally;
}
Willy
willy · · Solicitar retirada
No sé cómo subir las fuentes a otro servidor ya que solo dispongo de un servidor (All in Hosting recomendado por CCTW) donde tengo alojadas mis 3 páginas web (dominio principal y dos subdominios más)

¿Que me aconsejas?
Willy
willy · · Solicitar retirada
Perdona, no acabo de entenderte ¿Tengo que registrar un nuevo dominio y subir toda la web a este nuevo servidor o solo la tipografía?
¿Qué es lo que puede pasar con mi servidor de pago que creo que es un buen servidor para tener estos problemas?

Se me ha ocurrido una alternativa. No sé si sería posible o quizás es muy atrevido por mi parte pero si tú me pudieses subir la fuente (KGMullally) a tu servidor y darme la ruta, quizás así se podría saber si el problema es mi servidor. De esta manera no tendría que registrar un subdominio que en CCTW advierten que si no se va a utilizar es mejor darse de baja para no ocupar un espacio inútil. Obviamente, una vez hecha la comprobación, podrías eliminar la fuente de tu servidor ¿Quizás digo una tontería?

Excusa mi ignorancia
Willy
olukarak · · Solicitar retirada
Te la subiré a Dropbox. Si no me confundo de servicio, podrás usarlo normalmente.
willy · · Solicitar retirada
Disculpa mi retraso pero he estado una semana sin internet por problemas con el router.

No conozco esto de Dropbox ¿Qué es lo que debo hacer?
Willy
willy · · Solicitar retirada
Ya está cambiado, pero en cuanto desactivo la fuente en mi equipo Mac ya no se ve en el servidor con la fuente KGMullally.
¿Cómo lo ves tú?


Te paso el código que he cambiado y que está ahora en el servidor :


@font-face {
font-family: 'KGMullally';
/* Para IE (NO ES NECESARIO APARTIR DE LA V9 BETA) */ src: url('fuentes/KGMullally.eot');
/* Para los demas */ src: local('KGMullally'), url('https://dl.dropbox.com/u/69516601/fu...KGMullally.ttf') format('truetype');}
Willy
olukarak · · Solicitar retirada
WTFWTFWTFWTFWTFWTFWTFWTF? WTF? Será que llevo mucho tiempo sin programar nada y algo se me pasa por alto. Si me lo bajo a mi pc sí que se ve.

¿Hay alguien que si vea el error?
willy · · Solicitar retirada
Pues yo lo he probado con dos PCs diferentes y sigo sin poder ver la fuente KGMullally, además como es lógico los textos que se ven se descontrolan.

Ayuda please...........