pertemuan 3

Merancang dan Membangun Website

7 aturan merancang website

1.  Just becouse you can doesn’t mean you should.  Adanya  teknologi,  bukan  berarti  harus  digunakan  ketika merancang  website.  Sering  kali  teknologi  malah menghalangi  performa  dari  website  atau  mengganggu pengguna  sehingga  meninggalkan  website.  Ketika menggunakan  teknologi,  perancang  harus  bertanya “Apakah  teknologi  mampu  menambah  nilai  sebuah website atau ditambahkan sebagai hal yang baru?
2. There is almost always an exception Perancang  web  harus  hati-hati  ketika  mengesampingkan  penggunaan  teknologi  atau  metode design  yang  sederhana  karena  tidak  bekerja  di  website lain.
3. Users are the ultimate judges Pendapat/opini tidak pernah berhenti ketika berada pada proses perancangan/design.
4. Crossover experience is something a designer needs to always strive for Seorang  perancang  web  profesional  mengerti  akan kebutuhan  dari  user,  tanpa  memperhatikan  bahwa perancang  secara  pribadi  percaya  estetika  dan  aspek-aspek tehnik dari website harus dirancang. 
5.  Humility is the best approach Karena  ada  begitu  banyak  seluk-beluk Desain  Web,  dibutuhkan  desainer  dengan  situs  yang lebih  menarik,  teknologi  baru,  atau  penggunaan teknologi dengan cara yang lebih kreatif. 
6.  It is impossible to please everyone Seorang  desainer  seringkali  harus  mengambil  sikap untuk  mempertahankan  fungsional  tertentu  dan  aspek estetika  desain,  tidak  pernah  bertujuan  untuk  membuat semua  pengguna  puas  karena  semua  orang  punya pendapat. 
7. Try to stay on top of specifications and standards Spesifikasi  dan  standar  web  akan  terus  berubah. Perancang  web  harus  memiliki  pemahaman  dasar tentang  teknik-teknik  terbaru,  yang  akan  mempengaruhi hasil kerja dimasa yang akan datang.

3 Filosofi Merancang Web

1.  Estetika  Bagaimana  profesional  tampilan  dan  nuansa  situs  ini? Apakah  konsisten  dengan  yang  diinginkan  branding bisnis atau individu? 
2.  Kegunaan Seberapa  cepat  dan  mudah  pengguna  mampu menemukan  dan  memproses  informasi   ketika  sedang melakukan tugas-tugas yang diperlukan? 
3.  Fungsi  Pemrograman  harus  mengaktifkan  aspek  fungsional situs, seperti formulir dan konten database-driven. Desain web dibagi 3, yaitu:

a.       Desain Antar Muka

b.      Desain Situs

c.       Desain Halaman

Desain Web

1.   Look and feel requirements. Termasuk  penempatan  konten,  bagaimana  situs menyampaikan pesan perusahaan, palet warna, dan font serta gambar konsep-konsep yang akan disajikan.

2.  Bandwidth requirements. Cara situs dirancang menentukan bagaimana besar dari bandwidth  yang  diperlukan  oleh  sebuah  situs.  Dengan memahami  bandwidth  (download  size),  desainer  dapat menentukan  keseimbangan  antara  grafis  dan  teks  yang akan digunakan.

Requirement

Ketika  membangun  sebuah  situs,  beberapa  informasi  yang paling penting bagi seorang desainer  meliputi:

1.    Resolution requirements . Sebuah  situs  dengan  resolusi  yang  tidak  benar  dapat menghambat kegunaan atau kredibilitas.

2.    Scalability requirements. Hampir  semua  situs  berada  dalam  evolusi  yang  tetap, penting  bagi  desainer  untuk  empertimbangkan  bagaimana situs bisa expanded atau berubah di masa depan.

3.   Content requirements. Volume  isi  situs  akan  mempengaruhi  hampir semua  persyaratan  lain,  termasuk  tampilan  dan  nuansa, bandwidth, resolusi dan skalabilitas.

4.         Tata  letak  yang  baik  penting  untuk  penyajian  gambar profesional dan kegunaan dari sebuah situs. 

5.    Pengguna  harus  dapat  menemukan  informasi  dengan mudah  lengkap,  hal  inilah  yang      mempengaruhi  tata letak/layout. 

6.          Layout  dalam  sebuah  web  lebih  mengacu  pada  posisi elemen, daripada tampilan dan nuansa situs.

Keuntungan Scrolling

•           Desain  bisa  muat  lebih  banyak  konten  pada  satu halaman. 

•     Pengguna tidak harus klik dan menunggu untuk me-load halaman  lain,  yang  tidak  hanya  butuh waktu,namun pengguna  juga  harus  kembali   matanya  terfokus  pada daerah  baru  yang  sebagian  besar  kemungkinan  pada atau di dekat bagian atas layar.

•         Sangat  mudah  untuk  navigasi  cepat  jika  pengguna menggunakan  mouse  dengan  roda  atau         scroller  stylus danmemungkinkan  untuk  menggerakan  kursor  dengan mudah.

Kerugian Scrolling

•           Dibutuhkan  sedikit  usaha  untuk  mengklik  link  yang membuka halaman baru.

•           Karena  halaman  digulir  lebih  panjang,  waktu  download mereka biasanya lebih besar. Posisi Content

•         Posisi menu Sejak  pertengahan  1990-an,  desainer  telah  bereksperimen dengan  menempatkan  menu pada  kiri,  kanan,  atas,  tengah, atau  bawah  halaman,  dmana  saja  yang  bisa  bayangkan menu  telah  ditempatkan  di  sana.  Selama  bertahun-tahun, menempatkan  menu  ke  kiri  atau  di  bagian  atas  halaman telah menjadi standar yang lebih tradisional.

•    Hirarki  Struktur  hirarki  merupakan  suatu  struktur  yang mengandalkan  percabangan  untuk menampilkan  data berdasarkan  kriteria  tertentu.   Tampilan  pada  menu pertama  akan  disebut  sebagai  master  page,  halaman utama  ke  satu.   Halaman  utama  ini  akan  mempunyai halaman  percabangan  yang  dikatakan  slave  page, halaman  pendukung.   Jika  salah  satu  halaman pendukung  diaktifkan,  maka  tampilan  tersebut  akan bernama  master  page,  halaman  utama  kedua.   Pada struktur  navigasi  ini  tidak  diperkenankan  adanya tampilan secara linier.

•           Non Linier Pada struktur nonlinier diperkenankan membuat struktur navigasi  bercabang,  percabangan  ini  berbeda  dengan percabangan  pada  struktur  hirarki.   Pada  percabangan nonlinier  walaupun  terdapat  banyak  percabangan  tetapi tiap-tiap  tampilan  mempunyai  kedudukan  yang  sama tidak ada pada master page dan salve page.

•        Campuran Struktur navigasi campuran merupakan gabungan dari ketiga struktur sebelumnya.  Struktur navigasi ini banyak digunakan dalam pembuatan aplikasi multimedia sebab dapat memberikan keinteraksian yang lebih tinggi.

Teknik Typografy

•           Tipografi  (typography)  adalah  ilmu  yang  mempelajari tentang huruf.

•           Tipografi  lebih  dari  seni  memilih  font,  tentang  membuat konten lebih mudah dibaca. 

•   Teks  merupakan  bagian  sentral  dari  antarmuka pengguna,  sehingga  kebutuhan  User  Interfacedipengaruhi pemilihan font, ukuran, dan spasi. 

Anatomi Huruf

•           Semua karakter dari huruf ada pada baseline.

•           Tinggi  huruf  kecil  x  secara  tradisional  digunakan  untuk menentukan baris untuk font. 

•           Jarak  antara  garis  rata-rata  dan  baseline  disebut sebagai tinggi-x dari font. Bagian dari Font

Huruf dikelompokan menjadi 2 jenis, yaitu :

1.       huruf besar (upper case atau capital letter)

2.       huruf kecil (lower case).

Huruf dikelompokan menjadi 3 yaitu :

1.       huruf berkait (serif)

2.       huruf tak berkait (sansserif)

3.       huruf latin (script)

Ditinjau dari sudut geometri, garis dasar yang mendominasi struktur huruf dibagi dalam 4 kelompok besar:

1.       Kelompok garis tegak datar (E, F, H, I, L)

2.       Kelompok garis tegak miring (A, K, M, N, V, Z, X, Y, W)

3.       Kelompok garis tegak lengkung (B, D, G, J, P, R, U)

4.       Kelompok garis lengkung (C, O, Q, S)

5.       Ditinjau dari hukum teori Gestalt, huruf memiliki 2 ruang dasar, yaitu figure dan ground.

 Ruang  negatif  dari  seluruh  huruf  dapat  dikelompokan menjadi 3, yaitu:

1.       Ruang  negatif  bersudut  lengkung  (B,  C,  D,  t,  G,  O,  P, Q, R, S, U)

2.       Ruang negatif bersudut persegi empat (E, F, H, I, L, T)

3.       Ruang  nefatif  bersudut  persegi  tiga  (A,  K,  M,  N,  V,  W, X, Y, Z)

Huruf Tak Berkait (Sans Serif)

•         Bentuk  huruf  yang  tidak  memiliki  kait,  bertangkai  tebal, sederhana  dan  lebih  mudah  dibaca,    tidak  memiliki stroke/ekor,  ujungnya  bisa  berbentuk  tumpul  (rounded corner) atau tajam.

•           Sifat huruf kurang formal, lebih hangat dan bersahabat.

•           Sangat cocok untuk screen-font (tampilan layar monitor) karena tajam dan mudah dibaca.

•           Bentuk huruf yang popular adalah Helvetica dan Arial.

•           Bentuk huruf yang memiliki kait, dengan ketebalan yang kontras, memiliki stroke.

•           Merupakan huruf yang formal. Serif  mengekpresikan  organisasi  dan  intelektualitas, sangat anggun dan konservatif. Contoh paling umum adalah Times. Huruf Berkait (Serif)

•        Merupakan  dasar  dari  bentuk  huruf  yang  ditulis  dengan tangan,  kontras  tebal  dan  tipisnya     sedikit,  salir berhubungan dan mengalir.

•           Menyerupai  tulisan  tangan,  sering  disebut  kursif (cursive)

•           Memberikan  kesan  keanggunan,  sophistication  dan sentuhan pribadi.

•           Pemakaiannya jangan sampai terlalu banyak.

Huruf Tulis/Latin (Script)

AaBb

•           Sangat rumit desainnya, akan memusingkan jika dipakai sebagai  body  text  dan  hanya  cocok  dipakai untuk headline.

•            Dapat membuat efek responds yang berbeda.

•     Paling cocok digunakan untuk judul, dan lebih baik tidak digunakan sebagai body text/body copy. Dekoratif (Decorative)

•            Mempunyai jarak/lebar yang sama setiap hurufnya.

•            Banyak  digunakan  oleh  programmer  untuk  coding  dan juga untuk preformatted text.

•            Belakangan banyak dipakai oleh desainer yang beraliran grunge alternatif.

DETIL EDITING: TEKNIS

11. Mencari  kesalahan-kesalahan  faktual  dan  memperbaikinya, di  antaranya  kekeliruan  salah  tulis  tentang  nama,  jabatan, gelar,  tanggal  peristiwa,  nama  tempat,  alamat,  dan sebagainya.

22.  Memperbaiki  kesalahan  dalam  penggunaan  tanda-tanda baca.

33. Tegas  dalam  hal-hal  seperti  penggunaan  huruf  besar  dan singkatan,  penggunaan  gelar,  tanda  baca,  ejaan,  tata bahasa, pemilihan jenis huruf untuk judul, dsb.

44. Mengetatkan tulisan atau menyingkat tulisan sesuai dengan ruang  yang  tersedia,  termasuk  membuang  atau  memotong (cutting) paragraf yang tidak penting.

55.  Mengganti  kata  atau  istilah  yang  tidak  memenuhi prinsip ekonomi kata.

66.  Melengkapi  tulisan  dengan  bahan-bahan  tipografi, seperti anak judul (subjudul), di mana diperlukan.

77.  Menulis  atau  menentukan  judul  dan  lead  atau  teras berita jika dipandang perlu.

88. Di beberapa suratkabar, editing juga termasuk menulis caption  (keterangan  gambar)  untuk  foto  dan  pekerjaan lain yang berhubungan dengan cerita yang disunting itu.

DETIL EDITING: NON-TEKNIS

11. Memperhatikan  apakah  naskah  berita  sudah  memenuhi nilai-nilai jurnalistik dan kriteria layak muat—aktual, faktual, penting, dan menarik.

22. Meneliti  apakah  naskah  berita  sudah  menaati  doktrin kejujuran  (fairness  doctrine)  serta  asas  keberimbangan (cover  both  side).  Jika  belum,  tugaskan  kembali  reporter untuk memenuhinya.

33. Memperhatikan  apakah  opini,  interpretasi,  atau  penilaian wartawan lebih menonjol daripada fakta hasil liputan.

44. Menjaga  jangan  sampai  terjadi  kontradiksi  dalam  sebuah naskah.

55. Menjaga jangan sampai terjadi penghinaan, arti ganda, dan tulisan yang memuakkan (bad taste).

66. Sadar  mengenai  sifat-sifat  umum  tentang  umur,  taraf hidup,  dan  gaya  hidup  para  pembaca  utama  korannya, dan  menyunting  naskah  sesuai  dengan  sifat  umum tersebut.

77 Memperbaiki tulisan opini (artikel) dengan segala upaya tanpa  merusak  cara  penulisnya  menyatakan pendapatnya.  Karenanya,  redaktur  harus  membaca  lebih dahulu  seluruh  cerita/naskah  untuk  mendapatkan pengertian penuh tentang apa yang berusa dikatakan oleh si penulis.

88.  Menjaga masuknya iklan terselubung sebagai berita.