
HTML ile web tasarımı dersimizin birinci bölümünde editör kullanımı ve temel html sayfa yapısını öğreneceğz.Editör olarak eğitim boyunca ben sublime text editörü kullanacağım.Burada dikkat etmeniz gereken husus mümkün olduğu kadar hazır olmayan yani elle yazmanızı sağlayan editör kullanınız.Kodlamanın temelinde daha seri yazabilmek ve kendinizi geliştirebilmeniz için bu çok önemlidir.Html sayfalar <html> ile açılıp yine </html> tagı ile kapatılırılar.Temel olarak bu bölümde bir sayfa yapısında bulunan html kodlarını öğreneceğiz.
<html> sayfa açılış ve kapanışlarda kullanılır
<!doctype html>döküman tipinin html olduğunu beliritir
<head>Başlık bölgesini belirten tag
<meta charset="utf-8">Karakter setinin latin alfabesine ygun olduğunu belirtir.
<meta lang="tr"> kullanılacak dilin Türkçe olduğunu belirtir.
<style> Genel elementleri ve tagları düzenleme, renklendirme ve biçimlendirme için css yazdığımız kısımdır
<body> Html sayfamızın gövde kısmını belirten tag
Web tasarım 2 dersimizde; h1 den h6 ya kadar font tipini ,font büyüklüğünü gösteren html tagının tanımlarını ve sayfa düzeni hakkında en basit <center> tagını gördük.link yönlendirme ile web sayfamızda herhangi bir butonu yada yazıyı örneğin www. google.com sitesine yönlendirebiliriz.İstediğimiz siteye yada dökümana yönlendirebiliriz.Burada kullandığımız tagların tanımları şöyledir:
<a href="#"> #kısmına istediğimiz web sitesi linkini yazabiliriz.Kullanıcı bunu tıkladığında istemiş lduğumu siteye yönlendirecektir.a href tagı çok sık kullanılan bir html etiketidir.
<h1>En büyük fonta sahip html etiketidir.
<h6> En küçük fontu gösteren html etiketidir.Genellikle h1 den h6 ya kadar sitemizde ihtiyaç olan hangisi ise onu kullanırız.
background-color : çoğunlukla css kısmında yani <style> etiketleri arasında kullanılan bir arka plan deiştirme kodudur.
color: direk seçili elementin yada etiketin kodunu (fontun vb) değiştirir.
Bu bölümde tablo yapımını öğreniyoruz.Tablo yapımı , footer ve altalta menü oluşturma içeriklerini videodan izeyebilirsiniz .Bu tagların anlamaları aşağıdaki gibidir:
<table>Tablo oluşturma tagıdır
<td> Tablo altında kullanılr ,satır oluşturmak için kullanılan tagdır
<ul> liste oluşturma veya menü yapımında kullanılan tag dır
<li>list anlamına gelir ol yada ul tagının alt kısmında kullanılan taglardır.Çok sık menü yapımında kullanılan html elementleridir.
<footer> web sayfamızın en alt kısmında kullanılan genellikle (her hakkı saklıdır ) gibi gördüğümüz yazıların oluşturulduğu tag dır .Ancak footer herhangi bir ölçülendirme yapılmazsa en altta olur eğer isterseniz css kısmında footerın ölçü birimini değiştirebilir, web sayfamızdaki pozisyonunu değiştirebilirsiniz.
Bu bölümde web sayfamızda çizgi oluşturma ,alt satıra geçiş,css kısmında style ile değişiklikler yapma konularını göreceğiz.Ayrıca <br> alt satıra geçiş <hr> çizgili alt satıra geçiş taglarını tanıyacağız.Bu aşamalar harici butonlu veya butonsuz <checkbox> yapımı ve işareteleme kutusu yapımını göreceğiz.
Bu kurs ile HTML temel eğitimini almış olacaksınız.Kodlamanın temelini syntax yapısını öğrenmiş olacaksınız.HTML temel taglarının açıklamalarını öğrenmiş olacak ve kurs bitiminde statik web sitenizi yapabilecek duruma geleceksiniz.Tüm web siteleri temel olarak HTML etiketleri arasında kodlanır.Web sitenizi html temel eğitimini aldıktan sonra CSS ve Javascript ile daha dinamik bir hale getirebileceksiniz.Kurs içersinde kodların türkçe açıklamalarının olduğu dökümanada erişebileceksiniz.Web tasarımın en temel eğitimi olan HTML işretleme dili eğitimini tamamlayarak Web Geliştirici olma yolunda ilk adımınızı atmış olacaksınız.Bu kursu tamamladıktan sonra devamında CSS ve Bootstrap kurslarımdan faydalanabilir.Kapsamlı bir web developer haline gelebilirsiniz.Çok zor değil kodlama yapmak emin olun rahatlıkla başaracaksınız.Html tagları nasıl açılır ,nasıl kapatılır.Ana omurga nasıl oluşturulur ve ana omurga arasına geek CSS ,bootstrap,javasacript php yada diğer tüm dillerden kod yazımının yapıalbileceğini uygulamaları ile öğreneceksiniz.Front-end tasarımın en güzel yanı ortaya somut bir şeylerin çıkmasıdır.Yani yazdığınız kod size somut bir çıktı verecektir.HTML yüksek işaretleme dili olarak teknik bir tanıma sahiptir.
Temel gereği yazı, görüntü, video gibi değişik verileri ve bunları içeren sayfaları birbirine basitçe bağlamak, buna ek olarak söz konusu sayfaların web tarayıcısı yazılımları tarafından düzgün olarak görüntülenmesi için gerekli kuralları belirlemektir. HTML kodunu web tarayıcıları okur, yorumlar ve görsel hale dönüştürürler, dolayısıyla aynı HTML kodunun farklı tarayıcılarda farklı sonuç vermesi olasıdır. CSS ve JavaScript ile beraber kullanıldığında HTML vasıtasıyla görsel ve dinamik web siteleri yaratılabilir.
Küçüktür ve büyüktür işaretleri arasına yazılan HTML komutları kullanılarak yazılır (ör: <html>). İşaretlenen metnin başını ve sonunu belirtmek için çoğunlukla çift olarak kullanılırlar (Örnek: <h1>Selam</h1>) ancak işaretlemek yerine metnin bir yerine bir işaret konacaksa tek olarak da kullanılabilirler (Ör: <img>).