# Hero...

Konon *«*[*good design is invisible*](https://theverge.com/2012/7/24/3177332/ia-oliver-reichenstein-writer-interview-good-design-is-invisible)*»* dan *«*[*the best interface is no interface*](http://nointerface.com/book)*,»* setidaknya begitulah menurut bung [Oliver Reichenstein](https://twitter.com/reichenstein) dan bung [Golden Khrisna](https://twitter.com/goldenkrishna), *respectively*. Kebetulan sekali [Teletype](https://teletype.in/) memiliki fitur bawaan yang *invisible* sekaligus *no interface,* yakni secara *default* akan memanfaatkan gambar pertama dari sebuah entri sebagai *<s>thumbnail</s>* [*hero image*](https://en.wiktionary.org/wiki/hero_image) pada halaman beranda.

Terus terang fitur tersebut sangatlah bermanfaat dan membantu para pengguna awam, karena itu berarti Teletype akan menjadi panitia yang mengurusi [*sembarang kalir*](https://id.quora.com/Apa-saja-istilah-Bahasa-Jawa-Timur-yang-tidak-ada-di-Bahasa-Jawa-Tengah) demi mempersembahkan tampilan estetika yang hampir sempurna. Saya menggunakan kata sempurna karena ada kalanya pengguna tidak ingin menggunakan gambar pertama sebagai *hero image,* misalnya ketika saya menulis entri berisi banyak gambar [*insert*](https://en.wiktionary.org/wiki/insert#Noun) penjelas tidak estetis dan tidak ada yang layak menjadi *hero image.*

Pada [*<s>edge case</s>*](https://en.wiktionary.org/wiki/edge_case#Noun) situasi runyam macam inilah, sebuah *feature* dalam waktu seketika menjelma menjadi sebuah *bug.* Saatnya untuk menyetel *‹*[*<s>Funcrusher</s> Bugcrusher Plus*](https://en.wikipedia.org/wiki/Funcrusher_Plus)› dan memutar [kenop](https://kbbi.kemdikbud.go.id/entri/kenop) volume [hingga sebelas](https://en.wiktionary.org/wiki/up_to_eleven#Adverb). Untuk <s>mengatasi</s> mengakali hal ini, saya terpaksa mempersiapkan sebuah gambar [*decoy*](https://en.wiktionary.org/wiki/decoy#Noun) sebagai gambar pertama sebuah entri yang *multi* gambar, seperti yang terlihat pada bagian paling atas entri ini. Jadi, begini ceritanya...

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1742032876240/81150bda-8b7d-4ddd-bee7-6758167990a4.png align="left")

Saya hanya sekadar menyunting ulang logo versi [*<s>initial</s>*](https://en.wiktionary.org/wiki/initial) [*ligature*](https://en.wiktionary.org/wiki/ligature#Noun) saya (poin **a**) menjadi versi [*pixelated*](https://en.wiktionary.org/wiki/pixelated#Adjective) (poin **b**) sehingga lebih aman untuk diubah menjadi ukuran lebih kecil (poin **c**). Sebenarnya jumlah [*pixel*](https://en.wiktionary.org/wiki/pixel#Noun) yang digunakan bisa saja lebih sedikit dari yang sekarang, namun sengaja saya gandakan demi berbaik hati kepada para pengguna layar [*retina display*](https://en.wikipedia.org/wiki/Retina_display)*.*

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1742032882756/ff67e7ed-5a0e-4bc3-a391-b3cf97a57c1f.png align="left")

Berdasarkan keterangan yang diperoleh dari <s>tim penyidik</s> [alat](https://developers.google.com/web/tools/chrome-devtools) [inspeksi](https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Open_the_Inspector) peramban, ukuran lebar `div` entri Teletype—yakni jarak dari poin **d** ke poin **e**—adalah 700 *pixel*. Sehingga, logo versi *pixelated* ukuran kecil (poin **c**) diatas terpaksa—demi *retina display*—saya tempatkan di tengah [*canvas*](https://en.wiktionary.org/wiki/canvas#Noun) berukuran lebar 1400 *pixel* serta tinggi 50 *pixel,* yang ketika di [*invert*](https://en.wiktionary.org/wiki/invert#Verb) akan tampak seperti pada gambar [*insert*](https://en.wiktionary.org/wiki/insert#Noun) (poin **f**) dibawah ini.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1742032887751/d7691619-fda8-4317-bf6f-bf551841ece1.png align="left")

Besok pagi [Raymond K. Hessel](https://youtube.com/watch?v=HINIK3pIOp4) akan bangun dengan hidup yang tak akan pernah lagi sama, dan gambar *decoy* diatas bakal kerap dijumpai muncul menyelinap di antara tumpukan entri-entri halaman depan blog hina dina ini.

([sua](https://sua.ist))