Top1 獨家 七招幫你提高網頁設計水平

2022-02-28 07:10:36 字數 1890 閱讀 4338

1. 學好html和css程式設計

這條之所以成為第一條是因為它是網頁設計中最重要的部分。明白網頁是如何在瀏覽器中渲染的可以防止你做出不合理的設計,比如那些無法用網頁實現的設計。要保持與時俱進,弄清楚現什麼效果可以用現在的css技術實現,什麼效果不可以。

使用css3最新技術設計的經典案例

atebits(

)在網頁文字中使用了文字陰影,這樣就不需要使用了。它還使用了-webkit-transform和-webkit-transition來向這三個圖示加入了一些動畫,不過這些效果只有在支援webkit的瀏覽器中才能看到,比如chorme和safari。

elliot jay stocks(

2. 注重細節

好的設計和偉大設計之間的距離在於是否做好細節。

優秀設計細節的例子

metalab(

)很好的混合了著色(shading)、漸變和陰影,為網頁增加了額外的細節。

we follow(

)巧妙的使用了漸變和陰影,為其使用者介面新增了很好的細節。

3. 善於使用留白

世界上最痛苦的事情莫過於當你想閱讀一些東西卻發現頁面上各種元素的旁邊充滿了文字,頁面設計者這麼做的目的僅僅是想要在頁面狹小的控制項裡放下更多的資訊,但這只能給別人帶來一種痛苦的體驗。合理的使用留白可以給頁面中的元素以呼吸的空間,減少閱讀者眼鏡的壓力,從而讓使用者有一種愉快的瀏覽體驗。

合理使用留白的例子

soccernet(

)在他們的文章頁面中很好的使用了留白,你可以看出文字都離其它元素有一定的距離,從而提高了可讀性。

usability post(

)使用留白的方法和soccernet差不多。

4. 很重要

精彩的例子

palm(

)在其palm pre產品頁面上使用了一幅精美的來作為抬頭。通過一種清新而動人的方式展示了其產品。

tom pojeta(

)在其頁面上使用了繪畫,為其站點帶來了生氣。

5. 充分發揮色彩的威力

色彩在網頁設計中的重要性經常被忽視。在網頁設計中應當對色彩的使用給予更多的注意,因為它可以按照你的意願來對使用者進行一定的引導。例如,頁面中的鏈結應當與頁面正文文字的顏色有所區別,以便使用者能夠認出它們是鏈結。如果鏈結的顏色和正文的顏色差不多,那麼使用者如何能注意到它們並點選它們呢?

充分發揮色彩威力的例子

sam brown(

)在暗色背景上使用了許多種的顏色,當滑鼠移動到鏈結上時其背景會變成彩色,以便鏈結能清晰的顯示。

mix online(

)採用了彩色的導航條,當點選乙個彩色導航條以後,頁面的背景色便會變成相應的顏色。

6. 不要忘了頁尾

頁尾設計經常被忽視,因為設計人員沒有認識到它們的重要性。它們有時比你想象的要有用的多,因為它們可以包含頁面任何地方都無法承載的額外資訊。它們也可以作為引導使用者到站點其它部分的嚮導。

頁尾設計的例子

jason santa maria(

)在其超大的頁尾中放置了許多額外資訊。

web designer wall(

7. 清晰的導航

導航欄是頁面中最重要的部分,因為它是使用者使用**最主要的途徑。通過使用簡單清晰的導航欄,可以提公升**的易用性,還可以減少使用者在尋找自己需要的內容時遇到的麻煩。

清晰的導航的例子

disambiguity(

)使用了標籤頁的方式來給使用者以清晰的指示。

dabs(

)同樣使用了標籤頁,但同時還在頁面左側使用了側邊欄,將**內容的子分類予以顯示,而且對不同的大類還用不同的顏色加以區分。

(譯/曹巳甲)

TOP 1比不加TOP慢的疑惑

問題描述 有乙個查詢如下,去掉top 1的時候,很快就出來結果了,但加上top 1的時候,一般要2 3秒才出資料,何解?select top 1 a.invno from a,b where a.item b.itemnumber and b.ownercompanycode is notnull ...

TOP 1比不加TOP慢的疑惑

問題描述 有乙個查詢如下,去掉top 1的時候,很快就出來結果了,但加上top 1的時候,一般要2 3秒才出資料,何解?select top 1 a.invno from a,b where a.item b.itemnumber and b.ownercompanycode is notnull ...

Pytorch實現Top1準確率和Top5準確率

之前一直不清楚top1和top5是什麼,其實搞清楚了很簡單,就是兩種衡量指標,其中,top1就是普通的accuracy,top5比top1衡量標準更 嚴格 具體來講,比如一共需要分10類,每次分類器的輸出結果都是10個相加為1的概率值,top1就是這十個值中最大的那個概率值對應的分類恰好正確的頻率,...