Perbaikan Desain Portal UI

| January 5, 2008 | 21 Comments

Dari beberapa masukan melalui komentar di tulisan saya sebelumnya. Akhirnya sampai pagi ini, saya selesai memperbaiki tampilan web portal UI. Tidak banyak perubahan yang saya lakukan, tapi paling tidak perbaikan tersebut, lebih baik dari sebelumnya. Silahkan hasilnya dilihat DISINI. Dan tentu saja, jika ada kritik ataupun saran demi perbaikan web portal tersebut, silahkan isikan komentar dibawah ini.

Tags: , ,

Category: Project, Software Enginering

About the Author ()

Comments (21)

Trackback URL | Comments RSS Feed

  1. iang says:

    request tuk request web designer :)

  2. mira says:

    seperti web site taon 90an nih.

  3. sigit says:

    masih gak sreg dengan pembagian 3 kolom dimana kolom yang sisi kiri dan kanan terlalu kecil Lex… berani aja dibuat fix untuk resolusi 1024*768…

  4. wawan says:

    Disain nya jelek banget neh

  5. @iang,
    Hihihi, wah seperti memang harus demikian :-D

    @mira,
    Hehehehe, OK. terima kasih atas masukan-nya :)

    @sigit,
    Yup, sebenernya saya juga pengen buat saya buat seperti itu, liquid [full screen] mirip seperti blog ini. Tapi flash diatas sana yang membatasi saya. Flash-nya mempunyai panjang 800px [orang lain yang telah mendesain flash itu, dan saya harus memakai-nya] :-|
    Ya, semoga saja nanti ada kebijakan, untuk merubah ukuran dari Flash diatas sana itu.

    @wawan,
    Terima kasih atas masukan-nya :-)

  6. penggunaan flash pada header tidak menutup kemungkinan untuk “fluid” design kok… liat contohya di pinguin.stttelkom.ac.id …

    tetapi penggunaan fluid/liquid design, harap memperhatikan pengguna hi-res widescreen, karena jika tidak benar, maka bisa jadi satu paragraf menjadi satu baris panjang. :D

  7. lupa… contoh flash pada liquid design yg optimal ada di shauninman.com ;)

  8. aldi says:

    idem sama iang ;)

  9. @Adham Somantrie,
    Yup, terima kasih atas masukan-nya mas, masukan yang sangat bermanfaat :-)

    @Aldi,
    Hehehe, Thanks :)

  10. Yan says:

    Selamat untuk usaha Anda menerima saran melalui blog untuk portal UI.
    Ini pendapat saya.
    Untuk portal perguruan tinggi, yang utama adalah kemudahan dalam hal navigasi, sehingga pengunjung dengan cepat menemukan informasi yang diperlukan. Faktor desain, misal menyangkut warna, font, grafis, sebisa mungkin tidak mengganggu dalam penyampaian informasi.
    Trus itu flash yang segede gajah, mungkin bisa direformasi :)
    Desain yang bersih dan sederhana tampaknya itu saran saya untuk portal UI.

  11. Cecep says:

    sepakat sama no 1 & 2 :D

  12. galih says:

    Mas, salut buat UI yang selalu berubah. Sepengamatan saya, masih ada menu yang belum memiliki link (diberi tanda #), sebaiknya sementara jika memang belum ada isinya jangan ditampilkan dulu. Untuk masalah layouting dan tampilan, itu sih masalah selera, tapi memang sebaiknya diset di 1024×768 saja mengingat mayoritas resolusi monitor saat ini adalah 1024.

    Semangat! :)

  13. @Yan,
    Wah, terima kasih banyak atas masukan-nya. Ya, saya juga ingin desain yang “simple but powerful”, tapi tentu saja itu kembali lagi ke selera masing-masing orang.
    Untuk flash, mereka [UI] yang minta lho, jadi agak susah membuang flash itu. Mungkin nanti bisa di “resize” biar nggak “segede gajah” lagi :-)
    *lirik ke yang bikiin flash-nya*

    @Cecep,
    Hihihi, terima kasih juga.

    @galih,
    Yup, terima kasih atas masukanya :)
    Btw, dari statistik [google analytics] memang demikian, pengunjung paling banyak resolusi monitor-nya adalah 1024×768.

  14. iang says:

    ui bisa minta, tapi masa developer gak bisa ngasih saran?

    makanya, requestlah web developer :)

  15. Char says:

    Saran

    (1) css font-family untuk body, harusnya font-family: Calibri, “Trebuchet MS”, Verdana, sans-serif

    (2) tulisan di headernya THE UNIVERSITY With World Class Perspectives harusnya A UNIVERSITY with World Class Perspective (cmiiw). Tidak pakai THE soalnya bukan cuma UI yang *bilangnya* punya world class perspective. With diawali huruf kecil soalnya kata sambung. Perspectivenya kayanya singular d harusnya.

    (3) link versi lama di footernya sebaiknya diredirect pakai mod_rewrite misalnya URL http://www.ui.edu/ui/english/... diredirect internal ke http://muara.ui.edu/ui/english/... jadi link-link dari luar yang refer ke website lama tidak broken

    (4) All right reserved itu dipakai di US (cmiiw) berhubungan dengan undang-undang semething di jaman dahulu kala jadi sepertinya tidak relevan dipakai di website di Indonesia ;) Jadi kalimat itu sebaiknya dihilangkan saja. Lebih baik diganti Hak cipta © Universitas Indonesia 2007

    (5) di tiap artikel “ditulis oleh” sebaiknya dihilangkan karena tidak relevan.

    (6) css untuk paragraf di news : line height terlalu tinggi untuk font Calibri tapi sudah cukup untuk font Trebuchet

    (7) link “selanjutnya” tidak terlihat seperti sebuah link. Coba link itu dibedakan dari text lainnya misalnya a { color: darkgoldenrod; } a:hover { color: darkbrown; } etc.

    (8) language switchnya harusnya English | Indonesia kan bukan Indonesian

    Pertanyaan

    (1) urchintracker()-nya google analytics bukannya harusnya ditaruh di paling bawah halaman sebelum ya, soalnya dia modify dom setelah pagenya loading?

  16. @iang,
    Sebelum ada flash tersebut, tempat itu berisi banner, nah kemudian mereka [UI] minta, supaya banner tersebut bisa berjalan dinamis dan menggambarkan kegiatan yang berjalan di UI. Kemudian sudah dicoba dengan rotate banner, tapi ternyata hal itu tidak cukup, dan akhirnya muncul-lah flash itu.

    @Char,
    Wow, masukan yang sangat membangun, dan sangat jelas sekali saya memahami maksudnya.
    Terima kasih untuk semua saran-nya.
    Untuk nomer (2) dan (5), saya akan diskusikan dahulu dengan pihak-pihak terkait.
    Btw, untuk penempatan code google analytics dari referensi yang saya baca DISINI, code tersebut sebaiknya diletak-kan sebelum tag </body>. Jadi terima kasih lagi atas koreksi-nya :-)

  17. romi says:

    (a) ndak kebanyakan level ta?

    3 level rasanya dah terlalu banyak, ini ada yang empat.
    Internasional > Pendidikan Internasional > Pendidikan di UI > Program pertukaran Pelajar
    Riset galeri rasanya juga manjang-manjangin menu :)

    (b) Flashnya juga gede banget. ndak cocok sama namanya: portal, mestinya akses ke semua informasi (portal) yang jadi titik perhatian, supaya gampang. Bukan slideshow, tapi lha wong namanya perintah bos.

    (c) yang ditonjolkan itu menu sebelah kanan ya? karena begitu buka, yang keliatan setelah flash gede itu sebelah kanan. perpus, elearning ama webmail rasanya nggak keliatan, (kotak) search juga rasanya ndak cepet nemunya.

    (d) tulisan pak/bu profesor apa perlu ditebalkan ya? warna ui yang kuning rasanya kalah sama tebalnya huruf di posting…

    just my 2 cents :D

  18. @romi,
    Terima kasih atas “2 cents”-nya :-)
    Btw, yup saya sendiri juga merasa level-nya terlalu banyak, tapi ya itu tadi, struktur menu memang harus seperti itu. Eh, bahkan ada yang sampai 5 level lho :-|
    Untuk (b), ya seperti itulah.
    Untuk (c), coba nanti akan kami diskusikan lagi.
    Untuk (d), bold, digunakan untuk menandai sesuatu yang penting, dan crawler akan memberikan perhatian “lebih” kepada tag bold ini.[CMIIW]. Untuk tebal-nya huruf, mungkin nanti bisa disesuaikan lagi.

  19. christiono says:

    akhirnya diubah juga jadi Hak cipta © Universitas Indonesia 2007.

  20. Pendapatku masih sama, mas alex perlu banyak belajar lagi ttg pengembangan situs. Kasihan yang ngasih project ke mas alex tuh ;)

  21. @christiono,
    Yup, silahkan jika ada masukan lagi.

    @linus torvald,
    Boleh tahu dibagian mana yang perlu untuk dikembangkan?
    btw, untuk diketahui saja project tersebut bukan langsung dikasihkan saya, project tersebut merupakan project kantor dan kebetulan saya yang mendapatkan bagian untuk development CMS-nya.
    Silahkan jika ada masukan, tapi hendak-nya masukan yang ada dijelaskan lebih terperinci, sehingga saya bisa mendapatkan gambaran yang lebih jelas, untuk perbaikan-nya.

Leave a Reply