Tampilan Web Pada Layar Beresolusi Tinggi

Kemarin [Fajri](http://fajri.freebsd.or.id) dengan bangganya mengirim tangkapan layar beberapa blog jika dilihat dengan resolusi 2560×1600 pada monitor pinjaman. *Ah*, cuma 2560×1600, bagaimana kalau 4000×3000?

Priyadi.net pada layar lebar

Pada layar dengan resolusi setinggi ini debat [tata letak *fixed* lawan *fluid*](http://www.htmldog.com/ptg/archives/000012.php) tidak lagi relevan. Keduanya sama-sama tidak nyaman untuk digunakan. Tata letak *fixed* sulit digunakan karena tidak dapat mengakomodasi pembesaran ukuran huruf. Sedangkan tata letak *fluid* sulit digunakan karena pada ukuran huruf standar, ukuran kolom akan menjadi terlalu lebar. Dari sisi pengguna juga tidak mudah, memperkecil ukuran *browser* tidak dapat dilakukan karena pada ukuran monitor standar, ukuran *browser* akan menjadi beberapa sentimeter saja.

Salah satu hal yang dapat dilakukan adalah memperbesar ukuran huruf. Beberapa sistem operasi dan aplikasi akan menyesuaikan ukuran huruf berdasarkan besaran DPI (*dot per inch*) yang terdeteksi. Pada KDE misalnya, huruf akan menjadi sangat besar setelah DPI saya ubah dari yang saya biasa gunakan 85×85 DPI menjadi 400×400 DPI. Perubahan ini juga terjadi pada hasil *rendering* *browser* Konqueror.

Masalahnya, satuan ukuran untuk gambar adalah *pixel*. Berapapun DPI dari layar, satu pixel tetap satu pixel. Jadi walaupun ukuran huruf bertambah besar, ukuran gambar dan elemen lainnya yang menggunakan satuan pixel tidak bertambah besar. Akibatnya tata letak halaman web menjadi kacau.

*Web browser* [Opera](http://www.opera.com) memiliki fitur *zoom* untuk memperbesar halaman web termasuk elemen gambar, bukan cuma ukuran huruf seperti pada kebanyakan *browser* lainnya. Hanya saja, fitur ini harus digunakan secara manual dan tidak melihat besaran DPI layar. Selain itu pembesaran maksimum hanyalah 200%.

Mungkin seharusnya satuan ukuran pada halaman web adalah satuan fisik seperti sentimeter. Khusus untuk gambar, *web browser* perlu juga memperhatikan resolusi gambar ketimbang hanya melihat ukuran piksel dari gambar. Dengan demikian, sebuah halaman web akan terlihat sama baik pada resolusi rendah maupun tinggi.

\*\*\*

Beberapa blog lain jika dilihat pada ‘monitor’ dengan resolusi 4000×3000:

[Indrani.net](http://indrani.net):

Indrani.net pada layar lebar

[Hericz.net](http://hericz.net):

Hericz.net pada layar lebar

[Enda.goblogmedia.com](http://enda.goblogmedia.com):

Enda.goblogmedia.com pada layar lebar

[Direktif.web.id](http://direktif.web.id):

Direktif.web.id pada layar lebar

[Andri.andriani.web.id](http://andri.andriani.web.id):

Andri.andriani.web.id pada layar lebar

[Andika-lives-here.blogspot.com](http://andika-lives-here.blogspot.com):

Andika-lives-here.blogspot.com pada layar lebar

51 comments

  1. Makanya buka browser jangan di-maximize.

    BTW, itu yg bener “resolusi” atau “dimensi”? Kalo menurut gua sih 2560×1600 itu dimensi, sedangkan resolusi itu yg 96 dpi gitu.

  2. gimana kalau solusinya bikin beberapa css (page style), beda untuk tiap resolusi. Jadi user bisa milih sesuai resolusinya.

    moral of the story, menjadi besar bukan berarti usable?

  3. hehehe monitor gede memang bikin pusing. paling enak buat nonton pilem. sungguh norak, saya pernah nyoba buat ngetik pake word. mumet baget, pengin mundur sejauh mungkin dari meja…

  4. Moral of the story: Dimensi layar nyaman dibaca saat kepala tidak usah bergerak-gerak kiri-kanan atas-bawah.

    Umpatan: Sungguh konyol mereka yang mempunyai dimensi layar besar tapi selalu membuka aplikasi dengan window maximized

  5. Hehehe… pake fixed dong!.Fluid sux.. hihihi.

    Lagipula, aku pake resolusi diatas 1024 aja udah pusing bacanya. Harus maksain gededin tiap-tiap font.

    Kalau pengin nyaman sih, yang penting sih refresh-rate tinggi. diatas 85 juga udah cukup.

  6. Monitor gede itu enaknya buat jalanin xterm 4×4 biji, terus liat log squid/apache/tcpdump :d ato bikin sesi vic/rat 4×4 orang, uenak tenan ;)

  7. Setuju sama hericz, memang refresh rate yang paling adem di mata yah 85Hz ke atas. Kalau mau berresolusi di atas 1024×768, ya harus pake monitor di atas 19 inchi juga :D

  8. mmm, setuju aja deh ma hericz. tampilan kekecilan gak enak buat mbaca. tapi refresh rate tinggi kok agak2 gak nyaman buat mataku ya? *mikir.. aku yang aneh?*

  9. 4000×3000 itu di monitor berapa inch ya? monitor 17″ yang saya adepin sekarang keliatannya cuma bisa seribu sekian kali seribu sekian he. bingung:-\ atau cuma pake program kayak url2bmp?;-)

  10. hehehe gak kebayang untuk pake resolusi(demensi?) sebesar itu.
    Dulu waktu jaman 800×600 ngeliat yang bisa 1024×768 kayaknya asik banget dan sekarang memang terbukti kalo 1024×769 adalah yang paling nyaman untuk monitor gw.

    eh resolusi itu bisa terpakai kalo layarnya cukup lebar.

  11. Yup..resolusi tinggi sebaiknya dipakai di atas monitor yang lebar juga. Di layar 20″ yg gw pake (monitor pinjeman juga), gw pake resolusi 1680×1050.

    Kalo mau sekedar pamer tampilan blog di resolusi sekian, bisa diemulate di browser, misalnya set saja tampilan menjadi 10%, 20%, etc :P

  12. Kayaknya untuk resolusi segitu belum terlalu umum dipakai, jadi lebih baik testing di 800×600 dan 1024×768 dulu. Kalo sudah bagus, testing dulu di beberapa browser. Kalo ada waktu, baru cobain di resolusi yang lebih besar :D

  13. Kalo sekedar mau begitu mah bisa dibuat “virtual”, misalnya mau dibuat virtual 4000×3000 lalu physicalnya tetap di 1024×768 juga bisa. Jadinya layar seperti kaca pembesar aja, atau viewport. Di X dan Windows bisa, Mac ga tau deh. Jadi kalo mau bikin sendiri itu screenshot yg 8000×6000 bisa asal memorinya video card cukup (kalo 24bpp berarti butuh 8000x6000x24 bits minimum, sekitar 137 MB).

    Monitor 30 inch aja resolusi optimumnya cuma 2560×1600, dari Apple kurang lebih AU$4000 (Rp 28 jt). Jadi kalo ada monitor yg optimumnya 4000×3000 mungkin masih lama (58 inch LCD?).

  14. #3, #8: sekarang sudah ada monitor LCD yang lebih daripada 200 DPI. 2-3 tahun lagi mungkin ada yang 300 DPI (setara dengan kualitas cetak). dengan kerapatan itu, 1000 pixel itu cuma sekitar 8 cm, dengan cara merender web jaman sekarang jelas gak nyaman untuk dibaca, dimaximize atau ngga sama saja.

  15. Hidup 800×600!! :D

    Ya iyalah, orang monitor saya njeblug klo resolusi-nya di naikin, maklum monitor jadul. Masih pake puteran utk ngatur brightnes segala macem. :-”

    Btw, klo blog saya diliat pake monitor segitu, mungkin cuman kliatan sebagai garis tebal kali ya.. :D :D

  16. #8 #24
    saya setuju, jangan main maximized :D sejak make Monitor 17″(milik kantor) dan 17″ milik sendiri =)), setiap utek utek design atau buka aplikasi jarang make maximized :D biar mudah LONCAT antar APLIKASI gitu loh…

    walupun dengan cara Alt+Tab(pada windows) juga bisa, atau lewat launcher di OSX juga bisa :D

  17. ngobrol-ngobrol, pake infokus masuk itungan “gede” nggak? cuma resolusinya kayanya masih ajeg :D, cukup 1024 x 768. Hidup telat ! \:d/.

  18. Wah, aku baru rencana mo beli monitor nih. Tapi aku bingung, mo beli lcd yang 15 inc ato CRT fat 21 Inc.

    Soalnya sama2 di hargai miring sih. yang LCD Rp.400.000 an yang CRT Rp.800.000,-

    Ayo kawan2 ada sarat eh salah sran maksud ku? :-)

  19. #39, beli yang LCD aja lebih “enak di mata” dan lebih hemat listrik, kalo ada sih ya LCD 21″ :D

  20. bole minta tolong cobain desain contoh gue ngga? harusnya sih fleksibel, soalnya pake satuan em (termasuk gambarnya).

    monitor aye ngga kuat klo digedein sampe resolusi segitu. tapi klo di 1152 x 864 komposisinya bisa tetep stabil sih. ngetesnya harus digedein manual, klo firefox pake ctrl++.

    pengen tau aja seberapa fleksibel sih satuan em. klo udah kirim aja ke email br4inwash3r^at^gmail^dot^kom. thx berat…

  21. Wah kalo punya monitor yang gedenya kayak layar tancep sih asik2 aja tuh, hehehe:d. eh om Pri mau dong situsnya dijadiin contoh juga \:d/

Leave a Reply to Atha Cancel reply

Your email address will not be published. Required fields are marked *