El tamaño de la fuente, cambia, cambia, cambia, estoy harta. AAAHH!!!

Laura_Berenice · #1 (**permalink**) 18/12/2013, 13:56

Hola chicos,

soy una vieja programadora de html, programo en mis paginas web el tamaño de mis fuentes de la manera clasica con las sentencias HTML, pero con las actualizaciones de los buscadores Internet Explore, Mozzilla Fire Fox, Opera, Safari

...entiendo que hay que ponerse al dia. Me molesta que Internet Explore siga bloqueando con permisos la programacion javascript, pero quien usa ahora Internet Explore???

Bueno, me puese a investigar todo el asunto de las etiquetas de estilo de texto css y estas han sido "todas" las etiquetas de estilo css que le he puesto a mi website incluyendo las que "segun" controlan el tamaño de la fuente:

Código HTML:

<style type="text/css">
#NJ5Background{
/*float:center;*/
height:0;
width:0;
max-width:100%;
background-image: url(http://i822.photobucket.com/albums/zz142/NJ5_ACS_Futbol/NJ5_Background_Coat_of_Arms_Clean-01_zps727b2cee.png);
background-repeat:repeat;
background-position:top;
background-size:auto;
}
</style>


<style type="text/css">
 <link rel="STYLESHEET" type="text/css" href="estilos.css">
</style>


<STYLE type=text/css>BODY {
	SCROLLBAR-FACE-COLOR: #1a0e55; SCROLLBAR-HIGHLIGHT-COLOR: black; SCROLLBAR-SHADOW-COLOR: black; 
        SCROLLBAR-3DLIGHT-COLOR: black; SCROLLBAR-ARROW-COLOR: black; SCROLLBAR-TRACK-COLOR: gray; 
        SCROLLBAR-DARKSHADOW-COLOR: black
}
</STYLE>


<style>
a { outline:none; }
</style>


<style  type="text/css">
a:link {text-decoration:none; color:#DAA520;}
a:hover {text-decoration:underline; color:#DAA520;}
a:visited {text-decoration:underline; color:#DAA520;}
a:focus {text-decoration:underline; color:#DAA520;}
</style>


<style type="text/css">  
a.nounderline:link  
{  
 text-decoration:none;  
}  
</style>


<style type="text/css">
ip|
@media screen
  {
p.test {font-size:12px;font-family:Verdana,Helvetica,sans-serif;}
  }
@media print
  {
  p.test {font-size:10px;font-family:Times New Roman,Times,serif;}
  }
</style>

Y estas son las sentencias "Span Style" para darle el color, tamaño y estilo que deseo a las fuentes de los textos y link de mi website:

Código HTML:

<SPAN style="color:#F9F9F9; font-size:x-small; font-family:Verdana" line-height: 1.35em>
Hola amigo internauta, bienvenido a la agencia de viajes XXXXXXXXXX
</SPAN>

<a href="http://cancun.regency.hyatt.com.mx/es/hotel/home.html" target="_blank">
<SPAN style="color:#DAA520; font-size:x-small; font-family:Verdana" line-height: 1.35em><B>
Hotel Hyatt Regency Cancun (Lujoso Hotel 5*)
</B></SPAN></a>

Y NADA... NADAAA!!! AAAAAAAHHH!!!

Ya estoy harta, nada me funciona para que la fuente de mi pagina no cambie de manera tan brusca segun la configuracion del tamaño de fuente de los buscadores (Internet Explore, Mozzilla Fire Fox, Opera, Safari ) que tiene cada computadora ó dispositivo del internauta que entre a mi pagina.

Bueno...

Analisando el codigo fuente de la pagina de un hotel veo que abajo de la etiqueta <body> tiene declaradas unas "class" que despues se ponen despues en el texto de la pagina con las sentencias <div id="top_links" class="floatR">...

Código HTML:

<body class="no-js">
<script>var globalIsEdit=false;var offerCode='';var corp_id='';</script>
<!-- test and target - mbox-->
<!-- test and target - mbox-->
<div id="pageWrapper" class="fullWidth">
<!-- [C07] PROPERTY BRAND LOGO AND NAME INCLUDE -->
<!--#include virtual="/common/modules/C07.shtml" -->
<div class="brandlogo">
<div id="logoWrapper" class="fullWidth">
<div id="logoInner" class="centerAlign width980">
<div id="propertyLogo">
<div class="propertyLogoInner">

<div class="headerRight floatR">
<div id="top_links" class="floatR">
<div id="dashboardWrapperAlt" class="floatR" style="display:none;">
<div id="dashboardTitleAlt">
<a id="notDotComLink" href="javascript:;">Hyatt Gold Passport <b id="dashboard_ddAlt">Iniciar sesión o inscribirse<span class="downArrow"> &nbsp;&nbsp;</span></b></a>
</div>

La etiqueta <div class="headerRight floatR"> es la razon ó solucion para que su la fuente del texto de estas paginas no varie mucho y tan bruscamente en la configuracion tamaño fuente del texto de los diferentes buscadores y computadoras???

La verdad no me apetece usar un editor de texto como dreamwaver y otros. Yo estoy contenta con lo que se de la programacion HTML, lo poco que se de los efectos Javascript y mi pagina se ve muy bien...

Solo quiero encontrar alguna etiqueta ó sentencia de programacion que le asigne a mi website un tamaño de fuente standar que sea legible y no varie mucho en la configuracion de los diferentes buscadores y ordenadores que se ingresen a mi sitio.

Pido su ayuda y espero sus diversas opiniones y soluciones a este eterno problema de que no cambie tanto el tamaño de la fuente de una pagina web.

Ya antes lo habia solucionado con mis viejas sentencias ó etiquetas css y html, pero la programacion y configuracion de los buscadores va cambiando y yo solo quiero ponerme al dia.

pzin · #2 (**permalink**) 18/12/2013, 15:05

Uhmm... Diérase el caso de que uno tenga problemas de vista y tiene la fuente por defecto de su navegador en grande, ¿no sería desagradable entrar en una página donde esa fuente no se ajustara a esas preferencias/necesidades?

Laura_Berenice · #3 (**permalink**) 18/12/2013, 17:53

Cita:

Iniciado por pzin

Uhmm... Diérase el caso de que uno tenga problemas de vista y tiene la fuente por defecto de su navegador en grande, ¿no sería desagradable entrar en una página donde esa fuente no se ajustara a esas preferencias/necesidades?

Hola pzin:

Tienes razon en que el navegador use una fuente por defecto, en el caso de mis webpages uso la fuente verdana y creo yo "todas las computadoras con programas de escritura en Windows, Android, Mac OS X, Ubuntu y demas Linux tienen esa fuente y otra fuentas basicas de los procesadores de palabras.

Yo lo quiero es que en mi pagina se vea la fuente verdana a 14px-12px para que sea una escritura legible, es todo lo que pido, que no varie mucho su tamaño en los distintos navegadores, ordenadores y dispositivos.

Los sistemas de los actuales celulares y tablets hacen auto ajustes de tamaño de fuentes para que la fuente sea lo mejor legible posible. Pero lo que me pasa es que la fuente verdana y otras los navegadores y distintas computadoras las reducen hasta los 12px ó 10px de tamaño y eso es molesto para el internauta.

Es como la misma fuente de este foro... si la copia y pegas el texto en un archivo word su tamaño es de 12px. Perfecto, pero la fuente de mi pagina la reducen hasta los 10px. Voy a cambiar los rango de tamaños a ver que pasa.

Alexis88 · #4 (**permalink**) 21/12/2013, 17:57

Yo tenía ese problema, hasta que empecé a utilizar unidades relativas, como las em. Por ejemplo, supongamos que en un monitor de 1920x1080, el tamaño por defecto del texto sea de 12px, pero que en uno de 300x400, comparándolo con el de 1920x1080, se vea como de 4px, para que tome el tamaño por defecto con respecto a las medidas del dispositivo, basta con que coloques 1em al tamaño de la fuente, de ese modo, el texto se verá de un tamaño normal tanto en un monitor grande como en la pantalla de un celular.

Código CSS:

Ver originalfont-size: 1em;

Saludos