HTML Nedir?

10 Ağustos 2021
Markethinkers
HTML Nedir?

Sanal ortamın prensipleri ve işleyişi, hâlâ pek çok kullanıcı tarafından bir muammadan ibarettir. Fakat geliştirici ya da en azından e-ticaret sitesi sahibi iseniz, birtakım kodların sihrine şahit olmuş olabilirsiniz. Kullanılan uygulamalar ve bu uygulamalar aracılığıyla kullanıcıların ekranına aktarılan hemen her şey kodlar ile var olur. Özellikle internet ortamı ve tarayıcı ekranları düşünüldüğünde ise en temel dinamik, HTML kodlarıdır.

HTML Nedir?

HTML kod, kısaca “standart bir metin işaretleme dili” şeklinde tanımlanabilir. 90’lı yıllarda ortaya çıktığı bilinen bu dijital dil, hiç şüphesiz internetin bugünkü işlevlerinin pek çoğunun temelini atmaya yardımcı olmuştur. Evrensel açılımı “Hypertext Markup Language” şeklindedir ve Türkçe karşılık olarak “Hipermetin İşaretleme Dili” ya da “Köprü Metni Biçimlendirme Dili” tabiri kullanılır.

Hipermetin, bilgisayar gibi elektronik cihazların ekranında görüntülenen bir çeşit belge olarak tanımlanabilir. Sadece yazıdan ibaret değildir ve video, fotoğraf, tablo gibi içerikleri de kapsar. Ayrıca sayfalar ve web siteler arasında köprü görev de görür. Hipermetin İşaretleme Dili ise bu hipermetinleri hazırlamak için kullanılan kodlardan oluşan bir dildir. Sürekli geliştirilen bu dilin güncel olarak kullanılan son sürümü HTML5’tir.

Dijital kodların yeni programlar yazmak ve çalıştırmak için kullanıldığı da doğrudur fakat HTML özellikleri itibariyle böyle bir işlevi yerine getiremez. Örneğin HTML kod yazma işlemi ile bir tarayıcı uygulaması yapılamaz ama o tarayıcının ekranında gösterilecek tüm içerikler hazırlanabilir. Bu nedenle bir programlama dili değil, işaretleme dilidir.

HTML Ne İşe Yarar?

HTML kodu; Chrome, Safari, Firefox, Explorer gibi web tarayıcılarının okuyup anlamlandırabildiği bir dildir. Bu dil de tarayıcılar ve “www” ile birlikte hayatımıza girmiştir ve bu sistemin temel iskeletini oluşturur. Kısaca HTML site kodu olarak kullanılır. Yani bir web sitesi yapmaya yarar.

E-ticaret, blog, kurumsal ya da kişisel fark etmeksizin tüm web sitelerin temel iskeletini bu işaretleme dili oluşturur. Birtakım etiketlerden oluşan bu kod dizisi, dinamikten ziyade statik bir web sitesi hazırlamaya yardımcı olur. CSS ve JavaScript kodlarının da eklenmesi ile bu statik web sitesi, dinamik bir siteye dönüştürülebilir. HTML, asıl altyapıyı oluşturmaya yarar.

HTML Nasıl Öğrenilir?

HTML öğrenmek, dijital dünyada iş yapmak isteyenlerin en çok ihtiyaç duydukları eğitimlerden biridir. Front-end geliştiricisi, içerik yöneticisi; sitesini yöneten bir web, blog ya da e-ticaret sitesi sahibi olmak istiyorsanız, bu dili bilmeniz son derece önemlidir. Peki HTML en kolay nasıl öğrenilir?

Kod yazmak aktif bir işlem olduğu için en etkili yöntem, uygulamalı öğrenmektir. Sadece okuyarak ya da video izleyerek tam anlamıyla öğrenmeniz çok zordur. Bunun yerine her öğrendiğiniz adımı uygulamalı olarak pratiğe dökmeniz gerekmektedir. Bu yöntem, HTML hakkında öğrendiklerinizin kalıcı olmasına ve sonrasında gelişmenize de yardımcı olur.

Hipermetin işaretleme dilini öğrenebilmeniz için internet ortamında, ücretli ve ücretsiz çok sayıda kaynak bulabilirsiniz. Eğitimin ücretli ya da ücretsiz olmasından ziyade eğitimi veren kişinin bilgisi, deneyimleri ve eğitim sürecinin işlevselliği önemlidir. Öncesinde işaretleme dilinin ne olduğunu ve ne işe yaradığını araştırıp öğrenmeniz ise başlangıç için önemlidir.

HTML Nerelerde Kullanılır?

HTML kodlarının en çok kullanıldığı yer, site kurma sürecidir. Bir site üzerindeki hemen her detay, bu kodların yardımı ile şekillenir. Site içeriklerinin temel dinamikleri arasında bulunan başlıkları, paragrafları, metinleri, görselleri ve yapı profillerini oluşturmak ve konumlandırmak için kullanılır.

Site üzerindeki bir yazılı içeriğin hem okunabilirliğini hem de SEO uyumluluğunu artırmak için bu kodlar ciddi bir önem taşır. Metin içerisinde yer alan ana başlıklar, alt başlıklar, bullet pointler, kalın ve italik kelimeler, bu kodlar ile işaretlenir. Ayrıca yazılı içeriğe ek olarak eklenen tablolar ve görsellerin konumlandırması da yine kod eklenerek ayarlanır.

Bir görselin, videonun ya da herhangi bir materyalin web sitesinde yer alması, doğru yerde durması ve kullanıcıya doğru bir şekilde gösterilmesi, başına ve sonuna eklenen HTML etiketlerine bağlıdır. İşaretleme kodları, buton ve arka plan renklendirmesi için de yardımcı olur. Ve site içerisine eklenen tüm bu detaylar hakkında arama motorlarına bilgi vermek de HTML kodlarının görevidir.

HTML Yazarken Nelere Dikkat Edilmelidir?

HTML kodları ve anlamlarını bilmek, yazma sürecine başlamadan önce dikkat edilmesi gereken bir detaydır. Çünkü yapılan bir hatanın sayfalarca kodu kullanılamaz hâle getirmesi de muhtemeldir. Bununla birlikte kullanıcı deneyimini olumsuz etkileyecek sonuçlar da doğurabilir. Kod yazarken dikkat edilmesi gereken detaylardan bazıları ise şöyledir:

  • Kodlara, “tag” yani etiketler ile komut verilir.
  • Etiketler, “< >” şeklindeki küçüktür ve büyüktür işaretleri arasına yazılır.
  • Etiket açmak için gerekli kod, “< >” işaretleri arasına yazılır ve açılan etiketin kapatılması gerekir.
  • Etiketin kapatılması için “< >” işaretleri arasındaki kodun başına “/” şeklindeki “slash” işareti konur.
  • Kodlar arası metinlerde Türkçe karakter yer alabilirken kodlarda yer almaz.
  • Kodlar çoğunlukla küçük harflerle yazılır.

En Çok Kullanılan HTML Kodları Hangileridir?

HTML zengin bir dildir fakat bazı kodlar çok sık kullanılır. Çünkü hemen her sitede mutlaka olması gereken kodlar vardır. En çok kullanılan HTML kod örneklerine göz atmak gerekirse, “body, head, title” gibi terimlerle karşılaşmak olasıdır. Dolayısıyla bunları bilmek, yazma sürecinde önemli bir şekilde pratiklik kazandırır.

<!DOCTYPE html>

“DOCTYPE” etiketi, kodlanan belgenin hangi dilde olduğunu bildirmek için kullanılır. Yanına “html” etiketini de eklemek, sayfanın HTML5 ile hazırlandığını gösterir. Belgeye başlanırken yazılan ilk kod etiketidir.

<html>

Bu etiket, belgenin kök etiketi olarak kabul edilir. HTML kaynak dokümanı yaratmak için kullanılır ve belgenin içerdiği tüm kodlar, bu etiketin içerisinde yer alır. Belge bu kodun kapatılması ile sonlanır.

<head>

Hazırlanan belge ya da sayfanın genel bilgileri, bu etiketin arasına yazılır. Söz konusu bilgiler dil, başlık vb. şeklindedir. Bu etikete yazılan kodlar, sayfada görüntülenmez ve kullanıcıya gösterilmez.

<body>

Sayfanın içeriğini oluşturan kodların yazıldığı etikettir. Belgenin görünen kısmını içerir. Bu etikete metin, paragraf, görsel gibi içerikler ile ilgili kodlar yazılır.

<title>

Belge, sayfa ya da web sitesi için başlık oluşturan etikettir. Tarayıcının en üst kısmında görünen başlığı oluşturmak için kullanılır. <head> etiketlerinin arasına yerleştirilmesi gerekir.

<button>

Hemen her web sayfasının olmazsa olmazları arasında yer alan butonlar, bu etiket ile oluşturulur. Tıklanabilir bir buton yaratmak için kullanılan etikettir.

<img>

Sayfaya resim eklemek için kullanılan <img> etiketi, diğer etiketlerden farklı çalışır. Çünkü sadece açılan bir etikettir ve </img> şeklinde kapanması söz konusu değildir. Bu etikette ayrıca “src” ve “alt” nitelikleri de yer alır. “alt” görüntülenemeyen resimler için alternatif bir metin içerirken “src”, görselin yolunu gösterir.

<a>

Bağlantı ya da köprü etiketi olarak adlandırılmakla birlikte en önemli etiketlerden biri olarak kabul edilir. Kelime ve kelime gruplarının tıklanabilir bir bağlantıya dönüşmesini sağlar. Bu sayede sayfalar ve siteler arasında bir köprü görevi görür.

<hX>,

Metin içeriklerinin okunabilirliğini artırmak için <hX> etiketi kullanılır. Bu bir başlık etiketidir ve “x” yerine bir sayı yazılarak başlığın önceliği ve görünümü ayarlanabilir. Örneğin <h1> birinci başlık, <h2> ikinci başlık, <h3> ise üçüncü başlıktır.

<p>, <div>

Yine yazılı içeriklerde kullanılan <p> etiketi, metni paragraflara ayırmaya yarar. <div> ise belgenin birden çok paragraf içeren belirli bir bölümünün biçimlendirilmesinde kullanılır.

<form>, <frameset>, <table>

Bu etiketler web sitesinin her sayfasında kullanılmasa da içeriğin görünümünü özelleştirmek için etkilidir. <form> etiketi form, <frameset> etiketi çerçeve, <table> etiketi ise tablo hazırlamak için kullanışlıdır.

IdeaSoft akıllı e-ticaret paketleri ile kendi e-ticaret sitenizi kurabilir, internetten satış yapabileceğiniz online mağazanızı açabilirsiniz. Hemen başvurarak 15 gün boyunca altyapımızı ücretsiz olarak deneyebilirsiniz.

En çok okunan yazılar

Yorum yap

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Benzer yazılar

E-ticarette ürün fotoğrafları neden kaliteli olmalı?
E-ticarette ürün fotoğrafları neden kaliteli olmalı?
Ürün fotoğrafları, e-ticarette ürüne olan ilgiyi ve güveni artırma konusunda da bir görev üstlendikleri için de kalite bu noktada önemli bir konudur. Ürünlerinizi tüketicilere doğru bir şekilde tanıtmanın yanı sıra bu...
3 Temmuz 2020
Sinan Oypan
Reklam videoları hazırlarken nelere dikkat etmelisiniz?
Reklam videoları hazırlarken nelere dikkat etmelisiniz?
Reklam videoları günümüzde kullanıcılara tarafından daha çok etkileşim aldığı için e-ticaret firmalarınca da sıklıklı kullanılmakta. Eskiden video reklamlar sadece televizyon ekranlarında görülebilmekteyken, gelişen teknoloji...
2 Mayıs 2020
Sinan Oypan
Logo tasarımı yapmak için kullanabileceğiniz 7 araç
Logo tasarımı yapmak için kullanabileceğiniz 7 araç
Kendi işinizi kurarken bir kurumsal kimliğe ihtiyacınız olur. Logo tasarımı da bu kurumsal kimliğin bir parçasıdır. Tasarımı doğru yapılmış bir logo marka bilinirliğini tüketicilerin hafızalarına yerleştirirken, markanızın...
14 Kasım 2017
Sinan Oypan
E posta gönderim sıklığı ne olmalıdır?
E posta gönderim sıklığı ne olmalıdır?
E posta gönderim sıklığı; E-posta pazarlama yaparken, firmaların en sık sordukları sorulardan birisidir. E-ticaret firmalarına oldukça yüksek oranda geri dönüşüm sağladığı için, e-ticaret firmaları her fırsatta e-posta...
14 Ağustos 2016
Sinan Oypan
Facebook reklam hataları ve kaçınma yöntemleri
Facebook reklam hataları ve kaçınma yöntemleri
Facebook reklamları, günümüzde sosyal medya pazarlama çalışmalarında en sık kullanılan reklam türleri arasında yer alıyor. Geniş kitlelere ulaşma fırsatının yanı sıra birçok farklı reklam modelinin olması, Facebook...
12 Mart 2019
Sinan Oypan
Long tail keywords SEO ile e-ticaret sitenizin trafiğini arttırma
Long tail keywords SEO ile e-ticaret sitenizin trafiğini arttırma
Long tail keywords SEO ile e-ticaret sitenizin trafiğini nasıl arttırabilirsiniz, Long Tail Keywords SEO'da dikkat edilmesi gerekener ve daha fazlası bu yazımızda. Long Tail Keywords SEO Arama motoru optimizasyonu e-ticaret siteleri...
6 Mart 2018
Sinan Oypan
DDoS saldırıları sonrasında sitenizde satışlara tekrar başlarken neler yapmalısınız?
DDoS saldırıları sonrasında sitenizde satışlara tekrar başlarken neler yapmalısınız?
Geçtiğimiz günlerde internet alan adı sistemlerinin büyük birçoğunluğunu kontrol eden Dyn büyük bir DDoS saldırısına uğramıştı ve Twitter, Netflix, CNN, Reddit ve hem Avrupa’da hem de Amerika’da bunun gibi birçok firma bu...
27 Ekim 2016
Sinan Oypan
Büyük firmalarla rekabet etmek için neler yapmanız gerekiyor?
Büyük firmalarla rekabet etmek için neler yapmanız gerekiyor?
E-ticaret sektörünün büyümesi ve kullanıcıların online alışverişe daha fazla yönlenmeye başlaması haliyle sektörde büyük bir rekabet ortamının oluşmasına neden oldu. Birçok firma kendi e-ticaret sitesi üzerinden satış...
29 Mart 2018
Sinan Oypan
Trafik analizinde yeni ve geri dönen kullanıcılar ne ifade eder, bu metrik hakkında bilmeniz gerekenler
Trafik analizinde yeni ve geri dönen kullanıcılar ne ifade eder, bu metrik hakkında bilmeniz gerekenler
E-ticaret sitelerinin trafik analizinde üzerinde durulması gereken metriklerden biri de yeni ve geri dönen kullanıcılardır. Bu metrik, web site trafiğinizin hangi kitlelere ulaştığını ve sadık kullanıcı oranlarını belirlemenizde...
25 Nisan 2018
Sinan Oypan
Küçük firmalar büyük firmalarla olan rekabetle nasıl baş edebilirler?
Küçük firmalar büyük firmalarla olan rekabetle nasıl baş edebilirler?
E-ticarette küçük ve orta ölçekli firmaların en çok sıkıntı yaşadıkları durumlardan biri de sektörün bilinen ve büyük markalarıyla rekabet etmek oluyor. Büyük firmalar, marka bilinirlikleri, bütçeleri, ulaştıkları hedef...
16 Ocak 2017
Sinan Oypan
Ürün fotoğraf çekimi yaparken dikkat etmeniz gerekenler
Ürün fotoğraf çekimi yaparken dikkat etmeniz gerekenler
Ürün fotoğraf çekimi, tüketicilerin satın alma kararlarını etkileme ve e-ticaret sitelerinde ürünleri öne çıkartma sürecinde önemli konulardan biri. Ürün fotoğrafları, e-ticaret sitelerinin vitrinlerindeki ürünleri gösterir...
28 Nisan 2020
Sinan Oypan
E-ticaret sitenizde canlı destek sistemi kullanmak neden önemli
E-ticaret sitenizde canlı destek sistemi kullanmak neden önemli
Canlı destek sistemi son yıllarda e-ticaret sitelerinde müşteri desteği konusunda firmalara birçok avantaj ve kolaylık sağlıyor. Canlı destek kullanımı firmalara yarar sağladığı gibi siteyi ziyaret eden kullanıcıların da satış...
3 Ocak 2018
Sinan Oypan
E-ticareti Ücretsiz Deneyin