HTML, bildiğimiz webin hayati bir parçasıdır. Ve birkaç web tasarımcısı HTML'yi elle yazarak sayfalar oluştururken, bu konuda biraz bilgi sahibi olmak hala kullanışlı.

HTML'nin gerçekte ne olduğu, bazı temel kavramlar ve diğer dillerle nasıl etkileşime girdiği dahil olmak üzere dilin bazı temellerine bakacağız. Bunu bir düşün “Aptallar için HTML” yoğun program.

HTML Temelleri: HTML Nedir?

HTML kısaltması Köprü Metni Biçimlendirme Dili. Ve bazen programlama dilleriyle karıştırılırken, bu doğru değil.

Olarak biçimlendirme dili, HTML yalnızca sayfaların görüntü düzenini oluşturmanıza izin verir. Gerçek Programlama dili, Java veya C ++ gibi, mantık ve yürütülen komutları içerir..

Basit olmasına rağmen, HTML web'deki her sayfanın omurgasındadır. Metnin koyu olarak gösterilmesinden, resim eklemekten ve diğer sayfalara bağlanmasından sorumludur. HTML SSS var Temel HTML SSS Sık Kullanılanlara Eklenmelisiniz HTML Sıkça Sorulan Sorular SSS HTML bir süredir kullanılmaya başlanmıştır, bu yüzden temel bilgileri öğrenmenin zamanı gelmiştir. İşte bu, nasıl çalıştığı ve bugün HTML’de bazı ortak unsurları nasıl yazabileceğinizdir! bu daha fazla açıklıyor.

Tarayıcınızdaki çoğu web sayfasına sağ tıklayabilir ve Sayfa kaynağını görüntüle veya arkalarındaki HTML'yi görmek için benzer. Bu büyük olasılıkla, HTML olmayan bir çok kod içerecektir, ancak bunu gözden geçirebilirsiniz.

Biçimlendirme veya programlama dilleri konusunda sıfır deneyiminiz olsa bile, HTML hakkında biraz bilgi edinmek sizi daha bilgili bir web kullanıcısı yapacaktır. HTML'nin nasıl çalıştığını anlamanıza yardımcı olmak için beş temel adımdan geçelim. Yol boyunca örnekler sunacağız.

1. Adım: Etiketler Kavramını Anlamak

HTML bir sistem kullanır etiketler Belgenin farklı unsurlarını sınıflandırmak.

Çoğu etiket, etkilenen metni içlerine sarmak için çiftler halinde gelir. İşte basit bir örnek ( etiket metni yapar cesur; Bunu birazdan daha fazla tartışacağız.)

Bu biraz kalın metin.

Kapanış etiketinin eğik çizgiyle (/) nasıl başladığına dikkat edin. Bu önemli olan bir kapanış etiketini ifade eder. Bir etiketi kapatmazsanız, en baştan itibaren her şey bu özelliğe sahip olacaktır..

Ancak, tüm etiketlerin bir çifti yoktur. Denilen bazı HTML elemanları boş elemanlar, İçeriği yok ve kendi başlarına var. Bir örnek
Satır sonu etiketi. Yapabilirsin “kapat” eğik çizgi ekleyerek bu tür etiketler (örneğin
) ama kesinlikle gerekli değil.

Adım 2: Skeleton HTML Düzeni

Uygun bir HTML belgesinde belirli etiketlerin tanımlanmış olması gerekir, böylece doğru şekilde düzenlenir. Bunlar önemli parçalardır:

• Her HTML dokümanı ile başlamalıdır kendisini böyle ilan etmek. Böylece, kapanış etiketi, , HTML dosyasındaki son öğe.
• Sonra, bölüm, sayfa başlığı, sayfada çalışan çeşitli komut dosyaları ve benzerleri gibi bilgileri içerir. Adından da anlaşılacağı gibi, bu genellikle başlangıçtan hemen sonra gelir. etiket. Son kullanıcı bu etiketlerdeki içeriğin çoğunu görmüyor.
• Sonunda, etiketi, okuyucunun gördüğü metni tutar (artı çok daha fazlası). Burada görüntüleri, bağlantıları ve daha fazlasını bulacaksınız.

Beri bölüm bir HTML belgesinin büyük kısmını oluşturur, geri kalan kısmımızın geri kalanı, kendisine ait unsurlara bakar.

Adım 3: Biçimlendirme için Temel HTML Etiketleri

Daha sonra, HTML belgelerini oluşturan bazı ortak etiketlere bakalım. Elbette, her bir unsuru ele almak mümkün değildir, bu yüzden en önemlilerinden bazılarını gözden geçireceğiz. Daha birçok HTML örneğini ele aldık 17 10 Dakikada Öğrenebileceğiniz Basit HTML Kodu Örnekleri 17 10 Dakikada Öğrenebileceğiniz Basit HTML Kodu Örnekleri Basit bir web sayfası oluşturmak ister misiniz? Bu HTML örneklerini öğrenin ve tarayıcınızda nasıl göründüklerini görmek için bir metin düzenleyicide deneyin. eğer bunlar sizi tatmin etmiyorsa.

Bu etiketler oldukça basit görünüyorsa, HTML’nin 1993’te tamamen eski haline getirildiğini unutmayın. Web çok eskiden başlayarak metin temelli idi..

Basit Metin Biçimlendirme

HTML, Microsoft Word'de bulabileceğiniz temel metin stillerini destekler:

• etiketler metin yapar cesur.
• etiketler (bunun anlamı “vurgu”) irade italik harflerle yazmak Metin.

HTML ayrıca eskileri de destekler kalın için etiket ve italik için. Bununla birlikte, yukarıdakileri kullanmak tercih edilir..

Kısacası, ve bir şeyin nasıl anlaşılması gerektiğini gösterirken, sonraki etiketler yalnızca nasıl görünmesi gerektiğini size söyler. Bu eski etiketlere görme engelli kişiler tarafından kullanılan ekran okuyucular için daha erişilebilir.

Paragraf ve Diğer Bölümler

HTML en etiketi, belgenin bir bölümünü tanımlamanıza izin verir. Genellikle bu, bir bölümü belirli bir biçimde biçimlendirmek için CSS (aşağıya bakınız) ile eşleştirilir.

Belgenize başlıklar ekleyebilir ve

vasitasiyla

etiketleri. H1 en önemli başlıktır, H6 ise en az önemlidir. Neredeyse her MakeUseOf makalesinde bilgi düzenlemek için H2 ve H3 başlıkları kullanılır..

İsabet Girmek HTML belgenize satır sonu eklemek için aslında bunları görüntülemeyeceksiniz. Bunun yerine kullanabilirsiniz
satır sonu eklemek için.

İşte bunların hepsini kullanan bir örnek:

 
Örnek Başlık
 
Bu bir paragraftır.
 
Bu bir ikinci
iki satır arasında bölünmüş paragraf.
  

Adım 4: Görüntüleri Ekleme

Resimler çoğu web sayfasının hayati bir parçasıdır. Onları HTML ile kolayca ekleyebilir ve hatta onlar için farklı özellikler belirleyebilirsiniz..

Kullanarak görüntü eklersiniz.

Ama şimdi daha çok var. CSS (Basamaklı Stil Sayfaları), HTML’de hazırladığınız metnin nasıl görünmesi gerektiğini açıklayan bir dildir. Hatırla tartıştığımız etiket? Bunun içinde (ve diğer etiketlerin) tanımlayabilirsiniz. sınıf bağlıyor. Sonra, beraberindeki CSS belgenizde, bunun için talimatlar yazabilirsiniz. sınıf Bakmalısın.

Bu stil öğelerini HTML kodunuzda satır içi olarak tanımlayabilirsiniz, ancak bakımı çok daha zor olduğu için bunun kötü bir uygulama olduğu düşünülmektedir. Bu basit CSS örnekleri ile daha fazlasını öğrenin 10 10 Dakikada Öğrenebileceğiniz Basit CSS Kod Örnekleri 10 Dakikada Öğrenebileceğiniz 10 Basit CSS Kod Örnekleri 10 Dakikada Öğrenebileceğiniz Basit CSS Kod Örnekleri CSS becerilerinizi pratik edebilmeniz için nasıl bir satır içi stil sayfası oluşturulacağına bakacağız. Sonra 10 temel CSS örneğine geçeceğiz. Oradan, hayal gücünüz sınırdır! .

JavaScript

HTML'nin içeriği tanımladığını ve CSS'nin görünümünü belirlediğini gördük. Web için hayati önem taşıyan üçlünün son üyesi olan JavaScript, web sayfalarının her seferinde yeni bir sayfa yüklemeden insanların eylemlerine yanıt vermesini sağlar.

Örneğin, JavaScript bir web sitesinin size girmeden önce girdiğiniz parolanın gereksinimlerini karşılamadığı konusunda sizi uyarmasını sağlar. Bir web tasarımcısı, slayt gösterisindeki görüntüler arasında geçiş yapmak veya kullanıcıdan giriş yapmasını istemek için JavaScript kullanabilir.

Bunlar sadece birkaç temel örnek. JavaScript bir sürü şey yapabilen ve HTML ve CSS'den nispeten daha karmaşık bir betik dilidir. JavaScript genel bakışımızı görün JavaScript Nedir ve Nasıl Çalışır? JavaScript Nedir ve Nasıl Çalışır? Javascript nedir? Web sayfalarını geliştirmek için kullanılan bir programlama dilidir. Dinamik olarak güncellenen web sayfalarını, kullanıcı arayüzlerini ve daha fazlasını içerir. Javascript'in ne hakkında olduğuna dalalım. daha fazlası için.

Web tasarımının tüm kapsamına bakmak, bu makalenin kapsamı dışındadır, ancak HTML’nin bugün bildiğimiz web sayfalarını oluşturmak için diğer dillerle etkileşime girdiğini söylemek yeterlidir..

HTML'nin Evrimi

HTML'nin statik olmadığını not etmek önemlidir. HTML, en son HTML 5 olan birkaç revizyondan geçti. Özellikle, bu standart Adobe Flash gibi tescilli formatlara güvenmek yerine yerel video gömme işlemlerini destekliyor.

HTML'nin yeni yinelemeleri ayrıca belirli arkaik etiketleri zaman zaman kullanımdan kaldırılmış olarak ilan eder. Bunlar gibi korkunç etiketleri içerir ve (sırasıyla kaydırma ve flaş metni) 1990'lı yıllarda web sitesi tasarımında sıkça görülüyor. Bu nedenle standartların zaman içinde değiştiğini unutmayın.

Küçük Bir HTML Bilgisi Uzun Bir Yere Gidiyor

Bir HTML belgesinin nasıl çalıştığını kısa bir tur attık. Artık web sayfalarının nasıl yapılandırıldığının temellerini biliyorsunuz. Web sayfaları oluşturmaya devam etmeseniz bile, her gün kullandığınız web hakkında biraz daha farkındasınızdır.

Daha fazla bilgi edinmek için web geliştirme becerilerinizi gerekli araçlarla yükseltin Bu 10 Temel Araçla Web Geliştirme Becerilerinizi Yükseltme Bu 10 Temel Araçlarla Web Geliştirme Becerilerinizi Yükseltme Web siteleri geliştirmeye hazır mısınız? Bu yeni ve uzman web geliştiricileri için çevrimiçi araçlar, becerilerinizi artıracak garantilidir! ve sonra ilk web sitenizi nasıl tasarlayacağınıza dair kılavuzumuzu inceleyin Nasıl Bir Web Sitesi Nasıl Yapılır: Yeni Başlayanlar İçin Bir Web Sitesi Nasıl Yapılır: Yeni Başlayanlar İçin Bugün size eksiksiz bir web sitesi baştan yapma sürecinde size rehberlik edeceğim. Bu zor geliyorsa endişelenme. Her adımında size rehberlik edeceğim. .

Resim Kredisi: Belyaevskiy / Depositphotos