如今在互聯(lián)網(wǎng)行業(yè)掀起了一股網(wǎng)站制作的風(fēng)潮,特別是移動(dòng)互聯(lián)網(wǎng)時(shí)代,信息化建設(shè)早已成為人們耳熟能詳?shù)慕箺l,Internet已經(jīng)成為全球大的咨詢信息庫(kù),而成為傳播的載體網(wǎng)頁(yè)逐日被人們所關(guān)注,網(wǎng)站建設(shè)以及網(wǎng)頁(yè)設(shè)計(jì)已被人們逐日提到日程,因?yàn)榛ヂ?lián)網(wǎng)用戶是數(shù)以億計(jì)的,其中蘊(yùn)含的商機(jī)也是不可估量的。要想在互聯(lián)網(wǎng)上成為佼佼者,抓住技巧是關(guān)鍵。那網(wǎng)頁(yè)設(shè)計(jì)方面有哪些技巧?下面創(chuàng)新互聯(lián)創(chuàng)新互聯(lián)設(shè)計(jì)公司
小編給大家做以介紹。
一、能用css寫的,堅(jiān)決不要用圖片
經(jīng)驗(yàn)告訴我們,首頁(yè)圖片很多的網(wǎng)站打開會(huì)很慢,一是因?yàn)閳D片多,需要下載的文件體積就增大,二是每一個(gè)圖片下載都會(huì)對(duì)服務(wù)器有一個(gè)請(qǐng)求,增大了瀏覽器與服務(wù)端的交互次數(shù),如果能把純色的部分用css來(lái)寫,而不因?yàn)槭∈轮苯忧袌D,就會(huì)極大提高網(wǎng)站的運(yùn)行效率,我最早開始學(xué)習(xí)制作網(wǎng)站時(shí),就想當(dāng)然的認(rèn)為怎么樣能加快制作速度就怎么來(lái),于是把一個(gè)導(dǎo)航條的背景直接切成圖片,后來(lái)老板看到我寫的 html代碼,告訴我不能這么干,用div定義好寬和高設(shè)置背景色和邊框,一行代碼就搞定。如果遇到有漸變色的背景,可以沿著與漸變色相同方向切一個(gè)像素的條紋,用css中background的repeat-x或repeat-y來(lái)自動(dòng)填充。
二、好的網(wǎng)站主題
在制定網(wǎng)站主題的時(shí)候千萬(wàn)不能分散,網(wǎng)站主題越集中,這樣的網(wǎng)站提供的信息質(zhì)量就會(huì)越高。同時(shí)還要有好的框架結(jié)構(gòu),網(wǎng)站網(wǎng)頁(yè)上的框架非常重要,如果設(shè)計(jì)的不好的話,網(wǎng)頁(yè)上就會(huì)非常散亂,訪客在尋找信息的時(shí)候會(huì)變困難。所以說(shuō)設(shè)計(jì)師要掌握好框架結(jié)構(gòu)的設(shè)計(jì)技巧,讓網(wǎng)頁(yè)變的清晰,脈絡(luò)分明。
三、IE6的雙倍邊距BUG
例如:
<style type="text/css">
body {margin:0}
div { float:left; margin-left:10px; width:200px; height:200px; border:1px solid red }
</style>
浮動(dòng)后本來(lái)外邊距10px,但I(xiàn)E解釋為20px,解決辦法是加上display:inline
ps:剛開始接觸這一工作的時(shí)候真的是不知道怎么回事,還以為是各個(gè)瀏覽器之間的解釋不同,制作的時(shí)候只能小心意義的以ie6的寬度來(lái)定義,可惜ff 和ie經(jīng)常預(yù)覽效果不一致,被某些人抓住不放,當(dāng)時(shí)很是氣氛和郁悶,一氣之下瘋狂百度和谷歌,可惜那時(shí)候抓不住關(guān)鍵詞,走了不少?gòu)澛凡耪业絾?wèn)題答案,好在現(xiàn)在解決了。
四、怎么樣才能讓層顯示在FLASH之上呢?
解決的辦法是給FLASH設(shè)置透明:
<param name="wmode" value="transparent" />
五、網(wǎng)頁(yè)將不能被另存為
<noscript> <iframe src= "/blog/*.html> "; </iframe> </noscript>
六、刪除時(shí)確認(rèn)
<a href= "javascript:if(confirm( "確實(shí)要?jiǎng)h除嗎? "))location= "boos.asp?&areyou=刪除&page=1 " "> 刪除 </a>
七、使用text-align實(shí)現(xiàn)居中
將該屬性值設(shè)置為center并應(yīng)用到bodi元素上即可。這種做法是徹頭徹尾的hack但它卻能兼容大多數(shù)瀏覽器,另一種實(shí)現(xiàn)元素居中的方法是使用text-align屬性。所以在某些情況下也自然必不可少。
而是應(yīng)用到作為容器的元素上。這也給我?guī)?lái)了額外的工作。創(chuàng)建好布局必須的div之后,之所以說(shuō)它hack因?yàn)檫@種方法并沒(méi)有將文本屬性應(yīng)用到文本上。要依照如下代碼為bodi應(yīng)用text-align屬性:
body{
text-align:center;
}
之后會(huì)出現(xiàn)什么問(wèn)題嗎?bodi所有子孫元素都會(huì)被居中顯示。
就需要用再寫一條網(wǎng)站中關(guān)鍵詞的排名優(yōu)化規(guī)則,因此。讓其中的文本回到默認(rèn)的居左對(duì)齊:
p{
text-align:left;
}
真正完全遵循規(guī)范的瀏覽器并不會(huì)改變?nèi)萜鞯奈恢茫梢韵胂筮@條附加的規(guī)則將帶來(lái)一些不便。另外。而只會(huì)讓其中的文字居中顯示。
八、網(wǎng)頁(yè)尺寸
網(wǎng)頁(yè)尺寸一般都在800*600這個(gè)范圍內(nèi),起初由于電腦屏幕尺寸的原因。目前隨著屏幕分辨率擴(kuò)大,網(wǎng)頁(yè)的尺寸也開始調(diào)整到1000*900調(diào)整到這個(gè)尺寸目的就是為了考慮到讓搜索瀏覽者都能正常瀏覽網(wǎng)站。
九、網(wǎng)站顏色的使用與內(nèi)容的建設(shè)
則會(huì)嚴(yán)重影響人們對(duì)網(wǎng)站的瀏覽,顏色的使用在
網(wǎng)站建設(shè)(中起著非常關(guān)鍵的作用。勝利的顏色搭配可以讓人過(guò)目不忘;失敗的顏色搭配選擇。視覺(jué)不舒服,就算你內(nèi)容再好,受眾也沒(méi)有看下去的興趣,又如何談網(wǎng)站建設(shè)的好壞和后期的
網(wǎng)絡(luò)推廣呢?
十、利用導(dǎo)航取得統(tǒng)一
導(dǎo)航是網(wǎng)站的一項(xiàng)重要組成部分,一個(gè)出色的富有企業(yè)特性的導(dǎo)航將會(huì)給人留下深刻的印象,比如將標(biāo)志的形態(tài)寓于導(dǎo)航之中,或?qū)?dǎo)航設(shè)計(jì)在整個(gè)網(wǎng)站布局之中等等不一而足,花點(diǎn)力氣在導(dǎo)航上,也會(huì)設(shè)計(jì)出一個(gè)出色的站點(diǎn)。
十一、首頁(yè)設(shè)計(jì)技巧
網(wǎng)站首頁(yè)是企業(yè)網(wǎng)上的虛擬門面,在此,提醒上網(wǎng)的企業(yè)注意自己門面的設(shè)計(jì),決不能敷衍了事、馬馬虎虎。我們會(huì)經(jīng)??吹接∷⒕赖漠a(chǎn)品目錄或廣告,當(dāng)您屢屢看到那些印有產(chǎn)品目錄或廣告的精美印刷制品的時(shí)候,相信您或多或少會(huì)對(duì)有關(guān)的產(chǎn)品形成一種好感,即使您不會(huì)購(gòu)買,也必然對(duì)這些產(chǎn)品形成一定程度的認(rèn)同。而對(duì)于設(shè)計(jì)毛糙的宣傳品,您肯定會(huì)懷疑其內(nèi)容的真實(shí)性,從而對(duì)其產(chǎn)品或服務(wù)產(chǎn)生質(zhì)疑。好,現(xiàn)在說(shuō)說(shuō)網(wǎng)站的設(shè)計(jì),相信您會(huì)同意這種說(shuō)法:網(wǎng)站的頁(yè)面就好比是“無(wú)紙的印刷品”。既然如此,我們會(huì)因此而得出一個(gè)結(jié)論:精良和專業(yè)網(wǎng)站的設(shè)計(jì),如同制作精美的印刷品,會(huì)大大刺激消費(fèi)者(訪問(wèn)者)的購(gòu)買欲望,反之,您公司所提供的產(chǎn)品或服務(wù)將不會(huì)給消費(fèi)者(訪問(wèn)者)留下較好的印象。值得一提的是,除非您的企業(yè)有專業(yè)的網(wǎng)站規(guī)劃、設(shè)計(jì)人員,否則您好找專業(yè)公司或?qū)I(yè)人員為您設(shè)計(jì)制作,一個(gè)優(yōu)秀的專業(yè)設(shè)計(jì)人員會(huì)很快明白您的意圖,并根據(jù)您的
建站目的提出建設(shè)性的意見(jiàn)。
十二、漸變
技術(shù)的發(fā)展為所有想使用漸變的人提供了各種創(chuàng)造漸變的工具。但漸變真的很好么?
Media Temple 網(wǎng)站的每一個(gè)頁(yè)面都使用了漸變,不過(guò)其漸變使用的節(jié)制和精妙才是設(shè)計(jì)成功的關(guān)鍵。logo,大標(biāo)題,按鈕和背景都有細(xì)微的或者鏡像的漸變,以強(qiáng)調(diào)內(nèi)容。最復(fù)雜的漸變用在了那些簡(jiǎn)單的120像素寬的按鈕(子頁(yè)面中的“ACTIVATE”和“LEARN MORE”)上,因?yàn)樗鼈兪切枰L客注意的重點(diǎn)。
Commission Junction的漸變運(yùn)用遠(yuǎn)沒(méi)有Media Temple的細(xì)致,而且采用了過(guò)于豐富的漸變類型:
從黑色到灰色的水平線性漸變,位于頁(yè)面頂部 頁(yè)眉處的綠色徑向漸變 登陸框背景的“CJ” 標(biāo)志上方模糊的斜向漸變 輸入框背景中淡淡的垂直線性漸變 導(dǎo)航條背景的垂直漸變 Webinar廣告中明亮的線性漸變 另一個(gè)垂直線性減弱,用在了大標(biāo)題處 這種設(shè)計(jì)有點(diǎn)冒險(xiǎn),大部分漸變式有用的,但還是存在一些問(wèn)題。最突出的一點(diǎn)是,設(shè)計(jì)喪失了一致性。同選擇可辨性強(qiáng)的色彩組合一樣的道理,設(shè)計(jì)師也需要為每個(gè)項(xiàng)目選擇合適的漸變組合。
例如,大的水平漸變(1)引導(dǎo)眼睛橫向注視頁(yè)面。這本沒(méi)有什么問(wèn)題,但就在此漸變的正下方又出現(xiàn)了把視線吸引到中心的徑向漸變(2)和把視線引導(dǎo)到右下角的斜向漸變(3)。這會(huì)給訪客造成困擾,起伏變化的視覺(jué)流(visual flow)也削弱了可讀性。
使用漸變時(shí),保證好的視覺(jué)流很重要:請(qǐng)保守而精致地使用漸變。最重要的一點(diǎn),僅當(dāng)對(duì)整體設(shè)計(jì)有幫助時(shí)才使用漸變。在創(chuàng)新互聯(lián)制作
的時(shí)候,需要結(jié)合網(wǎng)站本身的特點(diǎn),提煉出自己的經(jīng)營(yíng)理念,擺脫低層次的網(wǎng)站運(yùn)行模式,網(wǎng)站作為一個(gè)企業(yè)就必須在不斷的發(fā)展壯大的時(shí)候,結(jié)合自身的文化特色,提煉出一些深層次的東西、技巧,而這些東西就是企業(yè)的靈魂,很多世界知名品牌都有自己的獨(dú)特的經(jīng)營(yíng)理念。這樣就給
網(wǎng)頁(yè)設(shè)計(jì)師提出了更高的要求,要求他們能夠深入的了解網(wǎng)站,同時(shí)將自己融入的到網(wǎng)站中,不斷的發(fā)掘具有閃光性的東西,同時(shí)找到合適的表達(dá)方式來(lái)加以強(qiáng)化。
文章題目:成都公司網(wǎng)站建設(shè)的秘笈有哪些
網(wǎng)頁(yè)網(wǎng)址:http://www.rwnh.cn/news38/244238.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站改版、自適應(yīng)網(wǎng)站、網(wǎng)站設(shè)計(jì)、關(guān)鍵詞優(yōu)化、全網(wǎng)營(yíng)銷推廣、服務(wù)器托管
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源:
創(chuàng)新互聯(lián)