HTML Dersleri

HTML Formlar Nedir?

eminbasbayan

eminbasbayan

2 dk okuma
HTML Formlar Nedir?
🔍 Büyütmek için tıklayın

HTML formlar, kullanıcıdan bilgi alıp bunu bir sunucuya göndermek için kullanılan en önemli araçlardan biridir. Bu yazıda, bir formun temel yapısını ve nasıl çalıştığını öğrenmek için adım adım ilerleyeceğiz.

1. Form Nedir ve Neden Kullanılır?

Form, kullanıcıdan alınan bilgilerin (örneğin metin, şifre, seçimler) bir sunucuya gönderilmesi için kullanılan bir HTML elementidir. Formlar, bir web sitesindeki etkileşimli özelliklerin temelini oluşturur.

Bir formun ana görevi şudur:

  • Kullanıcı girişlerini toplamak: Örneğin, ad, e-posta, şifre gibi bilgiler.
  • Verileri bir sunucuya göndermek: Formun gönderildiği sunucu, bu verileri işler.
html-formhtml-form

2. Formun Temel Yapısı

Bir form, <form> etiketiyle tanımlanır. Ancak, <form> etiketi yalnızca bir kapsayıcıdır; kendi başına bir şey göstermez. Formun içinde çeşitli giriş elemanları (örneğin metin kutuları, butonlar) bulunur.

Temel Form Örneği

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Form Örneği</title> </head> <body> <h1>Kullanıcı Bilgi Formu</h1> <form action="/submit-data" method="GET"> <label for="name">Adınız:</label> <input type="text" id="name" name="user_name"> <br> <label for="email">E-posta:</label> <input type="email" id="email" name="user_email"> <br> <button type="submit">Gönder</button> </form> </body> </html>

Çıktı

Kullanıcı, adını ve e-posta adresini yazabilir ve "Gönder" butonuna basarak verilerini /submit-data adresine gönderebilir.

3. Önemli Form Özellikleri

3.1. action

action özelliği, form verilerinin nereye gönderileceğini belirtir. Örneğin:

  • action="/submit-data": Veriler sunucuda /submit-data adresine gönderilir.

3.2. method

method özelliği, verilerin nasıl gönderileceğini belirtir. İki yaygın yöntem vardır:

  • GET: Veriler URL’de görünür. Genellikle arama formları için kullanılır.
  • POST: Veriler gizli olarak gönderilir. Daha güvenlidir ve büyük veri gönderiminde kullanılır.

4. Form Çalışma Mantığı

Bir form gönderildiğinde şu süreç gerçekleşir:

  1. Kullanıcı veriyi doldurur: Örneğin, adını ve e-posta adresini girer.
  2. Form sunucuya istekte bulunur: Belirtilen action URL’sine bir HTTP isteği gönderilir.
  3. Sunucu isteği işler: Örneğin, bilgileri bir veritabanına kaydeder.
  4. Sunucu cevap döner: Başarılı bir mesaj veya başka bir sayfa döner.

GET ve POST Örnekleri

  • GET: URL şu şekilde görünür:

    /submit-data?user_name=Ali&user_email=ali@example.com
  • POST: Veriler gizli gönderilir; URL değişmez.

5. Formların Kullanıldığı Alanlar

Formlar birçok farklı amaçla kullanılabilir:

  • Arama formları: Kullanıcıların bir sitede arama yapmasını sağlar.
  • Kayıt ve giriş formları: Kullanıcı bilgilerini alır ve doğrular.
  • Anket formları: Farklı türde sorularla veri toplar.

Sonuç

Formlar, web uygulamalarında etkileşim sağlamak için vazgeçilmezdir. Formun temel yapısını anlamak, daha karmaşık uygulamalara geçmeden önce sağlam bir temel oluşturur. Bir sonraki adımda, form içindeki farklı giriş elemanlarını keşfedeceğiz.

Etiketler

#Eğitimler#HTML Dersleri

İlgili Yazılar

Bu konuyla ilgili diğer yazılarımızı da inceleyebilirsiniz

HTML: Web Sayfalarının Temel Yapı Taşı
Genel

HTML: Web Sayfalarının Temel Yapı Taşı

HTML (HyperText Markup Language), bir web sayfasının temel yapı taşını oluşturan ve içeriğin yapısını belirleyen bir işaretleme dilidir. Web geliştirme dünyasında, HTML, bir web sayfasındaki her şeyin "ne" olduğunu tanımlamak için kullanılır. Örneğin, bu bir

3 dk
HTML'de Paragraf Etiketi (P Tag)
Genel

HTML'de Paragraf Etiketi (P Tag)

HTML, web sayfalarının temel yapı taşlarını oluşturan birçok öğeye sahiptir. Bu öğelerden biri de **paragraf etiketi** ya da yaygın bilinen adıyla **P tag**'dir. Paragraf etiketi, genellikle bir metin paragrafını ifade etmek için ku

3 dk
HTML Başlık Etiketleri (H1-H6)
Genel

HTML Başlık Etiketleri (H1-H6)

HTML'de başlık etiketleri, bir web sayfasının içeriğini hiyerarşik bir şekilde düzenlemek ve anlamlı bir yapı kazandırmak için kullanılır. Bu etiketler, **H1**'den **H6**'ya kadar sıralanır ve her biri farklı bir ö

3 dk
HTML İskeleti ve Boilerplate
Genel

HTML İskeleti ve Boilerplate

HTML belgeleri oluştururken, her sayfanın doğru ve geçerli bir yapı kullanması gereklidir. Şimdiye kadar yazılmış HTML kodları genellikle geçici olarak çalışsa da, **HTML iskeleti** olmadan bir belge teknik olarak geçersizdir. Bu yazıda, HTML'in

3 dk
HTML’de Listeler: Ordered List (OL) ve Unordered List (UL)
Genel

HTML’de Listeler: Ordered List (OL) ve Unordered List (UL)

HTML, web sayfalarındaki bilgileri düzenli ve anlaşılır bir şekilde sunmak için listeleme özellikleri sunar. **Ordered List (OL)** ve **Unordered List (UL)**, HTML’de kullanılan iki ana liste türüdür. Bu yazıda, bu liste türlerinin

3 dk
HTML Anchor (Bağlantı) Etiketi
Genel

HTML Anchor (Bağlantı) Etiketi

Web sayfalarının temel yapı taşlarından biri olan **anchor (a)** etiketi, bağlantı oluşturmak için kullanılır. Bu etiket, başka bir web sayfasına, bir e-posta adresine, bir dosyaya veya aynı sayfanın bir bölümüne bağlantı kurmanızı sağlar. Bu yazıda, anchor etike

3 dk