<![CDATA[Genel Paylaşım Forumu ,Türkçe Forum Sitesi, Güncel Forumlar - HTML]]> https://www.forumteams.com/ Wed, 17 Jun 2026 10:00:41 +0000 MyBB <![CDATA[HTML Nedir Ve Ne İşe Yarar?]]> https://www.forumteams.com/konu-html-nedir-ve-ne-ise-yarar.html Sat, 04 Oct 2025 18:13:31 +0000 Açelya]]> https://www.forumteams.com/konu-html-nedir-ve-ne-ise-yarar.html HTML Nedir? (HyperText Markup Language)
HTML, "Köprü Metni İşaretleme Dili" anlamına gelir. Bir programlama dili değil, işaretleme dilidir.
Basit bir benzetme: Bir web sayfasını bir insan vücudu olarak düşünün:
  • HTML = İskelet (Temel yapı ve içerik)
  • CSS = Kaslar ve deri (Görünüm ve stil)
  • JavaScript = Beyin (Etkileşim ve dinamik davranış)
HTML Ne İşe Yarar? (Temel Görevleri)
1. İçerik Yapısı Oluşturur
  • Metinleri başlık, paragraf, liste olarak düzenler
  • Görseller, videolar, linkler ekler
  • Tablolar ve formlar oluşturur
2. Semantik (Anlamsal) Yapı Sağlar
html
<header>Üst kısım</header>
<nav>Menü</nav>
<main>Ana içerik</main>
<article>Makale</article>
<footer>Alt kısım</footer>
3. Diğer Teknolojilerle Entegre Çalışır
  • CSS ile stil eklenir
  • JavaScript ile etkileşim eklenir
Basit HTML Kodu Örneği
html
<!DOCTYPE html>
<html>
<head>
    <title>Benim İlk Web Sayfam</title>
</head>
<body>
    <h1>Hoş Geldiniz!</h1>
    <p>Bu benim ilk HTML sayfam.</p>
    <img src="resim.jpg" alt="Açıklayıcı yazı">
    <a href="https://www.google.com">Google'a Git</a>
</body>
</html>
En Sık Kullanılan HTML Etiketleri


Etiket
Açıklama
Kod:
<h1>-<h6>
Başlıklar
Kod:
<p>
Paragraf
Kod:
<a>
Link
Kod:
<img>
Resim
Kod:
<div>
Bölüm
Kod:
<span>
Satır içi bölüm
Kod:
<ul>
,
Kod:
<ol>
,
Kod:
<li>
Listeler
Kod:
<table>
Tablo
Neden Önemli?
  1. Tüm Web'in Temeli: Her web sitesi HTML içerir
  2. SEO Dostu: Arama motorları HTML yapısını anlar
  3. Erişilebilirlik: Engelli kullanıcılar için önemli
  4. Tarayıcı Uyumluluğu: Tüm tarayıcılar HTML'yi anlar
Özetle:
HTML, web sayfalarının temel yapı taşıdır. İçeriği düzenler, yapılandırır ve anlamlandırır. Web geliştirmeye başlamak istiyorsanız, ilk öğrenmeniz gereken dildir!
HTML öğrenmek sandığınızdan daha kolay. Basit metin editörleriyle bile çalışmaya başlayabilirsiniz]]> HTML Nedir? (HyperText Markup Language)
HTML, "Köprü Metni İşaretleme Dili" anlamına gelir. Bir programlama dili değil, işaretleme dilidir.
Basit bir benzetme: Bir web sayfasını bir insan vücudu olarak düşünün:
  • HTML = İskelet (Temel yapı ve içerik)
  • CSS = Kaslar ve deri (Görünüm ve stil)
  • JavaScript = Beyin (Etkileşim ve dinamik davranış)
HTML Ne İşe Yarar? (Temel Görevleri)
1. İçerik Yapısı Oluşturur
  • Metinleri başlık, paragraf, liste olarak düzenler
  • Görseller, videolar, linkler ekler
  • Tablolar ve formlar oluşturur
2. Semantik (Anlamsal) Yapı Sağlar
html
<header>Üst kısım</header>
<nav>Menü</nav>
<main>Ana içerik</main>
<article>Makale</article>
<footer>Alt kısım</footer>
3. Diğer Teknolojilerle Entegre Çalışır
  • CSS ile stil eklenir
  • JavaScript ile etkileşim eklenir
Basit HTML Kodu Örneği
html
<!DOCTYPE html>
<html>
<head>
    <title>Benim İlk Web Sayfam</title>
</head>
<body>
    <h1>Hoş Geldiniz!</h1>
    <p>Bu benim ilk HTML sayfam.</p>
    <img src="resim.jpg" alt="Açıklayıcı yazı">
    <a href="https://www.google.com">Google'a Git</a>
</body>
</html>
En Sık Kullanılan HTML Etiketleri


Etiket
Açıklama
Kod:
<h1>-<h6>
Başlıklar
Kod:
<p>
Paragraf
Kod:
<a>
Link
Kod:
<img>
Resim
Kod:
<div>
Bölüm
Kod:
<span>
Satır içi bölüm
Kod:
<ul>
,
Kod:
<ol>
,
Kod:
<li>
Listeler
Kod:
<table>
Tablo
Neden Önemli?
  1. Tüm Web'in Temeli: Her web sitesi HTML içerir
  2. SEO Dostu: Arama motorları HTML yapısını anlar
  3. Erişilebilirlik: Engelli kullanıcılar için önemli
  4. Tarayıcı Uyumluluğu: Tüm tarayıcılar HTML'yi anlar
Özetle:
HTML, web sayfalarının temel yapı taşıdır. İçeriği düzenler, yapılandırır ve anlamlandırır. Web geliştirmeye başlamak istiyorsanız, ilk öğrenmeniz gereken dildir!
HTML öğrenmek sandığınızdan daha kolay. Basit metin editörleriyle bile çalışmaya başlayabilirsiniz]]> <![CDATA[Html Ile Tablolarda Başlıklar]]> https://www.forumteams.com/konu-html-ile-tablolarda-basliklar.html Wed, 08 Jan 2025 18:33:58 +0000 uzman]]> https://www.forumteams.com/konu-html-ile-tablolarda-basliklar.html
Kod:
<table border="1">
<tr>
<th>Başlık</th>
<th>Başka Başlık</th>
</tr>
<tr>
<td>Satır 1, Hücre 1</td>
<td>Satır 1, Hücre 2</td>
</tr>
<tr>
<td>Satır 2, Hücre 1</td>
<td>Satır 2, Hücre 2</td>
</tr>
</table>
]]>
Kod:
<table border="1">
<tr>
<th>Başlık</th>
<th>Başka Başlık</th>
</tr>
<tr>
<td>Satır 1, Hücre 1</td>
<td>Satır 1, Hücre 2</td>
</tr>
<tr>
<td>Satır 2, Hücre 1</td>
<td>Satır 2, Hücre 2</td>
</tr>
</table>
]]> <![CDATA[Html Img - Html Resim]]> https://www.forumteams.com/konu-html-img-html-resim.html Sat, 02 Mar 2024 15:52:26 +0000 Joker’s Grin]]> https://www.forumteams.com/konu-html-img-html-resim.html src - resmin yolunu veya linkini ister

style - resme custom CSS özellikleri vermemizi sağlar

width - resmin genişliğini ayarlamanızı sağlar

height - resmin yüksekliğini ayarlamanızı sağlar

Kod:
<img style="display: block" width="150px" height="50px" src="resim.jp"></img>
]]> src - resmin yolunu veya linkini ister

style - resme custom CSS özellikleri vermemizi sağlar

width - resmin genişliğini ayarlamanızı sağlar

height - resmin yüksekliğini ayarlamanızı sağlar

Kod:
<img style="display: block" width="150px" height="50px" src="resim.jp"></img>
]]> <![CDATA[HTML Dersleri #1 | Temel HTML Yapısı]]> https://www.forumteams.com/konu-html-dersleri-1-temel-html-yapisi.html Sat, 02 Mar 2024 15:50:42 +0000 Joker’s Grin]]> https://www.forumteams.com/konu-html-dersleri-1-temel-html-yapisi.html HTML Dersleri #1 | Temel HTML Yapısı

HTML Dersi 1: Temel HTML Yapısı ve Bir HTML Belgesi Oluşturma

HTML, web sayfalarının yapısal temelini oluşturan bir işaretleme dilidir. HTML belgeleri, metin, bağlantılar, resimler ve diğer medya öğeleri gibi içerikleri organize etmek ve tarayıcılar tarafından doğru şekilde görüntülenmelerini sağlamak için kullanılır.

1. Temel HTML Yapısı
HTML belgeleri, aşağıdaki temel yapısına sahiptir:

Kod:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- Sayfa içeriği buraya eklenecek -->
</body>
</html>
]]> HTML Dersleri #1 | Temel HTML Yapısı

HTML Dersi 1: Temel HTML Yapısı ve Bir HTML Belgesi Oluşturma

HTML, web sayfalarının yapısal temelini oluşturan bir işaretleme dilidir. HTML belgeleri, metin, bağlantılar, resimler ve diğer medya öğeleri gibi içerikleri organize etmek ve tarayıcılar tarafından doğru şekilde görüntülenmelerini sağlamak için kullanılır.

1. Temel HTML Yapısı
HTML belgeleri, aşağıdaki temel yapısına sahiptir:

Kod:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- Sayfa içeriği buraya eklenecek -->
</body>
</html>
]]> <![CDATA[Sitenize HTML Bakım Sayfası Kodu ( BASİT )]]> https://www.forumteams.com/konu-sitenize-html-bakim-sayfasi-kodu-basit.html Wed, 07 Feb 2024 16:00:46 +0000 uzman]]> https://www.forumteams.com/konu-sitenize-html-bakim-sayfasi-kodu-basit.html
Kod:
<!DOCTYPE html>
<html>
<head>
    <title>Bakımdayız</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f7f7f7;
            color: #444444;
        }
        .container {
            max-width: 800px;
            margin: 0 auto;
            padding: 50px 20px;
            text-align: center;
        }
        h1 {
            font-size: 36px;
            margin-bottom: 30px;
        }
        p {
            font-size: 18px;
            margin-bottom: 20px;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Bakımdayız</h1>
        <p>Web sitemiz şu anda bakım çalışması nedeniyle kapalıdır. Kısa süre içinde yeniden aktif olacaktır.</p>
        <p>Lütfen daha sonra tekrar deneyiniz.</p>
    </div>
</body>
</html>
]]>
Kod:
<!DOCTYPE html>
<html>
<head>
    <title>Bakımdayız</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f7f7f7;
            color: #444444;
        }
        .container {
            max-width: 800px;
            margin: 0 auto;
            padding: 50px 20px;
            text-align: center;
        }
        h1 {
            font-size: 36px;
            margin-bottom: 30px;
        }
        p {
            font-size: 18px;
            margin-bottom: 20px;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Bakımdayız</h1>
        <p>Web sitemiz şu anda bakım çalışması nedeniyle kapalıdır. Kısa süre içinde yeniden aktif olacaktır.</p>
        <p>Lütfen daha sonra tekrar deneyiniz.</p>
    </div>
</body>
</html>
]]> <![CDATA[Özel Yapılmış 404 Hata Sayfası (HTML)]]> https://www.forumteams.com/konu-ozel-yapilmis-404-hata-sayfasi-html.html Mon, 25 Sep 2023 19:45:16 +0000 uzman]]> https://www.forumteams.com/konu-ozel-yapilmis-404-hata-sayfasi-html.html Özel Yapılmış 404 Hata Sayfası (HTML)
Kod:
ErrorDocument 404 https://siteismi.com/404.html
[Resim: bayi8nu.png]


.rar   404 Sayfası.rar (Dosya Boyutu: 293.15 KB / İndirme Sayısı: 9) ]]> Özel Yapılmış 404 Hata Sayfası (HTML)
Kod:
ErrorDocument 404 https://siteismi.com/404.html
[Resim: bayi8nu.png]


.rar   404 Sayfası.rar (Dosya Boyutu: 293.15 KB / İndirme Sayısı: 9) ]]> <![CDATA[Html Basit Çok Yakında Sayfası Kodlarıı]]> https://www.forumteams.com/konu-html-basit-cok-yakinda-sayfasi-kodlarii.html Mon, 27 Feb 2023 17:52:23 +0000 Gece]]> https://www.forumteams.com/konu-html-basit-cok-yakinda-sayfasi-kodlarii.html çok yakında sayfası html ihtiyacımız olabilmekte. Basit ve sade şekilde kullanabileceğiniz kodları sizlerle paylaşıyorum.

Kod:
<div class="container">
  <div class="wrapper">
    <div class="content">
      <div class="item">
        <h1>ÇOK YAKINDA</h1>
        <p>Bu internet sitesi şuan bakımda...</p>
      </div>
    </div>
  </div>
</div>

CSS :

Kod:
@import url(https://fonts.googleapis.com/css?family=Montserrat);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);

h1 {
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 4em;
  color: #333;
  -webkit-text-shadow: 0 2px 1px rgba(0, 0, 0, 0.6), 0 0 2px rgba(0, 0, 0, 0.7);
  -moz-text-shadow: 0 2px 1px rgba(0, 0, 0, 0.6), 0 0 2px rgba(0, 0, 0, 0.7);
  text-shadow: 0 2px 1px rgba(0, 0, 0, 0.6), 0 0 2px rgba(0, 0, 0, 0.7);
  word-spacing: 16px;
}

p {
  font-family: 'Open Sans', sans-serif;
  font-size: 1.4em;
  font-weight: bold;
  color: #222;
  text-shadow: 0 0 40px #FFFFFF, 0 0 30px #FFFFFF, 0 0 20px #FFFFFF;
}

.container {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  background: url('');
  background-size: cover;
}

.wrapper {
  width: 100%;
  min-height: 100%;
  height: auto;
  display: table;
}

.content {
  display: table-cell;
  vertical-align: middle;
}

.item {
  width: auto;
  height: auto;
  margin: 0 auto;
  text-align: center;
  padding: 8px;
}

@media only screen and (min-width: 800px) {
  h1 {
    font-size: 6em;
  }
  p {
    font-size: 1.6em;
  }
}

@media only screen and (max-width: 320px) {
  h1 {
    font-size: 2em;
  }
  p {
    font-size: 1.2em;
  }
}
]]> çok yakında sayfası html ihtiyacımız olabilmekte. Basit ve sade şekilde kullanabileceğiniz kodları sizlerle paylaşıyorum.

Kod:
<div class="container">
  <div class="wrapper">
    <div class="content">
      <div class="item">
        <h1>ÇOK YAKINDA</h1>
        <p>Bu internet sitesi şuan bakımda...</p>
      </div>
    </div>
  </div>
</div>

CSS :

Kod:
@import url(https://fonts.googleapis.com/css?family=Montserrat);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);

h1 {
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 4em;
  color: #333;
  -webkit-text-shadow: 0 2px 1px rgba(0, 0, 0, 0.6), 0 0 2px rgba(0, 0, 0, 0.7);
  -moz-text-shadow: 0 2px 1px rgba(0, 0, 0, 0.6), 0 0 2px rgba(0, 0, 0, 0.7);
  text-shadow: 0 2px 1px rgba(0, 0, 0, 0.6), 0 0 2px rgba(0, 0, 0, 0.7);
  word-spacing: 16px;
}

p {
  font-family: 'Open Sans', sans-serif;
  font-size: 1.4em;
  font-weight: bold;
  color: #222;
  text-shadow: 0 0 40px #FFFFFF, 0 0 30px #FFFFFF, 0 0 20px #FFFFFF;
}

.container {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  background: url('');
  background-size: cover;
}

.wrapper {
  width: 100%;
  min-height: 100%;
  height: auto;
  display: table;
}

.content {
  display: table-cell;
  vertical-align: middle;
}

.item {
  width: auto;
  height: auto;
  margin: 0 auto;
  text-align: center;
  padding: 8px;
}

@media only screen and (min-width: 800px) {
  h1 {
    font-size: 6em;
  }
  p {
    font-size: 1.6em;
  }
}

@media only screen and (max-width: 320px) {
  h1 {
    font-size: 2em;
  }
  p {
    font-size: 1.2em;
  }
}
]]> <![CDATA[CSS İle Gölge Efekti Nasıl Verilir?]]> https://www.forumteams.com/konu-css-ile-golge-efekti-nasil-verilir.html Wed, 13 Jul 2022 23:02:24 +0000 uzman]]> https://www.forumteams.com/konu-css-ile-golge-efekti-nasil-verilir.html CSS ile gölge efekti sayesinde gölgeler siteye resim olarak eklenmez, kodlama ile eklenir. Bu durum siteniz için avantajlara sahiptir.

Site tasarımı ve görsellik açısından gölge efektleri çokça kullanılır. Bu efektler eskiden gölge verilen alanların kesilerek resim olarak eklenmesi şeklinde yapılıyordu. Ancak bu durumda kodlama ve arama motorları için dezavantajdır. Ayrıca resimlerin boyutu yüksek olduğundan site için dezavantajdır. Tüm bu dezavantajlardan CSS ile gölge efekti ile yararlanabilirsiniz.

CSS ile birlikte gelen text shadow özelliği ile photoshop uygulamalarındaki gibi bir gölge efekti vermek mümkündür. Text shadow ile bir veya birden fazla gölgelendirme yapmak mümkündür. gölgelerde uzaklık değerini ayarlayarak özgün çalışmalar yapılabilir.]]> CSS ile gölge efekti sayesinde gölgeler siteye resim olarak eklenmez, kodlama ile eklenir. Bu durum siteniz için avantajlara sahiptir.

Site tasarımı ve görsellik açısından gölge efektleri çokça kullanılır. Bu efektler eskiden gölge verilen alanların kesilerek resim olarak eklenmesi şeklinde yapılıyordu. Ancak bu durumda kodlama ve arama motorları için dezavantajdır. Ayrıca resimlerin boyutu yüksek olduğundan site için dezavantajdır. Tüm bu dezavantajlardan CSS ile gölge efekti ile yararlanabilirsiniz.

CSS ile birlikte gelen text shadow özelliği ile photoshop uygulamalarındaki gibi bir gölge efekti vermek mümkündür. Text shadow ile bir veya birden fazla gölgelendirme yapmak mümkündür. gölgelerde uzaklık değerini ayarlayarak özgün çalışmalar yapılabilir.]]> <![CDATA[CSS Display Kullanımı]]> https://www.forumteams.com/konu-css-display-kullanimi.html Wed, 13 Jul 2022 23:00:53 +0000 uzman]]> https://www.forumteams.com/konu-css-display-kullanimi.html CSS display kullanımı mümkündür. Bu sayede şekillerin nasıl davranacağı belirlenir.

[Resim: html-hakkinda-bilgi-html-nedir.jpg]

Kısaca özetlemek gerekirse CSS display ile html elemanında kullanılan kutu türü belirlenir. Web sitesindeki öğelerin nasıl konumlandırılacağı, sayfada görünüp görünmediği gibi özelliklerin belirlenmesi için CSS display kullanılır. Sitenin görselliği için avantajlı bir öğedir.

Html etiketleri yeni satır başlatmazlar. Aynı hizada yan yana görüntülenir. Bunu değiştirmek için CSS display kullanılır. Yükseklik ve genişlik gibi özellikleri bu şekilde kolaylıkla verebilirsiniz. Her eleman kendisine ayrılan kadar bir alan kapsayacaktır. Bir alt satıra da geçmeyecektir. Böylece sitenizdeki yazıların her biri kendi formunda olacak ve tasarıma katkı sunacaktır.]]> CSS display kullanımı mümkündür. Bu sayede şekillerin nasıl davranacağı belirlenir.

[Resim: html-hakkinda-bilgi-html-nedir.jpg]

Kısaca özetlemek gerekirse CSS display ile html elemanında kullanılan kutu türü belirlenir. Web sitesindeki öğelerin nasıl konumlandırılacağı, sayfada görünüp görünmediği gibi özelliklerin belirlenmesi için CSS display kullanılır. Sitenin görselliği için avantajlı bir öğedir.

Html etiketleri yeni satır başlatmazlar. Aynı hizada yan yana görüntülenir. Bunu değiştirmek için CSS display kullanılır. Yükseklik ve genişlik gibi özellikleri bu şekilde kolaylıkla verebilirsiniz. Her eleman kendisine ayrılan kadar bir alan kapsayacaktır. Bir alt satıra da geçmeyecektir. Böylece sitenizdeki yazıların her biri kendi formunda olacak ve tasarıma katkı sunacaktır.]]> <![CDATA[Daha İyi CSS Kodu Yazmak İçin Ne Yapmalı?]]> https://www.forumteams.com/konu-daha-iyi-css-kodu-yazmak-icin-ne-yapmali.html Wed, 13 Jul 2022 22:59:11 +0000 uzman]]> https://www.forumteams.com/konu-daha-iyi-css-kodu-yazmak-icin-ne-yapmali.html Daha iyi CSS kodu yazmak için becerilerinizi geliştirmeli, daha anlaşılır ve verimli ortaya çıkarmanız için gereklidir.

İyi bir temel atarak işe başlamak istiyorsanız CSS sıfırlama gerekir. Böylece kendi stilinizi kazandırmanız daha kolay olur. CSS’nin amacı kodlarla işi kolaylaştırmaktır. Bir kez yazılan kodlar html sayfası içinde çoğaltılarak gerekli yerlerde kullanılabilir. Ancak eğer kodlar doğru yazılmazsa işler kolaylaşmak yerine zorlaşabilir. Kodları mutlaka rastgele yazmak yerine belirli bir düzen içinde yazmalısınız. Öncelik genel ve önemli kodlarda olmalıdır.

Satır içi CSS kullanırsanız stil biçimlendirmelerini bağımsız şekilde yapamazsınız. Tasarım ve içerik için ayrı ayrı kodlar tutmalısınız. İçerik geliştirici ve tasarımcı olarak kendinizi bölebilirsiniz.]]> Daha iyi CSS kodu yazmak için becerilerinizi geliştirmeli, daha anlaşılır ve verimli ortaya çıkarmanız için gereklidir.

İyi bir temel atarak işe başlamak istiyorsanız CSS sıfırlama gerekir. Böylece kendi stilinizi kazandırmanız daha kolay olur. CSS’nin amacı kodlarla işi kolaylaştırmaktır. Bir kez yazılan kodlar html sayfası içinde çoğaltılarak gerekli yerlerde kullanılabilir. Ancak eğer kodlar doğru yazılmazsa işler kolaylaşmak yerine zorlaşabilir. Kodları mutlaka rastgele yazmak yerine belirli bir düzen içinde yazmalısınız. Öncelik genel ve önemli kodlarda olmalıdır.

Satır içi CSS kullanırsanız stil biçimlendirmelerini bağımsız şekilde yapamazsınız. Tasarım ve içerik için ayrı ayrı kodlar tutmalısınız. İçerik geliştirici ve tasarımcı olarak kendinizi bölebilirsiniz.]]> <![CDATA[HTML Hakkında Bilmedikleriniz]]> https://www.forumteams.com/konu-html-hakkinda-bilmedikleriniz.html Wed, 13 Jul 2022 22:56:29 +0000 uzman]]> https://www.forumteams.com/konu-html-hakkinda-bilmedikleriniz.html
[Resim: images.png]
  • Herhangi bir HTML eklentisine spe11check eklemeniz halinde yazım denetimi yapabilirsiniz. Metin girişi yaparken bu özellik işinizi oldukça kolaylaştırır.
  • İçerik kaynaklarınızın güvende olması çok önemlidir. Bu kaynakların başkasının eline geçmesini önlemek ya da zararlı yazılımlardan korumak için "integrity tagı" kullanabilirsiniz.
  • Köprü oluşturmak için "target tagı" kullanabilirsiniz. Bu sayede ekstra bir sayfa ya da hedefe geçiş sağlanır. İşte bu geçiş gönderme düğmeleri kullanılarak 4 farklı şekilde yapılabilir.
  • Ana "div" tagının içine "hidden" ekleyerek özelliklerin gömülü ya da izinsiz kullanımını önleyebilirsiniz.
]]>
[Resim: images.png]
  • Herhangi bir HTML eklentisine spe11check eklemeniz halinde yazım denetimi yapabilirsiniz. Metin girişi yaparken bu özellik işinizi oldukça kolaylaştırır.
  • İçerik kaynaklarınızın güvende olması çok önemlidir. Bu kaynakların başkasının eline geçmesini önlemek ya da zararlı yazılımlardan korumak için "integrity tagı" kullanabilirsiniz.
  • Köprü oluşturmak için "target tagı" kullanabilirsiniz. Bu sayede ekstra bir sayfa ya da hedefe geçiş sağlanır. İşte bu geçiş gönderme düğmeleri kullanılarak 4 farklı şekilde yapılabilir.
  • Ana "div" tagının içine "hidden" ekleyerek özelliklerin gömülü ya da izinsiz kullanımını önleyebilirsiniz.
]]> <![CDATA[Html Ile Sayfa Yönlendirme Nasıl Yapılır?]]> https://www.forumteams.com/konu-html-ile-sayfa-yonlendirme-nasil-yapilir.html Thu, 02 Dec 2021 18:21:10 +0000 şenol]]> https://www.forumteams.com/konu-html-ile-sayfa-yonlendirme-nasil-yapilir.html
Sitenizi yada sayfanızı yönlendirme yapmak için aşağıdaki kodu kullanabilirsiniz. Kod kullanımı yaparken content="5" alanındaki 5 saniye olarak geçmektedir. 

Eğer sitenize girildiğinde karşılama sayfası olup görüldükten sonra yönlendirilme yapmak istiyorsanız bu alanı 0 (sıfır) yapmanız yeterli olacaktır.

Bu kod 5 saniye sonra forumteams.com adlı siteye yönlendirmeye yarar;

Kod:
<meta http-equiv="refresh" content="5; url=https://www.forumteams.com">

Bu kod ise Girilen sayfayı hiç beklemeden yönlendirmek için;

Kod:
<meta http-equiv="refresh" content="0; url=https://www.forumteams.com">


Extra;  Utangaç

Bu kodu ise sayfayı yenilemek için kullanabilirsiniz.;

Her 30 saniyede sayfamız yenilenir.

Kod:
<meta http-equiv="refresh" content="30; url=https://www.forumteams.com">
]]>
Sitenizi yada sayfanızı yönlendirme yapmak için aşağıdaki kodu kullanabilirsiniz. Kod kullanımı yaparken content="5" alanındaki 5 saniye olarak geçmektedir. 

Eğer sitenize girildiğinde karşılama sayfası olup görüldükten sonra yönlendirilme yapmak istiyorsanız bu alanı 0 (sıfır) yapmanız yeterli olacaktır.

Bu kod 5 saniye sonra forumteams.com adlı siteye yönlendirmeye yarar;

Kod:
<meta http-equiv="refresh" content="5; url=https://www.forumteams.com">

Bu kod ise Girilen sayfayı hiç beklemeden yönlendirmek için;

Kod:
<meta http-equiv="refresh" content="0; url=https://www.forumteams.com">


Extra;  Utangaç

Bu kodu ise sayfayı yenilemek için kullanabilirsiniz.;

Her 30 saniyede sayfamız yenilenir.

Kod:
<meta http-equiv="refresh" content="30; url=https://www.forumteams.com">
]]> <![CDATA[HTML Reklam Kodu Oluşturma]]> https://www.forumteams.com/konu-html-reklam-kodu-olusturma.html Tue, 19 Oct 2021 19:00:27 +0000 şenol]]> https://www.forumteams.com/konu-html-reklam-kodu-olusturma.html
HTML Resim Kodu

Kod:
<img src=”resim-linkini-buraya-yapistir” alt=”resim-aciklamasi” />

alt etiketi resminize ait açıklama yeridir, isterseniz alt=”resim-aciklamasi” kodunu kaldırabilirsiniz fakat SEO için önemlidir.

Linkli HTML Resim Kodu

Kod:
<a href=”yonlenecek-site-linkini-buraya-yapistir” target=”_blank”><img src=”resim-linkini-buraya-yapistir” alt=”resim-aciklamasi” /></a>

target etiketinde bulunan _blank kodu linke tıklandığında yeni bir sekmede açılması içindir. Kendi sitenize yönlendireceğiniz bir kod ekliyorsanız  target=”_blank” kodunu kaldırabilirsiniz.]]>
HTML Resim Kodu

Kod:
<img src=”resim-linkini-buraya-yapistir” alt=”resim-aciklamasi” />

alt etiketi resminize ait açıklama yeridir, isterseniz alt=”resim-aciklamasi” kodunu kaldırabilirsiniz fakat SEO için önemlidir.

Linkli HTML Resim Kodu

Kod:
<a href=”yonlenecek-site-linkini-buraya-yapistir” target=”_blank”><img src=”resim-linkini-buraya-yapistir” alt=”resim-aciklamasi” /></a>

target etiketinde bulunan _blank kodu linke tıklandığında yeni bir sekmede açılması içindir. Kendi sitenize yönlendireceğiniz bir kod ekliyorsanız  target=”_blank” kodunu kaldırabilirsiniz.]]> <![CDATA[HTML Boşluk Bırakma Kodu (HTML Boşluk Bırakma)]]> https://www.forumteams.com/konu-html-bosluk-birakma-kodu-html-bosluk-birakma.html Sun, 06 Jun 2021 01:04:17 +0000 şenol]]> https://www.forumteams.com/konu-html-bosluk-birakma-kodu-html-bosluk-birakma.html Html Boşluk Kodu / Html Boşluk Bırakma

Bazı durumlarda birden fazla karakterlik boşluk bırakmak isteyebilirsiniz. Boşluk tuşuna birkaç kez bassanız bile HTML’de yalnızca tek bir boşluk göründüğü için bir seferde birden fazla boşluk eklemek için HTML etiketleri kullanmanız gerekir. Şimdi bunlardan bahsedeceğim.

( 1 Karakterlik Boşluk Bırakır)

Kod:
&nbsp;

( 2 Karakterlik Boşluk Bırakır)

Kod:
&ensp;

Eğerki 4 karakterlik boşluk bırakmak isterseniz şu boşluk kodunu kullanabilirsiniz

Kod:
&emsp;

Boşluk oluşturmak için şunu'da kullanabilirsiniz.

Kod:
&#160 ;
]]> Html Boşluk Kodu / Html Boşluk Bırakma

Bazı durumlarda birden fazla karakterlik boşluk bırakmak isteyebilirsiniz. Boşluk tuşuna birkaç kez bassanız bile HTML’de yalnızca tek bir boşluk göründüğü için bir seferde birden fazla boşluk eklemek için HTML etiketleri kullanmanız gerekir. Şimdi bunlardan bahsedeceğim.

( 1 Karakterlik Boşluk Bırakır)

Kod:
&nbsp;

( 2 Karakterlik Boşluk Bırakır)

Kod:
&ensp;

Eğerki 4 karakterlik boşluk bırakmak isterseniz şu boşluk kodunu kullanabilirsiniz

Kod:
&emsp;

Boşluk oluşturmak için şunu'da kullanabilirsiniz.

Kod:
&#160 ;
]]> <![CDATA[Html Nedir ? | Yazılıma Başlama Dili]]> https://www.forumteams.com/konu-html-nedir-yazilima-baslama-dili.html Fri, 21 May 2021 09:40:42 +0000 Mango]]> https://www.forumteams.com/konu-html-nedir-yazilima-baslama-dili.html Genel Olarak HTML

Web tasarım konusunda araştırma yapan hemen herkesin karşına çıkan temel kavram HTMLdir. Web sayfalarını oluşturma aşamasında kullanılan standart bir metin işaret dili olan HTML açılımı “Hyper Text Markup Language” olarak bilinir. Genel bilinen yanlış kanının aksine HTML bir programlama dili değildir. Daha açık anlatmak gerekirse, Chrome, Firefox, Yandex gibi tarayıcıların okuyup anlamlandırdığı dil HTML dilidir.

HTML Ne İşe Yarar?

HTML, web tasarımcılarına sayfalar ve uygulamalar için yapı profilleri, bağlantılar, blok alıntılar, paragraflar ve başlıklar oluşturmalarında yardımcıdır. Bu konuda basit kod yapıları olan etiketler ve nitelikler kullanılarak web sayfaları şekillendirilebilir. HTML için aslında bir web sitesinin iskeleti denilebilir. Yani HTML kodları olmadan web sitesi kodlanamaz.

Web sitesi ve sayfaları oluşturulurken mutlaka kullanılması gereken HTML, yeni başlayanlar için öğrenmesi en kolay biçimleme dillerinden biridir. HTML dersleri alarak sistemli bir çalışma için kendinizi geliştirebilir, öğrendiğiniz bilgileri web sayfası tasarlama aşamasında deneyebilirsiniz. Zamanla sahip olduklarınızdan fazlasını öğrenebilir ve web sitesi tasarlama konusunda söz sahibi olabilirsiniz.

En Çok Kullanılan HTML Kodları

HTML kodları, bir web sayfasının yapısını oluşturan parçacıklardır. Kullanılan kod ne olursa olsun tümü “<” ile başlar ve “>” ile bitmek zorundadır. Bazı basit HTML kodlarını daima bilmeniz gerekir. Hazırladığınız web sayfalarında bu kodları birden fazla yerde kullanmanız gerekecektir. Ancak öncesinde temel bir HTML belge yapısının nasıl olması gerektiğini bilmeniz gerekir. Buna göre;

!DOCTYPE html: Tüm HTML belgeleri bu kod ile başlamak zorundadır. Bu kod aslında sayfanın HTML5 formatına göre kodlandığını gösterir.

html: Kök etiket olarak da bilinen bu temel kullanımda tüm HTML kodları, bu iki etiket arasında tanımlanmak zorundadır.

body: Görünebilir tüm HTML kod parçalarının eklendiği etiket alanıdır.

head: Web sayfasının dili, başlığı ve diğer düzenlemelerinin yer aldığı etikettir.

title: Web sitesinin başlık alanını tanımlamak için kullanılır. <title> etiketi, <head> etiketleri arasında olmak zorundadır.

meta charset=”utf-8″: HTML kodunun Türkçe karakter desteği dahil olmak üzere pek çok dil seti içerdiğini belirtir.
  • Paragraf Kodu (<p>)
Metin içerisindeki paragrafları oluşturmanızı sağlayan koddur. İçerik bölümlerini ayırırken aralarında <br> kodu eklenerek metin paragrafları oluşturulabilse de <p> kodunun kullanılması tavsiye edilir. Arama motorlarını ve tarayıcıları sayfa yapısı hakkında bilgilendirir.
  • Satır Sonu Kodu (<br>)
Web sayfasındaki metni yatay olarak bölmeye yarayan HTML kodudur. Kullanıldığı yerde metin bir alt satırdan devam eder. Diğer bir deyişle <br/> kullanıldığında, takip eden tüm kelimeler alt satırdan devam eder.
  • Resim Kodu (<img>)
img kodu, görüntüleri web sayfasına eklemek için kullanılır. Web sayfasına resim eklemek istediğinizde önce web sunucusuna yükleyin. Daha sonra yüklenen resmin dosya adına başvuru yapmak için bir <img> etiketi kullanabilirsiniz.
  • Buton Kodu (<button>)
HTML buton kodu, sayfalarınızı ilgi çekici yapmak ve etkileşimli içerikler oluşturmak için kullanılır. JavaScript ve HTML renk kodları ile daha güçlü hale gelen bu kod, içeriklerinizde kullanıcılarla etkileşime girmenizi sağlar.
  • Bağlantı Kodu (<a>)
Önemli HTML link verme kodlarından biri olan <a> kodu ile diğer içerikleriniz arasında da bağlantılar oluşturabilirsiniz. Bağlantı oluşturmak için, bağlantı kurmak istediğiniz içeriğin çevresine <a> ve </a> etiketleri sarmanız gerekir.
  • Yatay Çizgi Kodu (<hr>)


  • Sayfa bölümlerini görsel olarak ayırmada yatay çizgi kodları kullanılır. Bu kod, sayfadaki geçerli konum üzerinden sağ kenar boşluğu arasında bir çizgi oluşturur. Böylece kelime veya cümle grupları yatay çizgiyle ayrılır.
]]> Genel Olarak HTML

Web tasarım konusunda araştırma yapan hemen herkesin karşına çıkan temel kavram HTMLdir. Web sayfalarını oluşturma aşamasında kullanılan standart bir metin işaret dili olan HTML açılımı “Hyper Text Markup Language” olarak bilinir. Genel bilinen yanlış kanının aksine HTML bir programlama dili değildir. Daha açık anlatmak gerekirse, Chrome, Firefox, Yandex gibi tarayıcıların okuyup anlamlandırdığı dil HTML dilidir.

HTML Ne İşe Yarar?

HTML, web tasarımcılarına sayfalar ve uygulamalar için yapı profilleri, bağlantılar, blok alıntılar, paragraflar ve başlıklar oluşturmalarında yardımcıdır. Bu konuda basit kod yapıları olan etiketler ve nitelikler kullanılarak web sayfaları şekillendirilebilir. HTML için aslında bir web sitesinin iskeleti denilebilir. Yani HTML kodları olmadan web sitesi kodlanamaz.

Web sitesi ve sayfaları oluşturulurken mutlaka kullanılması gereken HTML, yeni başlayanlar için öğrenmesi en kolay biçimleme dillerinden biridir. HTML dersleri alarak sistemli bir çalışma için kendinizi geliştirebilir, öğrendiğiniz bilgileri web sayfası tasarlama aşamasında deneyebilirsiniz. Zamanla sahip olduklarınızdan fazlasını öğrenebilir ve web sitesi tasarlama konusunda söz sahibi olabilirsiniz.

En Çok Kullanılan HTML Kodları

HTML kodları, bir web sayfasının yapısını oluşturan parçacıklardır. Kullanılan kod ne olursa olsun tümü “<” ile başlar ve “>” ile bitmek zorundadır. Bazı basit HTML kodlarını daima bilmeniz gerekir. Hazırladığınız web sayfalarında bu kodları birden fazla yerde kullanmanız gerekecektir. Ancak öncesinde temel bir HTML belge yapısının nasıl olması gerektiğini bilmeniz gerekir. Buna göre;

!DOCTYPE html: Tüm HTML belgeleri bu kod ile başlamak zorundadır. Bu kod aslında sayfanın HTML5 formatına göre kodlandığını gösterir.

html: Kök etiket olarak da bilinen bu temel kullanımda tüm HTML kodları, bu iki etiket arasında tanımlanmak zorundadır.

body: Görünebilir tüm HTML kod parçalarının eklendiği etiket alanıdır.

head: Web sayfasının dili, başlığı ve diğer düzenlemelerinin yer aldığı etikettir.

title: Web sitesinin başlık alanını tanımlamak için kullanılır. <title> etiketi, <head> etiketleri arasında olmak zorundadır.

meta charset=”utf-8″: HTML kodunun Türkçe karakter desteği dahil olmak üzere pek çok dil seti içerdiğini belirtir.
  • Paragraf Kodu (<p>)
Metin içerisindeki paragrafları oluşturmanızı sağlayan koddur. İçerik bölümlerini ayırırken aralarında <br> kodu eklenerek metin paragrafları oluşturulabilse de <p> kodunun kullanılması tavsiye edilir. Arama motorlarını ve tarayıcıları sayfa yapısı hakkında bilgilendirir.
  • Satır Sonu Kodu (<br>)
Web sayfasındaki metni yatay olarak bölmeye yarayan HTML kodudur. Kullanıldığı yerde metin bir alt satırdan devam eder. Diğer bir deyişle <br/> kullanıldığında, takip eden tüm kelimeler alt satırdan devam eder.
  • Resim Kodu (<img>)
img kodu, görüntüleri web sayfasına eklemek için kullanılır. Web sayfasına resim eklemek istediğinizde önce web sunucusuna yükleyin. Daha sonra yüklenen resmin dosya adına başvuru yapmak için bir <img> etiketi kullanabilirsiniz.
  • Buton Kodu (<button>)
HTML buton kodu, sayfalarınızı ilgi çekici yapmak ve etkileşimli içerikler oluşturmak için kullanılır. JavaScript ve HTML renk kodları ile daha güçlü hale gelen bu kod, içeriklerinizde kullanıcılarla etkileşime girmenizi sağlar.
  • Bağlantı Kodu (<a>)
Önemli HTML link verme kodlarından biri olan <a> kodu ile diğer içerikleriniz arasında da bağlantılar oluşturabilirsiniz. Bağlantı oluşturmak için, bağlantı kurmak istediğiniz içeriğin çevresine <a> ve </a> etiketleri sarmanız gerekir.
  • Yatay Çizgi Kodu (<hr>)


  • Sayfa bölümlerini görsel olarak ayırmada yatay çizgi kodları kullanılır. Bu kod, sayfadaki geçerli konum üzerinden sağ kenar boşluğu arasında bir çizgi oluşturur. Böylece kelime veya cümle grupları yatay çizgiyle ayrılır.
]]>