Dreamweaver CS4 | Tablosuz Tasarım 2

Uzun zamandır beklenen Tablosuz Tasarım 2 videosu sizlerle… vidobu.com sitesi için çektiğim Tablosuz Tasarım eğitim setinin bir parçası olan bu videoyu sizlerle paylaşıyorum.

Tablo kullanmadan web sitesi tasarlamak web standartlarına uyumluluk anlamına gelmektedir. Sizde tablosuz tasarım yapmaya başlayın!

Bu video da yer alan konular…

- Yan yana DIV eklemek
- DIV eklerken dikkat edilmesi gerekenler
- Float ve Clear özelliklerinin kullanılması

 

37 yorum

  1. Gökhan Görkem
    07 Mart 2010

    hakan bey tebrik ederim güzel bir çalışma olmuş dün keşfettim diye yine bir not yazmıştım ama bugun baktım sanki hız kesme al bu video ile devam et der gbi oldu bu :) çok güzel bir çalışma tebrik ederim gerçekten..linkte belirttiğim tasarımını yaptığım siteyi de divlere çeviricem en kısa zamanda…

  2. ertuğrul günay
    07 Mart 2010

    teşşekürler. hakan hoca başarılı ve faydalı bir çalışma olmuş

  3. Serkan URHAN
    08 Mart 2010

    Yeni başlayanlar için güzel bir video olmasının yanı sıra işi bilenlerinde bilgilerini pekiştirmesine yararlı olacaktır. Clear fonksiyonu sıklıkla kullanılmalı. Çok faydasını görmüşümdür.
    Video için teşekkürler..

  4. By_ÖmÜr
    09 Mart 2010

    Tebrikler Hakan Hocam ,,,

    Çok Başarılı Bir Video Olmuş Bizlerde Böyle Bir Video Bekliyorduk Sizden , Bu Video Sanırsam Online Video Eğitim Sitesi için Yapmış Oldugunuz Bir Çalışmaya Benziyor … ÇOK TEŞŞEKKÜRLER …

  5. Yavuz
    10 Mart 2010

    Çok teşekkürler. Sayende Dreamweaver öğrenmeye başladım. Menü tasarımı hakkındaki dersin de devamı gelir umarım. Tekrar çok teşekkürler.

  6. Mehmet Coşkun
    10 Mart 2010

    Hocam süpersin . hocam size bu menü olayı için baya sorular sormuştum saolsın hocam sende hiç bıkmadan bana anlattın video süper olmuş hocam tebrikler

  7. Mustafa Tok
    11 Mart 2010

    Hakan bey , cok tesekkurler.. Cok yalın ve basit bir anlatım tarzınız var. Benzerlerinizin coğalması dileği ile:)

  8. ismail su
    27 Mart 2010

    Ben anlatımınızı çok beğendiğimi söylemek istiyorum. Kalite sanırım Adobe eğitimlerinden geliyor. Ağzınıza sağlık…

  9. ışıl
    29 Mart 2010

    bu videonun devamı yokmu acaba?

  10. burhan
    06 Nisan 2010

    merhabalar hakan bey; ben de artık divlerle site tasarlamaya çalışıyorum (sayenizde) :D ben problemimi yukarıdaki videonuzu örnek olarak gösterecem.
    ben sol tarafın altına hava durumu onunda altına sayaç ve sağ tarafına da içerik gimek içinde bir div oluşturmak istiyorum. Ancak bunu yaparken videoyu da takip ederek yaptım. şablonu yaptım sayılır ama sol taraftaki divlere resim ya da flash buton eklerken alttaki divlerle yan yana geliyor ve divler dağılıyor. yardımcı olursunaız sevinirim. şimdiden teşekkürler….

  11. Nihan
    08 Nisan 2010

    Hocam, emeğinize teşekkürler. Kurstaki bilgilerimi pekiştirmiş oldum.

  12. Mesut
    29 Nisan 2010

    selamun aleyküm

    hakan bu tablosuz tasarımda kafama takılan bir konu var onu sormak istiyorum.

    Şimdi diyelim ki ; şu anda yorum yaptığım bu alanı oluşturmak için talo açıp tabloda bölümler oluşturup name , id, value, action, metod vs gibi bölümler oluşturuyoruz.
    bu şekildeki bir uygulamayı yine div lerle mi yapacağız ?
    yoksa bu şekildeki uygulamalarda mecbur tablo mu kullanacağız ?

    bana göre divlerle yapmak baya uzun bir iş olur doğrusu :)
    uzunca bir kayıt formu oluşturmak için her katmanı divlerle açmak tablo açmanın yanında 4 kat daha zaman kaybı demektir.

    div içerisinde oluşturulan bir tablo safari de yine bozulur mu ?

    bu konuyada açıklık getiriseniz memnun olurum.

  13. Hakan Çamoğlu
    29 Nisan 2010

    @Mesut: Bu tarz detaylı veri tabloları yaparken DIV yerine Tablo kullanmak daha mantıklı. Ben de bu tarz konularda tablo tercih ediyorum. DIV ile yapmak tabiiki mümkün ama dediğin gibi çok zaman alır…

  14. Mesut
    30 Nisan 2010

    Açıklama için tşk ederim.

    birde bu yorum bölümlerinde şu sorunla karşılaşıyorum. mesala bu yazıyı yazarken space tuşunu kullanarak yazdığım için tablo sonuna dayanan text’im en yakın bir aralıktan aşağı düşerek satır başı yapacaktır ancak hiç bir şekilde boşluk vermeden örnek ) aaaaaaaaaaaaaaaaaa………………………. şeklinde uzatınca kayıt edildiğinde siteyi bozmaktadır bunun önüne nasıl geçebiliriz ?

  15. Hakan Çamoğlu
    02 Mayıs 2010

    @Mesut: Bu söylediğin genel bir sorundur. O tarz birleşik bir kelimeyi malesef HTML ile parçalara ayıramıyoruz. Tek yapılabilecek şey CSS overflow: hidden özelliği ile taşan kısımların gösterilmemesini sağlamak olur.

  16. Burcu
    11 Mayıs 2010

    Hocam çok teşekkür ederim. Oldukça güzel tane tane akıcı bir dille anlatıyorsunuz. Bilgileriniz için çok teşekkür ederim. Div i bilmeme rağmen eksiklerim çıkıyor. Eksiklerimi de anlatımlarınız ile tamamlayacağım inşAllah..

  17. ruchan
    11 Mayıs 2010

    merhaba hakan bey,
    ben sizi takip ediyorum gayet iyi anlatıyorsunuz sizi izleyince tasarlayasım geliyor:) ben bu işe yeni başladım aynı zamanda şunu da belirteyim ki bilgisayar öğretmenliği birinci sınıf okuyorum küçük bişey sorucam bu videonun devamında yatay menü olacaktı sanırım onu nasıl yaptığınızı açıklayabilir misiniz
    şimdiden sağolun..

  18. Hakan Çamoğlu
    11 Mayıs 2010

    @ruchan: CSS Menü Tasarımı videosunu seyredebilirsin. O videodaki anlatıma ekstra “li” etiketine “float:left” özelliği vermen yeterli.

  19. yasir gürbüz
    15 Mayıs 2010

    Son derece sade ve anlaşılır bir şekilde anlatmışsınız…
    teşekkürler….

  20. .c.c
    17 Mayıs 2010

    hakan abi sen tamamam iyıde bu üyelik sitemi tamladı dıyelım peki bunu hani veri tablosunu hazırlam dersi &veri tabanı olussturma dersi ????????????????????????????????????????????????????????????

  21. .c.c
    17 Mayıs 2010

    cok eksik dersler bunlar dememde yeri var senın suvideobu.com mada uede oldum ama tasarım onemlı degil bize üyelik yadı ve üye girisi ,o veritabanı seciyoruz ya onu nasıl yapcaz yanı demek istedigi m sen bize hepsini ogretmen lazım ona gore 95tlyi verelim

  22. .c.c
    17 Mayıs 2010

    ben onun için para vermem bazı görsel egimtim siteleri var bunda örnegin biryat diyelim:85tl ama her onuya gore dersleri veriyorlar sizin suandan itibaren web master oldugunuza inanmıyorum by .glade

  23. volkan yatağan
    18 Mayıs 2010

    Sitenizi devamlı olarak takip ediyorum ve sayenizde web tasarımı yapıyorum ama siteye arkafona background resim koydum mozillada çalıştı chromeda çalıştı fakat i.explorerda çalışmadı sebebini öğrenebilirmiyim şimdiden teşşekkürler….

  24. cansu armutlu
    13 Haziran 2010

    gerçekten çok güzel anlatım

  25. Serkan
    24 Haziran 2010

    Hakan abi ben hem tasarım hemde php coder lük yapıyorum sanalkurstan az çok takip ediyordum.. Sormak istediğim bir şey var verilerini okuduğunuz yorumları yazdırırken içine koyduğunuz arka planı gri olan div in kenarlarında çok ince bi çizgi var onu nasıl yapıyosun? Ve sitenin genel tasarımını videodaki gibi divlerle yaptım ama içeriğindeki küçük resimdi veri okumaydı gibi işlerimlerin çerçeveyelerini divlerle yapsam herhangi bi tarayıcada bozulma olur mu ? bilginiz varsa yardımcı olur musunuz

  26. Abdullah özdem
    29 Temmuz 2010

    s.a hakan bey benim size bir sorum olacak ben yan yana divleri oluşturuyorumda tane yan yana oluş turduktan sonra onun yanına 3. bir div ekleyemiyorum bunun için bana yardım ederseniz sevinirim teşekkürler…. Kolay gelsin iyi günler

  27. özgür
    01 Eylül 2010

    Teşekkürler, güzel bir çalışma olmuş.

  28. seçkin
    22 Eylül 2010

    Hakan bey öncelikle anlatımlarınız için çok teşekkür ederim. Benim sorunum hem yanyana 3. tabloyu ekleyemiyorum birde dreamwiev de görünenler tarayıcıda o şekilde görünmüyor ? Neden acaba ?

  29. Özgür Y,
    18 Ekim 2010

    Videoların çok güzel güzel anlatmışsın sağol hakan abi çaba göstermişsin emeklerini es geçmemek lazım başarılarının devamını dilerim. Abi senden bişey rica etsem sanki bu video yarım kalmış ki gibi yaptıklarınızın aynısını yaptım hatta yaparken yeni bişeyler daha öğrendim ama logonun oraya yani alta menü ekleyemiyorum abi varsa bu videonun devamını gönderebilir misin ya da devamını çekebilir misin rica etsem. Allaha emanet ol abicim elin kolun dert görmesin

  30. Caner Abanoz
    25 Kasım 2010

    Hakan Hocam Saygılar sevgiler. =) Hakan hoca bir tanedir. Bu işe merak salmış üniversite öğrencileri yahut çalışan olarak kendini geliştirmek için kaynak bulamayan.
    bulsa bile anlamakta zorlanan arkadaşların gelişimi ve kendilerine bir parça daha fazla şey katması için bilgilerini hep paylaşmaktadır.Paylaşmamasının kendisine faydalı değil asıl paylaşınca genel etkilerini hissedebileceğini bilen. Genel düşünen Toplum olarak bu konularda ilerlememizin etkili olacagının farkında bir insandır.. =) Gönüllülerede hep destek vermektedir.Böyle Gelişime yönelik videoların devamlarını bekliyoruz. Ve TÜm ziyaretçi arkadaşlar fazlasını bekliyorlarsa vidobu.com a üye olmalarını tavsiye ederim. Bu arada. Hocam ne zaman neptüne gidiyoruz. =) Dünya ve dünyalılar sıkmaya başladı artık.

  31. yeşim
    19 Şubat 2011

    merhaba
    bu video gerçekten çok iyi oldu benm için.yeni başladm ve kafam divlerde çok karışıyodu ama sayenizde bu sorun ortadan kalkmış oldu. Ellernze sağlık

  32. Arzu Demir
    23 Şubat 2011

    Merhaba,

    Ben div in içine 8 adet resimi 2 sıra halinde 4′er koymak istiyorum

    Fakat 4 adet resimi yan yana koyamadım.

    NAsıl yapabilirim?

    Yardımlarınız için şimdiden teşekkürler

  33. ahmet
    26 Şubat 2011

    hakan usta mrb ben cok cok acemı sayılırım := bana siteme reklam banneri ni nasıl olusturup yonetebi,lecegim hakkında yardım edermisiniz

  34. aslı
    30 Nisan 2011

    hocam yardım edermisin anasayfa yapamıyorum

  35. mehmet ali
    22 Mayıs 2011

    iç içe şablon oluştturma yokmu çok ihtiyacım var bugün yetiştirmem lazım
    tşk

  36. özgehoca
    17 Kasım 2011

    süperanlatım. ilk bakışta çok seri anlaılmış ama irdeleyince Float,Margin,After start of tag ,after Tag özellikleri çok iyi anlaşılıyor. Paylaşamaya devam.

  37. mesut kırkbir
    13 Aralık 2011

    hocam gerekli resimleri nereden bulabiliriz

Yorum gönder

İsim*

E-mail

Website