Web Development (Web Geliştirme), son zamanların en çok tercih edilen meslekleri arasında yerini alıyor. Peki nedir bu web geliştirme?

Web geliştirme, sitelerin oluşturulması ve bakımının yapılması işine denir. Sitenin iyi görünmesini, hızlı çalışmasını ve iyi performans göstermesini sağlamak için arka planda yapılan çalışmadır. Web geliştiriciler, arka plandaki bu çalışmayı çeşitli yazılım dilleri kullanarak yaparlar. Kullanılan yazılım dili web sitesinin işlevine göre değişmekle beraber, web sitelerinin yapımında yaygın kullanılan temel diller HTML ve CSS ikilisidir. Bu iki işaretleme dili, kullanıcı ve web sitesi arasındaki bağlantıyı sağlayan UI (User Interface) oluşturur.

HTML Nedir?

Açılımı, Hypertext Markup Language (Hiper Metin İşaretleme Dili) olan HTML; web sitesi oluşturmak için kullanılan bir metin işaretleme dilidir. Arama motorlarına bilgi vermek, sayfada kullanılacak verileri yerleştirmek gibi arka plan işlerinde kullanılır. Bir web sayfasında iken klavyenizdeki F12 tuşunu kullandığınızda, ‘Elements’ kısmında bulunduğunuz web sitesini oluşturmak için kullanılmış HTML kodlarını görebilirsiniz.

HTML Nasıl Görünür?

Klavyenizde açık yay parantez ‘<’ ve kapalı yay parantez ‘>’ karakterleri arasına daha önceki yazılımcılar tarafından belirlenmiş karakterleri, kelimeleri yazarak bir HTML kodu yazmaya başlayabilirsiniz. Bu yazdığımız karakterlere HTML etiketi ya da HTML tag’i denir. Bazı HTML etiketlerinin kapatılması gerekir, bunlara closing tag denir. Diğer bir yandan bazı etiketlerin kapatılmasına gerek yoktur, bu tip elementler void element olarak adlandırılır. Bir HTML etiketini kapatabilmek için açık yay parantez ‘<’ işaretinden sonra slash ‘/’ kullanmanız gerekir. Örneğin:

<p>Bu bir HTML etiketidir ve paragraf oluşturmak için kullanılır.</p>

Yazdığımız bu kod aşağıdaki gibi görünür.

CSS Nedir?

Açılımı, Cascading Style Sheets (Basamaklı Stil Sayfası) olan CSS ise; HTML ile bir web sitesine yerleştirilmiş içeriklerin stillendirilme kısmı ile ilgilenir. Örneğin, sitenize HTML ile bir paragraf eklediniz. Bu paragrafın yazı tipini, rengini ve boyutunu CSS sayesinde değiştirebilirsiniz.

CSS Nasıl Görünür?

Bir CSS kodu yazmak için yapmanız gereken ilk şey bir selector (seçici) yazmanızdır. Seçici, HTML sayfasında bulunan herhangi bir elementi seçerek özelliklerini değiştirmenize yardımcı olur. Aşağıdaki kodumuzda açık süslü parantezden ‘{‘ önce yazdığımız ‘p’ bizim paragraf seçicimizdir ve HTML elementlerimizden içinde p etiketi olanları bu sayede seçebiliriz.

Bir seçici yazdıktan sonra içerisine özellikleri ve değerlerini yazabileceğimiz bir alan oluşturmamız gerekir. Bu alanı seçiciden sonra açık ve kapalı süslü parantezleri kullanarak oluştururuz.

Yukarıdaki aşamalardan sonra değiştirmek istediğimiz özelliği süslü parantezlerin içine yazıyoruz, iki nokta ile ‘:’ özellik ve değerini birbirinden ayırıyoruz. İki noktadan sonra hangi değeri vermek istediğimizi belirtiyoruz ve noktalı virgül ‘;’ kullanarak tarayıcıya bu komut ile işimizin bittiğini haber veriyoruz. Örneğin:

p {
color:red;
}

HTML ve CSS kullanarak oluşturduğumuz paragrafımız aşağıdaki gibi görünecektir.

Bugünkü yazımızda genel olarak Web Development ve HTML-CSS ikilisini anlattık. Yazılım ve web development hakkında daha fazla bilgi almak için takipte kalın!

Kaynakça

Görüntülenme Sayısı:
175 views