bildirgec.org

css hakkında tüm yazılar

En İyi Tarayıcı Hangisi? Başlıca Performans Karşılaştırması

axanc | 30 November 2009 10:03

Bugünlerde güncel olarak kullanmakta olduğumuz 5 temel tarayıcıların, son sürümlerini alarak bir performans karşılaştırması hazırlanmış.

1. mozilla firefox 3.5
2. google chrome 3.0
3. microsoft internet explorer 8.0
4. opera 10.0
5. apple safari 4.0

Karşılaştırma için 6 temel performans faktörü ele alınmış. bunlar:

1. javascript hızı
2. yoğun çalışma altında ortalama işlemci kullanımı
3. dom ayıklama hızı
4. css yorumlama hızı
5. sayfa yükleme hızı
6. tarayıcı önbellekleme hızı

Her tarayıcı, önbellek temizlenmiş şekilde 3 kere test edildi, önbellekleme hızı hariç tabii ki. sonuç olarak ortalama değerler alınmıştır.

1. javascript hızı
daha hızlı javascript çalışması ajax benzeri işlemler kullanan sitelerin daha hızlı çalışması ve kullanıcıya hızlı cevap vermesidir. SunSpider ile test edilmiş. Düşük süre daha iyidir.

Zen Coding: Html / CSS yazmanın en hızlı yolu

siriusbee | 26 November 2009 12:24

Zen Coding
Zen Coding

Bir website tasarımında html kod yazarken ne kadar zaman harcarsınız? Etiketler, özellikler, tırnak işaretleri, parantezler vs. Özellikle de benim gibi bütün karakterleri sıfırdan tek tek yazan biriyseniz sizi bu zaman kaybından kurtaracak ve çok kolayca html/css kodu oluşturabileceğiniz bir uygulamadan bahsetmek istiyorum: Zen Coding.

Zen Coding
Zen Coding

html/css kodu yazmanın en hızlı yolu olan Zen Coding Sergey Chikuyonok tarafından geliştirildi. Hem Mac hem de Windows ortamında çalışabilen versiyonları olan Zen Coding’i kullandığınız editöre (dreamweaver, GEdit vs) entegre ederek iç içe geçmiş en karmaşık div yapılarını oluşturma zahmetinden kısa zamanda kurtulabileceksiniz.

İki farklı Javascript betiği aynı anda kullanmak

AcharadSami | 26 November 2009 09:51

Merhaba bildirgec.org sakinleri;

Kişisel sitemde kullanmak amacı ile, basitçe bir “Flowplayer.org JQuery Scrollable” betiği ile, “Jquery dock” betiğini aynı anda tek bir sayfada kullanmak ve tek sayfalık bir dizayn oluşturmak istiyorum. Dock sabit durur iken,ikonlara tıklandığında sayfanın kaymsını istiyorum.

Bunun için, Dock betiğini ayrı bir iframe içinde çalıştırmak, overlay iframe veya div içinde tutmak, iki scripti birleştirmek, css attributeleri çakıştırma oluşturmayacak şekilde baştan düzenlemek gibi farklı yöntemleri denedim. Hatta en son olarak, Altlı üstlü bir Frameset oluşturup, farklı framelerdeki divleri çağırmata bile çalıştım. Ancak iki scriptin beraber sorunsuz işlemesini bir türlü sağlayamadım. Sizin bildiğiniz ayrıca bir yöntemi var mıdır ?

Webciler için kaynak dediğin böyle olur

GokhanKARAKAS | 25 November 2009 10:10

işte size bomba gibi bir liste. web tasarım ve yazılım konusunda tek sayfada hemen hemen bütün konuları bulmanız mümkün. konuları aşağıda belirttim.

html ve css konusunda aklınıza gelen ne varsa burada;

  • html tutorials (html tutorials)
  • css tutorials (css tutorials)
  • html tagları (html tags)
  • html renk kodları ve örnekleri (html color codes and swatches)
  • html sıkça sorulan sorular (html faq)
  • web içerik erişebilirliği (web content accessibility)
  • ulaşılabilir tablolar (accessible tables)
  • html kontroller (html validators)
  • html version information (html sürüm bilgileri)
  • html editörleri (html editors)
  • css editörleri (css editors)
  • doctype (döküman türleri)
  • formlar (forms)
  • çerçeveler (frames)
  • css karakter uyumluluğu (css compatibility charts)
  • css düzenleme ve örnekler (css layouts & examples)
  • css articles (css makaleleri)
  • css forumlar (css forums)
  • css menüler (css menus)
  • css yuvarlak köşeler (css rounded corners)

Yazılım için derlenmiş konular ise şöyle;

  • perl kaynakları (perl resources)
  • php kaynakları (php resources)
  • python kaynakları (python resources)
  • mysql kaynakları (mysql resources)
  • asp kaynakları (asp resources)
  • javascript kaynakları (javascript resources)
  • dhtml kaynakları (dhtml resources)
  • cgi kaynakları (cgi resources)
  • forum kaynakları, vbulletin, phpBB (forum packages)
    online araçlar;
  • arama motorlarına site kayıt (site submission)
  • seo (search engine optimisation)
  • browsers (tarayıcılar)
  • sayaçlar (counters)
  • web trafik raporları (web traffic reports)
  • web araçları (web tools)
  • 404
  • telif hakkı (copyright)
  • robots.txt

tasarım için;

  • photoshop kaynakları

tüm bunlara nereden ulaşacağız kayodeok.btinternet.co.uk sitesinin derlemiş olduğu muhteşem kaynaktan.
buyurunuz iyi günlerde kullanın.

Web 2.0 için Tasarım Araçları

admin | 20 November 2009 14:26

Web 2.0 gelince web siteleri dahada güzelleşip renklendi.Fakat eski tasarımcıların bazıları buna uyum sağlayamadı.Örneğin bir arka plan için photoshop vb. program ile uğraşmak istemiyorsanız aşağıdaki araçlar tam size göre. Sizin için butonlar, arka planlar, rozetler, yükleniyor simgelerini birkaç dakikada oluşturabilirler. Bazen dar zamanda yapmak zorunda olduğunuz bir iş varsa sizin için hayat kurtarıcı olabilirler. Sizin 10 dakida yapıcağınız işi 1-2 dakika gibi kısa sürede bitirirler.

Favico

(Çok kullanışlı bir favicon oluşturucu. Web siteleriniz için favicon oluşturabilirsiniz.)

SpiffyBox

(Artık yuvarlak köşeli kutu ve bloklar yapmak için uğraşmanıza gerek kalmayacak. Bu servis sizin için yapıyor ve size css, html kodlarınızı veriyor. Size bunları web sitenize eklemek kalıyor.)

ThemeForest ‘teki Türk Tasarımcılardan Seçmeler

admin | 18 November 2009 18:23

Envato firmasının tema ve tasarım marketi Themeforest.net ‘i artık duymayanınız kalmamıştır. Bu haberimizde Türk tasarımcıların Themeforest ‘te başarılı olan temalarına bakıcaz.

Phiyaz Entertaintment & Community Theme
Phiyaz Entertaintment & Community Wordpress Theme
Tasarımcı: turkhitbox
CONTRAST
CONTRAST Wordpress
Tasarımcı: Akay
Goldmine Wordpress Portfolio and Blog Theme
Goldmine Wordpress Portfolio and Blog Theme
Tasarımcı: Onuro
Luminous
Luminous HTML&CSS
Tasarımcı: peex
Blackops 960.gs Wordpress Theme
Blackops 960.gs Wordpress Theme
Tasarımcı: turkhitbox
Socio Video Photoshop Theme
Socio Video Photoshop Theme
Tasarımcı: kuntiz

Mükemmel HTML nasıl görünür?

admin | 17 November 2009 15:08

Çoğu zaman kendimi tutamıyor ve güzel görünen her sitenin kaynak kodlarını görüntüleyip inceliyorum. Tıpkı sokakta gördüğünüz her insanın temel kemik yapısını ve iç çamaşırlarını gösteren X-Ray gözlükler gibi doğrusu. Nasıl kendinize karşı koyup kodlara bakmazsınız ki?

Güzel bir sitenin güzel kodlarla yaratılışını görmek oldukça etkileyici doğrusu. Bazen de güzellik sadece dış görünüşte kalıyor. SEO’ya dikkat etmeyen arkadaşlarımız yüzünden olsa gerek. Ancak güzel kod nasıl olur? Şunun şurasında “Code is Poetry” (“Kod şiirdir”) diyen wordpress’i hepimiz bir şekilde kullanmışızdır. Sadece HTML’den ne olabilir ki? Topu topu sabit bir dil işte sadece ve dinamik özellikleri de hiç yok. Ancak gene de kodu yaratanın temel özelliklerini gösterir.

Bu konu da beni düşüncelere itiyor. Bir kodu ne güzel yapar? Konu HTML olunca, ustalığa bakar! Hadi güzel bir iskeletin, yazılması gerektiği şekilde yazıldığında nasıl göründüğüne bir bakalım.

Mükemmel HTML nasıl görünür?
Mükemmel HTML nasıl görünür?

Resim, isterseniz bir kağıda çıktısını alıp, duvarınıza asabileceğiniz kadar büyük.

  • HTML5 – HTML5 hem yeni, hem de html’yi şu ana kadarki en güzel haline getirdi.
  • DOCTYPE – HTML5 ile beraber, doctype da inanılmaz sade ve güzel bir hale geldi.
  • Sekmeler – Kodlar, ana/çocuk ilişkisini açıkça gösterecek şekilde ayrılmalı ve sekmelenmeli.