Web sitemin çirkin olmasının sebebi onu benim yapmış olmam

 (goodinternetmagazine.com)
22 puan yazan GN⁺ 2025-05-30 | 3 yorum | WhatsApp'ta paylaş
  • Bir başkası web sitemi daha havalı yapabilirdi ama o zaman artık benimki olmazdı
  • Bir web sitesinin karakteri, onu yapan kişinin zevkinden, takıntılarından ve doğrudan el izinden doğar
  • Sadelik ve yakınlık peşinde koşarak CSS ve JS’yi en aza indiriyor, doğrudan CSS varyasyon kuralları uygulayarak kaos, tekrar ve sahaf benzeri bir his yaratıyor
  • Site, kullanıcı etkileşimine yalnızca CSS ile tepki verecek şekilde tasarlandı; süssüz bir doku ve beklenmedik değişimler öne çıkıyor
  • Web sitesi durmadan değişiyor; sahibiyle birlikte büyüyor ve dönüşüyor, herkesin kendine özgü “çirkinliği” canlı kalıyor

Benim yaptığım web sitesi ve o çirkinliğin anlamı

  • Annem buzdolabına havalı bir resim asmak isteseydi, Vermeer, Lichtenstein ya da Wyeth gibi ünlü sanatçıların eserlerini kopyalayıp asardı
  • Ama annem öyle bir sanat değil, benim çizdiğim resmi istiyordu
  • Zevk sahibi bir tasarımcı sitemi havalı hale getirebilirdi ama o zaman artık bana ait olmazdı
  • Bazı insanlar ekmek pişirmek için buğday yetiştirmek, tuz çıkarmak ve maya kültürü üretmek ister; ben öyle değilim
  • Benim olgunlaşmamış damak zevkim, Olive Garden’ın breadstick’lerinden yığınla yemekten memnun
  • Bu zevk farkı, kişisel sahiplik hissinden doğuyor
  • Herkes kendi sebepleriyle internette kendine ait alanını kurup düzenliyor

Çeşitli kişisel web’lerin varlığı

  • Bütün bunlar, “bunu benden başkası yapamaz” diyen içsel motivasyon ve arzudan çıkıyor
  • Benim ekmek, sunucu ya da çip yapma motivasyonum yok ama o arzu, mizah, sistemler, yazılım ve yapı gibi şeylerle dışa vuruluyor
  • Duygular çok yoğunlaşınca kurgu, HTML/CSS, derme çatma robotlar, hüzünlü şarkılar olarak patlak veriyor
  • Bu yüzden web sitem benim

Sadelik ve karakterin bir arada oluşu

  • Eskiden sadece sadelik ve yakınlık istiyordum
    • Gürültüyü ayıklamak
    • Açık-koyu kontrastını vurgulamak
    • Menü derinliğini azaltmak
    • Sıkıcı HTML
    • Minimum CSS
    • JS’den kaçınmak vb.
  • 2023’te sitem böyle görünüyordu (orijinal yazıdaki görsele bakın)

Kaotik tasarım ve CSS hikâyesi

  • Bir noktada daha geniş yatay alan kullanmaya karar verince sorunlar başladı
  • İlk plan basitti: ul üzerine flex-wrap uygulamak
  • Ama metin de sarılınca, bağlantıların sınırları belirsizleşti
  • Kimi bunu inline gibi okuyordu, kimi de inline-block gibi hissediyordu
  • Daha fazla boşluk açmayı, her bağlantının etrafına kenarlık koymayı ya da bağlantılar arasına nokta yerleştirmeyi denedim ama içime sinmedi

  • Bu yüzden bağlantılara varyasyon verme yolunu seçtim

  • Ana sayfadaki kaos aslında birkaç basit kuraldan doğuyor

    li:nth-child(4n + 0) { transform: rotate(1deg); }  
li:nth-child(4n + 1) { transform: rotate(-0.6deg); }  
li:nth-child(4n + 2) { transform: rotate(0.5deg); }  
li:nth-child(4n + 3) { transform: rotate(-0.75deg); }  
li:nth-child(6n + 0) { font-family: Times; }  
li:nth-child(6n + 1) { font-family: Helvetica; }  
li:nth-child(6n + 2) { font-family: Georgia; }  
li:nth-child(6n + 3) { font-family: Times; }  
li:nth-child(6n + 4) { font-family: Arial; }  
li:nth-child(6n + 5) { font-family: "Trebuchet MS"; }

  • Başta daha fazla çeşitlilik için aralarında asal tam sayılar (coprime integer) kullanmıştım ama tekrar eden desenlerin inceliği daha çok hoşuma gitti

  • Minimalizmi seviyorum ama soğuk bir hissi sevmiyorum
  • “İkinci el kitapçı” gibi sıcak bir duyguyu vermek için birkaç CSS sürpriz öğesi daha ekledim 
    li:nth-child(5n + 2) { font-weight: 100; }  
li:nth-child(7n + 2) { letter-spacing: -1px; }  
li:nth-child(41n + 31) { transform: rotate(181deg); }
  • Web hâlâ etkileşimli bir mecra, bu yüzden JS olmadan da imleç hareketine tepki vermesini istedim
  • Aşağıdaki CSS sayesinde “çime dokunuyormuş hissi” yaratıyorum 
    li:nth-child(2n + 0):hover { transform: rotate(-2deg); }  
li:nth-child(2n + 1):hover { transform: rotate(2deg); }
  • Böylece imleç hareketine gerçek zamanlı tepki elde ettim
  • Ayrıca scrolljacking yapmadan kaydırma hissini güçlendirmek istediğim için, sayfanın kâğıt gibi görünmesini sağlayan dokulu bir arka plan yaptım
  • css-doodle kullanarak dokuyu sentezledim 
    svg {  
viewBox: .5 .5 10 10;  
fill: #000;  
circle*1000 {  
  cx, cy: @r(10), @r(10);  
  r: @r(.005, .01);  
  }  
}
  • Açık modda kâğıttaki toz hissini, koyu modda ise gece göğündeki yıldız hissini vermek istedim
  • 2024’te sitem böyle değişti (orijinal yazıdaki görsele bakın)

Değişen ben, değişen web sitesi

  • Çok geçmeden web sitem bambaşka bir görünüme kavuşacak
  • Çünkü web sitemin sahibi benim ve ben de durmadan değişiyorum
  • Sen de değişeceksin
  • Tutkuların ve değerlerin başka şeylere yayılacak
  • Çirkin görünse bile sana ait üretim yaşamaya ve hareket etmeye devam edecek

Yazının sahibi Taylor Troesh, taylor.town belediye başkanı, scrapscript’in yazarı ve derme çatma şeylerin tadını çıkaran biri

İlgili okumalar

3 yorum

 
secret3056 2025-05-30

Siteye girdim; gerçekten oldukça anlaşılmazmış...

https://taylor.town/
 
tsboard 2025-05-30

Yazının içeriğine derinden katılıyorum. Ben de berbat tasarım zevkimi gizlemek için tasarımcıların uzun uzun düşünüp hazırladığı framework'leri kullanarak çabalıyorum ama buna rağmen inatla bugüne kadar devam ettim.
Her seferinde daha iyi bir tasarımı düşünürken, orayı burayı düzelterek yapıp işletmenin keyfi var.
Bu tür uğraşlar sayesinde insan daha çok bağlanıyor ve daha fazla keyif alıyor galiba. haha
 
GN⁺ 2025-05-30
Hacker News görüşü
  • Haha, doğru söz. Çevremdeki geliştirici arkadaşlarımın çoğu kendi sitelerini çoktan Hugo ya da Jekyll gibi hazır şablonlara taşımıştı ama ben inatla CSS'i de backend'i de tamamen kendim yaptığım bir sistemle blogumu sürdürmeye devam ediyorum. Benim için asıl keyif 'bir web sitesine sahip olmak'ta değil, 'web sitesi yapma süreci'nde. Eğlenceli kısmı neden başkasına bırakayım ki, bilmiyorum. Biraz klasik arabayla bizzat uğraşmaya benziyor. Elbette temiz ve sağlam bir araba satın alabilirsin ama o zaman işin eğlencesi kalmaz. Önemli olan varış noktası değil; ben eğlencenin peşinden giden biriyim. Şirkette bütün gün, tasarımını ya da özelliklerini istediğim gibi özgürce belirleyemediğim siteler yapıyorum; bari kişisel sitem söz konusu olduğunda, her şeyi tamamen benim kontrol ettiğim o özgürlüğü asla bırakamam
    • Benim web sitem de tamamen kendi ellerimle yaptığım bir şey, hem de son 10 yılda neredeyse 10 kez baştan kurdum. Her yıl bir şeyleri yeniden düzenlemenin ayrı bir keyfi var. Ana sayfadaki matrix JS kodu (https://oxal.org, tıklarsanız şaşırabilirsiniz), benim yaptığım Static Site Generator genox ile derleniyor, CSS teması olarak da yine kendim yaptığım sakura kullanılıyor, bloga giderseniz (https://oxal.org/blog/) küçük bir cyborg sizi takip ediyor (taban görselini chatgpt ile oluşturdum, sprite animasyonunu da Piskel'de kendim yaptım), VPS'e manuel deploy ediyorum (make ile build alıyorum), özel bir konuma dosya yükleyen bir sürü shell script çalıştırıyorum, favicon'u da üniversite yıllarında piksel sanat olarak yapmıştım (bağlantı), kendi fontumu yapmayı denedim ama vazgeçip Naruto'dan ilham alan bir font kullandım, view-page-source ile kaynak koduna bakınca da ayrı bir keyif alabiliyorsunuz. Siteme baktığımda yazılım mühendisi olarak gelişimimin izlerini taşıdığını hissediyorum; bu yüzden bu sade eser benim için çok değerli
    • Benim ana sayfamı da (https://pablo.rauzy.name/) tamamen sıfırdan kendim yaptım. Build için sadece özel Bash scriptleri ve Makefile kullanıyor, tamamen statik bir yapıda çalışıyor. Tek satır JS yok. CSS çalışırken responsive yapı, mobil menü gibi şeyleri de kendim uyguladım. Muhtemelen kendi kendime birkaç rubric ya da yöntem de geliştirdim; böyle deneme yanılmaların gerçek eğlenceye dönüştüğünü düşünüyorum
    • Ben de aynı yoldan geçtim. Hugo ile başladım ama sonunda kendi static site generator'ümü yaptım: Loulou. Yapım sürecinin tamamı başlı başına keyifti ve kendim yapmış olmak gerçekten değerli bir deneyimdi. Sitem de burada
    • 'Bir web sitesine sahip olmak değil, onu yapmak keyifli' cümlesi tam özeti. Bu, Radiant şövalyelerinin 'Journey Before Destination' inancıyla da örtüşüyor. Çeşitli mitlerde de tekrar tekrar karşımıza çıkan bir tema bu. Herakles de insan olduğu dönemde harika işler başarıyordu; tanrı olunca bunları bıraktı. Mesaj şu: zorluğu ve insan tarafını elinden alma. Moraliniz bozulursa kuş sesi müziği (https://birdymusic.com) dinlemenizi öneririm. Bugün gördüğüm siteler arasında ya en havalısı ya da en tuhafı olabilir
    • Eğer amaç buysa güzel. Ama bazı web siteleri sadece basitçe belirli bir amaca hizmet edip işi bitirmek ister. Mesela bu site gibi, tek bir işi halletmesi yeterlidir
  • Orijinal yazıda gösterilen çirkin site görseli blog yazılarıyla dolu ama asıl yazı başka bir web sitesinde yayımlanmış. Pazarlama çerezleri ya da üyelik açılır pencereleri olmayacaksa, ben o çirkin siteye doğrudan gitmeyi tercih ederdim
    • Ekran görüntüsünde hello@taylor.town e-posta adresi görünüyor. Ben de aynı şeyi merak edip taylor.town'a (https://taylor.town/) girdim. Sonra da bu gönderi yayımlandıktan sonra site aşırı yavaşladı; muhtemelen Hacker News etkisi, yani HN hug of death, yaşanıyor
    • Ben bunun o meşhur 'enshittified web'e' karşı yazılmış bir eleştiri olduğunu sanmıştım. Bu siteyi kötü buluyorum ama şu yanları da komik: (1) basılı kitap satış banner'ı var (2) çerez onayı açılır penceresi var (3) 'Good Internet' başlığı, modern kötü web sitelerinin bütün sembolleri arasından zar zor görünüyor (4) manşet çerez açılır penceresinin arkasında kaldığı için okunması zor (5) çerez onayı banner'ını kapatınca bu kez sürekli duran çerez ayarları simgesiyle "+ Become a Member" düğmesi kalıyor. Buna kıyasla taylor.town gerçekten iyi web sayılır
    • Muhtemelen çirkin sitenin arka planı ya da yazı tipi/renk seçimleri kötü olduğu için okunması zor ve bu yüzden yazıyı başka bir siteye koymuşlar. Örnek: taylor.town/wealth-000. Ben de kişisel sitemi kendim yaptım ama çirkin değil. Bence o kişinin sitesi bilerek çirkinleştirilmiş; biraz kendi kendine hayranlık gibi duruyor
  • 'Çirkin ama ilginç' örneklerle 'çirkin ve sıkıcı' sitelerin ayrı şeyler olduğunu düşünüyorum. Bu site ikinci kategoriye daha yakın. Esasen CMS'in bir markdown klasörü etrafında dönüp başlıkları link olarak saçmasapan listelediği bir şeye benziyor. Bilgi mimarisi hiç yok; kategori, ikon, görsel, tarih hiçbir şey olmadığı için her şey aynı ağırlıkta görünüyor. Tek yaptığı, sadece 'farklı' dursun diye öğeleri yerleştirmek gibi. Geliştirici bloglarının çoğu zaten trafiğini arama motorlarından alıyor, dolayısıyla ana sayfa tasarımı çok önemli olmayabilir; ama eğer okuyucuların aktif şekilde keşif yapacağı bir mimari kurmak isteseydi, niyet ile sonuç arasında biraz hayal kırıklığı var. Sonuçta varsayılan Ghost şablonunu kullanan bir blogdan o kadar da farklı hissettirmiyor
    • Buna gerek yok. Önemli olan, yazarın bunu okuyucuyu memnun etmek için değil, kendini memnun etmek için yapmış olması. Bu yüzden dışarıdan gelen görüşler o kadar da belirleyici bir nokta değil
    • Sanırım yazarın asıl mesajını kaçırmışsın
  • Framework'le web sitesi yapınca herkesinkiyle aynı görünen bir his çıkıyor ve hiç eğlenceli olmuyor. İş amacıyla yapılıyorsa anlarım ama kendini ya da işlerini göstermek içinse, karakteri olan bir web sitesinin daha anlamlı olduğunu düşünüyorum. SEO ya da retention açısından verimsiz olsa bile, kendi kişiliğini yansıtmak daha iyi görünüyor. Günümüzdeki site kurucularının fazla yapısal ve tekdüze hale gelmesinden hoşlanmıyorum. Geocities ya da Freewebs dönemindeki, okunması zor arka plan görselleri, otomatik çalan müzikler, fareyi takip eden imleçler, alevlerin önünde dönen kafatasları... bunları gerçekten özlüyorum
  • Bu felsefenin internetin ilk dönemlerindeki hissi korumasını çok seviyorum. Flash sitelerin tuhaf gezinme yapıları ve sorunları yüzünden bolca eleştirildiği bir dönemdi ama tüm bu kusurların ötesinde, siteleri kendine özgü biçimde kuran yaratıcılığa saygı duyuyorum. Bugün internet fazla tek tip hale geldi ve bence AI üretimi içerik yüzünden daha da kötüleşecek. Standartlaşmamış köşeleri görmek ferahlatıcı
  • Bu felsefeye tamamen katılıyorum. Benim web sitem tamamen 'ben' denen kişiyi ifade ediyor. Birileri çirkin diyebilir, fazla amatörce diyebilir ama ben bu tarzdan memnunum. Web'de de dünyada da böyle uyumsuz tavırların daha fazla olmasını isterdim
  • Yazıyı gerçekten keyifle okudum. Geçmişte 'old web'in güzel olmasının nedeni, ortada belirgin standartlar olmaması ve insanların kendi başlarına deneysel şeyler üretmesiydi. Biraz daha dağınıktı ama gerçekten havalı ve karakterli bir siteyi tesadüfen keşfetmenin verdiği heyecan bambaşkaydı. Bugünün web'i fazla yapısal, fazla resmî hissettiriyor ve çoğu yer aynı şablonlar ve framework'lerle kurulduğu için öngörülebilir bir tüketim alanına dönüşmüş durumda. Keşif duygusu kayboldu
  • O kişinin 2023'teki web sitesi çirkin değildi, minimalist bir havası vardı. Şimdi ise gerçekten çirkinleşmiş. İlk başta 2023 sürümüne bakıyorum sanıp yazıya katılmıştım ama gerçekten çirkin olan sürümü görünce mesajın kendisine karşı daha olumsuz hissettim
    • 'Şimdi gerçekten çirkin olduğu için mesaj değişiyor' denmesini pek anlamıyorum. Bu yazının bütün mesajı, başkalarının ne düşündüğüne aldırmadan, insanın sevdiği ve keyif aldığı şekilde istediğini yapmasında anlam bulması. Pek çok kişinin bunu çirkin buluyor olması, bence siteyi ve mesajını daha da çekici kılıyor. Sadece görünüşe takılıp hayal kırıklığı yaşadığınız anda asıl noktayı kaçırmış oluyorsunuz
    • Eski tasarım temizdi, minimaldi ve... özel bir yanı yoktu. Şimdiki hâli ise bilinçli şekilde dağınık bir kaos. Çirkin olsun ya da olmasın, akılda kalıyor. Eksi yanları da var elbette (mesela belli bir bağlantıyı sonra tekrar bulmak zor olabilir) ama bu, o kişi için önemli görünmüyor. Gerçekten istediği şey 'rahatsızlık', 'uyumsuzluk', 'merak' ve her şeyden önce '/bana ait/' bir şey
  • Henüz kişisel bir sitem yok. Yaptığımda HTML+CSS+JS ya da JQ ile düzgünce yapmayı düşünüyorum. Apache ya da nginx gibi bir web sunucusu da değerlendiriyorum. AWS free tier'a ya da paylaşımlı hostinge koymayı planlıyorum. Sadece div'i tam ortaya hizalamanın yolunu çözersem hemen başlayabilirim gibi
    • AWS free tier'da S3 + cloudfront kombinasyonuyla 1 yıldır sıfır maliyetle çalıştırıyorum. Muhtemelen fiyat/performans açısından en iyisi bu. Benim sitem HTML+CSS tek sayfa; ChatGPT bana bir şablon oluşturdu, ben de aynen kullandım. Mobilde ve masaüstünde düzgün çalışacak şekilde kendim yapabilecek kadar iyi değilim, o yüzden şimdilik böyle memnunum
    • Birkaç dakikanı ayırıp Neocities üzerinde hemen başlamanı öneririm
    • div ortalamak neden meme oldu pek anlamıyorum 
        width: 60%; // istediğin kadar genişlik ver
  margin: 0 auto;
      Şimdi bloguna başlayabilirsin
    • Ben de aynısını yapmıştım: domi.work Ben de çirkin yaptım :)
    • Ben de benzer gidiyorum; üstüne 11ty koyup static build alıyor, netlify pages ile deploy ediyorum
  • Temiz bir şablonla yapılan sitelerin hepsi birbirine benziyor ama elde yapılmış her sitenin dünyada tek olan bir 'köşe bucak tuhaflığı' var. Kişisel bir projede Tailwind landing page yerine 'wabi-sabi HTML'i seçerdim