Menentukan Lebar Halaman Web Anda

Perkara pertama yang paling ditakrifkan oleh para pereka ketika membina laman web mereka ialah resolusi untuk mereka bentuk. Apa yang sebenarnya ini ialah menentukan sejauh mana reka bentuk anda perlu. Tidak ada lagi perkara seperti lebar laman web standard.

Mengapa Pertimbangkan Penyelesaian

Pada tahun 1995, monitor resolusi 640x480 standard adalah monitor yang paling besar dan terbaik yang tersedia. Ini bermakna bahawa pereka web berfokus pada membuat halaman yang kelihatan bagus di pelayar web memaksimumkan pada monitor 12 inci hingga 14 inci pada resolusi itu.

Hari ini, resolusi 640x480 menjadikan kurang daripada 1 peratus dari kebanyakan lalu lintas laman web. Orang menggunakan komputer dengan resolusi yang lebih tinggi termasuk 1366x768, 1600x900 dan 5120x2880. Dalam banyak kes, mereka bentuk untuk kerja skrin resolusi 1366x768.

Kami berada pada tahap dalam sejarah reka bentuk web di mana kita tidak perlu risau tentang resolusi. Kebanyakan orang mempunyai monitor skrin lebar dan besar dan mereka tidak memaksimumkan tetingkap penyemak imbas mereka. Oleh itu, jika anda membuat keputusan untuk membuat halaman yang tidak lebih daripada 1366 piksel lebar, halaman anda mungkin kelihatan baik di kebanyakan tingkap penyemak imbas walaupun pada monitor yang besar dengan resolusi yang lebih tinggi.

Lebar Pelayar

Sebelum anda pergi berfikir "ok, saya akan membuat halaman saya 1366 piksel lebar," ada lebih banyak cerita ini. Satu isu yang sering diabaikan apabila menentukan lebar halaman web adalah seberapa besar pelanggan anda menyimpan penyemak imbas mereka. Secara khusus, adakah mereka memaksimumkan pelayar mereka pada saiz skrin penuh atau adakah mereka menyimpannya lebih kecil daripada skrin penuh?

Dalam satu kaji selidik yang tidak rasmi untuk rakan sekerja yang semua menggunakan komputer riba resolusi 1024x768 standard, dua menyimpan semua aplikasi mereka dimaksimumkan. Selebihnya mempunyai tingkap bersaiz yang berbeza untuk pelbagai sebab. Ini menggambarkan bahawa jika anda merancang intranet syarikat ini pada lebar 1024 piksel, 85 peratus pengguna perlu menatal mendatar untuk melihat keseluruhan halaman.

Selepas anda menyumbang kepada pelanggan yang memaksimumkan atau tidak, fikirkan sempadan pelayar. Setiap pelayar web mempunyai bar tatal dan bersempadan di sisi yang mengecil ruang yang ada dari 800 hingga sekitar 740 piksel atau kurang pada resolusi 800x600 dan sekitar 980 piksel pada tingkap dimaksimumkan pada resolusi 1024x768. Ini dipanggil pelayar "chrome" dan ia boleh mengambil dari ruang yang boleh digunakan untuk reka bentuk halaman anda.

Halaman Lebar Tetap atau Cecair

Lebar berangka sebenar bukanlah satu-satunya perkara yang perlu anda fikirkan ketika merancang lebar laman web anda. Anda juga perlu memutuskan sama ada anda akan mempunyai lebar tetap atau lebar cecair . Dengan kata lain, adakah anda akan menetapkan lebar kepada nombor tertentu (tetap) atau kepada peratusan (cecair)?

Lebar Tetap

Halaman lebar tetap sama seperti bunyi. Lebar ditetapkan pada nombor tertentu dan tidak berubah tidak kira betapa besar atau kecil pelayarnya. Ini boleh menjadi baik jika anda memerlukan reka bentuk anda untuk melihat sama sama tidak kira seberapa luas atau mempersempit penyemak imbas pembaca anda, tetapi kaedah ini tidak mengambil kira pembaca anda. Orang dengan pelayar lebih sempit daripada reka bentuk anda akan perlu menatal secara mendatar, dan orang yang mempunyai pelayar lebar akan mempunyai ruang kosong yang besar di skrin.

Untuk membuat laman lebar tetap, gunakan nombor piksel khusus untuk lebar bahagian halaman anda.

Lebar Cecair

Halaman lebar cecair (kadangkala dipanggil halaman lebar fleksibel) bervariasi lebar bergantung pada sejauh mana tetingkap penyemak imbas. Ini membolehkan anda untuk mereka bentuk halaman yang memberi tumpuan lebih kepada pelanggan anda. Masalah dengan halaman lebar cecair adalah bahawa mereka boleh sukar dibaca. Jika panjang imbasan baris teks lebih panjang daripada 10 hingga 12 perkataan atau lebih pendek daripada 4 hingga 5 perkataan, ia boleh menjadi sukar dibaca. Ini bermakna bahawa pembaca dengan tetingkap pelayar besar atau kecil mempunyai masalah.

Untuk membuat halaman lebar fleksibel, gunakan peratusan atau ems untuk lebar bahagian halaman anda. Anda juga harus membiasakan diri dengan sifat maksimum CSS CSS. Harta ini membolehkan anda untuk menetapkan peratusan lebar, tetapi kemudian hadkannya supaya tidak begitu besar sehingga orang tidak dapat membacanya.

Dan Pemenangnya: Permintaan Media CSS

Penyelesaian terbaik hari ini ialah dengan menggunakan pertanyaan media CSS dan reka bentuk responsif untuk membuat halaman yang menyesuaikan dengan lebar penyemak imbas yang melihatnya. Reka bentuk web responsif menggunakan kandungan yang sama untuk membuat halaman web yang berfungsi sama ada anda melihatnya pada lebar 5120 piksel atau lebar 320 piksel. Halaman bersaiz berbeza kelihatan berbeza, tetapi ia mengandungi kandungan yang sama. Dengan pertanyaan media dalam CSS3, setiap peranti penerima menjawab pertanyaan dengan saiznya, dan lembaran gaya menyesuaikan dengan saiz tertentu.