2021-09-21 分類: 網(wǎng)站建設
專題是一種內(nèi)容聚合,有共同性的文章組成的集合體,呈現(xiàn)出信息量大、令人印象深刻的特點,將給讀者在瀏覽這一信息時得到全方位的認知,從而取得讀者給予信任和認可,在讀者的認知中建立起權威——百度百科
專題通常都是要求時效性的,所以做專題首先講究速度,那么我們怎樣才能較快的實現(xiàn)一個專題稿呢下面讓我們具體的聊聊。
一、 專題類型:
1、中規(guī)中矩型(變化的只是頭圖,不變的是內(nèi)容的格局),如下圖所示:
2、自由奔放型(變化的不止是頭圖,內(nèi)容呈現(xiàn)上也比較隨意),如下圖所示:
3、搭配發(fā)揮型(只有一個頭圖),如下圖所示:注:①
二、理念原則:
1、復用原則:
如上圖所示,該模塊在隨手拍四季中都會出現(xiàn),就需要我們將此模塊封裝好保留以來。常用的模塊歸類,以便日后復用,節(jié)省以后工作量提高工作效率。
2、舍棄原則:
盡量多的應用Css3技術,這樣做可以避免使用過多的圖片影響頁面打開速度,還能減少flash的開發(fā),當然這樣做的缺點是會造成頁面中css體積較大,低版本瀏覽器顯示效果不佳等;
如上圖所示,通過css區(qū)別對待,高版本瀏覽器顯示如左圖,低版本瀏覽器顯示如右圖。
3、時間原則:
通常需求都是一系列,比如:微攝影春夏秋冬、微小說一二三屆、年底重大節(jié)假日活動系列;
這就要求我們有提前預判的能力,及早與需求方溝通確認時間,盡早做好人員技術儲備。
三、構(gòu)建方案:
上述類型的專題,制作流程都相近,專題和產(chǎn)品是一樣的,大部分都是按塊區(qū)分,只不過專題更具視覺沖擊力,布局更隨意。
常規(guī)專題,構(gòu)建步驟通常如下:
1、規(guī)劃分類:
規(guī)劃:拿到設計稿后自上至下瀏覽一遍,瀏覽的時候就可以對這個頁面有初步的規(guī)劃,我們通常規(guī)劃成網(wǎng)格狀,如下圖所示:
分類:專題都是通過專題后臺搭建而成,后臺庫提供了一部分封裝好的模塊,所以先找出后臺已有的模塊,這些模塊直接在后臺中編輯發(fā)布即可;
如下圖所示:(公用模塊大約20多個,包括:發(fā)布器、feed、圖片列表(120、180)、加關注、焦點圖、視頻等)
2、模塊構(gòu)建:
公用的挑出來后,開始構(gòu)建‘非常規(guī)’模塊,特殊的模塊就是特定專題特定的內(nèi)容,這部分需要頁面工程師構(gòu)建完成;
做模塊的原則要求代碼盡量做到低耦合,高內(nèi)聚(將頁面中的元素看成相對獨立但又彼此聯(lián)系的小零件,設想這些小零件可以隨時被拖放到頁面中的任意位置而不影響其內(nèi)部元素的正常運行);模塊css的書寫原則要求本專題特有的標志開頭,例如:教師節(jié)–對應的線上域名為teacher,css就最好以t或 teacher開頭,譬如.t_top{}或.teacher__top{},這樣做為了規(guī)避css命名沖突的風險;
專題構(gòu)建時有些需要重點考慮(注:②),
3、測試交付:
模塊構(gòu)建好之后就開始把模塊拼合到一起,成為一個成型的頁面,后續(xù)交付編輯填內(nèi)容;做好的頁面交付給編輯進行內(nèi)容的添加,頁面交付后要跟進,因為不是所有編輯都很了解代碼,所以要提前做好風險控制,比如:注釋做好,代碼要精簡。
4、上線維護:
編輯填好內(nèi)容之后進行最后一次上線前的審核,優(yōu)化一下細節(jié),和設計稿截屏對一下像素,沒問題即可上線推廣;
解釋:
注:①搭配發(fā)揮型快捷構(gòu)建:
很多情況下,設計師排期不能提供整稿設計圖,只能提供一個頭圖,這就要頁面構(gòu)建協(xié)助編輯快速完成一個專題的搭建,依據(jù)頭圖調(diào)頁面背景色,內(nèi)容區(qū)域的背景色,標題背景色及標題文字色,文字鏈接色,文字色等,通常根據(jù)以往設計師的設計理念,按照下面的顏色順序搭配不至于偏差很多:
標題背景色>內(nèi)容區(qū)域的背景色>頁面背景色;
主鏈接色>次鏈接色>標題文字色;
文字色(文字色通常為灰色)。
根據(jù)上述理念,快速搭建出的專題如下圖所示:
注:②制作專題需要要重點考慮的幾個點:
標題欄處理:
1)、很多標題都是可復用的,這里要做靈活,最好能做到自適應寬度;
2)、要確定標題文字是否需要后續(xù)不斷修改,如果需要不斷修改要做成活字;
圖片處理:
1)、頭圖:
頭圖提倡應用jpg格式實現(xiàn)(注:②-①),
雖然原則上圖片盡量控制大小,但因為專題的周期和訪問量限制,再加設計師費了大量心血精雕細琢出來的頭圖不能因為質(zhì)量影響美觀,通常頭圖原則是Firework導出品質(zhì)為80~90較佳,Photoshop導出品質(zhì)為70~80較佳。
通常情況下,一個像素不是特別高的圖片Photoshop70的品質(zhì)大約等于Firework85,
Photoshop80的品質(zhì)大約等于Firework90(具體還要看圖片導出大小而定)。
2)、背景:
內(nèi)容背景建議用純色,如果純色不能滿足建議盡量用png鋪背景;
3)、icon及button:
icon和button盡量使用css sprites技術,如此不僅可以減少圖片數(shù)量,降低請求書,還方便后續(xù)統(tǒng)一管理。
icon,button避免gif,為什么不用gif(注:②-②),提倡應用png格式實現(xiàn)(注:②-③),
注:
②–①jpg特點:jpg優(yōu)點:攝影作品或?qū)憣嵶髌分С指呒墘嚎s,利用可變的壓縮比可以控制文件大小,支持交錯(對于漸近式 jpg文件)。 廣泛支持Internet 標準。由于體積小,jpg在萬維網(wǎng)中被用來儲存和傳輸照片的格式;jpg缺點:有損耗壓縮會使原始圖片數(shù)據(jù)質(zhì)量下降。 當您編輯和重新保存 jpg文件時,jpg會混合原始圖片數(shù)據(jù)的質(zhì)量下降。這種下降是累積性的。 jpg不適用于所含顏色很少、具有大塊顏色相近的區(qū)域或亮度差異十分明顯的較簡單的圖片。
②-②gif特點:流式讀/寫性能、逐次逼近顯示、透明性、無損壓縮等,gif特有的特點:在一個gif文件中可以存多幅彩色圖像,如果把存于一個文件中的多幅圖像數(shù)據(jù)逐幅讀出并顯示到屏幕上,就是一種最簡單的動畫,gif缺點:只能顯示256色,色彩過多會顯示效果較差。
②-③png特點:png保留了gif的特點,還有gif沒有的特點:支持真彩色圖像,png缺點:不支持動畫,ie6不支持真彩色透明。
四、總結(jié):
時間緊情況下,制作專題時間黃金比應該是:
規(guī)劃分類:模塊構(gòu)建:拼頁面:測試上線
1:4:1:2
假如:預估需要8個小時完成,最好的方案是模塊分類1小時,構(gòu)建4小時,拼頁面1小時,測試2小時,前6小時完成頁面可交付編輯進行內(nèi)容添加,在編輯添加內(nèi)容的同時測試可以同步實施。
應用以上幾點,無論簡潔還是復雜的專題就很容易搭建成了。
有時候理解專題會有錯誤的理念:專題就那么回事,沒人看,應付應付過去了,其實不然,一個好的專題是營銷的開始、合作資源互換的入口;
一個專題的數(shù)據(jù)實例:感恩節(jié)活動
專題囊括吃喝玩樂在一起,小專題,大樂趣,用心去建,你感覺還會相信愛的!
當前標題:網(wǎng)站專題人建人愛怎樣才能較快實現(xiàn)一個專題稿
網(wǎng)頁鏈接:http://m.rwnh.cn/news42/127792.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站設計公司、Google、網(wǎng)站導航、微信小程序、ChatGPT、品牌網(wǎng)站制作
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容