HTML'nin Temelleri Nelerdir?

Yayınlanan: 2023-09-25

HTML (Köprü Metni Biçimlendirme Dili), Orange County'deki web tasarımının temel yapı taşıdır. Bir web sayfasının yapısını ve içeriğini oluşturmak için kullanılan bir işaretleme dilidir ve tüm web sitelerinin temelini oluşturur. Muhtemelen tüm web tasarımcıları kariyerlerinde HTML ile karşılaşmışlardır!

HTML, HTML kodunu manuel olarak düzenlemeden değişmeyen, yani kullanıcıların onu etkileyemeyeceği sayfalar olan statik web sayfaları oluşturmak için kullanılan standart dildir.

web-tasarımında-kodlama-dillerinin-HTML-temelleri-orange-county-pinterest

HTML'nin Temelleri

HTML bir dizi öğe veya etiketten oluşur ve her öğe belirli bir web sayfası bileşenini temsil eder. Kulağa basit geliyor değil mi? Çünkü öyle! Bu HTML belgeleri bir metin düzenleyici kullanılarak oluşturulur ve .html uzantısıyla kaydedilir. Temel bir HTML belgesinin düzgün çalışması için aşağıdaki öğelere sahip olması gerekir:

<!DOCTYPE> Bildirimi

<!DOCTYPE> bildirimi, HTML belgeniz için açılış eylemi olarak hizmet eder ve tarayıcıyı kullandığınız HTML sürümü hakkında bilgilendirerek ortamı hazırlar. Bunu, "Hey tarayıcı, HTML5 ritmiyle dans edeceğiz!" diyen samimi bir giriş olarak düşünün. HTML5, web geliştirme dünyasında gösterinin şu anki yıldızıdır ve masaya çok sayıda heyecan verici özellik ve iyileştirme getirmektedir. Dolayısıyla, bu bildirimi eklediğinizde, aslında tarayıcıya modern, özelliklerle dolu bir HTML deneyimine hazırlanmasını söylüyorsunuz. Bu, web içeriğinizin doğru şekilde sunulmasını ve tüm harika HTML5 özelliklerinden faydalanmasını sağlamanın yoludur.

<!DOCTYPEhtml>

<HTML> Öğesi

<html> öğesini HTML belgenizdeki büyük patron olarak düşünün. Baş honcho, en iyi köpek ve her şeyi düzenli tutan kişidir. Tıpkı bir patronun bir şirketi yönetmesi gibi, <html> öğesi de web sayfanızın tamamını yönetir. Web içeriğinizi oluşturmak için kullanacağınız tüm diğer öğelerin başlangıç ​​noktası ve kapsayıcısıdır.

Bu <html> öğesinin içinde, <head> ve <body> öğeleri de dahil olmak üzere web sayfanızın planını bulacaksınız. <head> öğesi, belgeniz hakkında başlık, meta etiketler ve dış kaynaklara bağlantılar gibi önemli bilgileri içerir. Bu arada <body> öğesi, kullanıcıların web sitenizi ziyaret ettiklerinde gördükleri tüm görünür içeriği içerir.

Özetle, <html> öğesi büyük resimdir, başkomutandır ve HTML belgenizin nihai düzenleyicisidir. Her şeyin sorunsuz çalışmasını ve web sayfanızın hedef kitlenize doğru şekilde yapılandırılıp sunulmasını sağlar.

<Head> Öğesi

<head> öğesi belgenizin beyni gibidir; başlık, meta etiketler gibi önemli bilgileri ve stil sayfaları ve komut dosyaları gibi süslü şeylere bağlantılar içerir. Bu nedenle, <head> öğesi web sayfanızda görünmese de sitenizin harika görünmesini, iyi performans göstermesini ve hem kullanıcılarla hem de arama motorlarıyla etkili bir şekilde iletişim kurmasını sağlamada hayati bir rol oynar. Web sayfanızın en iyi şekilde çalışmasına yardımcı olan komuta merkezi gibidir.

<Başlık> Öğesi

<title> öğesi, tarayıcının başlık çubuğunda görünen belgenin başlığını belirtir. Bu sadece teknik bir gereklilik değil, aynı zamanda güçlü bir iletişim aracıdır. Açık, kısa ve alakalı bir başlık oluşturmak, web sayfanızın kolayca tanınabilmesini, erişilebilir olmasını ve hem kullanıcılar hem de arama motorları için çekici olmasını sağlamak için çok önemlidir.

<Gövde> Öğesi

<body> öğesi, metin, resimler, videolar ve diğer öğeler gibi tüm web sayfası içeriğini içerir. Burası bir tiyatronun ana sahnesi gibidir; HTML belgenizdeki tüm aksiyonun gerçekleştiği yerdir. Herhangi bir web sayfasının temel yapı taşlarından biridir ve rolü oldukça basit ancak bir o kadar da önemlidir: kullanıcıların bir web sitesini ziyaret ettiklerinde gördükleri tüm görünür içeriği içerir.

HTML Öğeleri

HTML öğeleri açılı ayraçlarla çevrelenmiş açma ve kapama etiketlerinin içine alınır. Açılış etiketi, öğenin adıyla başlar ve ardından ad-değer çiftleri biçimindeki nitelikler gelir. Kapanış etiketi, açılış etiketiyle tamamen aynıdır ancak öğe adının önünde bir tür kapanış açıklaması olarak eğik çizgi (/) bulunur.

Örneğin, aşağıdaki kod basit bir HTML sayfası oluşturur:

<!DOCTYPEhtml>

<html>

<kafa>

<title>İlk HTML Sayfam</title>

</head>

<gövde>

<h1>Web siteme hoş geldiniz</h1>

<p>Bu benim ilk HTML sayfam.</p>

</body>

</html>

Burada <html> öğesi kök öğedir ve <head> ve <body> öğelerini içerir. <head> öğesi, belgenin başlığını belirten <title> öğesini içerir. <body> öğesi, başlık ve paragraf içeren sayfa içeriğini içerir. Tipik bir HTML belgesinde, önce en büyük öğeyle (bu durumda HTML) başlamalı ve ardından sayfayı oluştururken daha küçük parçalara (örneğin, başlık, başlık, gövde vb.) gitmelisiniz.

HTML Nitelikleri

HTML nitelikleri bir öğe hakkında ek bilgi verir ve açılış etiketine dahil edilir. Bir nevi tanımlayıcı görevi görüyorlar. En yaygın özellikler aşağıdakileri içerir:

Kimlik Özelliği

İd niteliği bir öğeyi tanımlar ve öğeyi işlemek için JavaScript ve CSS'de kullanılır.

Sınıf Niteliği

Class özelliği, öğeleri bir arada gruplayarak onların CSS ile stillendirilmesine olanak tanır.

Stil Özelliği

Stil özelliği, stilleri doğrudan HTML kodundaki tek bir öğeye uygulamanıza olanak tanıyan kullanışlı bir HTML özelliğidir. Bu, ayrı bir stil sayfası oluşturmaya gerek kalmadan renkler, yazı tipleri ve boşluklar gibi şeyleri belirleyerek belirli bir öğeye modaya uygun bir görünüm kazandırmak gibidir. Bu, web sitenizin geri kalan stillerini etkilemeden bir öğenin görünümünde hızlı ve tek seferlik bir değişiklik yapmak istediğinizde kullanışlı olabilir. Bu nedenle, web tasarımınızdaki belirli öğelere bir miktar benzersizlik eklemek için başvuracağınız araçtır.

Href Özelliği

Href özelliği, bağlantılarda hedef sayfanın URL'sini belirtmek için kullanılır.

Çözüm

HTML, web tasarımının temelidir ve iyi yapılandırılmış bir web sayfası oluşturmak için gereklidir. Bunlar tam teşekküllü bir web sitesine giden ilk adımlardır! Bu nedenle, HTML'nin temellerini anlamak, bir web sitesi oluşturmak isteyen herkes için çok önemlidir. HTML, öğelerden, niteliklerden ve içerikten oluşan bir biçimlendirme dilidir. Her öğe, web sayfasının belirli bir bileşenini temsil eder ve nitelikler, öğe hakkında ek bilgi sağlar. HTML ile yapılandırılmış, görsel olarak çekici ve etkileşimli bir web sitesine sahip olabilirsiniz.

İlgili makaleye buradan bakın: https://www.drivetrafficmedia.com/the- Different-coding-languages-of-web-design/