Web Tasarım Teknikleri - Web Sitesi Yapmak İsteyenlere Kaynak

Sponsorlu Bağlantılar

irun

irun

Üye
    Konu Sahibi
Web Tasarım Teknikleri - Web Sitesi Yapmak İsteyenlere Kaynak
Webtasarım a başlangıç için rehber,yeniler için kaynaktır... Tamamını okumanız önerilir...


Neden Web Siteniz Olmalı?

*Bir Web sayfası sadece onu incelemek isteyen “hedef kitleye” ulaşır.
*Web sayfaları oluşturmak için tek masrafınız telefon hat ücreti olacaktır.
*Web sayfaları hazırlarken hayal gücünüzü olabilidiğince kullanabilirsiniz.
*Web sayfaları kolayca düzeltilip tekrar yayınlanabilir.
*Sayfalarınız zamanında etkisiyle yeniliklere uğrayacaktır.
*Web sayfalarınız 24 saat boyunca tüm dünyaya açık olacak ve internet kullanıcılarına “etkileşimli” bir hizmet verecektir.
*Web sayfalarını kullanıcıların fikirlerini ve beklentilerini öğrenmek için derleyebilirsiniz.
*Web sayfalarının kaderi diğer medyalar gibi çöp kutusunda sonlanmaz.


Web Editörleri ve İncelemeleri

Herşeyden önce size gerekecek olan program, kullanıcıların izleyeceği Web sayfalarınızı hazırlayacağınız bir programdır. Bu tip programlar ile site içinde yer almasını istediğiniz resimleri, yazıları ve bağlantıları istediğiniz biçimde bir Web Browser'ı tarafından izlenecek şekilde tasarlayarak biraraya getirebilirsiniz. Bunun için önünüzde Allaire Homesite,Microsoft Frontpage, Netscape Composer, Adobe PageMill, Macromedia DreamWeaver, HotDog Pro gibi birçok program alternatifi bulunuyor.


Bir Düzenleyici Hangi Özellikleri Desteklemeli

Kolay Kullanım
Site yönetimi ve dosyaların sunucuya kolayca aktarılması
HTML dışında da farklı dosya tiplerini tanıyabilme
Renkli kodlama
İyi bir dokümantasyon
Şablonlama ve proje desteği
Özelleştirebilme
CSS desteği

Bazı Düzenleyicilerin İncelemeleri

Microsoft Frontpage 2000:

Microsoft firmasının, kendi ürünü olan Word’e benzerliğiyle dikkat çeken, bu nedenlede birçok kullanıcıya kullanımı kolay gelen düzenleyicisidir.

Artıları: Frontpage en başta kullanması ve öğrenmesi kolay bir düzenleyicidir.Ayrıca Microsoft’un ISS Web sunucusuyla tümleşmesi çok iyidir.Frontpage görsel arabilimi (tam olmasada WYSIWYG denebilir) sayesinde hiçbir HTML kodu yazmadan Web siteleri oluşturabilmeyi sağlar.

Eksileri: Frontpage, önceden sizin düzenlemiş olabileceğiniz kodları, tekrardan düzenlemekte çok ısrarcıdır.Bu nedenle sayfa kodlarına elle müdahale etseniz bile, bir sonraki açışınızda bu ince ayarların silinme olasılığı yüksektir.

Allaire Homesite:

Piyasadaki en iyi HTML kod düzenleyicisi.

Artıları: En gelişmiş özelleştirebilme seçenekleri.Bir kod düzenleyicisi olsa da, sistemde IE4+ yüklüyse, sınırlı miktarda görsel tasarıma izin vermektedir.Bütünleşik FTP istemcisi, şablonlama desteği, siteleri projeler altında gruplandırma sistemi, yazım kontrolü, Perl-PHP-ASP-VBScript-Java-CSS- SMIL-ColdFusion gibi dilleri otomatik tanıma, Dreamweaver’la bütünleşme, istenen şekilde kodu girintileyebilme, çok iyi bir dokümantasyon, Homesite’la tümleşik çalışan bir sürümüyle gelmesi.

Eksileri: WYSIWYG düzenleyiler arayan kişiler için tam anlamıyla uygun olmaması, Windows 9x’de bellek kaçırması ve maalesef sadece Windows’ta çalışması.

Macromedia Dreamweaver:

Homesite’ın HTML kodu alanındaki liderliğini, WYSIWYG düzenleyiciler alanında paylaşan program

Artıları: Dreamweaver’ın ilk göze çarpan özelliği, görsel düzenleyiciler arasında en iyi tablolama desteğini sunmasıdır.HTML koduna fazla müdahale etmemesi, blokların kolayca seçilebilmesi, seçilen etiketlerin nerdeyse tüm özelliklerinin kolayca ayarlanabilmesi, tümleşik FTP istemcisi ve site yönetimi,çok iyi DHTML ve Frame desteği, Internet üzerinden de yüklenebilen etiketlerle genişletilebilmesi, tabloları katmanlara, katmanları tablolara çevirebilmesi, rehber resim desteği, Homesite’la bütünleşme.

Eksileri: Homesite kadar iyi bir doğrudan HTML kodu yazımı olmaması ve maalesef sadece Windows ve MacOs’da çalışması.

HotDog Pro:

Birkaç yıl öncesine kadar görsel olmayan düzenleyiciler piyasasında Homesite’la başabaş giden bu program, yeni sürümlerinin sık sık göçmesi, firmanın yanlış taktikler izlemesi gibi nedenlerle popülerliğini yitirmiştir.

Artıları: Birçok özelleştirebilme seçeneği, tablo ve frame’lerin yaratılmasında kullanılabilen sihirbazlar, tümleştirilebilentarayıcı desteği, site yönetimi, ftp istemcisi, renkli kodlama.

Eksileri: Sık sık göçmesi, zayıf dokümantasyon ve çalışmayı engelleyici ses efektleri

Web Sayfalarının Tasarlanması

Yukarıda incelemesini yaptığımız birçok web editörü size HTML dilini bilmeden, HTML kodlarını kullanarak web sitesi yapma imkanı veriyor.Bu tip editörler sitenizde yaptığınız her adımı, otomatikman HTML koduna çeviriyor.
Peki o zaman neden HTML öğrenmelisiniz?HTML öğrenmelisiniz çünkü:
En basit neden; eğer iyi bir webmaster olmak istiyorsanız, ve HTML bilmeden sadece bu tür programları kullanmayı düşünüyorsanız, muhtemelen programın verdiği, programdan kaynaklanan en küçük bir hatada eliniz kolunuz bağlı kalacaktır.
Lisans gerektiren programlar: Birçok kaliteli "HTML çevirici" programını kullanmak için, o programın lisansına sahip olmanız gerekir. Ve bu da genelde büyük paralar gerektirir.

HTML Nedir?

HTML, Hyper Text Mark-up Language'ın kısaltılmışıdır. Türkçe karşılığı Hiper Metin İşaretleme Dili'dir. Browserlar tarafından tanınıp yorumlanabilen metin tabanlı bir dildir ve metnin browser tarafından yorumlanması sonucu da web sayfaları elde edilir. Yazdığınız kodların browser tarafından alınıp yorumlanabilmesi için, dosyalarınızın uzantısının ".htm" veya ".html" olması gerekir.
HTML de her i&#351;aretleme dilindeki gibi komutlardan olu&#351;ur, bu komutlara tag veya mark-up denir. Tag&#39;ler herhangi bir metinden farkl&#305; olduklar&#305; browser taraf&#305;ndan anla&#351;&#305;labilsin diye "<" ve ">" i&#351;aretlerinin aras&#305;na yaz&#305;l&#305;r. Her tag&#39;in bir ba&#351;lang&#305;c&#305; ve biti&#351;i vard&#305;r. Biti&#351; tag&#39;lerinde, "<" i&#351;aretinden sonra tag&#39;in biti&#351; tag&#39;i oldu&#287;unu belirtmek için "/" i&#351;areti kullan&#305;l&#305;r. Bir örnek ile göstermemiz gerekirse;



Bu bir Paragraf tag&#39;idir.</P>

Temel Komutlar:

<HTML></HTML>
Tüm HTML doküman&#305;n&#305; içine alan en temel tag&#39;dir ve doküman&#305;n HTML ile yaz&#305;ld&#305;&#287;&#305;n&#305; browser&#39;a bildirir.
<HEAD></HEAD>
Bu tag&#39;in aras&#305;na yaz&#305;lan her &#351;ey, sayfan&#305;n tan&#305;m&#305;n&#305; olu&#351;turur. Buna sayfan&#305;n ba&#351;l&#305;&#287;&#305; da dahildir. Ayr&#305;ca meta tak&#305;lar&#305; da bu tag&#39;in aras&#305;na yaz&#305;l&#305;r:

<TITLE></TITLE> : Sayfa ba&#351;l&#305;&#287;&#305;d&#305;r. Bu tag&#39;in aras&#305;na yaz&#305;lan her &#351;ey sayfam&#305;z&#305;n ismi olacak ve ba&#351;l&#305;k çubu&#287;unda görüntülenecektir.

META Etiketi: Arama motorlar&#305;nda iyi bir s&#305;ralama kapmak için meta etiketleri içerisine yazd&#305;&#287;&#305;m&#305;z notlar çok önemlidir.

Örne&#287;in &#8220;Afyon Kocatepe Üniversitesi&#8221; sitesinin Meta etiketleri &#351;öyle olabilir:
<META name=&#8220;keywords&#8221; content=&#8220;Afyon Kocatepe Üniversitesi,AKÜ,AKU,fakülteler,Yüksekokullar,Enstitüler,Akade
mik Takvim, Üniversite, afyon kocatepe university, Turkey, University,education,campus,Türkiye, academics, students, faculty>

Sayfan&#305;zda kulland&#305;&#287;&#305;n&#305;z Türkçe karakterlerin ba&#351;ka bilgisayarda bozuk &#351;ekillerde görülmemesi için:
<meta http-equiv=&#8220;Content-Type&#8221; content=&#8220;text/html; charset=windows-1254&#8221;>

<BODY></BODY>
Sayfan&#305;n browser taraf&#305;ndan ekrana bas&#305;lacak tüm k&#305;s&#305;mlar&#305; bu tag&#39;in aras&#305;na yaz&#305;l&#305;r. Ekrana bas&#305;lacak k&#305;sm&#305;n içine metinler, resimler, formlar, tablolar vs. girer.

<html>
<head>
<title>&#304;lk Sayfam</title>
</head>
<body bgcolor="#e3e3e3">
Web sayfama ho&#351;geldiniz

Web sayfama ho&#351;geldiniz

<font face="Lucida Sans Unicode" size="+2" color="#297835">Web sayfama ho&#351;geldiniz</font>

<u>Web sayfama ho&#351;geldiniz</u>

<u>Web sayfama ho&#351;geldiniz</u>
<center><font face="Verdana" size="+2" color="#765678">Web sayfama ho&#351;geldiniz</font></center>

</body>
</html>

Web Grafiklerinin Haz&#305;rlanmas&#305;

Zor olan i&#351;lem, sayfalar&#305;n içine içeri&#287;in yerle&#351;tirilmesi de&#287;il, bu içeri&#287;in haz&#305;rlanmas&#305;d&#305;r.
Tahmin edebilece&#287;iniz gibi, sayfalarda yer alan grafikler metinlerden daha da zor haz&#305;rlan&#305;rlar.
Çünkü sayfada yer alacak renkler ve grafik tasar&#305;mlar&#305; sitenin genel çizgisini belirleyece&#287;i için, özenle ve uyumlu bir &#351;ekilde haz&#305;rlanmal&#305;d&#305;r.

Bu tip programlar ile haz&#305;rlanacak site grafiklerinde görselli&#287;in yan&#305;nda dikkat edilecek bir ba&#351;ka unsur da grafik dosyalar&#305;n&#305;n boyutlar&#305;n&#305;n küçük olmas&#305;d&#305;r.
Çünkü ne kadar fazla grafik kullan&#305;l&#305;rsa, site o kadar yava&#351; aç&#305;lacakt&#305;r ve bir site ne kadar görsel olursa olsun, e&#287;er yava&#351; aç&#305;l&#305;yorsa pek de cazip olmayacakt&#305;r.

Bu tür çe&#351;itli grafikleri tasarlamak için kullanabilece&#287;iniz yegane program Photoshop&#39;dur.
Ancak ücretli ve profesyonel bir program olan Photoshop&#39;un yerine buna çok yak&#305;n olan tamamen bedava olarak da&#287;&#305;t&#305;lan Paint Shop Pro adl&#305; Shareware program&#305; da kullanabilirsiniz.

Bu ve buna benzer programlar ile rahatl&#305;kla arka fonlar, Web tu&#351;lar&#305;, ba&#351;l&#305;klar ve Banner&#39;lar gibi sabit Web grafiklerini olu&#351;turabilirsiniz.

Sayfalar&#305;n Web Alan&#305;na Gönderilmesi

Grafikleri tasarlad&#305;n&#305;z ve metinleri haz&#305;rlad&#305;n&#305;z. Bunlar&#305; bir Web tasar&#305;m program&#305; ile Web sayfas&#305; haline getirdikten sonra haz&#305;rlam&#305;&#351; oldu&#287;unuz Web sayfalar&#305;n&#305; kullan&#305;c&#305;lara ula&#351;t&#305;rabilmeniz için bunlar&#305; yerle&#351;tirece&#287;iniz Internet üzerinde bir disk alan&#305;na yani Web alan&#305;na ihtiyac&#305;n&#305;z olacakt&#305;r.

Bu i&#351;lem için en iyi çözüm yine Internet üzerinde size bedava sabitdisk alan&#305; (host) sa&#287;layan bir sunucu bulup sayfalar&#305;n&#305;z&#305; oraya yerle&#351;tirmektir.E&#287;er alaca&#287;&#305;m&#305;z alan&#305;n FTP deste&#287;i varsa, yapt&#305;&#287;&#305;m&#305;z sayfalar&#305; CuteFTP gibi FTP programlar&#305; ile sunucu üzerindeki alana gönderebilirsiniz.

Site Alan Miktar&#305; Reklam FTP Desta&#287;i
50 MB Var Var
10 MB Var Yok
Freeservers.com 10 MB Yok Yok
Brinkster.com 20 MB Var Var


Sitenizin Bar&#305;naca&#287;&#305; Sunucuyu Seçerken Dikkat Etmeniz Gereken Ayr&#305;nt&#305;lar

Internet üzerinde yasal olmad&#305;&#287;&#305; kan&#305;tlanm&#305;&#351; MP3&#39;ler, emülatör dosyalar&#305;, cr*ack, Hack, Warez, çal&#305;nm&#305;&#351; &#351;ifreler ve benzeri içerikle Adult ö&#287;elere sitenizde yer vermekten kaç&#305;n&#305;n.

Seçti&#287;iniz sunucunun teknik özelliklerini mutlaka dikkate al&#305;n. Örne&#287;in Frame yani çerçeveye izin vermeyen baz&#305; sunucular, iki ya da daha fazla parçadan olu&#351;mu&#351; site tasar&#305;m&#305;n&#305;z&#305; tam anlam&#305;yla sunamayacaklard&#305;r.

Bunun yan&#305;nda her sunucu çok serbest bir &#351;ekilde CGI, Perl gibi dillerin kullan&#305;lmas&#305;na izin vermeyebilir.

Unutulmamas&#305; gereken fazla disk alan&#305; her zaman en iyi &#351;ey de&#287;ildir. S&#305;n&#305;rs&#305;z bir alanda hiçbir özellik desteklenmeyece&#287;i gibi, 3MB&#39;l&#305;k bir alan sa&#287;layan sunucu, buna kar&#351;&#305;l&#305;k Frame&#39;den CGI dilllerine kadar her &#351;eyi destekleyebilir.

Web Tasar&#305;m&#305;n&#305; Destekleyici Programlar

PHP
ASP
JAVA SCRIPT
JAVA APPLET
CSS
FLASH

PHP (Personal Home Page)

Html &#39;nin geli&#351;tirilmesinin çok eski zamanlara dayanmas&#305;ndan m&#305;d&#305;r? yoksa o zaman ki &#351;artlarla dü&#351;ünülmedi&#287;i için midir? bilinmez ama html baz&#305; yönden eksik bir dildir. &#304;&#351;te bu eksikliklerin anla&#351;&#305;ld&#305;&#287;&#305; dönemlerde, herkesin anlayabilece&#287;i ve k&#305;sa sürede ö&#287;renilebilece&#287;i bir dil yaratma çabas&#305;nda olan Rasmus Lerdorf taraf&#305;ndan dü&#351;ünülmü&#351; ve Perl dilinden esinlenilerek yap&#305;lmaya ba&#351;lanm&#305;&#351; bir dildir Php.
Php &#39;nin yapt&#305;&#287;&#305;n&#305; k&#305;saca anlatmak gerekirse; Web sayfas&#305; isteminde bulunan kullan&#305;c&#305;lara, istenilen dosya içerisinde Php ile ilgili sat&#305;rlar&#305; i&#351;leyerek dosya içeri&#287;ini kullan&#305;c&#305;n&#305;n Browser &#39; &#305;n&#305;n anl&#305;yabilece&#287;i html format&#305;nda sunan bir programlama dilidir diyebiliriz. Bu genel anlamda Server-Side ( Server-Tarafl&#305; ) Dil olarak an&#305;l&#305;r.

Php &#39;yi rakiplerinden ay&#305;ran özellikler?

En yak&#305;n rakibi ASP ile performans ve fiyat aç&#305;s&#305;ndan aç&#305;k farkl&#305;lar vard&#305;r.
Fiyat konusu haricinde ( Php ücretsiz da&#287;&#305;t&#305;lmaktad&#305;r. ) ASP kullan&#305;c&#305;lar&#305;n&#305;n kabul etmedikleri &#351;ey h&#305;z faktörüdür. Belkide en çok tart&#305;&#351;&#305;lan bu konu hakk&#305;nda en basit kar&#351;&#305;la&#351;t&#305;rma; PHP + MySql ve ASP + MSSQL oranlar&#305;nda ç&#305;kmaktad&#305;r. Elde edilen verilere göre 5000 sat&#305;rl&#305;k bir bilgiyi database&#8217; e; ayn&#305; makina üzerinde Php ve MySql 3 ( Üç ) saniyede girerken, ASP + MSSQL 28 saniyede girmektedir.

Php &#39;nin aç&#305;k kaynak kodlu olu&#351;u, hatalar&#305;n veya yeni özelliklerin güncellenmesi/eklenmesi gibi olaylarda büyük avantajlar sa&#287;lamaktad&#305;r.
Ki&#351;isel kullan&#305;c&#305;lar; Php ile web sayfalar&#305;nda daha çok kullan&#305;c&#305; etkile&#351;imli kodlar kullanmaktad&#305;r. Örnek olarak; Ziyaretçiler için olu&#351;turulan, forum, sayaç, anket gibi kodlarda Php çok ra&#287;bet görmektedir.

Peki bu dilin dezavantajlar&#305; nelerdir?

Günümüzde büyük &#351;irketlerde internet ve intranet uygulamalarda , büyük paya sahip Microsoft firmas&#305;, kendi ürünü olan ASP için büyük çabalar sarfetmektedir. Yeni teknolojiler ( Özellikle .Net ) ile ASP ye hergün yeni zeminler haz&#305;rlamakta ve i&#351; istihdam&#305; konusunda ASP yi bir ad&#305;m öne ta&#351;&#305;maktad&#305;r. Sunucu fiyatlar&#305; olarak Php &#39;ye göre yerine göre üç kat daha fazla oranda olmas&#305;na ra&#287;men, büyük &#351;irketler taraf&#305;ndan tercih edilmektedir.


ASP (Active Server Pages)

Sunucu tarafl&#305; bir teknoloji olan ASP, (Active Server Pages/Aktif Sunucu Sayfalar&#305;) kullan&#305;c&#305; taraf&#305;na etkile&#351;imli, dinamik Web sayfalar&#305; göndermek için kullan&#305;l&#305;r. ASP, Web programc&#305;lar&#305;na HTML, scripting ve kullan&#305;c&#305;dan ba&#287;&#305;ms&#305;z veritaban&#305; uygulamalar&#305;n&#305; özgürce kullanma f&#305;rsat&#305; verir. ASP programlama ortam&#305;n&#305;n özgür olmas&#305;n&#305;n sebebi tüm derleme i&#351;leminin sunucu taraf&#305;nda bitmesi ve kullan&#305;c&#305;n&#305;n sadece sonuçta olu&#351;an HTML sayfalar&#305;n&#305; görmesidir.

ASP&#8217;nin Kullan&#305;m Amaçlar&#305; ve Avantajlar&#305;

Çok geni&#351; bir kullan&#305;m alan&#305; olan ASP, scripting diye tabir edilen VBScript, JavaScript gibi her türlü ham kodu kullanabilir, sundu&#287;u kolay anla&#351;&#305;l&#305;r do&#287;al dili ile orta derece HTML bilen kimseler taraf&#305;ndan bile kolayca kavranabilir.
ASP&#39;nin Netscape Navigator / Internet Explorer /Opera gibi Web taray&#305;c&#305;lar&#305;ndan ba&#287;&#305;ms&#305;z olmas&#305;n&#305;n yan&#305;s&#305;ra en büyük avantajlar&#305;ndan biri kulland&#305;&#287;&#305;n&#305;z teknolojilerin, scriptlerin sakl&#305; kalmas&#305;d&#305;r.
ASP ile haz&#305;rlanan projeler kaynaklar&#305;n yönetimi, kontrolü ve uzaktan sistem yönetimine imkan verir. &#350;irketler aras&#305; bilgi payla&#351;&#305;m&#305; için ideal bir ortam olu&#351;turur.

JAVA SCRIPT

Java Script Netscape taraf&#305;ndan geli&#351;tirilmi&#351; bir script dilidir. Düz yaz&#305; formundad&#305;r. Browserlara ba&#287;l&#305;d&#305;r ve yorumlan&#305;r. HTML&#39;nin içine gömülür. Etiketi &#60;script>...</script> &#351;eklindedir.Java Script; etkile&#351;imli web sayfas&#305; yap&#305;m&#305;nda HTML&#39;nin yetersiz kalmas&#305; nedeniyle C/C++ dilleri baz al&#305;narak geli&#351;tirilen, "düz yaz&#305;" formunda bir script (komutlar dizisi) dilidir. Java Script kodlar&#305; herhangi bir metin editörü (Win 95/98 Not defteri vb.) ile düz yaz&#305; formunda yaz&#305;labilir. Bu &#351;ekilde yaz&#305;lm&#305;&#351; Java Script kodlar&#305; istemci taraf&#305;nda, yani ziyaretçinin web taray&#305;c&#305;s&#305; taraf&#305;ndan yorumlan&#305;r ve yapt&#305;r&#305;lmak istenen i&#351;lemler gerçekle&#351;ir. Ama bu i&#351;lemlerin gerçekle&#351;mesi için mutlaka bir olay gereklidir. (Örne&#287;in, sayfan&#305;n aç&#305;lmas&#305;-kapanmas&#305;, ziyaretçinin sayfada herhangi bir yeri t&#305;klamas&#305; veya klavyede herhangi bir tu&#351;a basmas&#305; gibi...)

Java Script kodlar&#305;n&#305; web sayfas&#305; içerisinde 2 &#351;ekilde tan&#305;mlayabiliriz;
1. HTML kodlar&#305; içerisinde &#60;script>....</SCRIPT> etiketleri aras&#305;nda yazarak,
&#60;script> &#60;&#33;-- JavaScript kodlar&#305; --&#62; </script>

2. Düz yaz&#305; formunda ve .js uzant&#305;s&#305; ile farkl&#305; bir dosya olu&#351;turup, bu dosyaya HTML içerisinde link vererek.
&#60;script LANGUAGE="javaScript" src="inc/navbar.js"> </SCRIPT>


JAVA APPLET

Java (yani Java Applet), Sun Microsystems taraf&#305;ndan geli&#351;tirilmi&#351; nesneye yönelik programlama dilidir ve i&#351;letim sistemlerinden ba&#287;&#305;ms&#305;z olarak çal&#305;&#351;&#305;r. HTML&#39;nin bir parças&#305; olamaz. Etiketi <applet>...</applet> &#351;eklindedir. Java Applet haz&#305;rlayabilmeniz için Sun firmas&#305;n&#305;n ücretsiz olarak da&#287;&#305;tt&#305;&#287;&#305; JDK (Java Development Kit &#8211; Java Geli&#351;tirme Ortam&#305;) program&#305;n&#305; download etmeniz gerekmektedir.

<APPLET code=hotbutton.class height=20 width=122>
<PARAM NAME="cl&#305;p" VALUE="">
<PARAM NAME="act&#305;veshadow" VALUE="fff9e3">
<PARAM NAME="shadowcolor" VALUE="ffedaf">
<PARAM NAME="al&#305;gn" VALUE="icon">
</APPLET>


CSS

CSS (Cascading Style Sheets), Bir HTML döküman&#305;ndaki HTML tak&#305;lar&#305;n&#305;n sitillerini belirleyen tekniktir.
CSS kodlar&#305;n&#305; web sayfas&#305; içerisinde 3 &#351;ekilde tan&#305;mlayabiliriz;
HTML tak&#305;lar&#305;n&#305;n sitillerini, tak&#305;lar&#305;n içinde(Local)
<h1 style= font-family:Verdana,Arial> CSS ö&#287;reniyorum </h1>
Sayfan&#305;n ba&#351;&#305;nda "" tak&#305;lar&#305; aras&#305;nda (Global)
<style> h1.buyukyazilar {font-family:verdana; color:yellow} h1.digerleri {font-family:arial; color:black} h2 {font-family:verdana; color:pink} </style>
Link olarak ba&#351;ka bir dosyadan alarak
<link rel="stylesheet" type="text/css" href="sitillerim.css">

CSS Ö&#287;renmenin avantajlar&#305;:

CSS, HTML tak&#305;lar&#305;na, HTML ile yap&#305;lamayacak fakat i&#351;inizi kolayla&#351;t&#305;racak bir çok özellik katabilir. Örne&#287;in; hemen hemen tüm web sayfalar&#305;nda gördü&#287;ünüz de&#287;i&#351;ik link sitilleri, CSS kullan&#305;larak yap&#305;lm&#305;&#351;t&#305;r. CSS ile sayfalar&#305;n&#305;z&#305; daha h&#305;zl&#305; hale getirebilir ve dosyan&#305;n yükünü hafifletebilirsiniz. Sayfalar&#305;n&#305;z için haz&#305;rlayaca&#287;&#305;n&#305;z bir CSS dosyas&#305;n&#305; kullanarak tüm sayfalar&#305;n&#305;za ayn&#305; özellikleri verebilir, dolay&#305;s&#305;yla h&#305;z ve tutarl&#305;l&#305;k sa&#287;lam&#305;&#351; olursunuz. Tabiki CSS&#39;in yapabilecekleri bunlarla s&#305;n&#305;rl&#305; de&#287;ildir. CSS ö&#287;renilmesindeki kolayl&#305;&#287;&#305;n aksine kapasitesi büyük bir dildir.


Flash

Flash, Macromedia taraf&#305;ndan geli&#351;tirilmi&#351; Internet&#39;te etkile&#351;imli vektörel grafik ve animasyon haz&#305;rlanmas&#305;nda kullan&#305;lan bir standartt&#305;r. Web tasar&#305;mc&#305;lar&#305; Flash&#39;&#305; çekici, ölçümlendirilebilir, çok az yer kaplayan gezinilebilir yüzeyler, teknik canland&#305;rmalar, uzun süreli animasyonlar ve di&#287;er &#351;a&#351;&#305;rt&#305;c&#305; efektleri yapmak amac&#305;yla kullan&#305;rlar.

Kullan&#305;m Alanlar&#305;:

Flash ile en küçük reklam pankart&#305;ndan (banner), en karma&#351;&#305;k animasyonun yap&#305;lmas&#305;, hatta bütün bir web sitesinin olu&#351;turulmas&#305; mümkündür. Interaktif CD&#39;lerin haz&#305;rlanmas&#305;, oyunlar, veritaban&#305; uygulamalar&#305;, PHP ve XML gibi birçok dil ile kullan&#305;labilme, Flash&#39;&#305;n ileri düzey maharetleri aras&#305;nda say&#305;labilir.
Flash ile ses ile bite&#351;lemler (bitmap) birle&#351;tirilebilir. Yani bir dosyan&#305;n içine müzik yada ses efekti rahatl&#305;kla gömebiliriz. Bu bize etkile&#351;im daha üst seviyelere çekebilme &#351;ans&#305;n&#305; verir.

Flash içerisinde bulunan bütün görüntü, ses, text elemanlar&#305; flash&#39;a özgü baz&#305; s&#305;k&#305;&#351;t&#305;rma teknikleri sayesinde çok küçük boyutlara s&#305;k&#305;&#351;t&#305;r&#305;labilir. Bu s&#305;k&#305;&#351;t&#305;rma oranlar&#305; program içerisinden kalitelerini de&#287;i&#351;tirmek suretiyle ayarlanabilir. Böylece örne&#287;in 1 birim tutan bir ses/görüntü dosyas&#305; 0.1 ile 0.9 aras&#305;nda boyutlarda son kullan&#305;c&#305;ya ula&#351;t&#305;r&#305;labilir.
Macromedia Flash program&#305;, macromedia&#39;n&#305;n adresinden deneme amaçl&#305; olarak indirilebilir. Bunun d&#305;&#351;&#305;nda tam kullan&#305;m için belirli bir ücret kar&#351;&#305;l&#305;&#287;&#305;nda macromedia&#39;dan yada temsilciliklerinden temin edilebilir.

Püf Noktalar

Tasar&#305;m&#305;n en önemli unsurlar&#305;ndan biri tablolard&#305;r. Tablolar&#305; amac&#305;n&#305;za uygun &#351;ekilde sayfaya yerle&#351;tirdi&#287;inizde sayfan&#305;z, görsel aç&#305;dan daha üstün bir tasar&#305;ma sahip olacakt&#305;r. Çünkü hizalama, uygun yere uygun resmi yerle&#351;tirme gibi &#351;eyler kod yazarak çok uzun sürebilir. Ama tablolar ile bu problemi a&#351;abilirsiniz.

Dikkat edilmesi gereken en önemli &#351;eylerden biri de resim kullan&#305;m&#305;. Sayfalar&#305;n&#305;zda mümkün oldu&#287;unca az resim kullan&#305;n. &#350;ayet resim kullan&#305;rsan&#305;z, boyutlar&#305; minimum, kaliteyi optimum düzeyde tutmaya özen gösterin. Çünkü Türkiye de internetin h&#305;z&#305; malum. Teorik h&#305;z&#305; 44.000 kb &#39;&#305; geçmeyen ziyaretçi, sayfan&#305;z&#305;n aç&#305;lmas&#305;n&#305; dakikalarca bekleyemeyebiliyor. Sayfalar&#305;n da daha çabuk aç&#305;lmas&#305; için akla gelen ilk &#351;ey de resimler oluyor. E&#287;er ki resimden ba&#351;ka Java Applet vs. varsa önceli&#287;i bunlara verin.

&#304;nternet üzerinde en çok kullan&#305;lan browser&#39;lar IE ve Netscape Navigator ve Firefox dur. Büyük ço&#287;unlukla da IE kullan&#305;l&#305;r. Sitenizin yap&#305;m a&#351;amas&#305;nda farkl&#305; browserlarda sitenizin nas&#305;l göründü&#287;ünü test etmeniz gerekebilmektedir. Çünkü baz&#305; tag&#39;ler farkl&#305; browserlarda ayn&#305; etkiyi yaratamayabilmektedir. Bunun da çabuk fark edilmesi, sizi emek, zaman ve kaynak kayb&#305;ndan kurtarabilir.

Sayfalar&#305;n&#305;z&#305;, farkl&#305; ekran çözünürlüklerinde test edin. Optimum çözünürlükte karar k&#305;ld&#305;&#287;&#305;n&#305;zda sayfalar&#305; bu ekran çözünürlü&#287;ünde tasarlay&#305;n. Bunu yapman&#305;zdaki sebep &#351;udur: Her kullan&#305;c&#305; sizinle ayn&#305; ekran çözünürlü&#287;ünü kullanmayabilir. Sizin 800*600 çözünürlükte yapt&#305;&#287;&#305;n&#305;z site, browser&#39;&#305;n&#305;zda gayet güzel görünebilirken, 640*480 kullanan ziyaretçinin bilgisayar&#305;nda da&#287;&#305;n&#305;k ve biçimsiz görünebilir.


Al&#305;nt&#305;d&#305;r,Te&#351;ekkür Ediyoruz...
Ara&#351;. Görv.
Özgür Ç&#304;N&#304;


--------------------------------------------------------------------------------

ve ayr&#305;ca a&#351;ag&#305;dak&#305; adreslerdende bu konuda faydalanab&#305;l&#305;rs&#305;n&#305;z...













Al&#305;nt&#305;d&#305;r...
 


pskolojik maynağ

pskolojik maynağ

Üye
sağolda insanın okuyası gelmiyor valla boş bir vakdimde yapmayı denicem ilgilendiğin için sağollllllllllllllll
 
HuMuRGaN

HuMuRGaN

Üye
sagol arkadaşım emegine saglık iyi bi kaynak olmuş
 
B@TuH@N

B@TuH@N

Üye
kaynaklar için saolasın dostum
 

S1FR3K1R1C1

Üye
Emeğine Sağlık..
 

UndeRqRo.uNd

Üye
yeni başlayanlar için qüzel kaynak.
 

alisadi

Üye
cok sagol guzel kaynaklar hepsı işime cok yaradı.emegıne saglık
 

ramazan0306

Üye
saol kardes afyonlumusuun yoksa sadece ornek mıydıı :D
 
galaxy7

galaxy7

Üye
:yuruSÜPER PAYLAŞIM KARDEŞ
:oke:BİRÇOK YOLU VAR SİTE KURMANIN
:bye2:SEN DE BAYAĞI BİR YOL VERMİŞSİN :)
 

omerxc

Üye
Arkadaşlar Bu Sitede Web Sitesi Oluşturmak İçin Çok Güzel Eğitim Seti Hazırlamışlar.
Birkaç Saat İçinde Web Kendi Sitenizi Kurabilirsiniz Yazıyo. İlgilenen Arkadaşların Bakmalarını Tavsiye Ederim
 

ahmetkahraman12

Üye
arkadaşlar,
ben web sitemde diyelim bir exa dosyası acmak istorum yanı dielim bir oyun programını siteye yükleyecegim ve her giren oynaya bilecek bunu sitemde hostumda yapabilirmiyim budurum legal mı illegalmı
 

ahmetkahraman12

Üye
cevap yok mu ya
 
wardaa

wardaa

Üye
iyi olmuş . bende bi site kurabilsem
 
hasbaly

hasbaly

Üye
En önemlisi doğru proje doğru içerik gerisi fos çıkar. Ne kadar güzel tasarımda yapsan nice siteleri görüyorum dandik. Ama adam güzel proje yapmış ve iyide içerik sunmuş.
 
Nef'i

Nef'i

Üye
Teşekkürler bilmediğim yerleri okdum sadece
 

Benzer Konular

Halil Caglar
Cevap
0
Görüntüleme
1K
Halil Caglar
Εthnic
Cevap
0
Görüntüleme
1K
Εthnic
Εthnic
Cevap
2
Görüntüleme
1K
Εthnic
Εthnic
Cevap
2
Görüntüleme
1K
Εthnic


Üst Alt