bildirgec.org

html hakkında tüm yazılar

İ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.

Google den PDF sorununa çözüm

ewrenjfm | 16 November 2009 17:31

Bilindiği üzere, Google‘de yaptığımız aramalarda, pdf özellikli sayfalarda, sayfayı iki seçenekte açabiliyoduk. Bu seçenekler ya pdf olarak dosyayı açacağız ya da ‘HTML olarak görüntüle’ bağlantısını seçeceğiz. Bu iki seçenek bizim için yeterli ve kullanışlı görünsede aslında bir takım sorunlar meydana getiriyodu.
Örneğin; sonucu pdf olarak görüntülemek istersek , bilgisayarımızda bir adobe programı yani pdf okuyucu bir program olması gerekiyor. Sonucu HTML olarak görüntülemek istersekde Google’nin HTML düzenleyicisi bazen tabloları eksik gösteriyor, biçimlendirme özelliklerini ayarlayamıyor yani orjinalle aynı özellikte olmuyordu.
Google artık bu sorunu çözdü ve ‘Quick View (Hızlı Görüntü)’ adını verdiği bir uygulamayı kullanıcıya sundu. Bu program ile bilgisayarımızda pdf okuyucu olmasa bile Google nin kendi yorumlayıcısıyla, yazıyı orjinal halde görebileceğiz.
Google artık pdf yazılarının %50 sinden fazlasının bu şekilde çalıştıgını ve yakında tamamının bu şekilde olacagını belirtiyor. Bu sayade bizde pdf dökümanlarımızı daha hızlı ve kayıpsız açabileceğiz…

font-face artık tüm tarayıcılarda!

basarozcan | 30 October 2009 12:03

Eğer web tasarımı ile uğraşıyorsanız @font-face tanımlamaları ile istediğiniz fontları sitenizde kullanmanın olağan olduğunu biliyorsunuzdur. OTF ve TTF gibi değişik uzantılı fontları birçok tarayıcıda sorunsuz olarak gösterebiliyorsunuz. Fakat iş bu fontları Internet Explorer’da kullanmaya gelince malesef tahmin edeceğiniz gibi yine bir sorunla karşı karşıya kalıyoruz.

@font-face desteği aslında Internet Explorer 4’ten beri Microsoft’un desteklediği bir deklerasyon. Fakat bu destekleri biraz tutucu. Çünkü IE serisi sadece EOT (Embedded Open Type) fotmatlı fontları desteklemekte. Bu formatın seçilmesinin nedeni ise bu formatlı font dosyalarının kopyalanarak kişisel kullanıma izin vermemesidir.

Bu yazıda sevdiğiniz fontları nasıl EOT formatına çevireceğinizi ve sitelerinizde nasıl kullanacağınız konusunda ipuçlarını kullanarak sitelerimizin albenisini arttıracağız.

Tarayıcılar ve desteklenen formatlar
Tarayıcılar ve desteklenen formatlar

Birinci Adım: Ücretsiz bir font seçin
Internet’te birçok ücretsiz font sunan site var. Lisans problemleri ile karşılaşmak istemiyorsanız tamamen ücretsiz lisansla yüklenmeye sunulan fontları bularak sitelerinizde kullanmaya bakın. Bu tarz fontların sıralandığı fontex.org mutlaka göz atılması gereken kaynaklardan.