web sitesi yapımı - ders 1

Web Sitesi Nedir?

Web Sitesi Tasarımı
Web Sitesi Tasarımı

Html Ders 1 : Bu Yazımızda sizlere Web sitesinden bahsedeceğim. Web sitesi yapımı, bunun yanında hangi editörlerle yazılır ve hangi browser‘lar ile nasıl çalışmalıyım? sorularını cevaplıyor olacağım.

Web sitesinin içinde olması gereken materyallere bakıldığı zaman başlangıç için yapılan sitelerde olan hemen hemen her şey aynıdır. Örneğin Html sayfalarının içinde kullanılan etiketler, a etiket(link ekleme), img etiketi(fotoğraf ekleme), div etiketi(alan oluşturma) bunun gibi etiketler’dir.

Sizlere Web sitesi yapımından bahsedelim arkadaşlar Web sitesi sunucu taraflı client (istemci) isteği olarak çalışan bir dil gibi çalışmaktadır. Web sitesi yaparken başlangıç aşaması için çok fazla bilgi bilmenize gerek yok. İnternet bu konuda çok zengin olup her türden bilgiye ulaşabileceğiniz bir ortamdır. Web sitesi yapımından sizlere örneklerle bahsetmeden önce nerede çalışır ve nerede yapılır bunun cevabını verelim.

Web Sitesi Nerede Yapılır?

Web sitesi yapmak için çok fazla karmaşık yapıya sahip olan programlar başlangıç aşamasında sizlere önermeyeceğim. Aşağıda başlangıç için iyi sayılabilecek programları en basitten en karmaşık olanına göre sıralıyorum.

  • Not Defteri : Eğer Html’e yeni başlıyorsanız Web sitesi yapımı için kodları teker teker yazmanız ve aklınızda kalması açısından gerçekten çok ama çok iyi bir seçenektir. Yeni başlayaksanız şiddetle öneririm.
  • Notepad++ : Tamamen ücretsiz olup internet üzerinden direk indirebilirsiniz. Başlangıç aşamasında kesinlikle önermekteyim. HTML yardım özellikleri ve FTP bağlanma modülleri vardır.
  • DreamWeaver : Adobe firmasının bir ürünüdür. Ücretli bir üründür. (Cs3, Cs4Cs5Cs6 ve Cs7) vb versiyonları mevcuttur. Başlangıç aşamasında pek önermiyorum. Kod yazımını kolaylaştırmakla birlikte hazır bileşenleri bünyesinde bulundurmaktadır.

Yukarıdaki programları kullanarak Html Kodları yazmaya başlayabilirsiniz.

 

Web Sitesini Nerede Test Edebilirim?

Web sitemizi yaptık ve artık sıra test aşamasına geldi Web sitemizi bir browser yani tarayıcı üzerinden kontrollerini sağlayabilirsiniz. Hazırladığımız .html uzantılı dosyasına çift tıklayarak seçmiş olduğunuz browser‘la açıp test edebilirsiniz. Aşağıda sizlere en kullanışlı olanından en kullanışlı olmayanına doğru sıralama yapacağım.

 

Web Sitesi Yapımı – Örnek Kodları

Web sitesi yapımı nasıl olmaktadır sorusunun en açıklayıcı ve kısa şekliyle, sizi sıkmayacak bir şekilde anlatmaya çalışacağım.

Not : Her açılan etiketin mutlaka kapanış etiketi olmalıdır.

<html> <p> Deneme Paragraf. </p> </html>

Web Sitesi 3 Bölüme Ayrılır;

  • HEAD : Baş kısmı
  • BODY : Gövde bölümü
  • FOOTER : Alt bölüm
<html>
	<head>
		<title>Web Sitemizin Adı</title>
	</head>
	<body>
		<p>Web sitemizin içerisindeki paragraf.<p>
	</body>
</html>

Html : Tüm Web sitenizin bilgilerinizi içerisinde barındırmanız gereken en önemli etikettir.

Head : Web sitenizin daha çok tanıtım rolünü üstlenen içerisinde sitenin başlığı, anahtar kelimeleri ve açıklamasını vb şeyleri içeren önemli bir etikettir.

Body : Web sitesinde kullanılan etiketlerin gözüktüğü alandır. Kısaca Web sitesinin sahnesi anlamına yani ana bölümüdür gelir. İçerisine Html‘in barındırdığı tüm etiketleri yazarak görsellik oluşturabilirsiniz.

P : Paragraf etiketidir, paragraf oluşturmak için kullanılmaktadır. Body etiketinin içerisinde kullanılır.

Yukarıdaki gibi not defterine yazıp uzantısını .html olarak kaydederseniz tarayıcınızda test edebilirsiniz.

Web Sitesi Yapımı