Web Tasarım - Grafik Tasarım

HTML

Web Sayfasında Kullanılan Renkler ve KODları

HTML
Web renkleri Web renkleri, web için siteler yaparken ve bu siteleri izlerken kullanılabilen renklerdir. Genelde RGBrenk sistemindeki üçlü kod kullanılır ama bazen renklerin standart İngilizce adlarını yazmak da yeterlidir. İlk web tarayıcılar (Mosaic ve Netscape Navigator) X11 renk adlarını kullanmışlardır. Bu ad sisteminin kökeni bilinmemektedir. Üçlü Hex Hex üçlüsü altı haneli, üç-baytlık hexadecimal bir numaradır. HTML, CSS ve diğer kodlarda renkleri bildirmek için kullanılır. Baytlar, kırmızı, yeşil ve mavi bileşenleri betimler. Numaralar da 00 ile FF arasında bir sayı belirtir. (Hexadecimal sistemde, 9'dan sonra A ile başlayarak harfler gelir) Yani 0 ile 255 arasında bir değer verir Bayt 1: kırmızı değer Bayt 2: yeşil değer Bayt 3: mavi değer Bu sistemle olu

Mouse ve Keyboard Olayları

HTML
OLAYLAR Genellikle fare düğmesine veya bir tuşa basılması gibi kullanıcı etkileşimlerini tespit etmede kullanılan niteliklerdir. Onblur Bir element odağını kaybettiğinde, yani kullanıcı başka bir form elementine tıklayarak veya tab tuşuna basarak geçtiğinde gerçekleşir. Onchange Hem form denetiminin odağı yitirdiğini, hem de değerinin son erişimde değiştiğini gösterir. Onclick Elementin tıklandığını gösterir. Ondblclick Elementin çift tıklandığını gösterir. Onfocus Bir form denetiminin odağı aldığını, yani kullanım veya veri girişi için seçildiğini gösterir. Onkeydown Element odağa sahipken bir tuşa basıldığını gösterir. Onkeypress Element odağa sahipken bir tuşun basılıp bırakıldığını gösterir. Onkeyup Element odağa sahipken bir tuşun b

HTML Elemanlarının Nitelikleri

HTML
Temel Nitelikler Bir çok HTML elementinin desteklediği, dört çekirdek nitelik vardır : ID , CLASS, STYLE, TITLE Bu niteliklerin kullanımı zorunlu değildir. Temel özelliği sayfanın incelenmesinde kolaylık sağlamasıdır. Biçimlendirme ve programlamada bazı kolaylıklar sağladığı için kullanılması tercih edilebilir. ID : Bir elemente özgün bir atamak için kullanılır. Örneğin, paragraf elementi <P> kullanılarak bu elemente ilkparagraf  ismi bağlanır. Bir dokuman için birden fazla elemente aynı ID değeri (ismi) verilemez. <P ID=”ilkparagraf”>Bu metinin ilk paragrafıdır.</P> Elementin adlandırılması, biçimlendirmeye ve programlama bağlantısı kurulmasına kolaylık sağladığı için önemlidir. CLASS : Bir elementin ait olabileceği sınıf veya sınıfları göstermek için k

HTML Elemanları – Hızlı Başlangıç

HTML
HTML  Hypertext Markup Language (Hipertext işaretleme dili) HTML Giriş Web sayfası düzenleme çalışmalarımıza her çalışmada kullanmayı tercih edeceğimiz bir kod grubu ile başlayacağız. <HTML> <HEAD><TITLE>HTML Giriş Kod Örneği</TITLE></HEAD><BODY> Merhaba! Bu HTML Giriş Kod Örneğidir. </BODY> </HTML> Örnek – 1 (giris.htm) 1. Yukarıdaki koyu zeminle yazılmış yazıları Windows’un Not Defteri programını kullanarak yazınız. 2. Dosya menusundan Kaydet seçeneğini seçiniz. 3. Açılan Farklı Kaydet dialog penceresindeki Kayıt Türü seçeneğini Tüm  Dosyalar yapınız. 4.  Dosya adını (tercihen) giris.htm olarak yazıp kaydetme işlemini tamamlayınız. 5. giris.htm dosyasını kaydettiğiniz klasörü açıp, giris.htm dosya

Web Tasarım Temelleri

HTML
Haydi Bir Web Sayfası Yapalım HTML dilini öğrenmenin en kolay yolu, deneme yanılma ile web sayfaları hazırlayarak bu sayfaları web tarayıcısı ile kontrol etmek, hataları düzelterek ilerlemektir. Ayrıca bilmediğiniz kodların nasıl kullanıldığını öğrenmek için Internet bağlantınız varsa varolan HTML sayfalarını web tarayıcınızın kaydetme seçeneğini kullanarak sabit diske kaydedip herhangi bir metin editörü kullanarak açıp inceleyebilirsiniz. Şimdi adım adım bir web sayfası hazırlayalım. Adım 1. Pencere Başlığının, arka planın belirlenmesi ve renkler. Her web sayfasının bir başlığı olmalıdır. Bu başlık web tarayıcısının başlık çubuğunda görüntülenecektir. Bu iş için <title> tag'ı kullanılır. <title> ve </title> tag'ları arasına yazacağınız metin web sayfasın

IMG – Resim Kullanmak

HTML
Resim Kullanmak Gelelim web dünyasının en önemli öğelerinden birine, resimlere. HTML dilinde her şey çok kolay olduğu gibi sayfalara resim yerleştirmek de çok kolaydır. Resimler sayfa içerisinde metne göre sağa, sola, aşağı ve yukarı doğru yerleştirilebilirler, ayrıca boyutları sadece belirli değerler değiştirilerek ayarlanabilir. Dokümanın herhangi bir yerine bir resim yerleştirmek için en sade haliyle <IMG SRC="RESIM.GIF"> tag'ını kullanabilirsiniz. Bu tag'ı kullandığınızda resim hiç bir yere yaslanmayacak, boyutu ayarlanmayacak, metin olarak bir alternatifi olmayacaktır. Yukarda da belirttiğimiz gibi resimleri kullanırken bir çok seçeneğiniz var, bu seçenekler sayfanın görünümünde kuşkusuz büyük rol oynayacaktır. Seçeneklerden birincisi Internet erişiminin yavaş

HTML Font Kullanımı – Yazı Tipleri

HTML
HTML ve Yazı Tipleri Dokümandaki yazıtipini  değiştirmek için <FONT> tagı kullanılır, genel kullanımı şöyledir: <FONT SIZE="x" FACE="[isim] COLOR="#XXXXXX"> * SIZE değişkeni metnin büyüklüğünü ayarlar, bu değişkene -1, +2 gibi değerler verilerek metnin puntosunun bir eksiltilmesini veya iki arttırılmasını sağlayabilir, direkt olarak bir rakam vererek puntoyu tayin edebilirsiniz. HTML sayfalarında SIZE değişkenine verebileceğiniz en büyük değer 5'tir. 5'ten sonra vereceğiniz her değer siz 5 değeri vermişsiniz gibi muamele görecektir. Yazıtipi çok büyük olmamalıdır, büyük yazıtipleri hem kullanıcıların sayfayı okumasını zorlaştırır hem de sayfanın güzelliğini bozar. * FACE takısını tüm web tarayıcıları desteklemese de bu takı kullanılarak sayfada resim kullanm

Link – Bağlantı Oluşturmak

HTML
Bağlantı Oluşturmak LINK veya shortcut dediğimiz Internet kısayolları, Internet'te belki de en çok kullanılan özelliklerden biridir. Asli amacı Internet üzerinde herhangi bir sunucuya bağlı bir dosyayla bağlantı kurmak olan kısayollar ayrıca elektronik posta yollamak, Telnet bağlantısı kurmak gibi değişik amaçlar için de kullanılabilir. <a href=" [Adres] [:port]" >[Görüntü]</a> Internet kısayollarının kullanımı yukarıdaki gibidir. Adres kısmı bağlanılacak HTML sayfasını, görüntü kısmı ise kısayolun, sayfadaki görüntüsünü belirler. Örneğin yazacağınız <a href=" http://www.birbilenesoralim.com" >BirBileneSoralım</a> gibi bir satır ekranda PC Magazine Online olarak görülecek ve sizi doğruca pc magazine Türkiye'nin Web sitesine bağlayacaktır. A

UL ve LI – Liste Kullanımı

HTML
Liste Kullanımı HTML tag'ları kullanarak sayfa içerisinde otomatik olarak numaralandırılan ve sıralandırılan listeler hazırlamak çok kolaydır, bunun için öncelikle metnin ne biçimde listeleneceğini seçmelisiniz. Liste hazırlarken en çok rastlananları tipler <OL> ve <UL> dir. <UL> tag'ını listeye ait olan her satırın başına bir nokta koymak için kullanabilirsiniz. <OL> tag'ı ise her bir satırı isteğe göre numaralandırmanızı veya harflendirmenizi sağlar. Bu tag'lar ayrıca bir paragrafı diğer paragraflardan biraz ileriye itmek için de kullanılabilir. Liste tipini belirlemek için yukarıdaki iki seçeneği kullanıyoruz; peki liste seçeneklerini birbirinden ayırmak için nasıl bir yol izleyeceğiz. Listenin her bir öğesini belirtmek için ise <LI> tag'ı kull

TABLE – Tablolar

HTML
Tablolar   Tablolar, HTML sayfasında listeler ve şablonlar hazırlamak dışında, resimleri ve metinleri sayfa içerisinde istenilen bölgelere yerleştirmek ve bunun gibi bir çok alanda kullanılırlar. HTML 3.2 ile birlikte pek çok yeni özelliğe kavuşan ve daha görsel hale getirilen tablolar konusunu iyi öğrenen bir webmaster, hayalgücü ile tasarladığı "TÜM" sayfaları tablolar yardımı ile oluşturabilir. <TR>,<TD>,<TH> ve bunları kapatma taglarıyla birlikte kullanılan <TABLE...> tag'ının genel kullanımı şöyledir: <TABLE BORDER=X CELLPADDING=X CELLSPACING=X WIDTH=[% veya X] HEIGHT=[% veya X] BGCOLOR=X BACKGROUND="X"> BORDER değişkenine verilecek 0 veya daha üstü bir değer tablonun kalınlığını belirler. CELLPADDING değişkenine verilebilecek