De acuerdo al contenido del blog es al público al que está dirigido y es posible que este público sean adultos mayores o bien tengan dificultades visuales. Así que una buena herramienta es darles la opción de que sean ellos quienes elijan el tamaño del texto del blog y puedan cambiarlo a su gusto. Para ello vamos a usar dos métodos:
El primero es que el lector escoja el tamaño exacto de la letra. Para lograr esto sólo pegamos este código en un elementoHTML/Javascript:
El primero es que el lector escoja el tamaño exacto de la letra. Para lograr esto sólo pegamos este código en un elementoHTML/Javascript:
Tamaño de letra: <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='10px'"><span>10</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='12px'"><span>12</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='14px'"><span>14</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='16px'"><span>16</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='18px'"><span>18</span></a>
Las opciones de tamaño de la fuente van desde 10 hasta 18 puntos, puedes agregar las que quieras repitiendo la línea correspondiente.
La segunda opción la vi en Vagabundia y se trata de cambiar el tamaño de la letra con dos botónes, uno para aumentar y otro para disminuir.
Primero hay que ir a Diseño > Edición de HTML y pegar antes de </head> lo siguiente:
<!-- cambiar tamaño de fuente -->
<script type='text/javascript'>
var tgs=new Array('div','td');
var szs=new Array('xx-small','x-small','small','medium','large','x-large','xx-large');
var startSz=2;
function ts(trgt,inc) {
if (!document.getElementById) return
var d=document,
cEl=null,sz=startSz,i,j,cTags;
sz += inc;
if (sz < 0) sz=0;
if (sz > 6) sz=6;
startSz=sz;
if ( !(cEl=d.getElementById(trgt))) cEl=d.getElementsByTagName(trgt)[0];
cEl.style.fontSize=szs[sz];
for (i=0 ; i < tgs.length; i++) {
cTags=cEl.getElementsByTagName(tgs[i]);
for (j=0; j < cTags.length ; j++) cTags[j].style.fontSize=szs[sz];
}
}
</script>
Ahora en un elemento HTML/Javascript pega esto:
<a href="javascript:ts('body',1)"><img src="http://dl.getdropbox.com/u/647003/CiudadBlogger/Iconos/%2Bfont.PNG"/></a>
<a href="javascript:ts('body',-1)"><img src="http://dl.getdropbox.com/u/647003/CiudadBlogger/Iconos/-font.png"/></a>
El resultado serán dos íconos con los que se podrá manipular el tamaño de la fuente de texto, puedes ver el ejemplo funcionando de ambos métodos en este blog de pruebas.
Los íconos puedes cambiarlos por los tuyos si así lo deseas, sólo cambia la URL de la imagen, o bien, puedes usar sólo texto, si este es el caso entonces usa esto:
Los íconos puedes cambiarlos por los tuyos si así lo deseas, sólo cambia la URL de la imagen, o bien, puedes usar sólo texto, si este es el caso entonces usa esto:
<a href="javascript:ts('body',1)">Aumentar fuente</a>
<a href="javascript:ts('body',-1)">Disminuir fuente</a>
Este truco hará que cambie el tamaño de la letra de todo el blog, si deseas que sólo cambie la letra de las entradas cambia donde dice body por main.
Categories:
Efectos
