Situs web saya jelek karena memang saya yang membuatnya

• Seseorang mungkin bisa membuat situs web saya jadi lebih keren, tetapi kalau begitu itu tidak akan menjadi milik saya
• Kepribadian sebuah situs web lahir dari selera, obsesi, dan sentuhan langsung pembuatnya
• Dengan mengejar kesederhanaan dan keakraban, saya meminimalkan CSS dan JS, lalu menerapkan aturan variasi CSS yang langsung untuk menciptakan kesan kacau, berulang, dan bernuansa toko buku
• Situs ini dirancang agar merespons interaksi pengguna hanya dengan CSS, sehingga ciri khasnya adalah tekstur yang polos dan perubahan yang tak terduga
• Situs web terus berubah dari waktu ke waktu, tumbuh dan bertransformasi bersama pemiliknya, membuat 'yang jelek' versi masing-masing tetap hidup dan bergerak

---

Situs web yang saya buat, dan makna di balik kejelekannya

• Kalau ibu saya ingin menempelkan gambar keren di kulkas, ia bisa saja menempelkan reproduksi karya seniman terkenal seperti Vermeer, Lichtenstein, atau Wyeth
• Tapi yang ibu saya inginkan bukan seni seperti itu, melainkan gambar yang saya buat sendiri

• Seorang desainer yang peka estetika mungkin bisa membuat situs saya tampak keren, tetapi kalau begitu itu bukan lagi milik saya

• Untuk memanggang roti, ada orang yang ingin menanam gandum, menambang garam, dan membiakkan ragi, tetapi saya tidak seperti itu
• Selera saya yang belum matang sudah puas dengan makan banyak breadstick dari Olive Garden

• Selera semacam ini lahir dari rasa memiliki yang berbeda pada tiap orang
• Dengan alasan masing-masing, setiap orang menata ruang internetnya sendiri

Keberagaman web personal

• Ada orang yang menjalankan situs web self-hosted bertenaga surya
• Ada juga yang membagikan kebijaksanaan melalui Substack
• Ada orang yang mendalami lantai produksi/manufaktur di YouTube
• Gwern melakukan sesuatu yang unik

• Semua tindakan ini berangkat dari dorongan batin dan hasrat bahwa "tidak ada orang lain selain saya yang bisa melakukannya"
• Saya tidak punya dorongan untuk membuat roti, server, atau chip, tetapi hasrat itu muncul dalam bentuk humor, sistem, perangkat lunak, dan struktur
• Saat emosi menjadi terlalu kuat, ia meledak keluar sebagai fiksi, HTML/CSS, robot murahan, lagu sedih, dan sebagainya

• Jadi situs web saya adalah milik saya

Kesederhanaan dan kepribadian yang hidup berdampingan

• Dulu saya hanya menginginkan kesederhanaan dan keakraban
  • menghilangkan noise
  • menegaskan kontras
  • mengurangi kedalaman menu
  • HTML yang membosankan
  • meminimalkan CSS
  • menghindari JS, dan seterusnya
• Pada 2023 situs saya seperti ini (lihat gambar di artikel asli)

Desain yang kacau, dan cerita tentang CSS

• Di suatu titik, masalah mulai muncul ketika saya memutuskan untuk memakai ruang horizontal yang lebih lebar
• Rencana awalnya sederhana: menerapkan flex-wrap pada ul
• Tetapi karena teksnya juga ikut terbungkus, batas antar tautan jadi tidak jelas

• Ada yang membacanya sebagai inline, ada juga yang merasakannya seperti inline-block
• Saya juga mencoba menambah lebih banyak jarak kosong, memberi bingkai pada setiap tautan, atau menyisipkan titik di antara tautan, tetapi tidak ada yang terasa pas

• Jadi saya memilih cara memberi variasi pada tautan

• Kekacauan di halaman utama sebenarnya berasal dari beberapa aturan sederhana

  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"; }  
  

• Awalnya saya memakai bilangan bulat koprima (coprime integer) untuk menciptakan lebih banyak variasi, tetapi justru kehalusan pola berulang itu yang saya sukai

• Saya mencintai minimalisme, tetapi tidak suka kesan yang dingin
• Untuk mengekspresikan nuansa hangat seperti "toko buku bekas", saya menambahkan beberapa elemen CSS yang mengejutkan

  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 tetaplah media interaktif, jadi saya ingin ia merespons gerakan kursor bahkan tanpa JS
• Berkat CSS di bawah ini, saya menciptakan sensasi seperti "menyentuh rumput"

  li:nth-child(2n + 0):hover { transform: rotate(-2deg); }  
  li:nth-child(2n + 1):hover { transform: rotate(2deg); }  
  

• Dengan ini, saya mewujudkan respons real-time terhadap gerakan kursor
• Lalu, karena saya ingin menonjolkan rasa scroll tanpa scrolljacking, saya membuat halaman tampak seperti 'kertas' dengan latar bertekstur
• Saya memakai css-doodle untuk menyintesis tekstur

  svg {  
  viewBox: .5 .5 10 10;  
  fill: #000;  
  circle*1000 {  
    cx, cy: @r(10), @r(10);  
    r: @r(.005, .01);  
    }  
  }  
  

• Dalam mode terang, teksturnya terasa seperti debu di atas kertas; dalam mode gelap, seperti bintang di langit malam
• Pada 2024 situs saya berubah menjadi seperti ini (lihat gambar di artikel asli)

Saya berubah, situs web pun berubah

• Dalam waktu dekat situs web saya akan berubah menjadi sesuatu yang sama sekali berbeda
• Karena saya adalah pemilik situs web saya, dan saya sendiri juga terus berubah

• Anda pun akan berubah
• Gairah dan nilai-nilai Anda akan menyebar ke hal lain
• Meski terlihat jelek, karya ciptaan Anda sendiri akan terus hidup dan bergerak

---

Penulis Taylor Troesh adalah pengelola taylor.town, penulis scrapscript, dan seseorang yang menikmati hal-hal murahan

[secret3056]

Saya sempat membukanya, dan memang benar-benar sulit dipahami...

https://taylor.town/

[tsboard]

Saya sangat relate dengan isi tulisannya. Saya juga berusaha menyembunyikan selera desain saya yang payah dengan memakai framework yang dibuat para desainer dengan penuh pertimbangan, tetapi meski begitu saya tetap keras kepala terus melakukannya sampai sekarang.
Setiap kali memikirkan desain yang lebih baik, ada keseruan tersendiri dalam membangun dan mengelolanya sambil memperbaiki ini itu.
Berkat aktivitas seperti ini, rasanya saya jadi lebih sayang dan juga lebih menikmatinya. hehe

[GN⁺]

Komentar Hacker News

• Haha, benar juga. Sebagian besar teman developer di sekitarku sudah lama memindahkan situs mereka ke template jadi seperti Hugo atau Jekyll, tapi aku tetap keras kepala mempertahankan blogku dengan sistem yang kubuat sendiri sepenuhnya, dari CSS sampai backend. Buatku, kesenangan sejatinya bukan pada 'memiliki situs web', melainkan pada 'proses membuat situs web'. Aku tidak mengerti kenapa bagian yang paling seru justru harus diserahkan ke orang lain. Mirip seperti merawat mobil klasik sendiri. Memang bisa saja beli mobil yang rapi dan kokoh, tapi jadinya tidak seru. Yang penting bukan tujuannya, aku ini tipe orang yang mengejar kesenangan. Karena di kantor aku seharian membuat situs yang desain atau fiturnya tidak bisa kutentukan sesuka hati, maka untuk situs pribadiku sendiri aku sama sekali tidak bisa melepaskan kebebasan untuk mengendalikannya sepenuhnya
  • Situs webku juga sepenuhnya hasil buatan sendiri, dan selama 10 tahun terakhir sudah hampir 10 kali kubangun ulang. Ada kesenangan tersendiri membenahi sesuatu setiap tahun. Kode JS matrix di halaman depan (kalau klik https://oxal.org mungkin bakal kaget), dibangun dengan Static Site Generator buatanku sendiri genox, juga memakai tema CSS buatan sendiri sakura. Kalau masuk ke blog(https://oxal.org/blog/), ada cyborg kecil yang mengikuti. Gambar dasarnya kubuat dengan chatgpt, lalu animasi sprite-nya kukerjakan sendiri di Piskel. Deploy ke VPS kulakukan manual (build dengan make), aku juga menjalankan banyak shell script untuk mengunggah file ke lokasi privat, favicon-nya pun kubuat sendiri sebagai pixel art saat masih kuliah (tautan). Aku sempat mau membuat font sendiri lalu menyerah dan akhirnya memakai font yang terinspirasi dari Naruto. Kalau melihat source code lewat fitur 'view-page-source', ada kesenangan lain lagi. Saat melihat situsku, aku merasa ada jejak pertumbuhanku sebagai software engineer di sana, jadi karya sederhana ini sangat berharga bagiku
  • Homepage-ku(https://pablo.rauzy.name/) juga kubuat sendiri sepenuhnya dari nol. Strukturnya sepenuhnya statis, hanya memakai Bash script dan Makefile kustom untuk build. Tidak ada satu baris pun JS. Sambil mempelajari CSS, aku juga mengimplementasikan sendiri hal-hal seperti responsivitas dan menu mobile. Sepertinya aku bahkan menciptakan beberapa rubrik atau metodologi versiku sendiri, dan trial and error seperti ini benar-benar terasa menyenangkan
  • Aku juga menempuh perjalanan yang sama. Awalnya pakai Hugo, lalu akhirnya membuat static site generator-ku sendiri, yaitu Loulou. Selama proses pembuatannya benar-benar menyenangkan, dan setelah mencoba membuatnya sendiri, ternyata memang pengalaman yang sangat berharga. Situsku ada di sini
  • Kalimat 'yang menyenangkan itu bukan memiliki situs web, melainkan membuatnya' memang inti semuanya. Ini terasa sejalan dengan keyakinan Knights Radiant: 'Journey Before Destination'. Ini juga cerita yang berulang di banyak mitologi. Herakles pun, saat masih manusia, melakukan hal-hal luar biasa, lalu ketika menjadi dewa ia berhenti. Pesannya adalah jangan biarkan kesusahan dan sisi kemanusiaanmu dirampas. Kalau sedang kesal, aku rekomendasikan dengar musik suara burung di https://birdymusic.com. Bisa jadi itu situs paling keren atau paling aneh yang kulihat hari ini
  • Kalau memang itu tujuannya, bagus saja. Tapi ada juga situs web yang hanya ingin menyelesaikan tujuan tertentu secara sederhana lalu selesai. Misalnya situs ini yang cukup melakukan satu tugas spesifik
• Di gambar situs jelek yang muncul di tulisan aslinya, halaman itu penuh dengan posting blog, tetapi tulisan yang sebenarnya justru dipasang di situs lain. Kalau saja tidak ada cookie marketing atau popup membership, aku malah lebih ingin langsung pergi ke situs jelek itu
  • Di screenshot terlihat email [e-mail]. Aku juga penasaran hal yang sama, jadi aku mengunjungi taylor.town(https://taylor.town/). Dan setelah posting ini muncul, loading situsnya jadi sangat lambat, jadi mungkin terkena efek Hacker News, HN hug of death
  • Kukira ini tulisan kritik terhadap 'enshittified web' yang umum itu. Menurutku situs ini memang buruk, tapi justru ada sisi lucunya juga: (1) ada banner penjualan buku cetak (2) ada popup persetujuan cookie (3) header 'Good Internet' sedikit terlihat di tengah simbol-simbol semua hal buruk dari situs web modern (4) headline-nya sulit dibaca karena tertutup popup cookie (5) setelah banner persetujuan cookie disingkirkan, sekarang malah ada ikon pengaturan cookie yang selalu muncul dan tombol "+ Become a Member". Dibanding itu, taylor.town benar-benar web yang bagus
  • Mungkin artikelnya dipasang di situs lain karena latar belakang situs jeleknya atau pilihan font/warna membuatnya tidak nyaman dibaca. Contoh: taylor.town/wealth-000. Aku juga membuat situs pribadi sendiri, tapi tidak jelek. Menurutku situs orang itu memang sengaja dibuat jelek, agak terasa seperti terlalu asyik dengan dirinya sendiri
• Menurutku ada perbedaan antara contoh yang 'jelek tapi menarik' dan situs yang 'jelek dan membosankan'. Situs ini lebih dekat ke yang kedua. Pada dasarnya rasanya seperti CMS yang hanya berputar-putar di folder markdown lalu menampilkan judul sebagai tautan. Tidak ada arsitektur informasi sama sekali; tidak ada kategori, ikon, gambar, atau tanggal, jadi semuanya terlihat punya bobot yang sama. Satu-satunya yang dilakukan hanyalah menyusunnya agar tampak 'unik'. Karena kebanyakan blog developer mendapat trafik dari mesin pencari, desain homepage mungkin memang tidak terlalu penting. Tapi kalau tujuannya membangun arsitektur agar pembaca mau menjelajah secara aktif, usaha dan hasilnya terasa agak mengecewakan. Pada akhirnya rasanya tidak jauh berbeda dari blog yang memakai template Ghost bawaan
  • Tidak perlu begitu. Yang penting adalah hasil ini dibuat penulis untuk memuaskan dirinya sendiri, bukan untuk memuaskan pembaca. Jadi opini dari luar bukanlah poin yang terlalu penting
  • Kurasa kamu melewatkan inti pesan penulis
• Kalau membuat situs web dengan framework, hasilnya jadi cuma punya tampilan dan nuansa yang sama seperti orang lain, dan itu sama sekali tidak seru. Kalau untuk tujuan bisnis masih bisa dimengerti, tapi kalau untuk menampilkan diri sendiri atau karya sendiri, menurutku situs web yang punya kepribadian jauh lebih bermakna. Meski tidak efisien untuk SEO atau retensi, sepertinya lebih baik memasukkan kepribadian kita sendiri. Aku tidak suka karena website builder sekarang terlalu terstruktur dan seragam. Aku malah sangat merindukan masa Geocities atau Freewebs dulu: gambar latar yang susah dibaca, musik autoplay, kursor yang mengikuti mouse, tengkorak berputar di depan api, hal-hal seperti itu
• Aku sangat suka karena filosofi ini mempertahankan nuansa internet awal apa adanya. Dulu memang banyak kritik terhadap situs Flash karena navigasinya aneh dan banyak masalah, tapi di luar kekurangan itu aku tetap menghargai kreativitas dalam membuat situs yang unik. Sekarang internet terlalu terseragamkan, dan kurasa akan makin parah karena konten buatan AI. Menyenangkan melihat sudut-sudut yang tidak distandardisasi
• Aku sangat setuju dengan filosofi ini. Situs webku sepenuhnya mengekspresikan diriku sebagai pribadi. Meskipun ada yang bilang jelek atau terlalu tidak profesional, aku sendiri puas dengan gaya seperti ini. Aku berharap di web, dan juga di dunia, ada lebih banyak sikap tidak konformis seperti ini
• Tulisannya enak sekali dibaca. Alasan kenapa "old web" dulu terasa bagus adalah karena tidak ada standar yang terlalu tegas, jadi orang-orang bebas bereksperimen membuat sesuatu dengan caranya masing-masing. Memang sedikit lebih kacau, tetapi ada sensasi luar biasa saat tanpa sengaja menemukan situs yang benar-benar keren dan penuh karakter. Web sekarang terlalu terstruktur dan formal, dan kebanyakan dibuat dengan template serta framework yang sama, sehingga berubah menjadi ruang konsumsi yang mudah ditebak. Rasa petualangannya hilang
• Situs web orang itu pada 2023 sebenarnya tidak jelek, malah terasa minimalis. Sekarang benar-benar jadi jelek. Awalnya kukira yang dimaksud adalah versi 2023, jadi aku setuju dengan isinya, tapi setelah melihat versi yang benar-benar jelek itu, aku malah jadi bersikap negatif terhadap pesannya sendiri
  • Aku kurang paham dengan maksud 'sekarang benar-benar jelek jadi pesannya terasa berbeda'. Seluruh pesan tulisan ini adalah bahwa ada makna dalam membuat sesuatu sesuai keinginan sendiri, dengan suka hati, tanpa peduli pandangan orang lain. Menurutku justru fakta bahwa banyak orang menganggapnya jelek membuat situs dan pesannya jadi lebih menarik. Begitu kamu terpaku pada tampilannya dan merasa sayang sekali, di situlah kamu justru melewatkan poin yang sebenarnya
  • Desain lamanya bersih, minimalis, dan... tidak ada yang istimewa. Sekarang jadi kekacauan yang sengaja dibuat berantakan. Jelek atau tidak, itu sangat membekas di ingatan. Memang ada kelemahannya juga (misalnya sulit mencari lagi tautan tertentu nanti), tapi itu bukan hal penting bagi dia. Yang benar-benar dia inginkan adalah 'ketidaknyamanan', 'disonansi', 'rasa ingin tahu', dan yang terpenting, '/milikku sendiri/'
• Aku belum punya situs pribadi. Saat membuatnya nanti, aku ingin benar-benar melakukannya hanya dengan HTML+CSS+JS atau JQ. Aku sedang mempertimbangkan web server seperti Apache atau nginx. Rencananya akan ku-host di AWS free tier atau shared hosting. Rasanya kalau sudah menguasai cara membuat div tepat di tengah, aku bisa langsung mulai
  • Aku sudah menjalankannya gratis selama 1 tahun di AWS free tier dengan kombinasi S3+cloudfront. Mungkin ini rasio harga-kinerja terbaik. Situsku cuma satu halaman HTML+CSS, aku pakai template yang dibuat ChatGPT apa adanya. Aku belum cukup mampu membuatnya berjalan baik di mobile maupun desktop, jadi untuk sekarang aku puas begini saja
  • Luangkan beberapa menit dan langsung mulai di Neocities
  • Aku tidak terlalu mengerti kenapa centering div jadi meme

      width: 60%; // tentukan lebar sesuai keinginan
      margin: 0 auto;
    

    Sekarang tinggal mulai blogmu
  • Aku juga dulu melakukan hal yang sama: domi.work aku juga membuatnya jelek :)
  • Aku juga mirip, hanya saja kutambahkan 11ty untuk static build dan ku-deploy lewat netlify pages
• Situs yang dibuat dengan template rapi memang semuanya tampak mirip, tapi setiap situs buatan tangan punya 'keanehan kecil di setiap sudut' yang benar-benar unik di dunia. Kalau ini proyek pribadi, aku akan memilih 'wabi-sabi HTML' daripada landing page Tailwind