CSS - HTML kardeşliği

fatihhayri · 20/09/2004, 16:02

HTML ile CSS kullanımı artıkolmazsa olmaz gibi artık. Bu konuda sizlerle birşeyler paylaşıp ve sizlerden de öneriler bekliyorum.

CSS nereye kadar kullanılmalı nerede html kullanılmalı. Çünkü CSS nerede ise html etiketlerinin bir çoğunun silip süpürdü.

Mesela <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

yerine

body {margin: 0; padding: 0;}

kullanmak daha mantıklı

ancak bir döküman içinde bazı yerlerin kalın(bold) olması için bir css etiketi oluşturmak ne kadar mantıklı onun yerine bir yazı için css etiketi oluşturmalı kalın olacak yerleri ide html bırakarak veya ile yapmalı mıyız.

CSS - HTML Kardeşliği hangi noktalarda nereye kadar olmalı öneri bekliyorum.

Bir bakıma beyin fırtınası

Zerzevat Adam · 20/09/2004, 17:15

W3C'nin tavsiyelerine göre Metin gibi bir kullanımdansa gibi kullanmak daha iyi. Ki W3C b(bold) kod'undan ziyade ve italik içinde 'i tavsiye ediyor.

Gelelim CSS, HTML durumuna; aynı tasarımlı sayfalar ya da yazı, blok, metin, bağlantı vs. öğelerinin renk ve tasarım durumları aynı olacak sayfalarda sadece tek bir sayfa üzerinde çalışmak. CSS oluşturma süreci harici bir sayfada değilde o ilk çalışmada sayfa içinde dahil edilmiş pozisyonda durur ve bütün objeler'in stili "belirsiz" yani "none"dur.

Biz a, a:hover veya yazi:link, yazi:hover gibi stil sınıflarını belirledikten sonra ihtiyacı olan objelere bunu uygularız.

Bu sayede hem daha az kod yazılmış olur ki daha önemlisi temiz kodlardır, hem tek bir merkezden değiştirilebilir. (Sayfanın hazırlanma süreci bittikten sonra css'i harici bir dosya haline getirip diğer sayfalardan bağlamak gerekir.)

Size W3C konusunda vereceğim en önemli ipucu ise; İmajların ALT parametreleri değersiz bile olsa kesinlikle bulunmalı, bütün arka-plan imajları stil olarak belirtilmeli...

Belki zor gibi gözükebilir ama herşey çok daha kolaylaşıyor.

Ayrıca arka-plan imajlarında repeat parametresine bir göz atın...

fatihhayri · 20/09/2004, 17:50

bir de mükün olduğunca table kullanımından kaçınılıp <div>ine mi yoğunlaşmalı. Performans açısından hoş olsada tasarımdaki kullanım açısından pek iç açıcı gelmiyor bana birde dw kullanıyorsanız hele hiç iç açıcı gelimyor bunu bizden önce dw yapması geçişi daha kolay laştıracaktır diye düşünüyorum

Zerzevat Adam · 20/09/2004, 18:19

Tabloları kullanmak W3C standartlarıyla uğraşmak istemeyen ve çoklu tarayıcı desteğini az da olsa sağlamak isteyenler için iyi çünkü katmanları kullanmak hassas iştir.

Ben Macromedia Dreamweaver MX 2004 kullanıyorum ve sonuna kadar arkasındayım çünkü gerçekten çok iyi bir editör...

fatihhayri · 20/09/2004, 19:50

http://www.cssbeauty.com/

güzel bir site CSS uygulaması süper sayfada table yok

DW açtığınızda çok karmaşaık bir ekranla karşılaşıyorsunuz.

fatihhayri · 22/09/2004, 12:25

Aslında bu Xhtml-Xml yolunda ilerleyişin belirtileri

Geçişi kaçırmamamk lazım

Ansugo · 22/09/2004, 12:50

Ben mumkun olan her yerde (hatta birazda zorlama yaparak) CSS kullanilmasi taraftariyim. Zira :

a ) HTML kodlarinda surekli ayni tanimlardan kurtuluyoruz. Bu sayfanin bayt cinsinden boyutunu azaltirken kodlari daha okunakli hale getiriyor.

b ) Tek bir dosya guncelleyerek tum tasarimi ( en azindan renkleri ya da uyumsuz yerleri ) degistirme sansimiz doguyor.

c ) CSS 2 desteklemeyen browser yok gibi. CSS ile yapilan tasarimlar HTML taglari ile yapilan tasarimlara gore "her browsera uyumluluk" acisindan daha uyumlu oluyor.

Yeri gelmisken, a:link, a:visited yerine :link :visited kullanmak daha uygundur diye belirtmeden gecmeyelim

Zerzevat Adam · 22/09/2004, 13:36

Ansugo'nun "Yeri gelmişken" diye başladığı cümleyi açıklamak istiyorum.

Diyor ki; bütün bağlantıların renklerini tek merkezden değiştirmeyin çünkü bu sizi kısıtlar. Fakat mesela bir yerde turuncu yazı vardır bir yerde gri yazı vardır ve bu yazıların bağlantı renkleri ve üstüne gelince değişen bağlantı renkleri farklı olabilir.

Bu durumda mesela griyazi diye bir stil sınıfımız varsa bu griyazi'nin bağlantılarını griyazi:link, griyazi:hover gibi belirlersek daha iyi olur.

Fakat tecrübelerimle bir ipucu vermek istiyorum; mesela griyazi'nin bağlantıları için griyazi_b diye bir sınıf kopyalarsanız ve :link, :hover gibi ekleri bu sınıfa eklerseniz ve gri yazı olan bağlantıları bu griyazi_b sınıfı ile tanımlarsanız daha temiz bir görüntü oluşur. Nasıl yani? Şöyle ki Internet Explorer kodlara sadık kalmaz ve yanlış gösterir ama Moz veya Moz. Firefox gibi tarayıcılarda denerseniz eğer griyazi_b kullanmadan bağlantıları ve yazıları belirlerseniz normal yazıların üstüne gelince de bağlantılar gibi rengi değişebilir.

Ayrıca griyazi_b yapmanın diğer güzel yanı da isterseniz ileride bağlantıların rengini değiştirebilirsiniz ve bu sadece bağlantıları etkiler, yazılar eski haliyle kalır.

sercotec · 22/09/2004, 14:14

CSS-HTML kullanımı pekçok işi basitleştirip daha kolay anlaşılır hale getiriyor. Sadece CSS mantığını çözene kadar kısa bir süre pek çok kaynağı incelemeniz gerekiyor. Ömer Balyalı'nın da dediği gibi şu anki tek sorun, ie, mozilla, opera gibi farklı tarayıcıların bazı css kodlarını farklı olarak algılamaları, yani bazen bir table ile her tarayıcıda sorunsuz görüntülenebilecek bir sayfa işin içine css girdiği zaman her tarayıcıda farklı görünebiliyor, gerçi bunun çözümleri de yok değil ancak, bu sefer zamanınızı bu dingil tarayıcı üreticilerinin buglarına göre css üretmekle harcıyorsunuz. Gördüğüm kadarıyla firefox şu an en iyi çeviri yapan tarayıcı, ayrıca png desteği de çok daha başarılı, ancak kullanıcıların neredeyse %90 ie kullandığı için yine de sayfaları ie de sorunsuz görünecek şekilte tasarlamak zorundayız.

Bir de css alışkanlık yapıyor, css ile table-less modellemeye başladığımdan beri neredeyse table kullanmıyorum. Örnek bir çalışmayı www.sercotec.net/susan adresinde görebilirsiniz.

Kolay gelsin...

Zerzevat Adam · 22/09/2004, 14:20

Ben derim ki; sizin muhattabınız öncelikle Mozilla sonra Mozilla Firefox ve bununla paralel giderekten Netscape'tir.

Siz bu tarayıcılarda düzgün görüntülenen bir site yaparsanız Internet Explorer zaten düzgün göstermeye mecbur.

Opera konusunda ise emin değilim çünkü bazen opera standartlara ve mozilla'ya uygun siteleride sorunlu gösterebiliyor.

Mesela; http://www.omerbalyali.com/dosyalar/referanslar/web/mos bu siteyi Mozilla, Mozilla Firefox, Internet Explorer, Netscape Navigator çok güzel gösterirken Opera CSS ile belirlenen marjinleri düzgün göstermiyor. Ayrıca müşteri girişi kutularıda yanlış gözüküyor.

Aynı şekilde http://www.omerbalyali.com bütün tarayıcılarda düzgün gözüküyor.

20/09/2004, 16:02	#1 (permalink)
fatihhayri talebe Üyelik Tarihi: 07/2003 Yer: istanbul Mesaj: 754	CSS - HTML kardeşliği HTML ile CSS kullanımı artıkolmazsa olmaz gibi artık. Bu konuda sizlerle birşeyler paylaşıp ve sizlerden de öneriler bekliyorum. CSS nereye kadar kullanılmalı nerede html kullanılmalı. Çünkü CSS nerede ise html etiketlerinin bir çoğunun silip süpürdü. Mesela <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> yerine body {margin: 0; padding: 0;} kullanmak daha mantıklı ancak bir döküman içinde bazı yerlerin kalın(bold) olması için bir css etiketi oluşturmak ne kadar mantıklı onun yerine bir yazı için css etiketi oluşturmalı kalın olacak yerleri ide html bırakarak <b></b> veya <strong></strong> ile yapmalı mıyız. CSS - HTML Kardeşliği hangi noktalarda nereye kadar olmalı öneri bekliyorum. Bir bakıma beyin fırtınası __________________ http://www.fatihhayrioglu.com CSS Notlarım

20/09/2004, 17:15	#2 (permalink)
Zerzevat Adam i got the blues Üyelik Tarihi: 01/2003 Mesaj: 4,793	W3C'nin tavsiyelerine göre <span class="kalin">Metin</span> gibi bir kullanımdansa <b></b> gibi kullanmak daha iyi. Ki W3C b(bold) kod'undan ziyade <strong></strong> ve italik içinde <em></em>'i tavsiye ediyor. Gelelim CSS, HTML durumuna; aynı tasarımlı sayfalar ya da yazı, blok, metin, bağlantı vs. öğelerinin renk ve tasarım durumları aynı olacak sayfalarda sadece tek bir sayfa üzerinde çalışmak. CSS oluşturma süreci harici bir sayfada değilde o ilk çalışmada sayfa içinde dahil edilmiş pozisyonda durur ve bütün objeler'in stili "belirsiz" yani "none"dur. Biz a, a:hover veya yazi:link, yazi:hover gibi stil sınıflarını belirledikten sonra ihtiyacı olan objelere bunu uygularız. Bu sayede hem daha az kod yazılmış olur ki daha önemlisi temiz kodlardır, hem tek bir merkezden değiştirilebilir. (Sayfanın hazırlanma süreci bittikten sonra css'i harici bir dosya haline getirip diğer sayfalardan bağlamak gerekir.) Size W3C konusunda vereceğim en önemli ipucu ise; İmajların ALT parametreleri değersiz bile olsa kesinlikle bulunmalı, bütün arka-plan imajları stil olarak belirtilmeli... Belki zor gibi gözükebilir ama herşey çok daha kolaylaşıyor. Ayrıca arka-plan imajlarında repeat parametresine bir göz atın... __________________ çılgın bir elmas vardı artık bakışlarında

20/09/2004, 17:50	#3 (permalink)
fatihhayri talebe Üyelik Tarihi: 07/2003 Yer: istanbul Mesaj: 754	bir de mükün olduğunca table kullanımından kaçınılıp <div>ine mi yoğunlaşmalı. Performans açısından hoş olsada tasarımdaki kullanım açısından pek iç açıcı gelmiyor bana birde dw kullanıyorsanız hele hiç iç açıcı gelimyor bunu bizden önce dw yapması geçişi daha kolay laştıracaktır diye düşünüyorum __________________ http://www.fatihhayrioglu.com CSS Notlarım

20/09/2004, 18:19	#4 (permalink)
Zerzevat Adam i got the blues Üyelik Tarihi: 01/2003 Mesaj: 4,793	Tabloları kullanmak W3C standartlarıyla uğraşmak istemeyen ve çoklu tarayıcı desteğini az da olsa sağlamak isteyenler için iyi çünkü katmanları kullanmak hassas iştir. Ben Macromedia Dreamweaver MX 2004 kullanıyorum ve sonuna kadar arkasındayım çünkü gerçekten çok iyi bir editör... __________________ çılgın bir elmas vardı artık bakışlarında

20/09/2004, 19:50	#5 (permalink)
fatihhayri talebe Üyelik Tarihi: 07/2003 Yer: istanbul Mesaj: 754	http://www.cssbeauty.com/ güzel bir site CSS uygulaması süper sayfada table yok DW açtığınızda çok karmaşaık bir ekranla karşılaşıyorsunuz. __________________ http://www.fatihhayrioglu.com CSS Notlarım

22/09/2004, 12:25	#6 (permalink)
fatihhayri talebe Üyelik Tarihi: 07/2003 Yer: istanbul Mesaj: 754	Aslında bu Xhtml-Xml yolunda ilerleyişin belirtileri Geçişi kaçırmamamk lazım __________________ http://www.fatihhayrioglu.com CSS Notlarım

22/09/2004, 12:50	#7 (permalink)
Ansugo Registered User Üyelik Tarihi: 07/2002 Mesaj: 6,401	Ben mumkun olan her yerde (hatta birazda zorlama yaparak) CSS kullanilmasi taraftariyim. Zira : a ) HTML kodlarinda surekli ayni tanimlardan kurtuluyoruz. Bu sayfanin bayt cinsinden boyutunu azaltirken kodlari daha okunakli hale getiriyor. b ) Tek bir dosya guncelleyerek tum tasarimi ( en azindan renkleri ya da uyumsuz yerleri ) degistirme sansimiz doguyor. c ) CSS 2 desteklemeyen browser yok gibi. CSS ile yapilan tasarimlar HTML taglari ile yapilan tasarimlara gore "her browsera uyumluluk" acisindan daha uyumlu oluyor. Yeri gelmisken, a:link, a:visited yerine :link :visited kullanmak daha uygundur diye belirtmeden gecmeyelim

22/09/2004, 13:36	#8 (permalink)
Zerzevat Adam i got the blues Üyelik Tarihi: 01/2003 Mesaj: 4,793	Ansugo'nun "Yeri gelmişken" diye başladığı cümleyi açıklamak istiyorum. Diyor ki; bütün bağlantıların renklerini tek merkezden değiştirmeyin çünkü bu sizi kısıtlar. Fakat mesela bir yerde turuncu yazı vardır bir yerde gri yazı vardır ve bu yazıların bağlantı renkleri ve üstüne gelince değişen bağlantı renkleri farklı olabilir. Bu durumda mesela griyazi diye bir stil sınıfımız varsa bu griyazi'nin bağlantılarını griyazi:link, griyazi:hover gibi belirlersek daha iyi olur. Fakat tecrübelerimle bir ipucu vermek istiyorum; mesela griyazi'nin bağlantıları için griyazi_b diye bir sınıf kopyalarsanız ve :link, :hover gibi ekleri bu sınıfa eklerseniz ve gri yazı olan bağlantıları bu griyazi_b sınıfı ile tanımlarsanız daha temiz bir görüntü oluşur. Nasıl yani? Şöyle ki Internet Explorer kodlara sadık kalmaz ve yanlış gösterir ama Moz veya Moz. Firefox gibi tarayıcılarda denerseniz eğer griyazi_b kullanmadan bağlantıları ve yazıları belirlerseniz normal yazıların üstüne gelince de bağlantılar gibi rengi değişebilir. Ayrıca griyazi_b yapmanın diğer güzel yanı da isterseniz ileride bağlantıların rengini değiştirebilirsiniz ve bu sadece bağlantıları etkiler, yazılar eski haliyle kalır. __________________ çılgın bir elmas vardı artık bakışlarında

22/09/2004, 14:14	#9 (permalink)
sercotec Eski Cevizci Üyelik Tarihi: 07/2004 Yer: İstanbul Mesaj: 276	CSS-HTML kullanımı pekçok işi basitleştirip daha kolay anlaşılır hale getiriyor. Sadece CSS mantığını çözene kadar kısa bir süre pek çok kaynağı incelemeniz gerekiyor. Ömer Balyalı'nın da dediği gibi şu anki tek sorun, ie, mozilla, opera gibi farklı tarayıcıların bazı css kodlarını farklı olarak algılamaları, yani bazen bir table ile her tarayıcıda sorunsuz görüntülenebilecek bir sayfa işin içine css girdiği zaman her tarayıcıda farklı görünebiliyor, gerçi bunun çözümleri de yok değil ancak, bu sefer zamanınızı bu dingil tarayıcı üreticilerinin buglarına göre css üretmekle harcıyorsunuz. Gördüğüm kadarıyla firefox şu an en iyi çeviri yapan tarayıcı, ayrıca png desteği de çok daha başarılı, ancak kullanıcıların neredeyse %90 ie kullandığı için yine de sayfaları ie de sorunsuz görünecek şekilte tasarlamak zorundayız. Bir de css alışkanlık yapıyor, css ile table-less modellemeye başladığımdan beri neredeyse table kullanmıyorum. Örnek bir çalışmayı www.sercotec.net/susan adresinde görebilirsiniz. Kolay gelsin... __________________ Serkan Ertürk SercoTec

22/09/2004, 14:20	#10 (permalink)
Zerzevat Adam i got the blues Üyelik Tarihi: 01/2003 Mesaj: 4,793	Ben derim ki; sizin muhattabınız öncelikle Mozilla sonra Mozilla Firefox ve bununla paralel giderekten Netscape'tir. Siz bu tarayıcılarda düzgün görüntülenen bir site yaparsanız Internet Explorer zaten düzgün göstermeye mecbur. Opera konusunda ise emin değilim çünkü bazen opera standartlara ve mozilla'ya uygun siteleride sorunlu gösterebiliyor. Mesela; http://www.omerbalyali.com/dosyalar/referanslar/web/mos bu siteyi Mozilla, Mozilla Firefox, Internet Explorer, Netscape Navigator çok güzel gösterirken Opera CSS ile belirlenen marjinleri düzgün göstermiyor. Ayrıca müşteri girişi kutularıda yanlış gözüküyor. Aynı şekilde http://www.omerbalyali.com bütün tarayıcılarda düzgün gözüküyor. __________________ çılgın bir elmas vardı artık bakışlarında

Seçenekler
Yazdırmaya Uygun Sayfa Sayfayı E-posta İle Gönder

Benzer Konular
Konu	Konuyu açana göre	Forum	Cevap	En Son Mesaj
PHP .net Kardeşliği	tayfundogdas	PHP	2	08/02/2007 23:54
a.html deki link b.html de iframe de nasıl acılır?	fatihed	Web Tasarım	3	06/03/2005 19:03
HTML KODLAYICI - Html Dosyalarının Kaynak Kodlarını Şifrelemek İstiyorsanız..	1941	Uygulama Yazılımları / Hazır Betikler	2	06/03/2005 13:42
CSS - HTML kardeşliği	fatihhayri	Web Tasarım	0	20/09/2004 16:01
lord of the rings: yüzük kardeşliği	RaiST	Oyunlar	5	23/11/2002 21:57