Basit HTML Kodlar

HTML (Hyper Text Markup Language) arayüz – işaretleme dilidir. Bir yazılım dili demek pek doğru olmaz. Javascript, PHP, C#, C++ veya Python gibi bir programlama dili değildir. O yüzden sadece bu dili bilenler, yazılım dili biliyorum diye avunmayın. 🙂 Biran önce bir yazılım dili öğrenmeye başlayın bakalım.

HTML ile hazırladığımız sayfaları .html veya .htm uzantısıyla kaydedip, tarayıcılarda doğrudan açabiliriz. HTML ile yazılan kodlara etiket ismini veriyoruz. Bu yazımızda temel yapı taşları, sıkça kullanılan etiketleri göreceğiz.

<Title> </title>

<title> ... Başlık ... </title>

Başlık eklemek, daha doğrusu oluşturduğumuz sayfanın adını belirtmek için kullanılır. Bir paragrafın başlığı için kullanılmaz.

Yorum Satırı Eklemek

<! — … — >

HTML sayfalarda sadece bizim görebileceğimiz veya tarayıcıda “Sayfa Kaynağını Gör” alanıyla inceleyenlerin görebileceği temel satır ve bilgileri yorum etiketiyle yazarız. Bunun için <! — … — > kod yapısını kullanırız.

Temel Yapı ve Etiketler

Tıpkı makale yazar gibi kod yazmanında “Giriş, Gelişme, Sonuç” mantığı vardır. Edebiyat gibi kod yazmak da bir sanattır. Bir sayfa hazırladığımızda aşağıdaki dizilime dikkat etmemiz ve uymamız gerekir.

<html>
<head>
<title> Web Site Adı</title>
</head>

<! — Gövde Kısmı — >
<body>


</body>
</html>

Resim Ekleme

<img src="resim.png" alt="resim açıklaması" title="Resim Adı"/>

Görüntülenmesi istenen resmin URL’sini, “SRC=” kısmı içerisine yazmamız yeterlidir.

Not: Resimlere boyut ve çeşitli stiller tanımlamak için bir başka arayüz dili olan CSS’ten faydalanmamız gerekiyor. Bir başka makalede ondan da bahsederiz.

Video Ekleme

<video src="video.mp4" poster="gorsel.jpg" controls> </video>

Bağlantı Verme (Link/Köprü Oluşturma)

<a href="websiteadresi/url"> Görüntülenecek İsim </a>

Örnek: Bu bir bağlantıdır.

Paragraf Ekleme

<p> … </p>

Metinsel Paragraf Başlığı Ekleme

<h1> … </h1>

Ana başlıkları <h1> etiketi ile, alt başlıkları ise <h2>, <h3>, <h4> … şeklinde listeleyebiliriz. Ayrıca SEO açısında yazı başlığı dışındaki başlıkları <h1> yapmamanızı öneriyorum.

Çizgi Ekleme

<hr>

Boşluk Ekleme

<br>

Tablo Ekleme

<table> 
<tr>
<td> ... </td>
</tr>
</table>

Satırlar için <tr>, sutunlar için <td>eklememiz gerekiyor.

HTML ile onlarca etiket kullanabilirsiniz. Bu makalede her birine detaylıca girmeye gerek görmüyorum. Çünkü yalnızca HTML ve CSS konusunda gerçekten faydalı kaynaklar mevcut. Onları inceleyerek hem örneklerle, hem canlı düzenlemelerle bu etiketleri öğrenebilirsiniz.

Sorunuz mu var?

HTML etiketleri ve kodlaması hakkında yardıma ihtiyacınız varsa iletişim kurmaktan veya yorumlarda belirtmekten çekinmeyin. Elimden geldiğince yardımcı olmaya çalışırım.

Sosyal Ağ ve Kanallardan

Bizi Takip Edin

Bizi Facebook, Twitter, Instagram ve Linkedin hesaplarından takip edebilirsiniz.

0 0 Değerlendir
Makale Değerlendirmesi

Abone Ol
Bildir
guest
0 Yorum
Inline Feedbacks
Tüm yorumları görüntüle
0
Would love your thoughts, please comment.x
()
x
WeCreativez WhatsApp Support
Müşteri destek ekibimiz sorularınızı yanıtlamak için burada. Lütfen sorunuzu iletiniz.
👋 Merhaba, nasıl yardımcı olabilirim?
Shopping Cart