Idea susun atur web baru untuk tahun 2015

Empat trend baru muncul dalam susun atur web pada tahun 2015: skrin split, susun atur bebas kontena, grid blok dan laman web skrin tunggal

Mata utama:

• Artikel menunjukkan empat trend susun atur utama yang muncul pada tahun 2015: skrin split, susun atur bebas kontena, grid blok dan laman web skrin tunggal.
• Susun atur skrin berpecah digunakan untuk menyerlahkan dua fungsi yang sama penting atau mengekspresikan konsep dualitas, sementara susun atur bebas kontena memberi tumpuan kepada kandungan, menggunakan warna dan tipografi untuk membuat hierarki dan bukannya struktur sendiri.
• Blok Grid adalah alat serba boleh untuk membuat laman web responsif, dengan modul yang boleh diselaraskan mengikut saiz skrin. Walau bagaimanapun, dengan menggunakan susun atur ini untuk membezakan kandungan boleh menjadi satu cabaran.
• Laman web skrin tunggal terutamanya responsif disesuaikan dengan imej latar belakang skrin, biasanya dengan reka bentuk minimalis dan tiada bar skrol. Oleh kerana ruang yang terhad, susun atur ini memerlukan hierarki kandungan yang jelas.

Konsep reka bentuk web baru muncul setiap tahun, sementara beberapa trend lama secara beransur -ansur hilang. Dalam beberapa bulan akan datang, kami pasti akan melihat peningkatan sementara dalam populariti latar belakang video, jubin dan buku cerita animasi, untuk menamakan beberapa.

Sebaliknya, hampir pasti reka bentuk web responsif yang muncul seawal tahun 2010 akan kekal di tengah -tengah reka bentuk kami untuk beberapa waktu yang akan datang.

Sudah tentu, ini tidak bermakna bahawa semua laman web mesti beralih kepada struktur standard yang sama. Sebaliknya, mungkin terdapat lebih banyak ruang untuk pembezaan, fleksibiliti dan percubaan daripada sebelumnya.

Kami mengenal pasti empat trend atau rancangan keseluruhan yang kami percaya akan menguasai reka bentuk susun atur pada tahun yang akan datang. Anda boleh mendapatkan inspirasi dari model -model ini, tetapi reka bentuk terbaik biasanya dihasilkan apabila anda menggunakan inspirasi sebagai titik permulaan untuk kreativiti anda.

Berikut adalah trend ini.

Susun atur skrin split

Apabila kita memanggil "Skrin Split" adalah laman web di mana skrin biasanya dibahagikan kepada dua bahagian (biasanya saiz yang sama).

Terdapat dua sebab utama untuk membahagikan halaman seperti ini:

1. Tunjukkan dua ciri penting.
2. menyatakan konsep duality.

Keadaan pertama biasanya berlaku apabila syarikat mesti mempromosikan produk atau perkhidmatan dengan dua ciri atau varian yang sama pentingnya. Oleh kerana laman web sering menyusun unsur -unsur dalam rangka penting, susun atur yang lebih tradisional mungkin tidak sesuai dalam kes ini.

Sebaliknya, membahagikan skrin ke dalam dua lajur mungkin merupakan cara terbaik untuk mempamerkan dua aspek yang berbeza dari sistem yang sama (contohnya, sistem penerbitan yang bermanfaat kepada penerbit dan pembaca).

Dengan cara ini, tidak perlu membezakan antara ciri -ciri utama dan kecil, dan pembaca akan segera memberi perhatian kepada kandungan penting.

Alasan kedua berpunca dari fakta bahawa kadang -kadang pereka perlu menyampaikan konsep dualitas. Dalam kes ini, membahagikan skrin ke dalam dua bahagian mewujudkan dua ruang di mana anda boleh memberi tumpuan kepada topik yang berbeza, atau bahkan dua produk yang berbeza. Tambahan pula, gaya ini membolehkan anda menyerlahkan ciri -ciri bertentangan realiti tertentu.

3

Contoh pertama yang akan kita lihat ialah laman utama DeskTime, sebuah syarikat yang beroperasi di medan perkongsian pejabat. Mereka membahagikan halaman itu menjadi dua bahagian untuk memenuhi keperluan kedua -dua mereka yang sudah memiliki pejabat dan mereka yang mencarinya. Oleh itu, mereka menggunakan "segmentasi menegak" untuk mendapatkan masa yang sama seperti dua ciri yang sama penting dalam perkhidmatan mereka. Gaya yang mereka pakai adalah berkesan dan praktikal, dan sangat ringkas dan jelas. Baiklah!

Nota: Lapan & empat telah direka semula sejak saya mengambil tangkapan skrin ini.

lapan & empat

https://www.php.cn/link/ad100897c6f809081d942836af421f86

Contoh kedua berasal dari Lapan & Empat, sebuah syarikat pemasaran digital. Laman utama mereka juga dibahagikan kepada dua bahagian, dengan reka bentuk berdasarkan perbezaan antara warna putih dan rata. Bahagian ini digunakan untuk menyatakan semua fungsi yang berbeza yang dimiliki oleh syarikat.

gaya "segmentasi menegak" juga bergantung kepada kewujudan "&", yang melemahkan kesan segmentasi.

susun atur containerless

Hampir sejak permulaan reka bentuk, pereka telah menggunakan unsur -unsur seperti kotak, bentuk dan garis untuk membahagikan dan memasukkan kandungan dalam reka bentuk. Sebagai contoh, pertimbangkan bagaimana tajuk atau footer sentiasa direka untuk secara visual terpisah dari seluruh kandungan.

Trend baru muncul, dengan idea teras untuk mengeluarkan struktur grafik dan beralih kepada gaya yang lebih bebas dan terbuka. Trend ini mempunyai beberapa kesamaan dengan minimalism, tetapi ia melangkah lebih jauh. Sebenarnya, minimalism biasanya masih menggunakan struktur yang mudah, linear, dan gaya baru "contaless" ini sepenuhnya membentangkan sebarang pembungkusan visual.

Kandungan itu sendiri menjadi pusat perhatian, dan hierarki maklumat ditentukan oleh pemilihan warna, lokasi dan tipografi yang bijak, dan bukannya oleh bingkai dan struktur.

Foreword

https://www.php.cn/link/93bb49ede783ed9c09b650c9234be21a

Seperti yang anda lihat dari laman utama, pengantar adalah agensi interaktif yang berpusat di New York dan Paris. Laman web mereka membatalkan sebarang elemen yang mengandungi, dan perhatian pengguna difokuskan di sini oleh warna dan fon.

Khususnya, mereka dengan mahir menggunakan tipografi untuk memberikan maklumat syarikat yang paling penting. Warna terutamanya digunakan untuk menyerlahkan bunyi yang boleh diklik lain. Adalah jelas bahawa laman web ini sangat ringkas selain responsif dalam setiap cara.

blok grid

Kami tidak perlu menunjukkan di sini bahawa struktur grid boleh menjadi cara yang sangat berkesan untuk membuat laman web responsif. Dalam kes ini, setiap modul akan mengandungi kandungan tertentu, seperti tajuk, imej, atau teks.

Modul

biasanya digunakan di halaman utama laman web, tetapi boleh dibangunkan di halaman lain untuk memenuhi keperluan.

Setiap modul direka untuk menjadi fleksibel dan ia akan menyesuaikan diri dengan saiz skrin. Ini menjadikan "susun atur grid" yang kuat "alat yang sangat serba boleh yang boleh digunakan secara efisien di laman web dan aplikasi mudah alih.

Walau bagaimanapun, salah satu cabaran dengan pendekatan ini ialah jika anda membuat banyak modul dengan saiz yang sama, mungkin sukar untuk membezakan antara kandungan yang paling menarik dari projek yang lebih tua dan kurang penting.

Malah, jika banyak blok adalah saiz yang sama, perhatian pengguna mungkin tidak tertarik kepada mana -mana item tertentu. Untuk mengelakkan masalah ini, pendekatan baru adalah untuk membuat modul saiz yang berbeza berdasarkan modul yang mengandungi.

NOTA: Greats juga telah direka semula sejak saya mengambil tangkapan skrin ini.

Greats

https://www.php.cn/link/2Fe37BD25993870F5A38563DD25B1D05 Greats adalah sebuah syarikat yang berpangkalan di New York yang menjual kasut lelaki terutamanya melalui laman webnya. Laman web mereka adalah tetingkap paparan mereka, jadi setiap butiran telah dikaji dan dipertimbangkan dengan teliti.

"Greats" memilih kepraktisan susun atur grid. Mereka menyusun halaman rumah mereka dalam baris modul, masing -masing mengandungi sepasang kasut. Semua modul adalah saiz yang sama, dan bentuknya tersirat dan tidak ditandakan dengan ketat. Malah, pengguna digalakkan untuk mengabaikan apa -apa selain paparan kasut.

Laman web skrin tunggal

Trend terakhir yang telah kita lihat dalam 6 bulan terakhir adalah laman web yang memberi tumpuan kepada responsif, selalu menyesuaikan diri dengan imej latar belakang skrin. Sering kali, laman web ini sangat ringkas dan pasti cenderung kepada rasa reka bentuk minimalis.

Walau bagaimanapun, ciri ikonik trend reka bentuk ini adalah kekurangan bar-bar: dengan kata lain, laman web ini hampir selalu mengambil pendekatan "aplikasi tunggal" untuk UI mereka.

Oleh kerana ruang kandungan yang terhad, pereka harus ingat hierarki kandungan yang sangat jelas dan harus sangat bijak apabila termasuk maklumat yang kurang relevan.

Dalam kebanyakan kes, imej (atau video) menguasai reka bentuk, meninggalkan ruang yang sangat terhad untuk idea reka bentuk yang lain. Ia boleh mempamerkan produk atau hanya digunakan untuk membangkitkan suasana emosi dan sinematik.

Shamballa Jewels

https://www.php.cn/link/885ca3d99fd35f509a2aa0130e8bf64f

"Shamballa Jewels" adalah sebuah syarikat yang menjual pelbagai perhiasan. Laman web ini mempunyai halaman utama, yang terdiri daripada halaman unik yang memaparkan beberapa kerja mereka. Tiada bar skrol, dan navigasi laman web disediakan oleh menu di bahagian atas skrin.

Apa yang saya suka tentang laman web ini ialah latar belakang berubah sepanjang masa. Malah, imej yang sesuai untuk seluruh ruang muncul secara bergantian dengan skrin perpecahan menegak.

Contoh di atas menunjukkan bahawa reka bentuk yang hebat dan berkesan tidak perlu terikat kepada 4 atau 5 corak susun atur yang paling biasa yang kita lihat. Setiap orang menentang keinginan untuk memulakan dengan kebiasaan dan keselamatan grid/bingkai popular yang kita lihat - dan mendapat hasil yang hebat sebagai hasilnya.

Adakah ini bermakna bahawa susun atur web yang lebih biasa tidak berfungsi?

Sudah tentu tidak. Tetapi seperti yang dikatakan Mark Twain, "Bagi orang yang memegang tukul, semuanya kelihatan seperti kuku."

Pastikan anda melihat kuku.

(Berikut adalah karya pseudo-asal di bahagian FAQ yang asal, yang mengekalkan makna asal, dan telah membuat pelarasan pernyataan dan penggantian perkataan)

Soalan -soalan yang sering ditanya mengenai reka bentuk susun atur web

Q: Apakah trend dalam reka bentuk susun atur web moden?

A: Trend reka bentuk susun atur web moden sentiasa berubah dan berubah. Beberapa trend popular termasuk reka bentuk minimalis, susun atur asimetrik, susun atur skrin split, dan reka bentuk pertama mudah alih. Trend ini memberi tumpuan kepada mewujudkan pengalaman mesra pengguna yang memberikan navigasi mudah dan kandungan yang menarik. Mereka juga menekankan daya tarikan visual, menggunakan warna berani, tipografi unik, dan imej dan video berkualiti tinggi.

Q: Bagaimana menjadikan susun atur laman web saya lebih menarik?

A: Untuk menjadikan susun atur laman web anda lebih menarik, sila perhatikan pengalaman pengguna. Ini boleh dilakukan dengan memastikan laman web anda mudah menavigasi dan mempunyai menu dan pautan yang jelas. Gunakan imej dan video berkualiti tinggi untuk menarik perhatian pengguna. Juga, pastikan kandungan anda relevan dan menyeronokkan kepada khalayak sasaran anda. Menggabungkan unsur -unsur interaktif seperti kuiz atau pengundian juga boleh meningkatkan penglibatan.

Q: Apakah kepentingan reka bentuk pertama mudah alih dalam susun atur web?

A: Reka bentuk mudah alih pertama adalah strategi reka bentuk yang mengutamakan reka bentuk untuk peranti mudah alih dan kemudian untuk desktop atau peranti lain. Ini penting kerana semakin ramai orang menggunakan peranti mudah alih mereka untuk mengakses Internet. Reka bentuk pertama mudah alih memastikan laman web anda kelihatan baik dan berfungsi dengan baik pada semua peranti, memberikan pengalaman pengguna yang lebih baik.

Q: Bagaimana menggunakan warna dengan berkesan dalam reka bentuk susun atur web?

A: Warna memainkan peranan penting dalam reka bentuk susun atur web. Ia boleh menetapkan emosi, menyampaikan emosi, dan juga mempengaruhi tingkah laku pengguna. Untuk menggunakan warna dengan berkesan, pertimbangkan identiti jenama dan penonton sasaran anda. Pilih palet yang mencerminkan jenama anda dan melibatkan penonton anda. Gunakan warna yang berbeza sebagai teks dan latar belakang untuk memastikan kebolehbacaan. Di samping itu, gunakan warna untuk menyerlahkan elemen atau maklumat penting di laman web.

Q: Apakah peranan menaip dalam reka bentuk susun atur web?

A: Typesetting adalah elemen penting dalam reka bentuk susun atur web. Ia bukan sahaja menyampaikan maklumat, tetapi juga menetapkan nada dan keperibadian laman web. Pilih fon yang mudah dibaca dan mencerminkan gaya jenama anda. Gunakan saiz dan ketebalan fon yang berbeza untuk membuat hierarki dan membimbing perhatian pengguna. Juga, pastikan terdapat perbezaan yang cukup antara teks dan latar belakang untuk memastikan kebolehbacaan.

Q: Bagaimana untuk menambah elemen multimedia ke reka bentuk susun atur web?

A: Unsur multimedia seperti imej, video, dan audio dapat meningkatkan pengalaman pengguna dan menjadikan laman web anda lebih menarik. Gunakan imej dan video yang berkualiti yang berkaitan dengan kandungan anda. Pertimbangkan menggunakan video latar belakang atau animasi untuk meningkatkan minat visual. Di samping itu, gunakan Audio dengan berhati -hati dan menyediakan pengguna dengan fungsi kawalan seperti main balik, jeda atau menyesuaikan kelantangan.

Q: Apakah beberapa kesilapan biasa dalam reka bentuk susun atur web yang harus dielakkan?

A: Beberapa kesilapan umum yang harus dielakkan dalam reka bentuk susun atur web termasuk susun atur yang berantakan, navigasi yang lemah, fon yang berlebihan atau warna, dan tidak dioptimumkan untuk peranti mudah alih. Juga, elakkan imej atau video berkualiti rendah dan pastikan pedalaman anda mudah dibaca dan difahami.

Q: Bagaimana untuk meningkatkan kebolehgunaan susun atur laman web saya?

A: Untuk meningkatkan kebolehgunaan susun atur laman web anda, pastikan laman web anda mudah dinavigasi dan mempunyai menu dan pautan yang jelas. Gunakan susun atur dan elemen reka bentuk yang konsisten di seluruh laman web. Di samping itu, pastikan laman web anda dimuatkan dengan cepat dan dioptimumkan untuk peranti mudah alih. Menyediakan ciri kebolehcapaian untuk pengguna kurang upaya, seperti teks alternatif untuk imej dan sari kata untuk video.

Q: Apakah peranan ruang putih dalam reka bentuk susun atur web?

A: Ruang putih atau ruang negatif adalah ruang antara unsur -unsur dalam reka bentuk. Ia boleh digunakan untuk membuat keseimbangan, membimbing perhatian pengguna dan meningkatkan kebolehbacaan. Meninggalkan ruang kosong juga boleh menjadikan reka bentuk anda kelihatan sederhana dan moden. Walau bagaimanapun, pastikan anda menggunakan Whitespace secara strategik dan jangan meninggalkan terlalu banyak ruang untuk mengelakkan membuat reka bentuk anda kelihatan tidak lengkap.

Q: Bagaimana untuk mengekalkan novel reka bentuk susun atur web saya dan up-to-date?

A: Untuk memastikan novel reka bentuk susun atur laman web anda dan up-to-date, teruskan maklumat mengenai trend dan teknologi reka bentuk terkini. Kemas kini kandungan anda dengan kerap untuk menjadikannya relevan dan menyeronokkan kepada khalayak anda. Juga, pertimbangkan untuk mendesain semula laman web anda setiap beberapa tahun untuk memastikan ia moden dan menarik.

Atas ialah kandungan terperinci Idea susun atur web baru untuk tahun 2015. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!