西安網(wǎng)站建設(shè) | 西安網(wǎng)站制作 | 西安網(wǎng)站設(shè)計(jì) | 西安小程序開發(fā) | 兄弟網(wǎng)絡(luò) - 西安網(wǎng)站建設(shè)十余年經(jīng)驗(yàn),值得信賴!
了解市場新觀點(diǎn),內(nèi)部案例剖析,增強(qiáng)服務(wù)意識與專業(yè)水平。

網(wǎng)頁設(shè)計(jì)者如何提高網(wǎng)頁制作效率(一)

來源:西安網(wǎng)站制作   日期:2015-05-19 16:18:23   點(diǎn)擊:2444

其實(shí)企業(yè)站點(diǎn)的工作量并不大,相信很多有經(jīng)驗(yàn)的同仁能夠把普通企業(yè)站可能用到的欄目一口報(bào)出來。在這里我們換個(gè)角度來看待這些工作。從頁面的內(nèi)容構(gòu)成上來針對他們進(jìn)行分類:

一:首頁。
這里的設(shè)計(jì)含量是最高的。工作也是最繁復(fù)的。暫且不談設(shè)計(jì)。從ps版到html,到最后的整站。往往修改最多的就是首頁了。在這里我要強(qiáng)調(diào)的是,從首頁開始,注意使用包含文件。

二:分頁。
分頁有幾類呢?在我看來,無非是list和view,列表頁和閱讀頁。list一般是新聞列表,或圖片列表。而view,則完全只需要一個(gè)!

所以,在構(gòu)建一個(gè)普通的企業(yè)站的時(shí)候,上述三個(gè)頁面完成了,工作基本已經(jīng)完成1/3了。還有程序,以及內(nèi)容錄入。

純動態(tài)的站點(diǎn)。內(nèi)容錄入很簡單。但如果是有著大量靜態(tài)頁的站點(diǎn),比如教育類和政府類的站點(diǎn)。當(dāng)然,也有相當(dāng)一部分原因是從公司角度或程序員角度來考慮,將簡介之類的很長時(shí)間才更新一次的頁面做成靜態(tài)的。另外一種情況則是內(nèi)容內(nèi)包含大量的圖片、特殊符號、公式、表格等。哪怕是再強(qiáng)的編輯器編輯起來也很麻煩。使用dw效率可能會更高。到這里,我的經(jīng)驗(yàn)才真正的表述出來。
    先說一下大量的文字錄入,先定義好你的P,記得縮進(jìn)2em,因?yàn)楹芏嗳撕茏⒁膺@一點(diǎn)。也必須注意到這一點(diǎn)。相信大家都開著qq,大量的文字,無論是從word還是記事本,直接copy,貼到qq對話框里再復(fù)制一次,去除多余的東西,然后到dw的代碼狀態(tài)。記住,是代碼狀態(tài)粘貼。這個(gè)時(shí)候,代碼狀態(tài)依然保留了原有的段落,而預(yù)覽則是不分段的,這個(gè)時(shí)候,你的P,就開始大顯神威了。開始的地方<p>,結(jié)尾的地方</p>,中間的段落則復(fù)制"<p></p>"直接粘貼.不需要你再去按回車,也不需要按著ALT+SHIFT+空格了!!!
  說表格,在編輯器里插表格,效率總沒在DW里高吧.好,那就在DW里畫表格,然后復(fù)制代碼,到編輯器的代碼狀態(tài)去粘貼.效果那是一個(gè)好啊....
  說復(fù)雜的內(nèi)容,有表格有特殊符號有公式有大量的文字有表格還有圖片.而且相當(dāng)?shù)拈L.怎么辦呢?我向你推薦一個(gè)小軟件,叫FLASHPAPER,它可以直接在word內(nèi),將所有的內(nèi)容轉(zhuǎn)換成一個(gè)帶滾動條的swf文件.相當(dāng)多的情況下,體積比你在dw里一點(diǎn)一點(diǎn)編輯出來的html還要?。?br />     其實(shí)要說的是,代碼狀態(tài)操作,很多時(shí)候效率是最高的!
  如果客戶提供給你的內(nèi)容,不全,或不完整,這種情況則不在我的考慮范圍內(nèi).這是前期工作.如果不知道怎樣處理合適,請翻閱我的


其實(shí)呢,有很多同仁花在設(shè)計(jì)上的時(shí)間是最多的。而企業(yè)站點(diǎn)一般也沒多少內(nèi)容。我想,你看一下我的網(wǎng)頁設(shè)計(jì)進(jìn)階系列的前四章。會對你的設(shè)計(jì)有很大的幫助。其余的不再做贅述。只是再強(qiáng)調(diào)一下積累。只有不停的積累,才會不斷的進(jìn)步。第四章關(guān)于素材里,我這樣說過:

當(dāng)你看到某一張圖片的某一個(gè)部分,腦袋就開始閃光,你發(fā)現(xiàn)你可以完全從這一部分出發(fā)設(shè)計(jì)出一套的東西。

當(dāng)你接到一個(gè)任務(wù),腦袋就像硬盤一樣,把你機(jī)器里跟這個(gè)任務(wù)相似類似的甚至可以直接拿過來用的那些內(nèi)容自動打包。

當(dāng)你要做某樣?xùn)|西,你的硬盤里哪些可用的字體哪些可用的花紋哪些的可用的小圖標(biāo)自動浮現(xiàn)在你的腦海里。

當(dāng)你要做某樣?xùn)|西,這個(gè)時(shí)候你在趕路,你在騎車,你立刻就能想到哪個(gè)哪個(gè)網(wǎng)站上什么什么素材可以拿過來用。

當(dāng)你看到某個(gè)站,你可以立刻進(jìn)行引申,張口就說出哪個(gè)哪個(gè)站跟這個(gè)結(jié)構(gòu)類似,哪個(gè)哪個(gè)站跟這個(gè)風(fēng)格接近。。。

這幾條都能做到了,設(shè)計(jì)對你來說還是難事么?

設(shè)計(jì),其實(shí)是一個(gè)不斷積累的過程。


再強(qiáng)調(diào)一句,包含文件,可以再包含一個(gè)甚至多個(gè)包含文件........理解這句話,會讓你在做那些靜不靜動不動的網(wǎng)站的時(shí)候省很多力氣!


 
網(wǎng)頁設(shè)計(jì)技巧:網(wǎng)頁中英文混排行高問題2008-08-27 01:02:40  來源:口碑網(wǎng)UED Team 布林基本上快被這個(gè)問題搞瘋了,癥狀如下

 

癥狀描述:在ie下(6或7,8沒有試過)當(dāng)出現(xiàn)中英文混排,都采用默認(rèn)字體時(shí),并使用 li 列表做float時(shí),會出現(xiàn)如上圖的癥狀,文字排列上下不對齊的情況。影響了布局的美觀性,造成上圖情況的原因是中英文的文字基線不同,arial字體的下邊緣要比宋體(同為12號)低一個(gè)象素,上邊緣比宋體矮兩個(gè)象素,而且英文還有i,y這種上下基線不同的情況。所以當(dāng)中英文混排對齊時(shí),就會出現(xiàn)明顯的高度差異,使排版不均??梢姺糯髨D。

 

采用中英文字均使用宋體的方案

 

可以解決文字排列不對齊的情況,但宋體英文字是襯線字體(Times New Roman即是英文中的襯線字),字型緊湊,細(xì)節(jié)較多,辦文憑排列在一起很醒目,但在連續(xù)成文時(shí),容易造成辨識困繞,看錯(cuò)行的情況。關(guān)于襯線字體的優(yōu)缺點(diǎn),請見這篇文章。相比之下,表示英文還是使用無襯線字體更美觀大方。

解決方法一 “餃子”童鞋的 發(fā)現(xiàn)。

英文采用tahoma字體–宋體,arial及 tahoma字體比較–arial與tahoma的無襯線體比較精致

 

當(dāng)中英文混排時(shí),使用tahoma字體的情形

 

中英混排,純中文組合的行高都一致了,但a在hover狀態(tài)下下劃線與中文粘聯(lián)在一起。

缺陷:使用tahoma字體時(shí),在ie6及ie6以下版本,會導(dǎo)致所有中文字體鏈接的下劃線會出現(xiàn)與字體粘連現(xiàn)象。淘寶使用的也是這一解決方案。相信大型項(xiàng)目,不同的人來共同完成一個(gè)頁面的模塊時(shí),在統(tǒng)一的規(guī)范下,使字體更規(guī)范,減少錯(cuò)位,而采用帶有下劃線會出現(xiàn)與字體粘連的tahoma字體,是值得的

以下是攜同大米童鞋 發(fā)現(xiàn)的:

英文采用arial字體,中文使用宋體??稍?a>標(biāo)簽內(nèi)注明 line-height:1.231,可解決行高不等以及字體與下劃線粘連問題。(不知道大范圍中英文混排適不適用,有待后續(xù)校驗(yàn)。)

上一篇:網(wǎng)站PR值是什么?PR值對搜索排名有什么價(jià)值?     下一篇:怎樣用sql標(biāo)簽來實(shí)現(xiàn)自己控制樣式
掃碼立即溝通
公眾號加關(guān)注
版權(quán)所有:西安兄弟信息科技有限公司 陜ICP備07012704號-8   地址:西安市三橋街道恒大都市廣場(1號線灃東自貿(mào)園站C1口)  營業(yè)執(zhí)照    網(wǎng)站地圖  
關(guān)閉
029-86512630 工作:8:30-17:30

*