Merancang Tips dan Contoh Layout Intensif Kandungan

Untuk membuat susun atur yang komprehensif untuk web memerlukan kemahiran dan dedikasi. Pereka web melakukan pekerjaan yang paling tidak dapat dilakukan, dan dengan cara yang sangat canggih. Apabila laman web telah berkembang, kami telah melihat keperluan untuk mengisi lebih banyak ruang dan memegang lebih banyak kandungan daripada sebelumnya. Jika anda sudah memahami bagaimana untuk merekabentuk laman web, itulah bonus yang besar ke arah memahami kaedah ini dengan lebih baik. Ciri teras dalam laman web jarang berubah. Bagaimanapun dengan lebih banyak kandungan halaman purata, faktor-faktor lain turut dimainkan termasuk ruang putih, tipografi, kedudukan unsur, antara lain.

Kami akan terperinci untuk menampung beberapa petua utama untuk membina susun atur intensif kandungan. Ini boleh didapati dari aplikasi rangkaian sosial, laman web perniagaan & korporat yang besar, atau apa saja di antara. Adalah penting untuk bertanya kepada diri sendiri "apa yang saya cuba capai dengan reka bentuk ini?"apabila anda merancang halaman kerana ia akan membantu anda meramalkan prospek yang lebih luas.

Halaman Web Custom

Tidak kira betapa berpengalaman dalam reka bentuk web praktikal yang anda mungkin, benar bahawa kita semua harus bermula di suatu tempat. Merancang halaman web peribadi pada umumnya merupakan langkah pertama ke arah kerjaya dalam pengaturcaraan web sebelum menggunakan spesifikasi konvensional.

Saya sentiasa mengesyorkan membuat senarai kecil elemen halaman yang dipertimbangkan untuk dipasang ke dalam templat. Sebaik sahaja semua ini dituliskan, ia menjadi lebih mudah untuk menyingkirkan idea-idea yang tidak baik atau mengambil permata yang tidak dijawab atau dilupakan. Ini juga membuka jalan bagi perancangan mudah untuk melegakan tekanan di jalan raya.

Wireframe Susun atur

Untuk laman web 5 muka surat generik, anda akan sering melihat elemen yang sama diulangi. Logo sudut atas, pautan navigasi kepala, kawasan kandungan utama mungkin berpecah dengan bar sisi dan fungsi lain (log masuk, kotak carian, dan lain-lain).

Pertimbangkan titik permulaan yang baik untuk membina susun atur halaman terperinci. Ramai pereka merasa senang membantu membuat rekaan wireframe yang mungkin untuk mengelakkan kekurangan yang tidak jelas. Ini tidak memerlukan apa-apa kertas mewah dan bahkan boleh dilakukan di dalam komputer riba yang dikendalikan oleh larian. Tujuan rentak adalah untuk memberi gambaran kasar di mana susun atur tapak harus menuju ruang untuk mengisi butiran kemudian.

Dengan susun atur berat kandungan, ia harus diambil kira betapa banyak platform yang akan dimuatkan. Membina susun atur 2-3 ruangan tertutup untuk menjadi tuan rumah 100+ halaman kandungan yang panjang, rumit tidak akan meninggalkan banyak ruang untuk ruang bernafas. Dengan lakaran dan perancangan di hadapan anda, anda boleh mengawal jumlah ruang yang luas untuk kandungan halaman. Ini bukan hanya merangkum kawasan teks atau blok tetapi juga berkaitan dengan imej dan video.

Brilliant White Space

Jarak putih mungkin faktor yang paling penting untuk diambil kira dalam reka bentuk susun atur intensif kandungan. Kandungan laman web mengamalkan semuanya, lebih daripada apa-apa laman web biasa. Jika pembaca tidak dapat memahami kandungan kerana tidak ada ruang untuk mencerna kata-kata anda, lalu lintas akan menjadi jerawatan dan tidak menyenangkan.

Perenggan dan tajuk halaman adalah tempat yang bagus untuk memulakan penyesuaian. Menggunakan sifat CSS anda harus dapat memanipulasi margin luar dan padding dari setiap elemen teks baris barisan. Ini termasuk semua tajuk 1-6, perenggan, blok sekat, senarai, teks terformat, dan beberapa unsur yang kurang.

Jika anda ingin memegang perhatian pembaca anda, penting untuk menggunakan jarak di bawah elemen teks utama. Perenggan dan tajuk yang lebih kecil berfungsi dengan baik dengan margin bawah 15px-25px. Untuk elemen halaman lebih besar seperti h1 atau h2 mempertimbangkan 35px + (ini bergantung pada saiz fon anda juga). Ruang antara unsur menegak adalah penting untuk menatal dan pengimbasan "sekilas". Walau bagaimanapun ketinggian baris adalah satu lagi ciri penting CSS yang mempengaruhi jarak antar baris dalam elemen teks. Perenggan harus mempunyai nilai ketinggian jalur yang jauh lebih besar berbanding dengan saiz fon mereka sehingga terdapat banyak padding tambahan di antara baris.

Pertimbangkan Gaya Dinamik

Selain jarak, tipografi digital harus dimanipulasi dengan cara untuk membuatnya melompat dari halaman. Dengan beratus-ratus berjuta-juta laman web di dunia hari ini, adalah perkara biasa untuk melihat jenis font yang sama di mana-mana.

Jika anda merancang susun atur untuk laman web yang berat dengan kandungan, hasilnya akan kelihatan seperti template hambar yang lain pada akhirnya. Terdapat banyak sifat untuk bermain-main dengan gaya tipografi lanjutan. Bayang teks, jarak kurang / lebih jarak surat, platform latar belakang, ikon ... senarai itu tidak berkesudahan.

Sesungguhnya anda adalah pereka dan kata terakhir anda adalah undang-undang. Merancang susun atur tidak setanding dengan lebuh raya lorong tunggal tanpa pemulihan. Semasa proses anda dapat kembali dan menukar gaya, memanipulasi elemen baru atau sampah konsep sepenuhnya. Pertimbangkan beberapa tips CSS yang berguna dan bermain-main untuk melihat apa yang paling sesuai!

Gunakan Menu Dropdown

Dengan begitu banyak kandungan, kemungkinan semua pautan anda tidak sesuai dengan satu halaman. Terdapat banyak pilihan tentang cara mengendalikan beban halaman. Meletakkan pautan tambahan di blok bar sisi atau dijahit ke dalam lajur di tapak tapak adalah dua pilihan yang bertujuan.

Pilihan yang paling mudah dan berguna ialah membuat skim navigasi drop-down dengan kategori kepala dan subkategori. Terdapat banyak skrip sumber terbuka yang menawarkan sub-sub-kategori jika anda mempunyai topik yang terperinci.

Mungkin strategi yang paling cepat dan tidak mengecewakan adalah dengan memulakan rangka kerja JavaScript. Antara yang paling popular termasuk jQuery, MooTools, atau Prototaip mungkin. Semua perpustakaan ini menawarkan dokumentasi dan banyak mempunyai skrip menu jatuh turun percuma yang tersedia.

Rancang Paparan Kandungan

Dalam amalan, lebih sukar untuk mewujudkan kawasan badan yang mudah untuk menempatkan semua kandungan laman web purata anda. Dengan piawaian penyemak imbas yang beralih dan sokongan mudah alih yang separa bermusim, tidak hairanlah kami melihat laman web intensif kandungan yang ditembak jatuh. Peka terhadap setiap gaya laman web yang dipaparkan. Sesetengah akan mengandungi berbilang imej, yang lain mungkin mengandungi grafik utama atau video atau tiada grafik sama sekali. Setelah selesai mengekodkan susun atur terakhir, buat beberapa halaman HTML untuk memaparkan pandangan yang berbeza.

Ini semua akan mempunyai markup dalaman yang sama kecuali kandungan di dalam kawasan kandungan utama. Setiap paparan halaman individu boleh dimanipulasi dan memberikan wawasan ke arah produk siap. Tukar ini untuk mengandungi semua pandangan utama yang anda fikir akan diperlukan dengan setiap halaman. Contoh lain dari elemen halaman boleh termasuk kotak ulasan, video atau galeri tertanam, atau pautan halaman split.

Strategi Rancang dengan teliti

Sebenarnya tidak begitu sukar untuk mewujudkan susun atur web kuasa. Ramai pereka yang terperangkap dengan butir-butir kecil seperti cara menanam elemen blok atau hiperpautan warna. Butiran ini penting kerana mereka menghantar mesej penjenamaan, walaupun dari elemen yang lebih kecil mesej itu harus disatukan dengan keseluruhan halaman. Rancangan merancang tahap reka bentuk anda untuk mengetahui bagaimana pendekatan terbaik untuk setiap halangan. Jika anda bekerja dengan pelanggan, adalah baik untuk membincangkan jenis kandungan yang akan mengisi muka surat terlebih dahulu. Ini memberi peluang kepada anda untuk merancang dan melancarkan pendekatan terbaik untuk tata letak umum.

Satu lagi topik utama yang tinggal adalah reka bentuk mudah alih. Pasaran baru ini menyaksikan pengembangan yang luar biasa bukan sahaja pada telefon pintar tetapi PC tablet yang berkuasa. Ini bermakna pengguna mungkin mengakses susun atur anda dari skrin mudah alih - pastikan kandungan tidak melimpah dan menyampaikan dengan kemas.

7 Contoh laman web Berat Kandungan

Berikut ialah beberapa tangkapan contoh dari laman web kandungan berat popular. Ini adalah jenama yang paling terkenal di pasaran fizikal dan digital. Lihat beberapa idea di bawah untuk mencari inspirasi dalam projek anda sendiri. Juga berasa bebas untuk berkongsi kandungan web berat kandungan lain di bahagian komen.

Clicker

Clicker adalah aplikasi rangkaian sosial baru untuk pencinta TV dan filem. Anda boleh mendaftar untuk akaun baru dan mencari beberapa rancangan TV klasik kegemaran anda, diarkibkan mengikut penyenaraian musim dan episod. Anda boleh membandingkan laman web ini dengan IMDB dengan kurang maklumat dan lebih banyak kandungan video!

Masa Depan Reka Bentuk Web

Masa Depan Reka Bentuk Web 2011 akan melancarkan perkara di London musim bunga ini. Lihat laman utama untuk maklumat lanjut dan contoh reka bentuk susun atur berasaskan teks. Semua butirannya benar-benar dikongsi dan menawarkan penceramah, jadual, bengkel, penaja, dan banyak lagi.

Tuhan mungkin

Dalam susun atur lucu ini, watak utama Tuhan mungkin telah "dipersonalisasi" dan berlubang ke dalam satu ilustrasi. Laman ini dibahagikan kepada 3 lajur dengan setiap kandungan, iklan, pautan suapan, dan arkib yang baru. Reka bentuk itu sendiri sangat retro dan pintar mengambil reka bentuk ilustrasi.

Microsoft

Kebanyakan peminat teknologi sudah biasa dengan Microsoft. Sebenarnya, kebanyakan orang yang memahami apa yang komputer boleh memberi anda gambaran ringkas mengenai Microsoft dan Bill Gates. Laman rumah mereka menempatkan kandungan untuk berpuluh-puluh pakej perisian, kemas kini berita, siaran akhbar, dan maklumat pemaju. Cara-cara kecil di bawah halaman anda boleh melihat menu tab menegak dengan pensuisan kandungan dinamik.

Land Search Engine

Search Engine Land adalah majalah web popular yang memberi tumpuan kepada Search Engine dan pemasaran Internet. Mereka sering mengemaskini dengan jawatan berkualiti dan memacu beratus-ratus orang ke laman web mereka setiap hari. Halaman utama berpecah kepada 3 lajur yang digunakan untuk memegang setiap modul dan iklan kandungan.

Rumah Putih

Reka bentuk White House Amerika Syarikat kelihatan sangat bersih dan profesional. Terdapat banyak maklumat mengenai jadual presiden dan peristiwa penting politik yang lain. Satu helah untuk mengurangkan ruang halaman adalah penambahan slider kandungan kecil ke arah tajuk halaman. Ini bagus untuk memaparkan tajuk utama berita 3-4 tepat apabila pelawat anda mendarat di halaman.

Portal Yahoo

Setakat laman web kandungan besar pergi Yahoo! mesti bergerak ke arah puncak. Yahoo! menawarkan beratus-ratus perkhidmatan kepada pelanggan mereka termasuk mel, berita, video, dan juga carian web. Semak beberapa Y! pautan portal dari bar sisi untuk melihat bagaimana templat mereka membandingkan.

Kesimpulannya

Ini hanya beberapa perkara utama dan langkah-langkah untuk membina susun atur kandungan yang menuntut kandungan. Laman web dengan takungan kandungan yang besar sering dilihat sebagai beban yang memegang fodder SEO dan tidak ada nilai sebenar. Reka bentuk adalah segalanya kerana ia merupakan kesan pertama pengguna mendapat dari setiap laman web. Dengan jumlah kandungan yang tinggi ini dapat menjadi bencana dengan kekacauan dan lebih umum. Jangan berhenti berlatih dan dengan hanya beberapa projek, anda akan mendapat penguasaan untuk membayangkan susunan kandungan yang intensif.