Oxxi.net  - Birlikteliğin Gücü Bulut Sunucu

Go Back   Oxxi.net - Birlikteliğin Gücü > Google & Msn-Yahoo kardeşler > Google Optimizasyon > HTML5

Cevapla
 
LinkBack Seçenekler Stil
  #1  
Alt 19-02-2016, 15:52:26
 
İstanbul Anadolu Şubesi
Yaş: 40
Mesajlar: 8
iTrader: (0)
Standart Kodlama yaparken işinize yarayabilecek 10 adet HTML5 etiketi

Bilmeniz Gereken 10 Yeni HTML5 Etiketi
1-<video> ve <audio>

Flash, Silverlight ve benzer teknolojilerin kullanılmasının en önemli sebebi multimedya veriler oynatmak. HTML5 ile tarayıcılar yeni video ve ses kontrollerini destekliyor. Bu yüzden eski teknolojiler kullanım açısından küme düşüyor. Tarayıcılar artık doğal olarak kontrolleri gösteriyor ve JavaScripte takılmadan işlenebiliyor. Kodek karışıklığı sizi korkutmasın! Birden çok kaynak gösterebilirsiniz içerik için yani multimedya içeriğiniz tarayıcınızın desteklediği kodek ayırtmaksızın çalışacaktır.

2-<input> tipi özellikleri

Yeni <input> elementi artık özellikleri için daha fazla değere sahip ve tarayıcılar değerine göre bazı güzel şeyler yapabiliyorlar. Mesela type özelliğini "datetime" olarak ayarlayın ve doğru zamanı seçmeniz için tarayıcı size takvim ve saat kontrollerini gösterecektir, bu eskiden JavaScript gerektirirdi. Baya çeşitli özellik tipleri var. Bunları öğrenmeniz bir çok JavaScript işinden sizi kurtaracaktır.

3-<Canvas>

<canvas> etiketi size HTML'de çalışabilmeniz için bitmap tarzında bir yüzey açacaktır tıpkı GDI+ veya .NET Image objesi gibi. Şu anlık mükemmel olmasada uzun zamandır HTMLde geleneksel bir zayıflık olan çeşitli grafik çalışmaları veya tablo çalışmaları yapılabilir ve bu sadece başlangıç!

4-<header> ve <footer>

<header> ve <footer> yeni etiketimiz. Bu iki etiket hiç bir şeyi kendi üstüne veya altına almayan bir <div> aslına bakarsanız. Fakat bu iki etiket arama motorları kazançlarınızı uzun zamanlı kesecektir çünkü artık arama motorları gerçek içerik ve kullanıcılar için önemli fakat gerçek içerik olmayanları ayırt edebilecek seviyedeler.

5-<article> ve <section>

Bu etiketler arama motorlarında sizi yükseltecek iki yeni etiket. Article yani makaleler bir çok section yani bölümden oluşabilir bir bölümde bir çok makaleden oluşabilir. Kafa karıştırıcı mı? Pek değil aslında. Bir makale(article) blok bir içeriği sunar. Bunun yanında bir bölüm(section) bundan çok daha büyük bir parçayı gösterir. Örnek olarak bir blog sayfasına bakıyorsanız ön sayfa bütün postları listeleyen bir bölüm(section) olabilir ve her bir post bir çok gerçek post ve yorum içeren bir bölümü(section) içeren başka bir makale(article) olabilir.Basit olarak iç içe kullanılıyorlar.

6-<output>

Yeni <output> etiketi eşsiz! İçindeki veriyi dinamik olarak JavaScript ile üreten bir yapı sunuyor.
Bu yeni etiketin direkt JavaScript ile DOM üzerinden değiştirilebilen ve ekranda gösterdiği şeyi değiştiren bir özelliği var. İşleri şu anki yollarla yapmaktan daha elverişli bir yapı sunuyor.

7-<details>

Her web sitenin açılır/kapanır bir yazı bloğuna ihtiyacı olduğu görülüyor. JavaScriptle ve server tabanlı kodlarla yazılması ne kadar kolay olsada <details> etiketi bu yöntemlerden bile daha kolay hale getiriyor. Tam olark yıllardır yaptığımız şeyin aynısını yapıyor. Basit bir tıklanıldığında açılan ve kapanan bir içerik bloğu oluşturuyor.<details> etiketi şu anlık yatay kullanıma uygun olmasada yakında geleceğine eminiz.

8-<figure> and <figcaption>

<figure> aslında içerik için basit bir taşıyıcı (genellikle resimler ama herşey olabilir) ve <figcaption> ( <figure> etiketinin içine alınan) size <figure> etiketindeki içerik için başlık veya altyazı yazmanızı sağlıyor. Örnek olarak yıllık satışları gösteren 4 resmi <figure> etiketine aldınız ve <figcaption> etiketi ile altına " 1989-1993 Yılları Arası Satış Büyümesi " yazdınız. Resimler yan yana gösterilirken altta 4 tanesini takiben bir yazıyla gösterilir.

9-<progress>and <meter>

<progress> ve <meter> etiketleri çok benzerler. <progress> etiketini bir işlem için veya bir şeyin ne kadar tamamlandığını göstermek için kullanabilirsiniz. Ayrıca bilinmeyen bir süre içinde belirsiz modu vardır(veritabanı aramaları gibi). <meter> etiketi bir değerin ölçümleri ve göstergeleri için kullanılır(Termometreler, kullanılan miktar..). Birbirine benzer kullanılıyor olabilirler fakat farklı anlamları vardır.

10-<datalist>

<datalist> etiketi aynı bir combo box gibi davranıyor. Sistem size önerilerden yapılmış bir liste çıkarıyor fakat kullanıcılar istedikleri gibi kendi girişlerini yapmakta özgür. Bu etiketin tonlarca kullanılma şekli var mesela daha önceden kullanıcının geçmişinde olan maddeleri göstererek arama yapan bir kutu. JavaScript(veya JavaScript kütüphaneleri) gerektiren hatta baya uğraştıran bir işlemi HTML5 ile basitçe yapabiliyorsunuz bu sayede.

Not: Web studio dijital ajans blog sayfasından alıntıdır.
Web Studio Blog Sayfası
Alıntı ile Cevapla

Sponsor Bağlantılar
  #2  
Alt 28-06-2016, 15:55:14
 
Adana Şubesi
Yaş: 37
Mesajlar: 1
iTrader: (0)
Standart

sağolasın.
__________________
Hafta Hafta Hamilelik
Alıntı ile Cevapla

  #3  
Alt 30-07-2016, 13:59:33
 
İstanbul Avrupa Şubesi
Yaş: 24
Mesajlar: 25
iTrader: (0)
Standart

Aldım hocam bilgileri çok teşekkürler
Alıntı ile Cevapla

Cevapla


Bu konuyu görüntüleyen üyeler: 1 (0 kayıtlı üye ve 1 misafir)
 
Seçenekler
Stil

Yetkileriniz
Konu açma yetkiniz yok.
Cevap yazma yetkiniz yok.
Eklenti yükleme yetkiniz yok.
Mesajınızı değiştirme yetkiniz yok.

BB code is Açık
Smileler Açık
[IMG] Kodları Açık
HTML-Kodu Kapalı
Trackbacks are Açık
Pingbacks are Açık
Refbacks are Açık



Forum Saati: 19:21:00. Zaman dilimi GMT +3 olarak ayarlanmıştır.


Powered by vBulletin™ Version 3.8.4
Copyright © 2017 vBulletin Solutions, Inc. All rights reserved.
Search Engine Friendly URLs by vBSEO 3.6.0
İçerik sağlayıcı paylaşım sitelerinden biri olan oxxi.net Birlikteliğin Gücü Adresimizde T.C.K 20.ci Madde ve 5651 Sayılı Kanun'un 4.cü maddesinin (2).ci fıkrasına göre TÜM ÜYELERİMİZ yaptıkları paylaşımlardan sorumludur.