FontSizer
Evet arkadaşlar bu gün sizlere makale yazarlarının en çok ihtiyaç duydukları ve sitesinde okunası uzun yazılar barındıran kişiler tarafından kullanmasını şiddetle tavsiye ettiğim bir uygulamadan bahsedeceğim. Ara sıra can sıkıntısı olduğu zamanlarda  espirili bir şekilde yazılar yayınlayan blog sitelerini okumakla geçiririm vaktimi. Gözler iyice şiş ve sulanmayana kadar da can sıkıntısının gelmemesi hep işin kötü tarafı olmuştur.

Dün yine gözler iyice sulandıktan sonra can sıkıntısı tuttu birden bire ve rastgele bir kaç tane makale okumak isterken yazıların küçüklüğü (o anki göz durumuna bağlı olarak küçük)  dolayısıyla sağda solda yazı büyütme araçlarını arayıp durdum ve bulamayınca da mecburen sayfayı kapatmak zorunda kaldım. Alexa toolbar kuruluydu ve sitede geçirdiğim her saniye siteye fazladan değer kazandıracaktı Alexa gözünde. Font büyütme uygulaması olmadığı için kısa süre sonra çıkış yapmak zorunda kaldım siteden.

Ben kendimi sadece sitede az bir süre geçirmiş bir ziyaretçi olarak gösterdim. Eminim ben gibi veya gözlerinin durumu gerçekten iyi olmayan bir çok ziyaretçi geliyordur sitenize. Hem bu tür kayıpları önlemek amaçlı hem de ziyaretçilerinize kolaylık olması için jQuery FontSizer gibi eklentileri sitenizde kullanmanızda fayda var diye düşünüyorum.

Kullanımı oldukça kolaydır ve sitenize eklediğiniz andan itibaren yazılarınızın en üstüne eksi ve artı butonları eklenir. Artıya basınca büyütür ve eksiye basınca da küçültür yazılarınızı.

Kullanım : 

  • Head etiketleri arasına eklemeniz gereken bölümler.

Js doysa adresleri : 

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.fontSizer.js"></script>

JavaScript : 

<script type="text/javascript">
	$(document).ready(function() {			
		$('ul#controls a').fontSizer();
	});
</script>

Stil kodları : 

body, html {
	margin:0;
	padding:0;
	font-size:14px;
	font-family: Arial, Helvetica, sans-serif;
}
.clear-both { clear:both; }
#wrap {
	width:500px;
	height:auto;
	margin:0 auto;	
}
h1 { text-align:center; }
  • Body etiketleri arasına eklemeniz gereken bölüm.

Html : 

<div id="control-wrap"></div>
<div class="fs-text">
Yazı buraya eklenecek
</div>

Varsayılan parametre ayarları:

var defaults = {
  maxSize: 18,
  minSize: 10,
  increment: 2,
  baseSize: parseInt ($'body')).css('font-size')),
  controlWrapID: 'control-wrap',
  controls: true,
  autoClass: true,
  textContainerClass: 'fs-text'
  elements: 'h1, h2, h3, h4, p, a, ul',
  controlPlusID: 'fs-plus',
  controlMinusID: 'fs-minus'
};

Mintik senin düşüncelerini merak ediyor.Bir yorum yaz

  1. incehesap dedi ki:

    Font dışında, stillerine de karar verebiliyorlar mı