Hazır Site Kodları Web Siteniz İçin Hazır Site Kodları

  • Onur YURT
  • iletisim@hazirsitekodlari.com
  • 57

    Makale

  • 3

    Yorum

  • 8

    Kategori

Webmaster adına tüm bilgi ve paylaşım platformudur.

Senin Kodun

Ana Sayfa / Html / HTML Hakkında Bilmediğiniz 5 Özellikler

HTML Hakkında Bilmediğiniz 5 Özellikler

HTML üzerinde muhtemelen bilmediğiniz 5 özelliği listeledik.

Herkese merhaba arkadaşlar. HTML hakkında birçoğumuzun az da olsa bilgisi var. Aslında HTML’yi herkes öğrenebilir. Öylesine basit  ve kolay bir syntaxı bulunuyor. Tabi her şey zamanla oturur. O yüzden bıkmadan çalışmanız gerekiyor.HTML nasıl öğrenebiliriz diye sorarsanız da daha önceden yazdığımız birkaç tane makale var onlara da aşağıdaki linkten ulaşabilirsiniz.

HTML 5

HTML hakkında her ne kadar bilgimiz var desek de, bu bilgi bir yere kadar olabiliyor. Biz de düşündük ve bilmediğimiz yönlerini araştırdık. Sonuçların sizin için şaşırtıcı ve öğretici olması dileğiyle diyoruz ve sizleri baş başa bırakıyoruz.

1- Yazım Denetimi Yapılabilir

Herhangi bir HTML etiketine spellcheck ekleyerek yazım denetimi yapılmasını sağlayabilirsiniz. Metin girişi yapabileceğiniz etiketler üzerinde faydalıdır. Ayrıca hiyerarşide düzgün çalıştığından yani, bir div ve onun alt elemanları yani çocukları üzerinde etkili olacağından faydalı bir kullanıma kapı açar.

<input type="text" spellcheck="true"
placeholder="Bir şeyler girin">
<p contenteditable="true" spellcheck="true">
  Bir şeyler girin
</p>

Yukarıdaki kodda, hem <div> hem de <p> etiketleri, bir kullanıcı yazmaya başladığında heceleyerek kontrol etmektedir. Dikkatli olmanız gereken konu ise tarayıcı ayarlarından yazım denetimini devre dışı bırakmamanız gerekiyor. Devre dışı bırakmışsanız bu özelliği kullanamazsınız.

2- İçerik Kaynaklarınızı Güvence Altına Alın

İçerik kaynaklarımızın bir diğer adı da CDN dir. Content Delivery Network olarak açılır. Komut dosyalarının ve stil sayfası dosyaları gibi kaynakların CDN’ler aracılığıyla barındırılması oldukça yaygın kullanılıyor.  Mozillanın yaptığı açıklamada;

using CDNs also comes with a risk, in that if an attacker gains control of a CDN, the attacker can inject arbitrary malicious content into files on the CDN (or replace the files completely) and thus can also potentially attack all sites that fetch files from that CDN.

yani CDN kaynaklarınız başkasının eline geçerse zararlı yazılım enjekte ederek zarar verici sonuçlar elde edebilirsiniz mesajını veriyor. Bu işlemi önleyebilmek için integrity diye bir tag çıkartılmış. Source tagının içine yazılan integrity bu işlemin güvene alınmasını sağlıyor. Kullanımı ise aşağıdaki şekilde.

<script src="https://example.com/example.js"
integrity="sha384-Li9vy3DqF8tnTXuiaAJuML3ky+er10rcgNR/VqsVpcw+ThHmYcwiB1pbOxEbzJr7"
crossorigin="anonymous"></script>

3- Gönder Düğmelerindeki Form Hedeflerini Geçersiz Kılmak

Target tagının nasıl kullanıldığını bir çoğumuz biliyor. Köprü oluşturmak ve ekstra bir sayfa veya hedefte aç olarak değiştirebiliyoruz. HTML5’in ilk taslaklarından birinde, formtarget dört diğer form gönderme özelliği ile birlikte tanımlandı: formaction,formenctype ,formmethod ve formnovalidate. Bu öznitelikler, gönderme düğmeleri ile kullanılabilir ve düğmelerin ait olduğu etiketindeki ilgili özniteliklerini geçersiz kılar. Kullanım örneği ise aşağıdaki şekildedir.

<form action="/save" target="_self" >
  <input type="submit" name="save"  />
  <input type="submit" name="print" formaction="/print"
  formtarget="_blank" />
</form>

4- Öğelerin Semantic Özelliklerini Gizle

Özelliklerin gömülü ve izinsiz görüntülenmemesini istiyorsanız yapacağınız şey çok basit arkadaşlar. Tanımlayacağınız ana div tagının içine hidden ekini eklemeniz, sizin işinizi görecektir.

<div hidden>...</div>

CSS kuralı; Gizli özniteliği olan öğe sayfasında oluşturulmaz. Eleman içerisindeki herhangi bir betik yürütüldüğünde, bir form denetimi olarak yürütülüyor ise, form gönderimi sırasında diğer form denetimleri ile birlikte gönderilir.

5- Klavye Kısayolu Ekleyin

Global olarak kullanabileceğiniz bir diğer özellik ise accesskey. HTML4 üzerinde tanımlanmış olup, HTML5 üzerinde de kullanılabilir durumdadır. Bu anahtarı oluşturmanız iki şeye bağlıdır;

1-) accesskey üzerine verdiğimiz değer

2-) Aynı öğe için önceden tanımlanmış anahtarlar.

Örnek üzerinde kullanımını görelim.

<button accesskey="v" onclick="alert('View Click')">
  View
</button>

Her platform üzerinde v tuşuna yapılan kombinasyonlarda alt+shift+v vs. View Click adında bir alert oluşturacaktır. Kısayollar her işletim sistemine göre değişiklik göstereceğinden kısayolların nasıl olduğunu belirtmeniz faydanıza olacaktır.

BENZER KONULAR

HTML5’te Temel Elemanlar Ders#1
HTML5’te Temel Elemanlar Ders#1 DEVAMI
  • 15 Mayıs 2020 | 0 | 368
Html | Kategorisine Ait Yazıların Daha Fazlası...

KONU HAKKINDA (Yorum Yapılmamış) | SENDE YORUM YAP DESTEK OL!

Yazı hakkında görüşlerinizi belirtmek istermisiniz?

BEN KİMİM?

Onur YURT

Web Developer And Coder

Merhaba arkadaşlar Adım Onur YÜRT Bursada doğdum ve yaşıyorum 2009 yılından itibaren web hayatına adım attım ve şuanda bulunduğum sayfayı açtım amaçım sizlere birşeyler öğretmek ve kazandırmak Web tasarım konusunda kendimi yeterince geliştirdiğime inanıyorum bu bilgileri zamanla siz değerli takipçilerime sunmak yeterince bildiğim kodlama diller Css3, Html5, Javascript ve Php dir.

POPULER KONULAR

Hazır Site Kodları Web Siteniz İçin Hazır Site Kodları...