HTML özünde, bir belgedeki metin parçalarına uygulanabilen öğelerden oluşan oldukça basit bir dildir. Belgenin parçalarına farklı anlamlar vermek için kullanırız (Bu bir paragraf mı? Bir liste mi? Bir tablonun parçası mı? ), ve belgeyi mantıksal bölümler halinde yapılandırırız (Bir başlığı var mı? Üç içerik sütunu var mı? Bir gezinme menüsü var mı?). Bir sayfaya resim ve video gibi bir içerik gömmemizi sağlar. Bu kılavuzda bunlardan ilk ikisini tanıtacak ve HTML’yi anlamak için bilmeniz gereken temel kavramları inceleyeceğiz.
Önkoşullar
Bu modüle başlamadan önce herhangi bir HTML bilgisine ihtiyacınız yok, ancak bilgisayar kullanma ve web’i pasif olarak kullanma (yani, sadece gezinme ve içerik tüketme) konusunda en azından temel düzeyde bilgi sahibi olmanız gerekir. Temel bir çalışma ortamı ayarlamış olmalısınız ( Temel yazılımı yükleme bölümünde ayrıntılı olarak açıklandığı gibi ) ve dosyaların nasıl oluşturulacağını ve yönetileceğini anlamalısınız (Dosyalarla ilgilenme bölümünde ayrıntılı olarak anlatıldığı gibi ). Her ikisi de web tam başlangıç kılavuzumuzda anlatılmıştı.
Not: Kendi dosyalarınızı oluşturmanıza izin vermeyen bir bilgisayar/tablet/başka cihazlar üzerinde çalışıyorsanız, kod örneklerini (çoğu) çevrimiçi bir kodlama programında deneyebilirsiniz. JSBin veya glitch‘e göz atabilirsiniz.
Kılavuzlar
Bu modül, sizi tüm temel HTML teorisine götürecek ve bazı becerileri test etmeniz için bolca fırsat sağlayacak aşağıdaki makaleleri içeriyor.
HTML’e başlarken
Başlamanız için HTML’nin mutlak temellerini kapsar — öğeleri, nitelikleri ve diğer önemli terimleri tanımlar ve bunların dilde nereye uyduklarını gösteririz. Ayrıca tipik bir HTML sayfasının nasıl yapılandırıldığını ve bir HTML öğesinin nasıl yapılandırıldığını gösteriyoruz ve diğer önemli temel dil özelliklerini açıklıyoruz. İlginizi çekmek için biraz HTML ile de oynayacağız!
HTML’deki meta veriler
Sayfada kullandığımız başlık (<title>), CSS bağlantıları (HTML içeriğinizi CSS ile biçimlendirmek istiyorsanız), özel favori simgelerine bağlantılar ve meta veriler (HTML hakkında kimin yazdığı gibi veriler ve belgeyi tanımlayan önemli anahtar kelimeler) HTML belgesinde <head> etiketi içerisinde verilir.
HTML metin biçimlendirme temelleri
HTML’in temel görevlerinden biri de metinlere anlam vermesidir – bu aynı zamanda semantik olarak da bilinir. Böylece tarayıcılar içeriğin nasıl gösterileceğini bilirler. Bu yazıda HTML’in bir metin kümesini nasıl yapılandırdığına bakacağız ve başlıklara, paragraflara, listelere ve daha fazlasına nasıl dönüştürdüğü ile ilgileneceğiz.
Bağlantı – Link oluşturma
Bağlantılar web’i web yapan şeylerdir. Bu makalede, bağlantı eklemek için gereken sözdizimine bakacağız ve bağlantılar için en iyi uygulamaları inceleyeceğiz.
Gelişmiş metin biçimlendirme
HTML metin temelleri makalesinde değinmediğimiz bir çok öğeyi bu makalede inceleyeceğiz. Buradaki elementler daha az bilinir, ancak yine de bilinmesi yararlıdır. Bu makalede, alıntıları, açıklama listelerini, bilgisayar kodlarını ve diğer ilgili metinleri, alt simge ve üst simgeyi, iletişim bilgilerini ve daha fazlasını biçimlendirmeyi göreceğiz.
Belge ve web sitesi yapısı
HTML, sayfanızın tek tek bölümlerini tanımlamanın yanı sıra (“paragraf” veya “resim” gibi), web sitenizin alanlarını tanımlamak için de kullanılır (“üst alan”, “gezinti menüsü” veya “ana içerik sütunu”). Bu makalede, temel bir web sitesi yapısının nasıl planlanacağı ve bu yapıyı temsil etmek için HTML’nin nasıl yazılacağına bakacağız.
HTML’de Hata Ayıklama
HTML yazmak iyidir, ancak bir şeyler ters giderse ve koddaki hatanın nerede olduğunu çözemezseniz ne olur? Bu makalede size yardımcı olabilecek bazı araçlar tanıtılacaktır.
Değerlendirme
Aşağıdaki değerlendirmeler, yukarıdaki kılavuzlarda ele alınan HTML temellerini anlamanızı test edecektir.
Mektubu düzenle
Hepimiz er ya da geç mektup yazmayı öğreniriz. Mektup yazmak metin biçimlendirme becerilerinizi test etmek için de yararlı bir örnektir. Bu değerlendirmede, biçimlendirmeniz için size bir mektup veriyoruz.
İçerik sayfasını yapılandırma
Bu değerlendirme, üst alan, alt alan, gezinti menüsü, ana içerik ve kenar çubuğu içeren basit bir içerik sayfasını yapılandırmak için HTML kullanma yeteneğinizi sınayacak.