Html nedir ve ne için kullanılır? Bir sayfanın HTML kodu nedir? HTML'nin ne olduğunu anlamak için pratik yapın...

Her sitenin farklı bir görünümü ve işlevi var ama bunun sebebi nedir ve sayfa hangi dilde yazılmış? Tüm bunlar için Cascading Style Sheets ve HTML dili kullanılır. Tarayıcıdaki nesneleri incelerseniz bu dilin koduna kendiniz göz atabilirsiniz. Özellikle HTML dili nedir, bu yazımızda konuşacağız.

Makalemiz esas olarak yeni başlayanlara yöneliktir, bu nedenle blogun düzenli okuyucularının anlayışını umuyoruz!

Gönderi aşağıdaki bölümlere ayrılacaktır:

HTML sayfası nedir

Tablolar, resimler ve metin dahil tüm sayfa öğelerine stil vermek için HTML adlı bir biçimlendirme dili kullanılır. Koda bakabilir ve herhangi birini kullanıyorsanız anlamaya çalışabilirsiniz. modern tarayıcı, sayfaya sağ tıklayın ve menüde "sayfanın kaynak kodu" veya "HTML kodu" satırına tıklayın. Bundan sonra, içinde birçok anlaşılmaz yazıt ve sembol bulunan bir editör gibi bir şey göreceksiniz, bu HTML dil kodudur.

Her WWW belgesi, zengin biçimde biçimlendirilmiş ve güzel tasarlanmış metinlerin yanı sıra site sahibi tarafından seçilen köprüler ve resimlere sahiptir. Bu öğelerle çalışmak için programcılar, köprü metni biçimlendirme dili anlamına gelen HTML (Hyper Text Markup Language) adlı bir dil oluşturdular. Her tarayıcı HTML'yi farklı şekilde çalışır ve işler, bu nedenle farklı tarayıcılarda, özellikle eski sürümlerde, farklı şekilde oluşturulur. Internet Explorer.

Tüm HTML belgeleri benzerdir - bu standarttır Metin dosyası, site ziyaretçilerinin okuyacağı metinlerle birlikte o dil için işaretleme etiketlerine sahiptir. Etiketler bir sayfa oluşturmak için kullanılır ve tarayıcı onu yüklediğinde bunları okur. Etiketlerin tanımı ve tasarımı sayesinde, bir makaleyi veya başka bir materyali sayfada belirli bir yere yerleştirebilir, grafik dosyaları ve fotoğrafların yanı sıra sitenin diğer sayfalarına köprüler ekleyebilirsiniz. İlk olarak HTML dosyası bir web belgesi değildir, yalnızca tarayıcı tarafından okunduktan sonra bir olur.

Elbette, standart HTML kodunun dezavantajları ve dezavantajları vardır. Sayfada metin içeren paragrafları düzenlemek için çok uğraşmanız gerekecek, çünkü işaretleme ve diğer her şey için metnin tamamı ve her bir paragraf için belirli özellikler belirlemeniz gerekir. Sitenizde 50 sayfa varsa ve her birinde 10-20 paragraf varsa, metni biçimlendirmek ve her seferinde aynı etiketleri eklemek çok uzun zaman alacaktır. Bu sadece site sahibini yormaz, site sayfalarının ağırlığını da olumsuz etkiler. Bu nedenle, daha sonra basamaklı stil sayfaları oluşturuldu, bunlara kısaca CSS denir, bu da Basamaklı Stil Sayfaları anlamına gelir, bu sayede metni hızlı bir şekilde düzenleyebilirsiniz. Bir etiket atayabilir ve ona metin rengi, boyutu, yazı tipi vb. gibi belirli özellikler verebilir ve ardından bunu paragraflara uygulayabilirsiniz. Bu durumda, stil sayfası dosyası ayrı olarak saklanır, aynı anda bir veya birkaç siteye yüklenebilir. Ardından, sayfanın ana öğeleri HTML'ye yazılır ve metin eklenir ve ardından CSS bağlanır ve tüm metin ihtiyacınız olan tasarımı alır. Aynı zamanda çok önemli olan sayfaların ağırlığını da azaltır.

CSS'yi kullanma sitenin aynı tasarıma sahip olacak çok sayıda sayfası varsa tavsiye edilir. Bir belgeye CSS koduyla birkaç satır yazarsanız, tüm paragraflar için belirli metin biçimlendirmesi ayarlayabilirsiniz. Sitenin oluşturulması sırasında mizanpaj tasarımcıları, Photoshop'ta oluşturulan mizanpaja odaklanarak HTML'de ana mizanpajı oluşturur. Ancak bundan sonra site bitmemiş görünüyor, çekici bir görünüm oluşturmanız gerekiyor ve bu, basamaklı stil sayfaları ile elde ediliyor. Çok fazla boş zamanınız varsa bunu öğrenmek kolaydır, çünkü tüm sitelerin genel görünümü yaklaşık olarak aynı olduğundan, birkaç bloklu bir yerleşim düzenine sahip olabilir ve sitelerin geri kalanını buna "ayarlayabilirsiniz". Kural olarak, basamaklı stil sayfaları CSS'den çok daha karmaşıktır ve bir siteyi tablolara değil bloklara yerleştirmek daha da zordur. Ayrıca ilk aşamalarda sitenin tarayıcılarda farklı görüntülenmesi gibi bir sorunla karşılaşabilirsiniz. CMS'nin oluşturulduğu sitelerde zaman kaybetmemek ve para kazanmamak için - hazır düzenlerücretsiz veya ücretli olabilen ve belirli bir yönetim sistemine sahip siteler.

HTML5 nedir. Farklılıklar ve faydalar

yeni standart HTML5, site sahiplerine yardımcı olur ve onları formatı kullanma zorunluluğundan kurtarır Adobe Flash programı, diğer programlar gibi. Sayesinde bu standart sayfalardaki metin görünümünü değiştirebilir ve elektronik formları doldururken bilgi girişini kolaylaştırabilirsiniz. Bu dilin tüm yeniliklerini bölersek şu noktaları ayırt edebiliriz:

  1. Siteye girdikten sonra insanlar tarayıcı üzerinden video izleyebilecek ve ses dinleyebilecek, bunun için oynatmak için ayrı bir buton oluşturuluyor.
  2. Bu dil aracılığıyla yeni fotoğraflar yüklemek çok daha kolay, hatta resim galerileri bile oluşturabilirsiniz. Ek indirmenize bile gerek yok yazılım.
  3. Metni bulabilir ve metin bloklarını işaretleyebilirsiniz. Ayrıca okumayı kolaylaştırmak için metne ince ayar yapabilirsiniz.
  4. HTML4'te daha önce bir kişi yalnızca form gönderirken veri girdikten sonra bir hata fark ettiyse, şimdi bir kişi formu yanlış doldurursa tarayıcı hemen bir hata bildirir. Bu, kullanıcılar için çok uygundur, çünkü aynı bölümleri birkaç kez veri ile doldurmaları gerekmez.
  5. kullanmaya gerek yok yazılım modülleri, çünkü HTML5'in yardımıyla siteyle ilgili her türlü fikri gerçekleştirebilirsiniz. Yalnızca site benzersizse ve özel bir şey bulmanız gerekiyorsa, ek yazılım modülleri yükleyin.
  6. Önceden, HTML4 standardında tarayıcı uyumluluğu bulunmadığından, insanlar siteyi bir tablet veya akıllı telefon aracılığıyla normal şekilde görüntüleyemiyordu. mobil cihazlar ve diğerleri işletim sistemleri. HTML5 dilini kullanarak, ideal olarak tüm cihazlardan yüksek hızda okunan sayfalar oluşturulur.

Herhangi bir sorunuz varsa - yorumlara yazın, cevaplamaktan mutluluk duyarız!

HTML nedir ve ne içindir? - 3 oy ile 5 üzerinden 3,7

Çalışmaya devam etmeden önce, html'nin ne olduğunu ve ne için tasarlandığını düşünmeyi öneriyorum.

HTML, Hiper Metin İşaretleme Dili olarak çevrilebilen Hiper Metin İşaretleme Dili anlamına gelir. Bu dil yardımıyla web sayfaları oluşturulur.

HTML bir programlama dili değildir. Metin belgelerinin işaretlenmesi için tasarlanmıştır. Yani, genel olarak, onun yardımıyla metin biçimlendirmesini gerçekleştiriyoruz.

Peki HTML kullanarak metni nasıl düzenleyebiliriz? Mesele şu ki, HTML dili etiketlerden (etiketlerden) oluşuyor. Her etiket, metnin sayfanızda nasıl görüneceğini tanımlar.

Başka bir deyişle, her etiket tarayıcınıza (web sayfalarını görüntülediğiniz program) belirli bir komut verir, tarayıcı bu komutu anlar ve belirli bir şekilde formatlanmış hazır metni ekranınızda görüntüler.

Bu nedenle, kodun kendisini görmezsiniz, tarayıcı zaten biçimlendirilmiş metni ve grafikleri monitörünüzün ekranında görüntüler. kendin görmek istersen HTML Kodu ve şu anda okuduğunuz metni biçimlendiren etiketler, ardından internet tarayıcısı Explorer'dan menü öğesine > görünüm'e gidin ve açılır listeden öğe > kaynak'ı seçin. Çizime bakın.

Bu, kodu içeren bir pencere açacaktır. İkinci resimde gördüğünüze benzer. Bu kodu kaydırıp inceleyebilirsiniz, çoğunlukla içinde metin bulunan etiketlerden oluşur. Böylece ayrıntılara girmeden, her etiketin metninizin nerede, nasıl, hangi yazı tipini, hangi renkte görüneceğini belirlediğini söyleyebiliriz.

Ancak aslında HTML etiketleri yalnızca metni biçimlendirmekle kalmaz, bunları bir sayfaya resim eklemek, tablolar oluşturmak, bağlantılar oluşturmak ve çok daha fazlası için kullanabilirsiniz.

Her etiket kendi özel işlevlerini yerine getirir ve web sayfalarının nasıl oluşturulacağını öğrenmek için şu veya bu etiketin ne için olduğunu bilmeniz gerekir. Sanırım artık html'nin ne olduğunu biraz anladınız.

Öncelikle tag nedir ona bakalım. Basitçe söylemek gerekirse, etiketler sıradan İngilizce karakterlerden veya kelimelerden oluşur, yalnızca bu harfler ve kelimeler belirli bir şekilde tasarlanmıştır.

Her etiket açılı ayraçlardan oluşur,< >belirli karakterlerin yerleştirildiği yer. Çoğu açma ve kapamadan oluşur.

Örneğin etiket - açma ve- kapanış. Gördüğünüz gibi, sondaki eğik çizgi / kapanış karakterinde farklılık gösterirler. Aralarında herhangi bir kelime varsa, örneğin, Hey o zaman görüntülenecek kalın harflerle. Bu durumda köşeli parantez içine alınan her şey ekranda gösterilmez, ancak tarayıcı için bu etiketlerin arasına alınan kelimenin kalın olarak gösterilmesi gerektiğine dair bir tür komuttur.

Doğal olarak birçok etiket vardır ve her biri kendi özel işlevlerini yerine getirir. Yaklaşık olarak bu prensibe göre, diğer tüm etiketler ve tüm HTML bir bütün olarak çalışır. İnternetten herhangi bir belge talep ettiğinizde, tarayıcınız html kodunu yükler, doğru şekilde yorumlar ve hazır formatlı metin, grafik, tablo vb. ekranınızda görüntüler.

Bu dersin amacı size HTML'nin ne olduğu hakkında bir fikir vermekti, sonraki derslerde bu biçimlendirme dilinin çalışmasına başlayacağız. Malzemeyi öğrenmenizi kolaylaştırmak için, dersleri en basitlerinden çalışmaya başlamanızı, sorunsuz bir şekilde daha karmaşık olanlara geçmenizi öneririm, örneğin aşağıdaki sırayla: başlangıçta, bir belge olarak çalışın , hangi ile ayarlandıkları ve üretildikleri, ayarlamayı öğrenmeleri vb. daha zor.

HTML sayfaları oluşturmak için şunları kullanabilirsiniz: özel programlar gibi veya Windows'un herhangi bir sürümünde bulunan basit bir metin düzenleyiciyi kullanarak sayfalar oluşturabilirsiniz.

HTML- Web sayfaları yazmak için en yaygın kullanılan dil olan HyperText Markup Language anlamına gelir.

  • köprü metni web sayfalarının (HTML belgeleri) bağlanma şeklini ifade eder. Bu nedenle, bir web sayfasında bulunan bağlantıya hiper metin denir.
  • Adından da anlaşılacağı gibi, HTML bir biçimlendirme dilidir; bu, web tarayıcısına onu görüntülemek için nasıl yapılandıracağını söyleyen etiketlerle bir metin belgesini basitçe "işaretlemek" için HTML kullandığınız anlamına gelir.

HTML orijinal olarak, değişimi kolaylaştırmak için başlıklar, listeler, paragraflar vb. gibi belgelerin yapısını tanımlamak için tasarlanmıştır. bilimsel bilgi araştırmacılar arasında.

HTML artık HTML dilinde mevcut olan çeşitli etiketlerle web sayfalarını biçimlendirmek için yaygın olarak kullanılmaktadır.

HTML Belgesi

Aşağıdaki örnek, bir HTML belgesini göstermektedir. en basit hal:

Belge başlığı

başlık

İşte belgenin içeriği...

Kodu, favori metin düzenleyicinizi kullanarak Document.html HTML dosyasına kaydedelim. Ve dosyayı Internet Explorer gibi bir web tarayıcısıyla açın, Google Chrome veya Firefox vb. Aşağıdaki sonucu göstermelidir:

HTML belgesi oluşturmak için etiketler

Daha önce tartışıldığı gibi, HTML bir biçimlendirme dilidir ve içeriği biçimlendirmek için çeşitli etiketler kullanır. Bu etiketler köşeli parantez içine alınır. Birkaç etiket dışında çoğu etiketin karşılık gelen bitiş etiketleri vardır. Örneğin, etiket kapanış etiketi var ve etiket yakın bir etiketi var diğer.

Yukarıdaki örnek, bir HTML belgesi oluşturmak için aşağıdaki etiketleri kullanır:

EtiketTanım
Bu etiket, belge türünü ve HTML sürümünü tanımlar.
Bu etiket, HTML belgesinin tamamını kapsar ve esas olarak etiketlerle temsil edilen belgenin başlığından oluşur. ... ve etiketlerle temsil edilen belgenin gövdesi ... .
Bu etiket, aşağıdaki gibi diğer html etiketlerini içerebilecek belgenin başlığını temsil eder. , <link>vb.</td> </tr><tr><td><title> </td><td>Etiket <b><title> </b> etiket içinde kullanılır <head>Belgenin başlığını belirtmek için.</td> </tr><tr><td><body> </td><td>Bu etiket, aşağıdaki gibi diğer html etiketlerini tutan belgenin gövdesini temsil eder. <h1>, <div>, <p>Diğer.</td> </tr><tr><td><h1> </td><td>Bu etiket başlığı temsil eder.</td> </tr><tr><td><p> </td><td>Bu etiket bir paragrafı temsil eder.</td> </tr></table><p>Bu etiketleri bilmek, bir html belgesi (html sayfası) oluşturmak için oldukça yeterlidir.</p> <p>HTML öğrenmek için çeşitli etiketleri bilmeniz ve biçimlendirildiklerinde nasıl davrandıklarını anlamanız gerekir. <a href="https://obanracer.ru/tr/kak-vstavit-skrinshot-v-tekstovyi-dokument-kak-sdelat-printskrin-s.html">Metin belgesi</a>. Kullanıcıların güzel bir web sayfası oluşturmak için metin veya görüntüleri biçimlendirmek için yalnızca farklı etiketleri nasıl kullanacaklarını öğrenmeleri gerektiğinden, HTML öğrenmek kolaydır.</p> <h2>HTML belge yapısı</h2> <p>Tipik bir HTML belgesinin yapısı şöyle görünür:</p><p>Belge bildirim etiketi <html> <head> <title>Belge başlığıyla ilişkili etiketler Belge gövdesiyle ilişkili etiketler

Tüm head ve body etiketlerini sonraki derslerde öğreneceğiz, şimdi bir belge bildirim etiketinin ne olduğunu görelim.

beyanname

etiket beyanıbelgede kullanılan HTML sürümünü anlamak için web tarayıcısı tarafından kullanılır. Şimdiki versiyonu HTML 5'tir ve aşağıdaki bildirimi kullanır:

Hangi HTML sürümünün kullanıldığına bağlı olarak, bir HTML belgesinde kullanılabilecek başka birçok türde bildirim vardır. Etiketi tartışırken bununla ilgili daha fazla ayrıntı göreceğizdiğer HTML etiketleriyle birlikte.

Merhaba!. İkinci ders, şu soruya ayıracağız - HTML nedir ve onunla nasıl çalışılır. İçinde en popüler web programlama dilinin özelliklerini öğrenecek ve ana özünü açıkça anlayacaksınız.

Nasıl öğrendiğinize göre, ilerlemeniz sizin için daha kolay olacak ve daha sonra site oluşturmak için daha karmaşık dillerin fethini kolayca üstlenebilirsiniz (hayır, yine de çok çalışmanız gerekiyor), örneğin, aynı PHP. Öyleyse işe başlayalım.

HTML nedir

HTML (köprü metni biçimlendirme dili), bir köprü metni biçimlendirme dilidir. World Wide Web'deki İnternet belgeleri için standart biçimlendirme dili. En popüler web sitesi geliştirme dillerinden biridir. Ayrıca tarayıcılarda yükleme açısından en kolay olarak kabul edilir.

Sayfayı tarayıcıda görüntülemeden önce önce MySql veritabanına istekte bulunan ve ardından yalnızca içeriği kullanıcıya görüntüleyen PHP gibi karmaşık "mutasyonları" yoktur. Nasıl yaratıldığına dair uzun sözlü prelüdler vermeyeceğim çünkü uzun ve ilgi çekici değil.

Tüm bu noktalar için - size yardımcı olacak harika Wikipedia. Hızlı bir şekilde web siteleri oluşturmayı öğrenmek istiyoruz, değil mi? İyi! O zaman devam edelim ve bu web biliminin tüm inceliklerini anlayalım.

HTML dilinin temelleri. Etiket kavramı

Sağlam bir temel bilgisi olmadan, hiçbir yere gidemezsiniz, henüz kimse “mat.chast” ı (herhangi bir konunun (“temel”) iptal etmedi. Ve geleneklerden ve kurallardan sapmayacağız.

HTML dilinin temelleri etiketlerdir veya daha kesin olmak gerekirse bir dizi etikettir. Böyle etiketleniyorlar<тег>. Etiketler her zaman eşleştirilir ve bu şekilde görüntülenir

<тег>.

< тег> < / тег> .

Her biri sıkı bir şekilde gerçekleştirir belirli işlev tarayıcılarda görüntülemek için.

Bazıları ekranda bir resim gösterir, diğerleri bir bağlantı, diğerleri paragraflardan sorumludur, diğerleri bir tablo oluşturur vb. İçlerine herhangi bir metin yazabiliriz. Açıklık için onlara kapsayıcı demeyi seviyorum, tabiri caizse. Ama bekar olanlar da var, onları sonraki derslerde işleyeceğiz.

Ve anlaşılması gereken bir şey daha önemli nokta. AT verilen dil Pareto ilkesi geçerlidir yani hayatın her alanında, aktivitede olduğu gibi ve başka her yerde 80/20 kuralı vardır.

Ne diyor? Bu bize, dilin %20'sinin (bizim durumumuzda html) işin %80'ini yaptığını söyler. Mantık, çoğu kullanılmadığı veya çok nadiren kullanıldığı için tüm etiketleri öğrenmenin gerekli olmamasıdır. Bu yüzden derslerimizde en sık ve önemli olanlara odaklanıyoruz. Ve onunla harika iş çıkardın!

HTML belge yapısı

Herhangi bir html belgesinin yapısı şöyle görünür

Başlıksız belge

< ! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Geçiş//EN""http://www.w3.org/TR/html4/loose.dtd">

< html >

< head >

< meta http - equiv = "Content-Type" content = "text/html; charset=utf-8" >

< title >Başlıksız Belge< / title >

< / head >

< body >

< / body >

< / html >

Şimdi her noktayı daha ayrıntılı olarak açıklayalım:

Doktip nedir ve anlamları

Doctype öğesi, web sayfamızın türünü belirtmek için kullanılır. Bu, sözde "belge türü bildirimi" veya Belge Türü Bildirimidir.

Bu etiket her sayfada her zaman ilk sırada olmalıdır. Standartlarla uyumlu olduğunu iddia eden web sayfalarının önemli bir bileşenidir: onsuz, kodunuz doğrulayıcıyı geçemez.

Web belgesi doğrulayıcısı bilgisayar programı Herhangi bir belgenin, veri akışının veya kod parçasının belirli bir formata uygunluğunu kontrol eden , bir belgenin veya dosyanın sözdizimsel doğruluğunu kontrol eder (Wikipedia'ya göre).

Birkaç Doctype değeri vardır:

  1. katı (katı)
  2. geçiş (geçiş)
  3. Çerçeve seti (çerçeveli)

Ben ikinci seçeneği kullanıyorum. Geliştiriciyi sınırlamadığı için onunla çalışmak en uygunudur. Okuyucu için kafa karışıklığı var, peki aralarındaki fark nedir ve hangisinin kullanılması en iyisidir?

Aralarındaki farkın ne olduğunu açıklayayım. Geçiş sürümü, W3C doğrulama standartlarına (veya Rusça'da kontrollere) tam olarak uymaz, yani tarayıcı, eski, tavsiye edilmeyen ve diğer olmayanlar içerse bile web belgesinin içeriğini aynı şekilde gösterecektir. standart kod varyasyonları. Ancak, Strict versiyonu tüm standartlara tam olarak uyar, yani pratikte, ilgili sembolü kodun bir yerine koymayı unuttuysanız (örneğin, bir eğik çizgi /), o zaman kontrol ederken size bir uyarı verilecektir.

Sıkı sürümü kullanan bir web belgesi şöyle görünür:

Dil standartlarına sıkı sıkıya uygunluk

< ! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Katı//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

< html xmlns = "http://www.w3.org/1999/xhtml">

< head >

< title >Dil standartlarına sıkı sıkıya uygunluk< / title >

< meta http - equiv = "Content-Type" content = "text/html; charset=utf-8" / >

< / head >

< body >

< p > . . . < / p >

< / body >

< / html >

En uygun olduğu için ikinci seçeneği kullanmanızı ve banyo yapmamanızı tavsiye ederim. Şimdi sayfamızın diğer bileşenlerine bakacağız.

- veya "head" etiketi, tarayıcıya sayfada ne yapılması gerektiğini ve hangi mekanizmaların çalıştırılacağını açıklayan en önemli etiketleri içerir. Bir web belgesini ve içeriğini tanımlar. Genellikle sayfada çeşitli özellikleri çalıştıran çeşitli komut dosyaları içerir ve ayrıca SEO tanıtımı için önemli bir "kapsayıcı" vardır - etiket

HTML'nin ne olduğunun ayrıntılarına ve geçmişine girmeyeceğiz, hemen ana noktalara geçeceğiz. HTML, herhangi bir web sitesi oluşturmanın temelidir! Site oluşturma konusunu incelerken, onunla başlamak gerekir. Burada ağır bir şey yok. KESİNLİKLE HERKES bu teknolojide ustalaşabilir!

Hemen belirtmek isterim ki bu bir programlama dili DEĞİL, bir biçimlendirme dilidir.

HTML öğrenmek neden kolaydır?

akıcı konuşmak ingilizce diliİngilizce dilindeki tüm kelimeleri bilmenize gerek yoktur. Yani burada, sadece bazı temel etiketleri öğrenmeniz ve onlarla nasıl çalışacağınızı öğrenmeniz gerekiyor. Ve sonra sadece pratik yapmanız ve becerilerinizi geliştirmeniz gerekiyor.

Haydi bu büyüleyici ve aynı zamanda basit teknolojiyi öğrenmeye başlayalım.

Küçük bir teori...

Herhangi bir sayfa etiketlerden oluşur. Yani sayfa aslında alıştığımız gibi görünmüyor, ancak her biri belirli bir rol oynayan birçok etiketten oluşuyor.

Büyük bir tuğla duvara benziyor. Üzerine tüm tuğlalar düzgün bir şekilde döşenirse, tüm duvar güzel görünür. Bu nedenle sayfa yapısını yazarken her etikete dikkat etmek gerekir çünkü gelecek sayfamız için "tuğla"dır.

Ancak HMTL'de bir etiket nedir?

Bu HTML öğesi sayfanın görüntülenmesini ve düzenini bir şekilde etkileyen sayfa. Kelimelerle, bunu anlamak oldukça zor, bu yüzden pratikte hemen her şeye bakmanız ve koda alışmanız gerekiyor. Aşağıdaki resme bakın:

Bu, en basit sayfanın yapısıdır. Ancak üçgen parantez içindeki bu tekrarlanan kelimeler etiketlerdir. seninkini açarsan Metin düzeltici ve bu kodu yazın ve ardından HTML formatında kaydedin, ardından bir HTML sayfası alacaksınız. Şimdiye kadar HTML'nin ne olduğu net değil mi? 🙂

Bu yapıdan, bulunması gereken etiketleri görebilirsiniz. Bunlar etiketler:

  • ve kapanış
  • ve kapanış
  • ve kapanış

Daha açık hale getirmek için, aşağıdaki resimde bunları turuncu renkle vurguladım:

Etiketlerin arasına yazacağımız her şey ve Sayfamızda göremeyeceğiz. Bu etiketler, tarayıcıya kodlama hakkında, sayfamızın başlığı hakkında bilgi verebilir, çeşitli stiller, komut dosyaları vb. buraya bağlanabilir. Bütün bunları sonraki derslerde göreceksiniz.

Ve işte etiketlerin arasına yazacağımız tüm etiketler ve amacına bağlı olarak, yapımızı tam olarak etkileyecektir. HTML sayfaları.

Peki, HTML'nin ne olduğu daha net hale geldi? 😉 Ama durup yolumuza devam etmiyoruz...

Bazı etiketlerin kapanış etiketi olabilir, bazılarının olmayabilir. Örneğin etiket kapanış etiketi var. Tahmin edebileceğiniz gibi, etiketler eğik çizgi ile kapatılır.

Açılış ve kapanış etiketlerine saygı duymak çok önemlidir. Hatalardan kaçınmak için. Tarayıcı bir hata göstermeyebilir, ancak stillerle çalışırken bile sayfalarınızın yapısı yanlış olacaktır (burada görünüm) büyük bir sorun olacaktır. Bu nedenle, etiketin bir kapanış etiketi varsa, doğru yerde bulunmalıdır.

Etiketlerin nasıl KAPATILMAYACAĞINA ve hangi sırayla yapılacağına dair bir örnek alalım. İki etikete bir örnek:

Doğru HTML KODU

Yukarıda gördüğünüz - bu, kapanış etiketlerini yazmanın doğru sırasıdır. Ama böyle bir durum olabilir

HTML KODUNDA HATA

çok yakın etiketler kesinlikle yasak!

HTML'nin ne olduğunu anlamak için pratik yapın...

HTML'nin ne olduğu hakkında daha fazla bilgi edinmek için yalnızca pratik yapabilirsiniz. Bunun için herhangi bir metin düzenleyiciyi kullanabilirsiniz. Hatta bir not defteri. Ancak HTML ile çalışmak için daha birçok işlev olduğundan Notepad++ kullanmanızı öneririm. Download Notepad++ linkinden indirebilirsiniz. Bu düzenleyici, HTML sayfaları oluşturmak ve düzenlemek için tüm özelliklere sahiptir.

Hadi başlayalım. Programı açtıktan sonra aşağıdaki pencereyi göreceksiniz:

Bir HTML sayfası oluşturmak için bu kutuya sayfanın "gövdesini" girmelisiniz. Aşağıdaki metni kopyalayıp yapıştırabilirsiniz. Ancak her şeyi elle girmek daha iyidir. Böylece hızlı bir şekilde hatırlayabilir ve etiketlere alışabilirsiniz.

Yani, aşağıdakileri almalısınız:

Ardından, kaydetmeniz gerekir bu sayfa HTML formatında. Bunu yapmak için "Dosya" menüsüne tıklayın, burada "Farklı Kaydet ..." seçeneğine tıklayın. HTML sayfasının adını girin. Ben buna index.html adını verdim. O zaman sadece kaydet rahat nokta bilgisayarınızda. Bundan sonra, arka ışık görünecektir HTML etiketleri, çünkü Notepad++ editörü ne olduğunu anlayacaktır. HTML belgesi. Ve arka ışıkla çalışmak çok daha keyifli.