Murat BütünWeb Tasarım ve Arama Motorları Optimizasyonu

Merhabalar arkadaşlar bu gün sizinle bir scripti paylaşıcım demo sayfasından scriptin nasıl çalıştığını görebilirsiniz.

Demo İçin Tıklayınız

Aslında diyeceksiniz bu sistem zaten Twitterda mevcut panelimden aldığım kodu siteme ekliyorum ve işimi hallediyorum. Ben her zaman sadelikten yanayım her ne kadar twitter dada şeklini kendimiz belirlesekte tam olarak aklımdakini web sayfam twitter panelimden yaratamadım ve oturup kendim bişiyler yapmaya çalıştım. Öncelikle şu kodları bilgisayarınıza indiriniz. Ve daha sonra aşağıdaki işlemleri yapalım.

İndirdiğiniz dosyası sitenizi ana dizinine atınız. Ve twittercss.css dosyası içerisindeki

width: 500px;

padding-top: 55px;

padding-left: 20px;

bu kodlarla sayfanız üzerinde şekillendire bilirsiniz. Sayfanıza göstermeniz için koyucanız kodda aşağıdaki gibidir.

<div>

<h2 style=”display: none;” >Twitter </h2>

<span id=”twitter_update_list”></span>

</div>

<script type=”text/javascript” src=”js/blogger.js”></script><script type=”text/javascript” src=”http://twitter.com/statuses/user_timeline/muratbutun.json?callback=twitterCallback2&amp;count=1″></script>

</div>

</div>

Kırmızı ile vurguladığım yeri siz kendi twitter kullanıcı adızı yazınız

CodeProject ASP ve ASP.NET kaynağı | www.codeproject.com

Microsoft ürünleri üzerinde çalışma yapan programcıları bir araya getiren Code Project yalnızca webmasterlar için değil programcılar içinde güzel bir kaynak. Sitede asp ve asp.net üzerinde çalışabilen bir çok script ve Microsoft masa üstü programlarlıda mevcuttur. Code Project en önemli özelliği scripti programcının anlatımı ile yayınlamasıdır. Siteniz için kullanabileceğin yazılımı bir çırpıda indirebileceğiniz gibi yazılımcının açıklamasını da inceleyebilirsiniz. Site içeriği oldukça geniş olsa da aradığınızı bulmak o kadar zor değil. Sitede makaleleri okumak ve yazılımları görüntülemek için üyelik zorunlu tutulmamış. Web Development başlığı altında bolca zaman geçirerek AJAX ve Atlas kontrollerinin kullanımından Silverlight makalelerine kadar birçok kaynağı inceleyebilirsiniz.

Hotscripts Binlerce PHP uygulama | www.hotscripts.com

Code Project çok geniş bir içeriğe sahip olsa da bu sitede php uygulamaları yer almamaktadır. Hotscripts de bir çok yazılım türüne yer verilmiş fakat php daha ağır basıyor. Sitede 13 bin üzerinde yazılım bulunmaktadır. Bunun yanında C ve C#, Flash, Ruby on Rails, XML, ASP, CFML, Java, Python, ASP. NET, CGI ve Perl, Java Script dillerinde hazır uygulamalar bulabiliyorsunuz. Site ASP ve ASP.NET konularında da boş değil. 3 binin üzerinde klasik ASP uygulaması ve binin üzerinde ASP.NET uygulaması buradan edinilebiliyor. Hotscripts üzerindeki bazı yazılımlar maalesef ki ücretsiz değil. Yinede aradığınız yazılıma bakarken tek tek incelemenizde yarar var. Bazı durumlarda işini çok iyi yapan bir script için minik bir ücret ödemeyi göze alabilirsiniz. Çünkü Hotscripts’de gerçekten profesyonel uygulamalar bulabilirsiniz

Sayfalarınızı süsleyecek JavaScript’ler | www.javascript.internet.com

Web sitenizin arka planında kullandığınız programlama dilinden bağımsız olarak tarayıcı tarafında çalışacak Java Script’ler kullanabilirsiniz. Web sitenizin arka planında kullandığınız programlama dilinden bağımsız olarak tarayıcı tarafında çalışacak Java Script’ler kullanabilirsiniz. Java Script’ler birçok fonksiyon sağlayabildiği gibi web sitenizin sayfalarını renklendirecek efektler de sunuyor. Bu konuda web’deki en iyi kaynaklardan javascript.internet.com adresinde yer alıyor. Hareketli menüler, resim efektleri, imleç efektleri, metin efektleri, tarih-saat gösteren kodlar gibi sayfalarınızda kullanabileceğiniz birçok Java Script bileşenini bu

adresten indirebilirsiniz. İlerleyen bölümlerde Java Script’lerin sayfalara nasıl eklendiğine kısaca değineceğiz.

Her ne kadar programcı ve webmaster arasında ciddi bir bağlantı olsa da aynı şey değildir. Bir webmaster bir siteyi kurar ve yönetir ayrı olarak programlama bilmek zorunda değildir. Webmasterın mutlaka bilmesi gereken şey html bilgisidir.

Html (Hypertext Markup Language) bir işaretleme dilidir. Html sunucu üzerinde gerçekleşen olayları değil, içeriğin tarayıcıda nasıl gösterileceğini belirten işaretlerden oluşur. Örneğin bir html dosyasında <H1> ve </H1> kodlarının arasına yazılan yazılar başlık anlamına gelmektedir. İnternette girmek için kullandığımız tarayıcı <H1> kodlarının arasına yazılan yazılanın diğer yazı karakterlerine göre büyük olarak gösterileceğini bilir. En kısa yönden HTML Explorer, Firefox, Opera, Safari vb… tarayıcıların anladığı bir dildir. Html kodlarının ne anlama geldiğini öğrenerek kısa sürede sizlerde bir web sayfası yapabilirsiniz.

Web Sitenizin Vitrini

Html kodları web sitenizin vitrinine benzetilebilir. Hiçbir veri tabanı bağlantısına gerek duymadan sadece webmaster ın yapım aşamasında eklediği sabit içeriklerden oluşur. Örneğin kişisel bir web sayfası oluşturmak istiyorsanız html kodları ile kolayca oluşturabilirsiniz. Ben kendi web sayfamı html ile oluşturdum, daha kullanışlı ve tasarım olarak daha göze hitap etmek istediğim için css, java ve ajax kodlar ile html sayfamı destekledim. Benim web sayfamda daha basit bir web sayfasını Expression ve Dreamweaver ile dakikalar içerisinde oluşturabilirsiniz.

Web Sitenizin Mutfağı

Expression  Web ve Dreamweaver programları ile web sayfası hazırlamak wordde yazı yazmaktan pek bir farkı yoktur. Sizin oluşturduğunuz yazı, resim ve animasyonları web ortamına aktarmak için kullanılan programlardır. Oysa web sitelerinize dinamik bir sayfa oluşturmak isterseniz işin boyutu değişir ve yazılıma ihtiyaç duyarsınız. Web sitenizin içeriğine göre bir program alt yapısı hazırlamalısınız.

Hazırı Var!

Programcılığı okullardan ve eğitim merkezlerinden öğrenenlerin  yanı sıra kendi imkanları ile Internet ten ve kitaplardan öğrenenlerin sayısı da bir hayli fazladır. Internette derslerin yanı sıra bir çok ücretsiz açık kaynak kodları da bulabilirsiniz. Çeşitli web sitelerinden indirebileceğiniz scriptti web sayfanıza kurarak ciddi bir dinamik web sitesi oluşturabilirsiniz. Ayrıca sitenizin ihtiyacına göre eklentilerde ekleyebilirsiniz. Çalışmalarını paylaşan o kadar çok programcı var ki bu paylaşım yeni nesil programcılarında önünü açıyorlar. Seçkin yazılımları paylaşan başarılı web sayfalarını sizin için derleyip topladım ve BU sayfada inceleyebilirsiniz.