0
Görünümler
TarafındanRyan Dube
Son Güncelleme Tarihi
HTML, web sitesi geliştiricilerinin internette bulduğunuz tüm web sayfalarını oluşturmak için kullandığı bir biçimlendirme dilidir.
HTML, web sitesi geliştiricilerinin internette bulduğunuz tüm web sayfalarını oluşturmak için kullandığı bir biçimlendirme dilidir.
HTML Nedir?
HTML, Hiper Metin İşaretleme Dili anlamına gelir. Bir web sayfasının düzenini ve yapısını, ""den büyük sembollerden oluşan parantez içindeki "etiketler" biçimlendirmesini kullanarak tanımlar.
Her web sayfası öğesi, tarayıcıya sayfanın o bölümünü nasıl biçimlendireceğini veya yapılandıracağını söyleyen belirli bir etiket içerir. Bu nedenle, tüm bir web sayfası basitçe bu öğelerin bir dizisidir.
Örneğin, en temel web sayfalarından biri şunları içerecektir:
- : Bir HTML dosyasının başlangıcını ve sonunu işaretler
- : Web sayfası başlık bilgilerinin başlangıcını ve sonunu işaretler
- : Tarayıcı başlık çubuğunda görüntülenmesi gereken başlığı etiketler
- : Web sayfası içeriğinin başlangıcını ve sonunu işaretler
- için: Belgedeki başlıkları büyükten (H1) çok küçüğe (H6) kadar boyutlandırır
- : İki satır başı olarak bir paragraf sonu ekler (satırlar arasında bir boşluk)
-
: Satır sonu ekler (satırlar arasında boşluk bırakmaz) - : Etiketler arasındaki metni kalınlaştırır
- : Etiketler arasındaki metni italikleştirir
-
: Bu etiketin bulunduğu her yere bir resim ekler
- : Belgenin içine başka bir web sayfasına bağlantı ekler
Kullanabileceğiniz başka birçok HTML etiketi vardır, ancak yukarıdakiler internetteki çoğu web sayfasında en yaygın olanlardır.
Bir HTML Dosyası Örneği
Kendi web sayfanızı oluşturmak için bir programlama geçmişine ihtiyaç duymaz. Aslında, hemen şimdi Not Defteri'ni açabilir, basit bir metin yazabilir ve onu .html veya .htm dosyası olarak kaydedebilirsiniz. Bu, oluşturduğunuz ilk web sayfası olabilir ve tek ihtiyacınız olan kendi bilgisayarınızdır.
Aşağıda çok basit bir HTML dosyası örneği verilmiştir.
Bu benim ilk paragrafım.Bu İlk Başlık
Bu ikinci satır
Bu başka bir paragraf.
Bu hiper metin işaretlemesi şu şekilde çalışır:
- İlk iki satır tarayıcıya belgenin HTML biçiminde olduğunu ve dilin İngilizce olduğunu söyler.
- Ekteki sayfa başlığı
ve tarayıcının web sayfasını “Web Sayfası Başlığı” olarak görüntülenecek şekilde ayarlayın. - ile birlikte verilen bölüm ve tarayıcıya bu satırların web sayfasında görüntülenecek içeriği içerdiğini söyler.
- Başlık ile birlikte
ve
etiketleri, HTML'de bulunan en büyük başlık yazı tipinde "Bu İlk Başlıktır" oluşturur. -
ve
etiketlerden sonra bir boşluk ekler etiket. -
etiketi, bu cümleden sonra tek bir satır sonu ekler. - belgeyi sonlandırır ve web sayfası bu noktada yüklenmeyi durdurur.
Tarayıcınızla açtığınızda yukarıdaki web sayfası dosyası buradadır.
Gördüğünüz gibi, bir web sunucunuz olmasa bile bir web sayfası oluşturmak kolaydır. Tek ihtiyacınız olan bir HTML dosyası oluşturmak ve onu
HTML Nasıl Çalışır?
Açıkçası, çoğu sayfa bilgisayarınızda depolanmaz. Bunun yerine, internetteki web sunucularında depolanırlar. Bu nedenle, herhangi bir web sitesindeki bir makaleyi veya başka bir içeriği ziyaret ettiğinizde, sunucu tarayıcınıza o sayfanın içeriğini içeren .html dosyasını gönderir.
Herhangi bir web sayfasının HTML kodunu, sayfanın herhangi bir yerine sağ tıklayıp seçerek Chrome tarayıcısında görebilirsiniz. Sayfa kaynağını göster.
Bu size web sayfasının arkasındaki kodu gösterecektir. Dosyanın üstündeki ilk etiketten bunun bir HTML dosyası olduğunu görebilirsiniz.
Ancak, kaynak kodun hiç HTML etiketi olmayan başka tür etiketler içerdiğini de fark edeceksiniz.
HTML Dosyalarına Gömülü Komut Dosyaları
Örneğin, .php veya .js dosyalarını çağıran bir kod görebilirsiniz. Bunlar, kullanıcı girdilerine veya çıktılarına bağlı olarak farklı içerik yükleyen dinamik web sayfalarına izin veren PHP ve Javascript betikleridir. diğer komut dosyaları web sunucusunda veya tarayıcıda çalışan ve içeriği tarayıcınızın okuduğu HTML dosyasına teslim eden.
HTML, bir web sayfasındaki içeriği biçimlendirmek için kullanılan "statik" bir yöntem olduğundan, web tasarımcılarının sayfadaki içeriği tarayıcıların üzerine geldiği veya tıkladığı yere göre değiştirmek için daha dinamik bir yola ihtiyacı vardır. Tarayıcılar Javascript kodunu okuyabilir ve yorumlayabilir, kullanıcı etkileşimine dayalı olarak bir web sayfasının biçimlendirmesini veya diğer öğelerini değiştirebilir.
Örneğin, her menü öğesinin üzerine geldiğinizde sayfadaki menülerin rengi bu şekilde değişir.
Web sayfasına gömülü PHP kodu, dinamik düğmeler gibi şeylerin düzgün çalışmasına izin verir. Örneğin, Yorumlar Bu sitede göreceğiniz makalelerin altındaki buton, sunucu üzerinde çalışan ve her makaleye gönderilen yorumları iletecek olan PHP kodu tarafından yönlendirilmektedir.
PHP ayrıca web yöneticilerinin, siz sitenin ana sayfasını aşağı kaydırdıkça yeni makaleler yüklemeye devam eden sonsuz kaydırma gibi yenilikçi özellikler oluşturmasına olanak tanır.
Modern web tabanlı betik dilleri sayesinde, günümüzün web sayfaları artık sadece statik değil, tüm HTML kodları tek başına buna izin veriyor.
Diğer HTML Etiketleri
Kendi HTML dosyalarınızı oluşturmaya başlamaya hazırsanız, yukarıda açıklanan temel etiketlerin ötesinde en yaygın HTML etiketlerini nasıl kullanacağınızı bilmeniz gerekir.
Aşağıda, kendi web sayfalarınızı kodlarken kullanabileceğiniz bazı diğer HTML etiketlerine birkaç örnek verilmiştir.
Bağlantı Eklemek için HREF
Web sayfanızın içine bir bağlantı yerleştirmek için şunu kullanın: a href.
Hey Siri'yi Kullanarak iPhone'unuzu Bulun
Bu, “Hey Siri Kullanarak iPhone'unuzu Bulun” metnini, “href=” sonrasında çift tırnak içine aldığınız URL bağlantısına bağlayacaktır.
Resim Eklemek için IMG SRC
Yapabilirsin resim ekle kullanarak bir web sayfasına img kaynağı.
Bu, resmim.jpg resmini web sunucusundan çeker ve bu etiketi yerleştirdiğiniz sayfada 150 piksel genişliğinde ve 120 piksel yüksekliğinde görüntüler.
alt parametresi, resmi görüntüleyemeyen tarayıcılarda "profil fotoğrafım" metnini görüntüler. "Stil" parametresini eklemezseniz, görüntü orijinal çözünürlüğünde görüntülenir; bu, sayfanın gömdüğünüz alanı için çok büyük veya çok küçük olabilir.
Listeler Oluşturmak için UL ve OL
İçeriğinizde madde işareti veya numaralı listeler kullanmak istiyorsanız, bunu yapmanıza izin veren iki etiket vardır.
Aşağıdaki kod, numarasız bir liste (madde işaretleri) ekleyecektir:
kullanın
- Listenin başında ve
Aynı yaklaşımı numaralı bir liste için de kullanabilirsiniz.
- "Sıralı Liste" anlamına gelir.
Tablo Ekleme
Web tasarımcıları, web sayfalarını biçimlendirmek için büyük tablolar kullanırdı. Ancak Basamaklı Stil Sayfalarının (CSS) ortaya çıkmasıyla bu artık gerekli değildir. Bunun yerine, CSS dosyaları web sunucusunda depolanır ve HTML sayfaları, kenar boşlukları, yazı tipi boyutları ve renkleri ve daha fazlası gibi şeylerin nasıl biçimlendirileceğini belirlemek için bu dosyaları çağırır.
Ancak, tablolar veri gibi şeyleri görüntülemek için hala kullanışlıdır. Tablo eklemek için içeriğin başına şunu ekleyin:
Her satırı şununla kapat:
isim Adres Telefon numarası Ryan Dube 100 Jones Yolu; Johnson City, TN 317-555-1212
Bu, aşağıdaki gibi bir web sayfasına çıktı verecektir:
Yalnızca bu temel öğelerle, içeriğinizi internette görüntülemek için kullanışlı statik web sayfaları oluşturabilirsiniz. Herkese açık ve dünya tarafından görüntülenebilir hale getirmek istiyorsanız ihtiyacınız olan tek şey, bir web barındırma hesabı ve dosyalarınızı hesabınızın içindeki ortak klasörde saklayın.
Aslında, kendi web sitenizi başlatmak şaşırtıcı derecede kolaydır, özellikle bir içerik yönetimi kullanmayı tercih ederseniz WordPress gibi bir platform.
Nasıl
Google Chrome Önbelleği, Çerezler ve Tarama Geçmişi Nasıl Temizlenir?
Chrome, tarayıcınızın performansını çevrimiçi olarak optimize etmek için tarama geçmişinizi, önbelleğinizi ve çerezlerinizi depolama konusunda mükemmel bir iş çıkarır. Onun nasıl...
Fırsatlar
Mağaza İçi Fiyat Eşleştirme: Mağazada Alışveriş Yaparken Çevrimiçi Fiyatlar Nasıl Alınır
Mağazadan satın almak, daha yüksek fiyatlar ödemeniz gerektiği anlamına gelmez. Fiyat eşleştirme garantileri sayesinde alışveriş yaparken online indirimlerden yararlanabilirsiniz...
Nasıl
Dijital Hediye Kartı ile Disney Plus Aboneliği Nasıl Hediye Edilir
Disney Plus'tan keyif alıyorsanız ve bunu başkalarıyla paylaşmak istiyorsanız, Disney+ Gift aboneliğini nasıl satın alacağınız aşağıda açıklanmıştır...
Nasıl
Google Dokümanlar, E-Tablolar ve Slaytlarda Belgeleri Paylaşma Kılavuzunuz
Google'ın web tabanlı uygulamalarıyla kolayca ortak çalışabilirsiniz. Google Dokümanlar, E-Tablolar ve Slaytlar'da izinlerle paylaşma rehberiniz burada...
Abone Ol
YOU MIGHT ALSO LIKE
