Colocar font a mi sitio web

joseehrn · #1 (**permalink**) 09/01/2013, 09:20

Estoy empezando a diseñar una plantilla para mi próximo sitio y quisiera colocar una fuente en especial al menú de esas que descargas en internet (Ejemplo: http://www.dafont.com/es/yummycupcakes.font) ... he intentado de varias forma pero no me funciona. Solo se HTML básico, alguien que me podría asistir? Aquí les dejo el código de como esta estructurada la plantilla a ver si la ayuda es mas precisa. Si puedes expliquen detalladamente.
Saludos

Código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>TITULO</title>


<style type="text/css">
<!--
body {
	background-color: #000000;
	background-image: url(img.jpg);
	background-repeat: no-repeat;
}
a:link {
	text-decoration: none;
	color: #666666;
}
a:visited {
	text-decoration: none;
	color: #666666;
}
a:hover {
	text-decoration: none;
	color: #999999;
}
a:active {
	text-decoration: none;
	color: #666666;
}
body,td,th {
	color: #999999;
}
.Estilo2 {font-family: Verdana, Arial, Helvetica, sans-serif}
-->
</style></head>

<body>
<table width="800" border="0" align="center" cellpadding="0" cellspacing="0">
    <td height="62"><img src="img/.png" width="800" height="62" border="0" usemap="#Map" /></td>
  </tr>
  <tr background="img/menu.png">
    <td><table width="800" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="160" height="25"><div align="center"><a href="plantilla.html" class="Estilo2">HOME</a></div></td>
        <td width="160"><div align="center"><a href="plantilla.html" class="Estilo2">ACERCA DE</a></div></td>
        <td width="160"><div align="center"><a href="plantilla.html" class="Estilo2">IMAGENES</a></div></td>
        <td width="160"><div align="center"><a href="plantilla.html" class="Estilo2">FAQ</a></div></td>
        <td width="160"><div align="center"><a href="plantilla.html" class="Estilo2">CONTACTO</a></div></td>
      </tr>
    </table></td>
  </tr>
  <tr background="img.png" style="background-repeat:repeat-y">
    <td><p>&nbsp;</p>
    <p>&nbsp;</p></td>
  </tr>
  <tr background="img/footer.png">
    <td height="86" background="img.png"><table width="800" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
    </table></td>
  </tr>
</table>
</body>
</html>

algoparapensar · #2 (**permalink**) 09/01/2013, 09:37

Segun lo poco que se de HTML/CSS, tenes 2 opciones:
http://www.mmfilesi.com/blog/como-an...gla-font-face/
http://ayuda.bligoo.com/content/view...-tu-sitio.html

pzin · #3 (**permalink**) 09/01/2013, 09:58

Google Web Fonts es una buena opción. Limpio, rápido, funciona bien y quitas algo de carga a tu alojamiento

La única limitación es que puedas no encontrar alguna fuente, o si eres muy maniático y tienes alguna entre ceja y ceja que quieras poner y no encuentres en el servicio de Google, puedes usar tu propia fuente como dice el artículo que enlaza algoparapensar. Y en este caso una buena herramienta para convertir tu fuente a varios formatos, además de generar un fichero con las reglas de CSS adecuadas, siempre se recomienda usar el generador @font-face de FontSquirrel.

willycarp · #4 (**permalink**) 10/01/2013, 05:33

Hola! antes q nada te recomiendo q no uses tablas para diseñar! es mucho mejor usar divs!
Busca en google "tablas o divs" y encontraras buenas explicaciones de xq no usar tablas!

Yo te recomiendo que uses CS3 para no tener problemas con las fuentes.. gracias a cs3 ahora se puede usar cualquier fuente sin la necesidad de q el visitante de tu web la tenga instalada en su pc (como anteriormente q si no la tenia se cambiaba automaticamente)

Leete este minitutorial q es muy claro y facil de implementar:
[URL="http://www.psdahtmlpasoapaso.com/blog/fuentes-personalizadas-font-face"]http://www.psdahtmlpasoapaso.com/blog/fuentes-personalizadas-font-face[/URL]

Espero haberte ayudado!!!

pzin · #5 (**permalink**) 10/01/2013, 06:00

Cita:

Iniciado por willycarp

gracias a cs3 ahora se puede usar cualquier fuente sin la necesidad de q el visitante de tu web la tenga instalada en su pc

@font-face existe desde hace mucho tiempo, no es algo nuevo de CSS3. En la especificación está al menos desde 1998.

joseehrn · #6 (**permalink**) 11/01/2013, 02:51

Muchas gracias todos por su colaboración. Bonez tu enlace fue el mas fácil y eficaz... willycarp tomare en cuenta lo de div aunque apena solo estoy iniciando en este mundo, desde abajo se empieza.