Apakah situs web lancar layak dibuat lagi? [Tutup]

Saya membuat situs web sekarang dan saya mencoba memutuskan apakah saya harus membuatnya lancar atau tidak. Situs web dengan lebar tetap lebih mudah dibuat dan juga lebih mudah membuatnya tampak konsisten.

Sejujurnya, saya pribadi lebih suka melihat situs web cair yang membentang ke seluruh lebar monitor saya. Pertanyaan saya berasal dari kenyataan bahwa di sebagian besar browser modern Anda dapat memegang kendali dan menggulir roda mouse Anda untuk mengubah ukuran situs web mana pun.

Jadi, apakah membuat situs web cairan sepadan dengan masalahnya?

Itu tergantung pada audiens Anda dan konten Anda.

Berikut ini adalah situs yang saya hormati dan saya pikir adalah contoh untuk ditiru.

Contoh Cairan:

Amazon

Wikipedia

Contoh statis:

apel

eBay

MSN

StackOverflow

MSDN

Beberapa Campurkan!

CNN

Saya pikir saya lebih suka statis sebagian besar waktu. Lebih mudah membuatnya terlihat bagus di lebih banyak browser. Juga lebih mudah dibaca.

Membuat situs web lancar, tetapi menambahkan atribut min / max-width tampaknya menjadi yang terbaik dari kedua dunia, bagi saya. Anda mendukung fluiditas, tetapi Anda membatasinya pada lebar tertentu (katakanlah, 800px dan 1200px).

Terserah Anda - berikut adalah beberapa hal untuk dipertimbangkan:

1. Teks sulit dibaca karena garisnya sangat panjang.
2. Audiens Anda mungkin memiliki resolusi lebih besar atau lebih kecil dari biasanya, dan memilih lebar statis 'salah' akan mengganggu mereka.
3. Mempertahankan tempat cairan bisa saja, tetapi tidak harus jauh lebih sulit daripada pasangan statisnya.

Benar. Ini adalah ketidaknyamanan besar bagi orang-orang dengan monitor besar untuk mengubah ukuran halaman. Itu juga bisa sedikit cerdik dengan beberapa tata letak. Sedikit ketidaknyamanan, betapapun sepele, sebenarnya dapat memengaruhi pendapat orang tentang situs Anda.

Juga, netbook memiliki resolusi aneh yang membuatnya sulit untuk mendesain situs. Misalnya, saya menulis ini pada 1024x600.

Ini tidak terlalu sulit saat ini baik (di browser modern), terutama dengan min-dan max-heightdalam CSS, dan gradien baru, dll di CSS3, sehingga penskalaan gambar tidak akan menjadi masalah besar dalam waktu dekat.

Menanggapi komentar di bawah ini, saya pikir pro lebih besar daripada kontra dalam kasus khusus ini - IE6 merupakan masalah di mana-mana. Kami hanya harus menghadapinya.

Anda harus menyadari bahwa sebagian besar pengguna komputer bahkan tidak TAHU CARA memperbesar browser! Sebagian besar pengguna sangat jauh dari pemahaman komputer yang kita miliki. Kita harus selalu mengingat fakta itu.

Aplikasi berbasis teks: Tidak . Aplikasi berbasis tabel: Ya .

Kelebihan tata letak cairan

1. Orang dengan monitor besar dapat menggunakan layar real estat mereka.
2. Lebih mudah bagi pengguna dengan monitor besar ketika Anda memiliki banyak informasi di halaman Anda.

Kekurangan tata letak cairan:

1. Kolom teks lebar cairan sulit dibaca jika terlalu lebar. Ada alasan bagus di balik penggunaan kolom di koran: membuat lompatan ke baris berikutnya jauh lebih mudah.
2. (Agak) sulit untuk diimplementasikan, karena keterbatasan dalam CSS.

Jika Anda menampilkan data tabular (iTunes, db manager, ...), lebar fluida baik. Jika Anda menampilkan teks (artikel, halaman wiki, ...) lebar cairan buruk.

Dari sudut pandang iPhone saya, tata letak lebar tetap bermasalah ketika menggunakan blok kode. Bilah gulir untuk blok kode lebar tidak muncul, jadi saya tidak bisa membaca ujung kanan blok.

Kalau tidak, saya pikir ini masalah sederhana tentang jenis situs yang Anda desain dan tampilannya di layar dan jendela ukuran berbeda. Seperti disebutkan sebelumnya, ada opsi untuk mengatur lebar maksimum, tetapi peringatan yang sama berlaku untuk blok kode dan iPhone. Saya telah merancang keduanya, dan saya tidak suka yang satu lebih dari yang lain.

Meskipun, itu menyenangkan untuk menonton kotak bergerak ketika saya bermain dengan ukuran browser dengan tata letak yang cair, tetapi saya dapat dengan mudah geli.

Yang paling penting adalah untuk mempertimbangkan kasus penggunaan dominan dari situs web atau aplikasi Anda. Apakah Anda berharap orang menggunakannya secara eksklusif di perangkat seluler? Ponsel, netbook, desktop?

Lihatlah "Desain Web Responsif" oleh Ethan Marcotte: http://www.alistapart.com/articles/responsive-web-design/

Artikel hebat yang menunjukkan penggunaan tata letak yang benar-benar lancar menggunakan kueri media. Terkadang Anda perlu membuat front end yang terpisah untuk agen-pengguna yang berbeda, tetapi kadang-kadang permintaan media adalah alat yang sempurna untuk melayani berbagai resolusi di seluruh agen-pengguna yang berbeda.

Itu tergantung pada apa yang Anda coba lakukan. Lihatlah SO. Tetap lebar dan bagus. Bahkan, jika itu cairan, itu akan menjadi sedikit PITA. Beberapa situs terlihat lebih baik dengan tata letak yang cair, tetapi secara pribadi, saya akan memperbaikinya kecuali jika Anda memiliki alasan yang baik untuk menjadi lancar.

Banyak poin bagus dalam komentar, tetapi dari pertanyaan Anda, sepertinya Anda sangat menyukai desain yang cair dan ingin membuatnya jadi gunakanlah, itu adalah situs Anda, tidak harus seperti setiap situs lainnya di web.

Perlu diketahui pro dan kontra setiap solusi.

Sampai pada suatu titik - ya.

Ada lebar tertentu, di mana teks mulai menjadi menjengkelkan untuk dibaca jika terlalu lebar. Mudah untuk diuji jika Anda memiliki monitor besar, cukup ambil notepad dan rekatkan beberapa teks ke dalamnya tanpa jeda baris.

Namun, ketika turun ke ukuran yang lebih kecil, menjadi cairan mungkin merupakan ide yang baik. Browser ponsel semakin mampu menampilkan situs web "normal" dengan baik, tetapi terkadang dibatasi lebar, dan karenanya, mendapat manfaat jika situs Anda dapat masuk dalam ruang yang sedikit lebih kecil.

Secara pribadi saya juga suka menyimpan peramban di monitor saya, tetapi hanya setengah dari lebar monitor (24 "). Situs yang skalanya bagus yang sangat bagus.

Saya pikir itu sebagian besar kasus kenyamanan pengguna. Tidak semua situs akan diuntungkan dengan menjadi lancar, tetapi saya pikir situs yang memiliki banyak konten teks adalah yang paling diuntungkan dari hal itu, setidaknya jika mereka lancar hingga maksimum (katakanlah 800px atau apa pun)

Iya. Zoom halaman bagus, tetapi terutama digunakan untuk membuat teks lebih besar, bukan untuk membuat teks mengisi viewport. Tentu saja jika teks badan sudah terlalu lebar, zoom ke bawah untuk membuatnya pas biasanya akan membuatnya tidak dapat dibaca.

Anda memerlukan tata letak cair jika Anda akan membuat teks sesuai dengan viewport apakah diperbesar atau tidak.

Poin tentang 'garis panjang menjadi sulit dibaca' sering dilebih-lebihkan oleh desainer yang berusaha membenarkan desain lebar tetap (*), tetapi pada kenyataannya itu tampaknya tidak memiliki cukup kuat di layar seperti di atas kertas. Tentu saja pengaturan tinggi / garis-depan yang baik adalah penting, dan lebar-maks dapat digunakan untuk menghambat ekses terburuk dari garis panjang. (Atur dalam unit em font-relatif.) Anda tidak mendapatkan lebar max di IE6, tapi itu bukan bencana dulu. (Anda dapat memperbaikinya dengan sedikit JavaScript jika Anda benar-benar peduli dengan mereka. Saya tidak.)

(* yang memang kurang bekerja untuk tata letak yang sangat grafis. Tapi untuk tata letak yang lebih sederhana seperti, eh, StackOverflow, sebenarnya tidak ada alasan untuk tidak menjadi cair. Tsk @SO, eh!)

Pendahuluan: Bukan artis web profesional.

Saya telah menemukan bahwa ada terlalu banyak bit fiddly untuk membuat hal-hal mengalir begitu saja pada telepon seluler dan ukuran layar lebar uber, terutama dalam kompleksitas yang cukup menarik.

Biasanya, saya merancang sekitar memiliki situs dengan lebar tetap dalam beberapa mode; biasanya dibatasi pada [600.1200].

Saya juga menemukan kolom konten yang sangat lebar menjadi sulit untuk dibaca. Sepertinya saya ingat bahwa ada beberapa penelitian yang menunjukkan jumlah kata yang optimal per baris kolom.

Anda bisa membuatnya seperti ini.

# Buat tata letak utama lancar dan terapkan ' max-width: 1140px ' untuk itu dan pusatkan .

Dengan ini tidak akan ada 'garis panjang' teks pada layar yang lebih besar dan penyelesaian halaman web yang tepat pada yang lebih kecil (tidak termasuk 800x *** dan lebih rendah).

Saya telah menerapkan metode ini dalam proyek-proyek baru saya dan itu berfungsi seperti pesona.

atb .. :)

Saya pikir cairan keputusan / perbaikan harus didasarkan juga pada konten situs web:

1. Untuk situs dengan jumlah besar informasi biasa (seperti portal berita), lebih baik menggunakan tata letak yang lancar.

2. Layanan web terlihat lebih baik dan bekerja dalam dimensi tetap, sehingga Anda selalu tahu di mana elemen antarmuka berada di tempat mereka dan mereka tidak bergerak terus-menerus.

Ya, situs web yang cair layak untuk dibuat
Seperti yang Anda katakan, terlihat bagus dan masuk akal ketika Anda merencanakan dengan baik pada tahap desain.

Keraguan Anda tentang dampak Ctrl + Scrollbar bukan masalah besar. Fitur ini terutama untuk aksesibilitas, untuk membuat teks lebih mudah dibaca dengan menambah ukuran.

Namun, jika Anda menyebutkan semua ukuran Anda dalam Piksel (px) itu tidak akan terjadi. Penyesuaian yang tepat hanya terjadi ketika Anda menggunakan "em" untuk menentukan ukuran. Jadi, Anda memiliki cara untuk menghidupkan / mematikannya

Saya penggemar berat tetap di <800px ... lebih mudah untuk membaca kolom yang lebih sempit, dan itu akan bekerja di mana saja. Yaitu, jika Anda mencoba membuat situs web yang menyajikan hiperteks ... Situs web yang menyajikan aplikasi ujung depan, apakah saya pikir satu kaleng cacing lain sama sekali ...

Desain cairan - benar-benar cair - sulit. Sangat keras. Ini bukan hanya masalah lebar halaman - apakah skala font Anda, dan apakah semuanya berskala? Idealnya:

• Ukuran harus didefinisikan emdaripadapx
• ... dan itu berlaku untuk ukuran elemen, bukan hanya font!
• Dengan perubahan ukuran font atau level zoom, elemen halaman harus memiliki ukuran yang relatif sama satu sama lain

Produk utama kami adalah cairan, dan itu menyakitkan dari sudut pandang saya sebagai seorang desainer, terutama karena melibatkan banyak konten yang dibuat pengguna.

Untuk satu hal, gambar - di situs dengan lebar tetap, Anda dapat memiliki gambar yang mengisi setengah lebar, dan tampak hebat. Dalam situs yang cair, gambar ini kemungkinan besar akan hilang di lautan ruang putih, tampak agak sepi.

Hidup seharusnya lebih mudah sekali border-radiusdan properti CSS3 lainnya ikut bermain lebih, tetapi sayangnya audiens inti kami adalah pekerja pemerintah, yang semuanya, SEMUA MASIH MENGGUNAKAN IE F @! * ING 6!

Untuk menjawab pertanyaan, "apakah itu layak"? Ya , jika Anda melakukannya dengan benar.

Berikut ini sebuah skenario: pilih situs dengan lebar tetap: bos Anda menampilkannya kepada klien di laptop 1920x1600-nya yang baru, kemudian mengeluh kepada Anda tentang "bagaimana semuanya terlihat kecil di layar orang ini!"

Saya pikir itu bagus untuk dapat mengukur dengan baik di layar pengguna, daripada membuat pengguna menggeser dan memperbesar. Di saat pengguna menjelajahi web dari beragam perangkat, mulai dari ponsel cerdas hingga PC ultra-mobile, masing-masing dengan resolusi sendiri, mungkin non-standar, saya pikir penting untuk menjaga pengalaman pengguna pada tingkat tinggi saat situs Anda dilihat di layar seperti itu. Mengenai panjang teks, bisa dibatasi oleh rasio tertentu, sehingga cocok dengan tata letak. Saya pikir ada juga kerangka kerja yang dapat membantu dengan menulis situs secara lancar, dan membantu dengan coding rawatan.

Saya akan menentang mayoritas dan mengatakan TIDAK. Alasan: situs cairan seperti Wikipedia adalah mimpi buruk untuk dibaca di layar besar karena panjangnya garis panjang (meskipun kutipannya membuat sulit dibaca pada saat terbaik).

Masalahnya benar-benar terjadi karena tidak ada mekanisme untuk ukuran teks relatif terhadap resolusi layar. Jika Anda dapat secara otomatis membuat teks lebih besar pada resolusi yang lebih besar, Anda bisa tetap lebih dekat dengan 80-karakter aneh per baris yang umumnya dianggap sebagai yang terbaik untuk keterbacaan.

Ada juga masalah gambar dan elemen ukuran tetap lainnya. Anda dapat memiliki gambar besar dan membiarkan browser mengecilkannya jika perlu, tetapi kemudian Anda mengalami masalah lain seperti waktu unduhan yang lebih lama, dan masalah kualitas gambar di banyak browser.

Saya penggemar situs yang memiliki lebar maks tetap antara 800px - 1000px, tetapi juga dapat memperkecil sehingga saya dapat membaca konten tanpa menggulir ke samping dan juga tanpa memperkecil karena sering kali teks menjadi terlalu kecil untuk dibaca dan itu menyakitkan mataku. Jadi, ini biasanya ingin saya perjuangkan karena saya ingin membangun situs yang bisa saya banggakan.