Web And Application Developer & Oracle DBA
Püf Noktası
Css ile Tarayıcı Sıfırlama
27 Ara
Merhaba arkadaşlar bu yazıda her zaman kullanmanız gerekli olan tarayıcıları sıfırlama yönteminden bahsedeceğim. Tarayıcılar için belirli bir standart olmadığından dolayı farklı form elemanları tarayıcılarda farlı görünüyorlar. Bu yüzden bir tarayıcıya uyumlu olan tasarımınız başka bir tarayıcıda aynı görüntüyü vermiyor. Bu sorunu çözmek için de oluşturacağınız css dosyasına aşağıda vereceğim kodları eklemeniz gerekmektedir. Vereceğim kodlar bütün form elemanlarını kapsayacak şekilde düşünülmüştür. Siz isterseniz kullanmayacağınız elemanları çıkarabilirsiniz. Şimdi tarayıcı sıfırlama kodlarını yazalım.
html, body, div, span, p, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, strong, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline;}
:focus {outline:0;}
body {line-height:1; color:black; background:white;}
ol, ul {list-style:none;}
table {border-collapse:separate; border-spacing:0;}
caption, th, td {text-align:left ;font-weight:normal;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
Yukarıda ki css kodları ile tasarımınız bütün tarayıcılarda aynı görünümü verecektir. Umarım çok fazla geçmeden bütün tarayıcılar bir standarda girer bizim de bu işlemi yapmaya ihtiyacımız kalmaz.
22 views
div-css bilmeniz gereken kodlar
24 Ara
sayfanızı yukarıya yapıştırmak için:
PHP Kodu:
body
{
margin-top: 0px;
}
div içinde scrollbar:
1. kaydırma çubukları sürekli görünen: (overflow: scroll)
PHP Kodu:
.div1
{
overflow: scroll;
height: 100px;
width: 100px;
}
<div class="div1">asd asasd asdsad asd asd d<br /><br /><br /><br /><br /><br /><br /></div>
2. kaydırma çubuğu yazı alanı taşınca görünen: (overflow: auto)
PHP Kodu:
.div1
{
overflow: auto;
height: 100px;
width: 100px;
}
<div class="div1">asd asasd asdsad asd asd d</div>
yan yana div kutular: (float)
1. sola dayalı: (float: left;)
PHP Kodu:
.div2
{
border: solid 1px black;
float: left;
height: 100px;
width: 100px;
}
<div class="div2">1</div>
<div class="div2">2</div>
<div class="div2">3</div>
2. sağa dayalı: (float: right)
PHP Kodu:
.div2
{
border: solid 1px black;
float: right;
height: 100px;
width: 100px;
}
<div class="div2">1</div>
<div class="div2">2</div>
<div class="div2">3</div>
div’i sayfaya göre ortaya almak: (margin-left: auto; margin-right: auto; ikisi bir arada kullanılmalı)
PHP Kodu:
.div3
{
border: solid 1px black;
height: 100px;
margin-left: auto;
margin-right: auto;
width: 100px;
}
<div class="div3"></div>
24 views
Plesk Hatası : function of_get_key_by_product()
19 Ara
merhabalar (:
geçen gün başıma geldi bu hatayı aldım
Fatal error: Call to undefined function of_get_key_by_product() in C:\Program Files\Parallels\Plesk\admin\plib\common_func.php3 on line 4501
Çözüm ise çok basit;
- “C:\Program Files\Parallels\Plesk\admin\repository” dizinini açın
- registry.xml dosyasını bulun, 0 byte olması lazım
- registry.xml.old olarak ismini değiştirin
- IIS ve Plesk’i yeniden başlatın.
Dipnot : IIS yeniden başlatmayı bilmeyenler çalıştır a cmd yazın açılan pencereye iisreset yazın enter a basın 
12 views
Domain suspended: This user account and user’s domain were suspended
6 Eyl
Geçenlerde yaşadığım sorundu plesk kafayı yedi dedim bi ara, neyse kapalı/durdurulmuş domaini nasıl çalıştıracağımızı anlatayım;
Plesk bilgilerini ms access de tutuyor bunu da açmak için en kısa çözüm, http://www.alexnolan.net/software/mdb_viewer_plus.htm adresinden MDB Viewer ‘ı indirin ( bu işlemleri sunucunuzda yapıcaksınız vps vs. )
sonra programı çalıştırın Open butonuna basarak
C:\Program Files\Parallels\admin\db\ dizinine giderek psa.mdb’yi açın.
tablolardan ” domains ” i bulun
aktif olmayan domaini bulun örneğin: hakanyazilim.com
bulduktan sonra status sütunundaki değeri 0 ( sıfır ) yapın.
sonra kapatın ve pleski açıp domain paneline gelin domain i aktif edin.
kolay gelsin
iyi çalışmalar
28 views
Mobil Site Yapımı Üzerine Notlar
15 Ağu
Günümüz mobil teknolojiler gerçekten çok gelişti. Eskiden bir siteyi tasarlarken sadece birkaç ekran çözünürlüğünü esas alırdık. Şimdi ise ekran çözünürlüğü bir yana, artık sitenin hangi fonksiyonlarının hangi ortamlarda çalışacağını dâhi hesaplamak zorundayız. Sonuç ise basit bir kaç css seçicisini değiştirmekten çok öte, adeta siteyi baştan kodlamak, böylelikle yeni ortamlara uyarlamak zorundayız. İşte bu uyarlamayı nasıl yapmalı, nereden başlamalıyız? Kolay yolu var mıdır yoksa gerçekten çok mu zordur? Siteyi olduğu gibi farklı platformlara taşıyabilir miyiz yoksa bazı fedakârlıklarda mı bulunmalıyız? Bu ve benzeri soruları içeren ve basit notlardan oluşan bu başlangıç yazımız ile yol haritamızı oluşturmaya çalışalım. Umarım faydası dokunur.
Planlama
Öncelikle iyi bir planlama yapmalıyız. Şöyle ki sitemizi olduğu gibi mobil platformlara taşımamız oldukça zordur. Her ne kadar siteden siteye durum değişse de iyi bir planlamayla sitemizin hangi fonksiyonlarının mobil cihazda görüntüleneceğine karar vermeliyiz. Örnek üzerinden gitmek gerekirse Yakuter.com‘u mobil platforma taşımak istesem yazıların en etkili şekilde görüntülenmesi ve kategorilerin kolay ulaşılabilmesi üzerine uğraşırım. Onun dışındaki diğer tüm nesneleri göz ardı edebilir, mobil siteyi oldukça sade tutabilirim. Ne de olsa bu siteyi oluşturan temel unsur yazılardır. Mevcut büyük sitelerin mobil sürümlerine de baktığınızda bazı özelliklerinden fedakârlık ettiklerini rahatlıkla görebilirsiniz.
Adres Seçimi ve Yönlendirme
Planlamanın bir kısmı da kullanacağınız adresi seçmektir. yakuter.com/mobile,m.yakuter.com, yakuter.com/android, wap.yakuter.com, yakuter.com/iphone gibi adresler kullanabilir ya da kendinize özgü bir adres belirleyebilirsiniz. Yeterki kullanıcı mobil cihazıyla sitenize zorlanmadan, kolay bir şekilde girebilsin. Tabi bu sırada siteye girişin nasıl olacağını da düşünmek lazım. Acaba kullanıcı doğrudan m.yakuter.com yazarak mı girecek siteye yoksa mobil cihazında yakuter.com yazdığında kendiliğinden m.yakuter.com‘a adresine mi yönlenecek? Tercih tamamen size kalmış ama yine de söylemekte fayda var, otomatik yönlendirmeyi sağlayan hazır kütüphaneler mevcut. Hatta sitemizde sevgili Serkan Çakmak‘ın paylaşmış olduğu bir kütüphaneyi PHP ile Mobil Sayfalar yazısında tanıtmıştık.
Tasarruf
Tasarruflu olmayı unutmayalım. Ziyaretçilerimizin mobil cihazlardan internete girerken mevcut operatörlerin internet tarifelerini kullandıklarını düşünmeli ve onları büyük çaplı sitelerle zarara uğratmamalıyız. Bu nedenle resim görüntülemeden kısabilir ya da mobil cihazlar için ufak çaplı resimler gösterebiliriz. Tabi kodlamanın da hafif ve sade olmasına dikkat etmeliyiz. Özellikle gereğinden fazla javascript kodu kullanmaktan kaçınmalıyız. Örneğin Cufón kullanarak yazıları güzelleştirmek zorunda değilsiniz. Flash nesnelere ise hiç bulaşmayın ve hiç kullanmayın desem sanırım yanlış söylemiş olmam. Malum halen birçok mobil cihaz flash nesneleri görüntülemekte sorun yaşıyor.
Hazır Paketler ve Anaçatılar
Yukarıdaki maddeleri karara bağladıktan sonra artık harekete geçme zamanı. Bu aşamada örnek çalışmaları ve istediğimiz dönüştürmeyi yapacak mevcut hazır paketleri araştırabiliriz. ÖrneğinWordPress günlük sistemleri için mobil cihazlarla uyumlu temalar ve eklentiler (bkz. WordPress Mobile,WPtouch: WordPress Mobil Teması) mevcut. Kendi yazılımlarınız için de JQuery Mobile gibi hazır kütüphaneleri ve anaçatıları (framework) kullanabilirsiniz.
Tasarımda Esneklik
Mobil cihazlarımız için sitelerimizi tasarlarken dikkat etmemiz gereken belki de en önemli nokta sitenimizin esnekliği. Malum mobil cihazların belirli bir ekran boyutu standartı bulunmuyor. Bu nedenle likid kodlama da denilen esnek kodlamayı tercih etmeliyiz. Daha net konuşmak gerekisewidth:300px; demek yerine width:90%; demeliyiz. Elbette bazı kestirme yollara da başvurabiliriz. Örneğin iPhone cihazların ekran çözünürlüğü bellidir. iPhone‘larda görünecek siteler için Fatih Hayrioğlu‘nun CSS İpucu 22: iPhone için CSS Yazmak başlıklı yazısındaki gibi 480px genişliği sabit alabiliriz.
Ayrıca tasarımda kullanıcıların nesneleri seçerken bilgisayarlardaki gibi fare okunu değil, parmaklarını kullanacağını düşünmeli ve buna göre düğmeleri büyük yapmalısınız. Bazı kaynaklarda iPhone’lar için uygun düğme büyüklüğünün yaklaşık olarak “44px x 44px” olduğu söylenmekte ama tabi ki bu da göreceli bir kavramdır.
Faydalı Bağlantılar
Mobile Web Design Trends For 2009
PHP ile Mobil Sayfalar
JQuery Mobile
WordPress Mobile Edition
CSS İpucu 22: iPhone için CSS Yazmak
Tips to design your site for mobile devices
Redirect a mobile/PDA to a “lite homepage”
Device detection using PHP
Device detection using ASP
WPtouch: WordPress Mobil Teması
10 tips for designing mobile websites
Kaynak : http://www.yakuter.com/mobil-site-yapimi-uzerine-notlar/
107 views
