Bercakap tentang pembinaan semula tapak web dari Douban website design_CSS/HTML

douban.com sangat bijak menggunakan div+css, dan melalui penggunaan warna, meminimumkan gambar, dsb., ia bukan sahaja menjadikan halaman laman web segar dan menyenangkan, tetapi juga memampatkan saiz halaman web ke tahap maksimum, sekali gus menjadikan kecekapan Akses dimaksimumkan.

Apabila saya membaca douban.com buat kali pertama, saya rasa saya sedang membaca majalah "membaca" di tangan saya. Ia sangat elegan dan nampaknya mempunyai sedikit rasa seperti buku. Kita semua sudah biasa dirogol oleh laman web ala Cina, menyangkakan laman web ini hanya begini dan tidak dinafikan ramai yang akan tersentuh dengan kesederhanaan laman webnya apabila pertama kali melihat douban.com. , dan mata mereka akan bersinar! Kenapa? Jadi saya ada beberapa idea

1. Menggunakan teknologi halaman div+css Sejak terjemahan buku "Pembinaan Semula Laman Web", kaedah susun atur ini telah mula berakar umbi di hati orang ramai. org untuk mengetahui lebih lanjut), tetapi boleh dikatakan A mesti untuk web2.0.

2. Gunakan latar belakang blok warna untuk menyerlahkan keseluruhan kandungan Warna penting ialah merah jambu muda, biru muda dan latar belakang putih, yang sangat menyegarkan.

3. Teras douban.com ialah buku, muzik, filem dan pengguna (kumpulan), semuanya menggunakan lakaran kenit dan lakaran kecil pengguna (kumpulan) adalah lebih kecil. Gambar-gambar di Internet bagi tiga yang pertama biasanya kelihatan lebih baik dan mesti lebih besar. Gambar yang terakhir boleh dimuat naik dan direka bentuk menjadi gambar yang lebih kecil, yang boleh menjadikan gambar kelihatan lebih baik.

4. Selain di atas, douban sangat kedekut dengan gambar, hampir tiada. Pengguna tidak dibenarkan menyiarkan gambar walaupun semasa menghantar komen atau siaran. Faedah ini sangat jelas Ia membolehkan pengguna menumpukan pada teks, manakala gambar berkaitan dengan teras laman web dan tidak akan menghasilkan perkara yang tidak relevan. Selain itu, kelajuan capaian laman web adalah sangat pantas.

5. Tidak kira halaman apa, susun atur yang sama digunakan. Reka letak menggunakan pendekatan atas-tengah-bawah. Bahagian atas ialah navigasi; bahagian tengah ialah format 2 lajur, dengan kandungan teras halaman di sebelah kiri, fungsi dan maklumat tambahan dan berkaitan di sebelah kanan dan navigasi tapak di bawah. Semua navigasi juga tidak mempunyai gambar.

6. Douban juga bijak dalam menggunakan helaian gaya Pilihan pautan diserlahkan dalam warna biru tua, klik diserlahkan dalam warna oren, pemadaman diserlahkan dalam warna merah gelap dan buku/muzik/filem diserlahkan dalam huraian fungsi dan Ikon penanda halaman tapak berwarna hijau, bintang yang disyorkan berwarna merah, dan selebihnya berwarna hitam abadi. Keseluruhan palet warna berkisar pada warna biru dan merah serta hijau. Ini sesuai dengan logo Douban dan sangat diselaraskan.

7. Butang jarang digunakan, tetapi saya memutuskan bahawa kerana terdapat sedikit butang, lebih baik jangan gunakan semuanya, ini lebih baik!

8. Panjang halaman Douban sangat pendek, biasanya 2 halaman dan tidak lebih daripada 3 halaman. Saya sentiasa percaya bahawa halaman yang terlalu panjang akan membuatkan pengguna tidak sabar, dan 2-3 halaman adalah pilihan terbaik. Sebab mengapa terdapat halaman yang panjang ini hanya kerana laman web portal ingin mempunyai lebih banyak jawatan pengiklanan Tidak setiap laman web memerlukan ini.

9. Pengiklanan, Douban berbeza daripada laman web lain kerana ia tidak menyediakan ruang pengiklanan yang mewah pada masa ini ia hanya mempunyai iklan teks Google dan iklan teks untuk "Membaca" dan "Pembaca". iklan pada masa hadapan Jika gambar Tradisional dan iklan kilat disediakan, dan keseluruhan tapak akan berubah.

10. Jangan gunakan tetingkap pop-up Saya tidak biasa dengan ini pada mulanya, saya meneliti dan mendapati bahawa ini harus berkaitan dengan penonton laman web , dan filem, jadi biarkan pengguna mengikut laluan sebanyak mungkin. Adalah lebih baik untuk menyelesaikan perjalanan, kerana saya tidak fikir sesiapa yang melompat untuk menghargai perkara ini. Oleh itu, saya berpendapat bahawa mereka yang tidak biasa tidak mempunyai tetingkap timbul mungkin tidak dapat benar-benar menetap di Douban untuk masa yang lama, dan mereka ditakdirkan untuk tidak menjadi pengguna teras Douban.

Secara amnya, douban.com menggunakan div+css dengan sangat mahir, dan melalui penggunaan warna, meminimumkan gambar, dsb., ia bukan sahaja menjadikan halaman laman web segar dan menyenangkan, tetapi juga memampatkan halaman web ke tahap maksimum saiz, dengan itu memaksimumkan kecekapan akses. Kerana hampir tiada maklumat sampah dalam halaman, carian Google sangat cekap, dan perkaitan setiap halaman menjadikan keseluruhan tapak sangat mesra untuk robot carian. Dari segi susun atur UI, keseluruhan laman web mempunyai susun atur bersatu, yang sangat mudah digunakan dan tidak mudah untuk pengguna tersesat. Saya fikir falsafah UI Douban mungkin juga mempunyai kaitan dengan pembangun menggunakan Python adalah susunan logik berfungsi yang pantas melalui lekukan Ditambah dengan kesederhanaan Python itu sendiri, program Python sangat mudah dan jelas. Dari perspektif ini, susun atur Douban boleh dilihat sebagai susunan program Python, dan falsafah Douban juga boleh dilihat sebagai falsafah Python.

Kalau nak sebut genre apa gaya laman web Douban, saya rasa Douban sepatutnya tergolong dalam gaya minimalis Google, lagipun, ini berbeza dengan yang gelap dan gaya komersial yang kami salin di Eropah dan Amerika dalam tempoh 2 tahun yang lalu Ia seperti menyalin templat kilat Korea dengan blok warna besar, gambar besar dan gambar besar. Saya rasa kesederhanaan Google mempunyai empat perkara utama: kesederhanaan (fungsi yang mencukupi, termasuk navigasi halaman), kemudahan penggunaan (hanya bermula dengan interaksi mudah dan UI), bertimbang rasa (dekat dengan psikologi pengguna) dan fokus (berdasarkan perniagaan itu sendiri). Atas dasar ini, menambah ciri industri tapak web anda sendiri, adakah ini bermakna kemungkinan arah aliran pembinaan semula tapak web web2.0 domestik?