Beşiktaş.Us

Beşiktaş Haber Portalı

SinerjiSoft için hazırladığım Beşiktaş Haber Sitesi tasarımının script giydirilmesi tamamlandı ve site yayın hayatına beta olarak basladı.

Siteye Katkım:

 Tasarım, Xhtml ve Css Kodlama

SinerjiSoft.Com Beşiktaş.Us - Ziyaret Et

HTML5 ve Yenilikleri Hakkında

tarih 17 Temmuz 2010 yazarMustafa AYDIN
Kategori: 
Web Tasarım

XHtml her ne kadar css ile birlikte kolaylık sağlasa da ve Html’i belli standartlara oturtsa da, yine de bazı noktalarda kod kalabalığının önüne geçemiyor. İşte bu noktadan hareketle geliştirilmeye başlanan HTML5 çok güzel özelliklere sahip. Bunlarda bazıları ise şöyle:

  • <canvas>: Sayfada bir tuval alanı oluşturur. Tuvale çizim javascript ile yapılabilir.
  • <audio>: Sayfaya ses oynatıcı bir modül ekler.
  • <video> : Video oynatıcı bir modül ekler.
  • <progress> : İşlem süreci göstergesi ekler.
  • <caption> : Başlık olarak düşünülen metinleri düzenler.
  • <header> : Sitenin başlık ve açıklama içeriğini alır.
  • <nav> : Menüleri ve bir takım zaruri işlevleri içine alır.
  • <footer> : Sitelerin en alt kısmını içine alır.
  • <section> : Sitelerin ana içerik kısmını içine alır.
  • <aside> : Ana içerikte ayrı yazılan kısımdır.
  • <article> : Makale, deneme tarzı yazıları kapsar.
  • <embed> : Dışarıdan eklenen componentler için kullanılır. (Örn : .swf uzantılı dosyalar)
  • <details> : Detay bilgisi içerir.
  • <summary> : Yazının başlığını belirler.
  • <time> : Tarih, saat verilerini kapsar.
  • <mark> : Yazı içerisinde özellikle üstünde durulan kelimeleri belirler.
  • <fig>
  • <figure>
  • <hgroup>

HTML5 yapısını şu anda Mozilla Firefox 3.6.3, Opera 10.53, Apple Safari 5, Google Chrome 5 tarayıcıları kısmen desteklemektedir. Ancak Internet Explorer 8 bu yapıyı hiç tanımamaktadır. Yeni geliştirilen Internet Explorer 9’un ise test aşamasında şu anda %88 olarak desteklediği söylenmektedir Microsoft tarafından. Bu değerleri http://samples.msdn.microsoft.com/ietestcenter/#html5Canvas adresinden takip edebilirsiniz.

http://html5demos.com/ sitesinden ise HTML5’in yeni özelliklerini ve bunların demolarını inceleyebilirsiniz.

http://www.whatwg.org/specs/web-apps/current-work/ adresinden HTML5 hakkında geniş kapsamlı bilgiye ulaşabilirsiniz.

Photoshop Fırça (Brushes) Kütüphaneleri

tarih 16 Temmuz 2010 yazarMustafa AYDIN
Kategori: 
Photoshop

Photoshop’ta tasarım yaparken çoğu kez kullandığımız fırçalarla harika efektler ortaya çıkartırız. Bunun için ister kendi fırçalarımızı oluştururuz, istersek de internetten fırça setlerini indiririz. İşte tasarımcılara çok yardımcı olacak fırçaları bulabilmek için en uygun siteleri paylaşmak istedim.

Brusheezy.com
Brusheezy.com adresinden birçok fırça ile birlikte, doku ve desenlere de ulaşabilirsiniz.

Myphotoshopbrushes.com
Yine bu sitede de fırçalara, dokulara, desenlere, şekillere (shapes), gradient çeşitlerine, style dosyalarına ulaşabilirsiniz.

Psbrushes.net
Psbrushes sitesi fırçaları kategorilere ayırmış ve geniş bir kütüphane oluşturmuş. İstediğniz kategoriden, istediğiniz fırçayı bulabilirsiniz. Sitede bu yazıyı yazdığımda toplam 511 fırça bulunmaktaydı.

Qbrushes.net
Psbrushes sitesi gibi çeşitli kategorilerden fırçalara ulaşabilirsiniz. Geniş arşivinde çok güzel fırçalar bulunmakta.

Brushking.eu
Bu sitenin de çok geniş bir arşivi bulunkata.

Findbrushes.com – Fırça Arama
Bu site ise aradığınız fırçayı bulmanızda size yardımcı olmak için var. Bünyesinde bulundurduğu 14954 fırçadan ve 745 fırça setinden arama yaparak en uygun sonuçları gösteriyor. Yapmanız gereken tek şey aradığınız fırçaya en uygun kelimeyi (İngizce kelime) girip ara butonuna basmanız.

Umarım bu siteler çok işinize yarar. :)

Photoshop’a Başlarken

tarih 16 Temmuz 2010 yazarMustafa AYDIN
Kategori: 
Photoshop

İnternet ve bilgisayar kullanımının yaygınlaşmasıyla beraber; Photoshop, web tasarım konularına da ilgi arttığını görüyoruz. Bir çok forumda, blogda bu konular hakkında çeşitli bilgiler bulunuyor. Ancak bu bilgilerin çoğu belli bir düzen içinde değil ve kullanıcılara neye nereden başlayacağını göstermiyor. Bu husus çok önemlidir. Çünkü bir işte seri ilerlemenin ilk şartı sağlan temelle başlamaktır. Toplama bilgilerle hareket ettiğinizde bu bilgileri birbiriyle bağlamakta çok zorluk çekebilirsiniz. Ben de bu yazımda işe nereden başlanacağını, başlangıç olarak dökümanlara nereden ulaşacaklarını dilim döndüğünce, becerebildiğimce anlatmaya çalışacağım.
devamını oku

300 Harf Sosyal Ağı

tarih 16 Temmuz 2010 yazarMustafa AYDIN
Kategori: 
İnternet

Uzun zamandır siteme ilgi gösteremiyordum. Baktım çok ihmal etmişim “Yanlış yapıyorsun Mustafa!” dedim kendi kendime. :D

Bu arada uzun bi aradan sonraki ilk yazımda geçenlerde rastladığım bir siteyi tanıtmak istiyorum: “300 Harf” adında bir sosya ağ… Site ile Cnet Turkiye’de site için yazılan bir makale ile tanıştım.

Site Twitter’ı andırsa da aslında tam olarak öyle değil. Sitede takipçiler söz sahibi. Yani siz bir profil yarattınız ve takipçileriniz var diyelim. Onlar profilinize sizin hakkınızda kişisel haklara bağlı kalarak istediklerini yazabiliyorlar. Eğer profil sahibi kendisi hakkında yapılan yorumlardan hoşnut değilse bu yorumları şikayet edebiliyor.

Siteden bahsetmişken adresini de vereyim: 300harf.com

Google, Internet Explorer 6′ya desteğini çekti

tarih 02 Şubat 2010 yazarMustafa AYDIN
Kategori: 
Web Tasarım, İnternet

Uzun bir süredir siteme yazı yazmmıyordum. Ancak son bir iki haftadır da içimde böyle bir istek vardı. Bugün bu konuyu görünce de dayanamadım bu sevincimi herkesle paylaşmak istedim. :D Ne kadar mutlu oldum anlatamam : )

Evet yanlış duymadınız Google artık Internet Explorer’in eski versiyonlarını desteklemeyecekmiş. Yani artık Internet Explorer’ın artık dönemi kapanmasına rağmen kullanılan ve web site tasarımcılarını deli eden eski versiyonlarıyla Google siteleri ziyaret edilemeyecek. Bu müthiş haber bende heyecan yarattı hemen. Çünkü artık bu sayede Internet Explorer 6′nın sonu gelebilir.

Şimdi haberin ayrıntılarına gelelim. Google 1 Mart tarihinden itibaren eski versiyon tarayıcılarda düzgün görüntülenemeyecek. Ben başlıkta IE6 yazdım fakat bunun yanı sıra diğer eski versiyon tarayıcılar da aynı şekilde destekten yoksun.

Ayrıca yapılan açıklamada kullanıcıların Internet Explorer 7 ve üstü, Mozilla Firefox 3 ve üstü, Google Chrome 4 ve üstü, Safari 3 ve üstü versiyonları kullanmaları öneriliyor.

Ben de böylece bu güzel haberle tekrar yazı yazmış oldum. Çifte mutluluk. :D

Microsoft Windows 7 Deneme Sürümleri

tarih 24 Eylül 2009 yazarMustafa AYDIN
Kategori: 
İşletim Sistemleri

Microsoft Ekim ayında satışa sunacağı yeni işletim sisteminin 90 günlük deneme sürümünü internette yayınlamaya başladı. Windows 7 Enterprise Deneme Sürümünün çıkacak olan sürümden hiç farkı da yok. Ancak 90 gün sonunda da Windows 7′yi kullanmak isteyenler sistemi satın almalı ve yeniden kurmalıdır diye de uyarıyorlar. :)

Sadece İngilizce, Fransızca, Almanca, Japonca ve İspanyolca olarak indirilmeye hazır. Tabii sonra dil eklentilerini de kurabilirsiniz. Şunu da söylemekte fayda var: Sadece sınırlı sayıda indirilecektir. İşte indirme bağlantıları:

Windows 7 Enterprise 90 Günlük Deneme Sürümü :
http://technet.microsoft.com/en-us/evalcenter/cc442495.aspx

Windows Server 2009 R2 180 Günlük Deneme Sürümü :
http://www.microsoft.com/windowsserver2008/en/us/try-it.aspx

VirusTotal – Çevirimiçi Ücretsiz Bir Virüs ve Kötü Niyetli Yazılım Tarama Servisi

tarih 23 Eylül 2009 yazarMustafa AYDIN
Kategori: 
Güvenlik

Sanal paylaşımların her geçen gün arttığı ortamda sanal güvenlik saldırılarının da artması oldukça doğal bir sonuçtur. Hatta bu saldırılar bazen bizim sadece sanal işlerimizi etkilemekle kalmayıp gerçek hayatımızı da etkisi altına almaktadır. Binlerce, milyonlarca insan hergün internet üzerinde alış-veriş yapmakta. Hergün bu sayı kadar kredi kartı hesabı sanal alemde risk altındadır.

Güvenlik, kendini güvende hissetme dürtüsü ise insanın var oluşunda birincil ihtiyaçlardan olduğuna göre her türlü güvenlik de bizim için önemlidir. O yüzden sanal ortamda da verilerimizi veya maddi kaynaklarımızın bir kısmını yada tamamını kaybetmek istemiyorsak sanal tehtidlerin başında gelen virüslerden korunmamız gerekmektedir. Bu amaçla oluşturulan VirusTotal projesi de dosyalarımızı çevrimiçi olarak 39 anti-virüs yazılımına göre tarayarak o dosyada virüs var mı, yok mu bize bildiriyor. 39 anti-virüs yazılımı hiç de azımsanmayacak bi rakam. Üstelik Türkçe desteği de mevcut. :)

Tabii bu site bilgisayarınızı tam olarak taramıyor. Sadece sizin gönderdiğiniz dosyalarınızı tarıyor. Bu yüzden bilgisayarınızda mutlaka bir virüs yazılımı bulundurmalısınız.

VirusTotal, PC World Dergisi Amerika versiyonu tarafından 2007 yılının en iyi Güvenlik Web siteleri kategorisinde en iyi 100 siteden biri olarak ödüllendirilmiştir.

devamını oku

CSS3 – Gölgeler (Shadow)

tarih 06 Eylül 2009 yazarMustafa AYDIN
Kategori: 
CSS3 Hakkında

CSS3’ün getirmiş olduğu yeniliklerden bir tanesi de gölgelendirme efektleridir. Böylece metinlerimize ya da kutularımıza kolayca gölge ekleyebileceğiz.

Metne Gölge Ekleme

İstediğimiz metne, başlığa, paragrafa istediğimiz renkte istediğimiz ebatlarda gölge atayabiliriz. Bunu da sadece text-shadow kodu ile yapacağız. Hemen örnek kodumuz üzerinde gösterelim:

1
2
3
4
5
p{
	font-family:Arial, Helvetica, sans-serif;
	color:#ea9800;
	text-shadow: 4px 4px 7px #999;
}

Buradaki ilk iki kodu anlatmayı atlıyorum. Çükü bizim konumuzu ilgilendiren asıl kod kısmı son kısımdır. Text-shadow kodunda 4 değer görüyoruz. Bunlardan ilk 4px.lik değer gölgemizin metnin sağından uzaklığını belirler, ikinci değer olan 4px.lik değer ise gölgemizin metnin aşağısından uzaklığını belirler, üçüncü değerimiz (2px.lik değer) ise gölgemizin yoğunluğunu, bulanıklılık değerini belirler. Son değerimiz ise gölgemizin rengidir. Aşağıda bu kodların örnek görünümü de bulunmaktadır. Bu örneği görebilmeniz için sitemizi Firefox 3, Opera ve Safari ile görüntülemeniz gerekmektedir.

devamını oku

CSS3 – Border (Çerçeveler – Kenarlar)

tarih 06 Eylül 2009 yazarMustafa AYDIN
Kategori: 
CSS3 Hakkında, Web Tasarım

Css3 ile gelen yeniliklerden biri de borderlar üzerinde artık daha fazla hakim olabileceğiz. Yani şöyle ki artık borderlara istediğimiz resmi arkaplan olarak atayabileceğiz. Çok güzel bir özellik değil mi.  Diğer özellik ise kalın borderlarda her pixele ayrı bir renk tonu atayarak gradient görünümlü borderlar hazırlayabilirsiniz. Birde köşeleri ovalleştirebildiğimizi zaten bir önceki konuda ayrıntılarıyla anlatmıştım.

Köşelerde her pixele ayrı renk atama:

Evet bu özellik şu anda sadece Firefox tarayıcısında çalışıyor. Örnek kodlarımız da işte şöyle:

1
2
3
4
5
6
7
8
#kutu {
	border: 8px solid #000;
	-moz-border-bottom-colors: #033 #039 #777 #888 #999 #aaa #bbb #ccc;
	-moz-border-top-colors:    #033 #039 #777 #888 #999 #aaa #bbb #ccc;
	-moz-border-left-colors:   #033 #039 #777 #888 #999 #aaa #bbb #ccc;
	-moz-border-right-colors:  #033 #039 #777 #888 #999 #aaa #bbb #ccc;
	width:400px;
}

Aşağıda da örnek görünümü bulunuyor. Bu kutuyu görebilmeniz için Firefox ile sitemizi ziyaret etmeniz gerekir.

devamını oku

CSS3 – Oval Köşeler

tarih 04 Eylül 2009 yazarMustafa AYDIN
Kategori: 
CSS3 Hakkında

CSS3 ile birlikte artık oval köşelerimizi, yuvarlak köşelerimizi çok daha kolay yapabileceğiz. CSS’yi geliştirenler işimizi daha da kolaylaştırabilmek için Photoshop gibi resim editörleriyle yaptığımız ve resimlerle sitelere eklediğimiz oval köşeler için yeni kodlar eklemişler. Bu kodları yazarak grafiksiz olarak oval köşelerimizi halledebiliriz. Bu özellik kodu “border-radius”tur. Şimdi örnek bir uygulama yapalım o zaman. İlk olarak Xhtml dosyamıza şu kodu ekleyelim:

1
2
3
<div class=”oval-kutu”>
<p>Bu bir paragraftır.</p>
</div>

Gördüğünüz gibi div etiketimize oval-kutu sınıfını atadık. Şimdi de CSS ile oval-kutu sınıfının özelliklerini yazalım:

1
2
3
4
5
6
7
8
9
.oval-kutu {
	background-color: #666; 
	color: #fff; 
	line-height: 20px; 
	width: 200px; 
	padding: 10px; 
	-webkit-border-radius: 10px; 
	-moz-border-radius: 10px;
}

devamını oku