<Blink> ve <Marquee> (2020)

• 90'ların başındaki web döneminde ortaya çıkan <blink> ve <marquee> etiketleri, o dönemin web tasarımının simgesel unsurlarıydı
• <blink> etiketi Netscape Navigator 2.0 ile tanıtıldı ve şakacı amacı ile estetik açıdan zayıf olmasına rağmen yaygın biçimde kullanıldı
• Microsoft buna karşılık Internet Explorer'a <marquee> etiketini ekledi ve metin animasyonlarını çok daha çeşitli biçimde kontrol etmeyi mümkün kıldı
• İki etiket iç içe kullanıldığında tarayıcıya göre farklı animasyon efektleri sunmak mümkün oluyordu; bu da aşamalı iyileştirme ilkesinin bir örneği olarak anılıyor
• Bugün <blink> ortadan kalktı, <marquee> de artık önerilmiyor; ancak web tarihi ve çevrimiçi nostaljinin temsilî örnekleri arasında anılmaya devam ediyor

---

Giriş: <blink> ve <marquee> etiketlerini hatırlamak

• Yakın zamanda bir web geliştiricisi meslektaşımla konuşurken HTML <blink> ve <marquee> etiketleri hakkında şaka yaptım; karşımdaki geliştiricinin bu iki etiketi bilmediğini fark ettim
• Bu etiketler bugün genç geliştiricilere yabancı gelebilir, ancak bir zamanlar 90'lar web tasarımının simgesel unsurlarıydı

<blink> etiketinin ortaya çıkışı ve tarihi

• <blink> etiketinin yaratıcısı olarak sıkça Lynx tarayıcısının geliştiricisi Lou Montulli gösterilse de, kendisi kodu doğrudan yazmadığını söylüyor
• Anlattığına göre, bir barda Netscape mühendisleriyle yapılan sohbet sırasında Lynx gibi metin tabanlı tarayıcılarda da kullanılabilecek bir “metin yanıp sönme efekti” şaka yollu önerildi; bunun ardından başka bir mühendis gece boyunca çalışıp bunu hayata geçirdi
• 1995'te Netscape Navigator 2.0 ile <blink> etiketi resmen tanıtıldı ve hareketli GIF'lerle birlikte, erken dönem JavaScript ile beraber kişisel web sitesi deneyimini tanımlayan unsurlardan biri oldu
• <blink> etiketi herhangi bir öznitelik olmadan kullanılıyordu ve HTML4'te resmî olarak şaka amaçlı etiket olarak kaydedilmesine rağmen 90'ların sonlarında yaygın biçimde kötüye kullanıldı
• “Son güncellemeler” vurgusu gibi çeşitli mesajlara dikkat çekmek için sıkça kullanıldı

<marquee> etiketi ve tarayıcılar arası rekabet

• Aynı yıl Microsoft'un duyurduğu Internet Explorer 2.0, Netscape'in <blink> etiketinden farklı olarak <marquee> etiketini tanıttı
• <marquee> etiketi kaydırma yönü, hız, tekrar edip etmeme gibi çeşitli özniteliklerle animasyonu ayarlayabiliyordu
• <blink> daha çok şaka yollu biçimde görsel okunabilirliği bozabilecek bir etki sunarken, <marquee> efekti bilinçli olarak öne çıkarıyordu
• 90'ların sonlarında iki etiketi birlikte kullanma yöntemi—<marquee> içinde <blink>—tarayıcıya göre (IE ve Netscape) farklı efektler vermenin popüler bir yolu hâline geldi

Aşamalı iyileştirme (Progressive Enhancement) ve web uyumluluğu

• <blink> ve <marquee>'nin iç içe kullanımı, web tarayıcılarının desteklemediği etiketleri yok sayıp içeriği yine de göstermesi anlamına gelen Postel’s Law (hoşgörü ilkesi) ile ilişkilendiriliyor
• Yeni HTML öğeleri (<video> gibi) de bu nedenle çoğu zaman kendi kendine kapanmayan etiketler olarak tasarlanarak uyumluluğu korumaya çalıştı
• <blink>/<marquee> gibi etiketler kullanıldığında, bu etiketleri tanımayan tarayıcılarda bile bilgi içeriği okunabiliyordu
• Web, tüm kullanıcılara bilgi sunma ve yalnızca bazı tarayıcılarda ek efektlerin görülebilmesini sağlama fikri olan aşamalı iyileştirme kavramına dayanır

Farklı tarayıcılardaki değişim ve destek

• Opera kullanıcıları ücretli lisans kullanıyor olsalar bile <blink> ya da <marquee> efektlerini neredeyse hiç görmüyordu; ancak içeriğe erişimde sorun yaşamıyorlardı
• Netscape 7, hem <blink> hem de <marquee>'yi destekleyen neredeyse tek tarayıcıydı; böylece aynı anda kaydırma + yanıp sönme efektini uygulayabiliyor ve web'in en zor izlenir efektlerinden birini üretebiliyordu

Sonuç: bugünkü yeri ve web tasarımına verdiği ders

• <blink> etiketi bugün tamamen ortadan kalktı (modern tarayıcılar desteklemiyor); gerekirse CSS animasyonları ile yerine konabilir
• <marquee>, bazı tarayıcılarda hâlâ yerleşik destek veya polyfill bulunsa da kullanımı önerilmiyor
• Web tarihinin ve geçmiş çevrimiçi estetiğin simgelerinden biri olarak, ayrıca web standartları ile erişilebilirlik ve bakım kolaylığı açısından öğretici bir örnek olarak yaşamayı sürdürüyor
• Dijital nostaljiyle ilgileniyorsanız, eski web tasarımıyla ilgili kaynaklara veya sitelere göz atabilirsiniz

[GN⁺]

Hacker News görüşleri

• Eskiden aşağıdaki bağlantıdaki gibi bir sitenin var olduğunu hatırlıyorum https://web.archive.org/web/20201111125145/https://danq.me/2020/11/11/blink-and-marquee/

• Ben kendimi sanki 3.000 yıldır varmış gibi hissedenlerdenim. Frame navigation'ın kötü bir pratik olup olmadığı üzerine hararetli tartışmaların yapıldığı günleri hatırlıyorum (iframe değil, frame). Frame'i bilen birini görmek güzel olurdu. AJAX çıkmadan önce, sayfayı yenilemeden sunucuya mesaj göndermek için HTTP 204'ü bizzat kullanıyordum. 2000'lerin başında image map de yaptım image map için bkz.: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/map. Dreamweaver'da günlerce harita sınırları çizip tıklanabilir bir ülke haritası tamamladığım da oldu. Dreamweaver template'leri version control kullanmadığı için, güncelleme yaparken değişikliklerin tamamen kaybolup geri döndürülemez hale gelmesi de çok olurdu. input type=image ile görselde tıklanan konumu backend tarafında işlediğimi de hatırlıyorum. Motion JPEG kullanarak sayfada streaming update bile yaptım; hâlâ Chrome'da çalışıyor ama Firefox'ta biraz kararsız. IE'de PNG alpha blending sorununu çözmek için türlü yöntemler denedim, sonunda bir süre ActiveX sürümünü kullandım ama flat design moda olunca ihtiyaç kalmadı. Navigasyon için JAVA, Flash, Silverlight hepsini kullandım. Spacer GIF'ler, conditional comment'ler ve Firebug çıktıktan sonra geliştirme ortamının ne kadar rahatladığını da çok net hatırlıyorum. Zamanın nasıl geçtiğini anlamadan yaşlandığımı hissettiren bir deneyim bu

  • Eskiden frame'lerle web yazılımı geliştirdim ve pek bir sorun hissetmedim. İnsanlar erişilebilirlikten bahsediyor ama tam olarak nerede sorun olduğunu hâlâ pek bilmiyorum

  • IE6'nın bütün tuhaf bug'ları ve sınırlamaları içinde destek isteyen müşteriler için çalıştığımı hatırlıyorum. Tasarımcı Photoshop'tan yuvarlatılmış köşeli bir tasarım gönderdiğinde her seferinde iç çekmekten başka çare kalmazdı. O zamanlar responsive dedikleri şey aslında farklı masaüstü çözünürlüklerine uyum sağlamaktan ibaretti. Köşeleri görsel olarak kesip doğrudan tablo hücrelerine yerleştirmek gerekirdi. Bu kadar el işi yapınca geliştiricinin zihinsel dayanıklılığı ciddi biçimde artıyor

  • Photoshop slice aracıyla görselleri ince ince bölüp gif olarak dışa aktardıktan sonra HTML tablolarında tam yerine oturtmaya çalıştığımız günleri hatırlıyorum. 800x600 çözünürlüğe optimize edilmiş tasarımların çok olduğu bir dönemdi. Bütün bu anılar zamanın içinde eriyip gitmiş gibi

  • Hâlâ birkaç kez ziyaret ettiğim ve frame kullanan siteler var. Open Group/POSIX sitesi hâlâ frame kullanıyor

  • Frame kullanarak bir web chat yapmıştım. Yukarıda sonsuz yüklenen bir sohbet penceresi, aşağıda bir input box vardı; mesaj gönderirken yenilemeyi engellemek için 204 kullanıyordum. Üst frame'den, user list'in olduğu sağ frame'i reload eden küçük bir script de gönderebiliyordum. 2000 civarında birkaç arkadaşımla birlikte kullanmıştık

• Bir zamanlar sadece saf marquee etiketiyle animasyon yapan bir site yapmıştım. Hiç JavaScript kullanmadım, birine gösterince herkes şaşırıyordu https://udel.edu/~ianozi/

  • marquee etiketini görmeyeli 20 yıl olmuştur herhalde; direction parametresiyle dikey kaydırmanın da mümkün olduğunu bilmiyordum sanırım

• marquee etiketiyle en sevdiğim numara onu iç içe kullanmaktır. Yönleri farklı yaparsanız, içteki marqueeyi ters yönde aynı hıza ayarlayarak bir an durup sonra hareket eden bir etki yaratabilirsiniz. Hızları farklı yaparsanız daha karmaşık hareketler de üretilebiliyordu. Bunun düzgün çalışması için inner marqueeye bir max-width vermek gerekiyordu diye hatırlıyorum

• Eskiden blink etiketinden o kadar nefret ederdim ki kullandığım tarayıcının (muhtemelen Netscape) binary dosyasında blink yazısını blonk ile değiştirip artık yanıp sönmemesini sağlamıştım

  • Ben bu tarz binary tweak'leri en çok Slack istemcisinde yapıyorum (Electron uygulaması olduğu için aşırı kolay). Hoşuma gitmeyen özellikleri de (ör. bildirimleri gizleme, yazıyor sinyalini engelleme vb.) kolayca kaldırabiliyorum

  • Biri blonk etiketini kullandıysa artık blonking diye bir şey ortaya çıkmış olabilir. Oldukça eğlenceli bir hack gibi duruyor

  • Binary düzenlemek oldukça eğlenceli. "__gnu_warning" ifadesini "__gnu_whining" yaparak gets() uyarı mesajlarını ortadan kaldırırdım. Buffer overrun olabilir tabii ama alelacele yazılan kodlarda o kadar da umursamıyordum

• marquee etiketini HTML injection testi için çok faydalı buluyorum. Neredeyse kimsenin kullanmadığı hareketli bir etiket olduğu için saldırının işe yarayıp yaramadığını hemen anlayabiliyorsunuz. Teknik olmayan insanlara da, hareket etmemesi gereken bir yerde metnin hareket ettiğini göstermek, bold gibi şeylerden çok daha etkili biçimde riskin anlaşılmasını sağlıyor

  • HTML sanitization yaparken, easter egg olarak yalnızca marqueeyi whitelist'te bırakıp geri kalanların neredeyse hepsini engelliyorum

  • Hacker News'i özel bir aggregator üzerinden okuyorum ve bu yazı sayesinde bunun HTML injection'a açık olduğunu fark ettim. 2020 tarihli yazı ekranda marquee olarak dolaşıyordu

• "Canavar, intikamın dönen bulutlarıyla çevrili olarak belirecek. İnançsızların evi yıkılacak ve etiketleri son gelene kadar yanıp sönecek." – The Book of Mozilla, 12:10 (about:mozilla) sözünü görünce, şimdi Mozilla'nın da yok olmakta olduğunu düşünüyorum. Tam bir kıyamet hissi var

  • Ben hâlâ varsayılan tarayıcı olarak Firefox kullanıyorum

• Üniversite yurdu katının web sitesini kendi bilgisayarımda çalıştırdığım günleri hatırladım. marquee içinde 997 kelimelik uzun bir mesaj bırakmıştım; kadınlar, depresyon, felsefe ve başka şeyler hakkında dağınık dağınık yazıyordum. Mesajın sonunda bir ! işareti vardı ve o gizli bir sayfaya bağlantı veriyordu. Sonunda biri view source ile o uzun metni okuyup sayfayı bulmuştu

• Arkadaşım, escaping eksikliği ve olası XSS olup olmadığını hızlıca test etmek için ikinci adına hep blink etiketi sarardı. Eskiden bu kadar basit yöntemler bile zafiyet bulmakta oldukça etkiliydi

• Bu yorum şu anda yapım aşamasındadır. Güncellemeler için sık sık tekrar ziyaret edin

  • Ziyaretçi sayacıyla ziyaretçi defteri nerede acaba

  • Bu sayfa hangi tarayıcı için optimize edilmiştir acaba

  • [NEW] ibaresini eklemeyi unutmayın