首頁(yè)?>?知識(shí)?資訊?>?網(wǎng)站設(shè)計(jì)中的圖片說(shuō)明不可以忽視!?>?正文

網(wǎng)站設(shè)計(jì)中的圖片說(shuō)明不可以忽視!

2012/9/18 0:00:00 · 稿源:傳誠(chéng)信

圖片說(shuō)明網(wǎng)頁(yè)設(shè)計(jì)是一個(gè)經(jīng)常被忽視的元素。他們常想的更多的功能比形式。只要包含照片的信貸或識(shí)別信息的圖像對(duì)象,而不是給他們更多的思考。

但是,圖片說(shuō)明是一個(gè)偉大的地方到您的網(wǎng)站中添加了更多的風(fēng)格,或給一些獨(dú)到的見解,進(jìn)入正題的圖像。的標(biāo)題是否是照片上的新聞網(wǎng)站或投資組合中的設(shè)計(jì)樣本,他們提供了一個(gè)機(jī)會(huì),為加強(qiáng)本網(wǎng)站的整體外觀。如果處理得當(dāng),他們甚至可以添加更多的視覺(jué)趣味,成為一個(gè)特定的品牌或網(wǎng)站的一個(gè)顯著的商標(biāo)。

有兩個(gè)基本類型的圖片說(shuō)明。是簡(jiǎn)單,簡(jiǎn)約,腳踏實(shí)地,商務(wù)風(fēng)格。這些通常有一個(gè)簡(jiǎn)單的sans-serif字體在白色,黑色或灰色陰影。它們通常定位的側(cè)面或下面的圖像,雖然他們有時(shí)重疊或它上面。這種類型的新聞網(wǎng)站常見的,但也可見于組合及其他網(wǎng)站。

其他主要的風(fēng)格是更多的圖形。這通常包括效果,如只出現(xiàn)一個(gè)鼠標(biāo)或“詳細(xì)信息”按鈕,導(dǎo)致完整的標(biāo)題顯示的標(biāo)題。雖然字體是sans-serif字體,顏色更被使用,往往是疊加在實(shí)際的圖像和字幕。這些類型的圖片說(shuō)明被普遍認(rèn)為對(duì)投資組合的設(shè)計(jì)師和廣告公司的網(wǎng)站。當(dāng)然,也有一些網(wǎng)站使用交叉型圖片標(biāo)題,顯示這兩種風(fēng)格的元素。

圖片說(shuō)明:熱門造型技巧

設(shè)計(jì)師使用多種不同風(fēng)格的圖片說(shuō)明。在大多數(shù)情況下,設(shè)計(jì)實(shí)驗(yàn)用不同的顏色,使用較亮的顏色較暗的背景。經(jīng)常使用斜體,而圖像字幕的字體大小通常小于體內(nèi)復(fù)制。讓我們來(lái)看看在我們已經(jīng)確定了我們的研究過(guò)程中各種技術(shù)的概述。

  • 標(biāo)題文字的底部,以斜體

    網(wǎng)站設(shè)計(jì)中的圖片說(shuō)明不可以忽視!

  • 標(biāo)題文字的底部,明亮的背景顏色

    網(wǎng)站設(shè)計(jì)中的圖片說(shuō)明不可以忽視!?

  • 標(biāo)題文字底部半透明的背景

    網(wǎng)站設(shè)計(jì)中的圖片說(shuō)明不可以忽視!?

  • 標(biāo)題文字的底部在一個(gè)黑暗的背景

    網(wǎng)站設(shè)計(jì)中的圖片說(shuō)明不可以忽視!?

  • 標(biāo)題文字排版重點(diǎn)

    圖片說(shuō)明設(shè)計(jì)

  • 標(biāo)題文字作為一個(gè)覆蓋

    圖片說(shuō)明設(shè)計(jì)

  • 背景圖像環(huán)繞

    圖片說(shuō)明設(shè)計(jì)

  • 在使用中的圖標(biāo)

    圖片說(shuō)明設(shè)計(jì)

  • 在使用中的圖像枚舉

    圖片說(shuō)明設(shè)計(jì)

  • 標(biāo)題是右對(duì)齊

    圖片說(shuō)明設(shè)計(jì)

  • 標(biāo)題右對(duì)齊頂部

    圖片說(shuō)明設(shè)計(jì)

  • 標(biāo)題居中

    圖片說(shuō)明設(shè)計(jì)


1。樸素?zé)o華的圖片說(shuō)明

簡(jiǎn)單的標(biāo)題設(shè)計(jì)是最常見的圖像標(biāo)題設(shè)計(jì)。他們可以讓一個(gè)網(wǎng)站顯得更加優(yōu)雅,但如果不小心地將網(wǎng)站的整體設(shè)計(jì)風(fēng)格的整合,他們可以結(jié)束了平淡乏味。下面是一些不:

Viget.com

截圖

一個(gè)名單,除了

截圖

“紐約客”

截圖

AIGA.org

截圖

37signals的

截圖

DesignLessBetter.com

截圖

賈森圣瑪麗亞

截圖

Wired.com

截圖

Inspirationbit.com

截圖

Astheria.com

截圖

AIGA

截圖

加勒特戴蒙

截圖

截圖

設(shè)計(jì)觀察

截圖

Designsensory
設(shè)計(jì)組合。圖片和標(biāo)題的設(shè)置,淺灰色的背景,標(biāo)題文字本身就是在暗灰色。

Designsensory截圖

無(wú)網(wǎng)站設(shè)計(jì)和開發(fā)
設(shè)計(jì)投資組合。這是最低限度的,因?yàn)樗诎咨尘吧系幕疑玸ans-serif字體類型。

無(wú)功截圖

{E}內(nèi)部工作室的
廣告代理組合。這些標(biāo)題提供了更多的信息比大多數(shù)的圖像,但他們堅(jiān)持以最小的灰,白色的配色方案。他們使用觸摸襯線字體,將它們分開。

E屋工作室截圖

假的草坪
圖形設(shè)計(jì)組合。另一個(gè)網(wǎng)站,其中包括大量的圖像信息,但采用了淺灰色和白色,暗灰色的配色方案。

假的草坪截圖

Pixelight創(chuàng)意
網(wǎng)頁(yè)設(shè)計(jì)組合。本網(wǎng)站的照片說(shuō)明光在黑暗和側(cè)面的圖像。

Pixelight創(chuàng)意截圖

萊斯藝術(shù)家的
藝術(shù)畫廊網(wǎng)站。另一個(gè)最小的標(biāo)題樣式,但這次更有趣的鼠標(biāo)經(jīng)過(guò)效果。

萊斯藝人截圖

班布里奇工作室
設(shè)計(jì)組合。簡(jiǎn)單的白色和淺灰色的黑色的字幕設(shè)置為每個(gè)圖像的一側(cè)。該網(wǎng)站包括了serif字體的標(biāo)題。

班布里奇工作室截圖

Studio7Designs
網(wǎng)頁(yè)設(shè)計(jì)組合。另外一個(gè)非常簡(jiǎn)單的暗灰色光灰色風(fēng)格的圖像和字幕組對(duì)淺灰色的方塊。

工作室設(shè)計(jì)截圖

CNN.com
新聞網(wǎng)站。一個(gè)簡(jiǎn)單而醒目的標(biāo)題上一個(gè)黑色,半透明覆蓋白字的。

CNN截圖

紐約時(shí)報(bào)
新聞網(wǎng)站。這可能是一個(gè)最簡(jiǎn)單的標(biāo)題風(fēng)格在那里,灰色的小文字和形象的描述稍微大一點(diǎn)的同色型的照片信貸。

紐約時(shí)報(bào)截圖

政治
新聞網(wǎng)站?;疑谋尘昂秃谏煮w。它沒(méi)有得到比這更最小的。

政治截圖

MK的多媒體Communicatie
設(shè)計(jì)組合。這是一個(gè)最優(yōu)雅的照片在這里列出的標(biāo)題風(fēng)格,色調(diào)的灰色,白色背景上的圖像旁襯線和無(wú)襯線類型的混合。

MK多媒體截圖

尼泊爾迷航之旅
旅游圖片庫(kù)。在這樣一種方式,使圖像的類似寶麗來(lái)照片:非常恰當(dāng)?shù)囊粋€(gè)旅游網(wǎng)站,并顯示標(biāo)題可以圖形方式的影響,而其余的微妙和簡(jiǎn)單的文字,這些文字。

尼泊爾迷航之旅截圖

托馬斯程
攝影組合。另一組的字幕,使良好的排版和一個(gè)灰色的白色的調(diào)色板。

托馬斯程截圖

Designsensory.com

截圖

2。大膽和圖形圖像字幕

圖形圖像字幕使用明亮的色彩和大膽的形狀,使圖片說(shuō)明中脫穎而出。他們結(jié)合圖片說(shuō)明完全在整體設(shè)計(jì)上的網(wǎng)站。熱的粉紅色,灰綠色和電藍(lán)色似乎是最流行 的顏色使用。

充滿活力的字幕

JeffCroft.com

截圖

Typesites

截圖

Segd.nl

截圖

Designslices
設(shè)計(jì)組合。檸檬綠與熱粉紅色的可以是一個(gè)艱難的組合拉斷,但它在這里做了精美的。黑色覆蓋,透明和不透明,新增的圖形上訴。

截圖

圖形圖像標(biāo)題中使用

SuperflousBanter.org

截圖

ILoveTypography

截圖


廣告公司的投資組合。熱粉紅色的頭和下拉詳細(xì)信息框的網(wǎng)站很受歡迎的感覺(jué),同時(shí)提供所有的相關(guān)細(xì)節(jié)。

Deep.co.uk截圖

IDEO
廣告代理組合。半透明,顏色協(xié)調(diào)的覆蓋(顏色的變化取決于廣告的配色方案)工作得很好,而且很簡(jiǎn)單,全部大寫字體出色的作品。

IDEO截圖

電源的海報(bào)
海報(bào)設(shè)計(jì)展示。這些字幕透明的色彩效果設(shè)置它們分開,襯線和無(wú)襯線字體的組合,添加了興趣。

權(quán)力的海報(bào)截圖

設(shè)計(jì)的休閑
網(wǎng)頁(yè)設(shè)計(jì)展示。圓角和單色的調(diào)色板提供一個(gè)合適的Web 2.0外觀到這個(gè)網(wǎng)頁(yè)設(shè)計(jì)庫(kù)。

設(shè)計(jì)小吃截圖

Freshivore
網(wǎng)頁(yè)設(shè)計(jì)組合。過(guò)大的熱粉紅色的標(biāo)題,圖形,紙狀背景和淺灰色的元信息結(jié)合起來(lái),創(chuàng)造一個(gè)非常吸引人的視覺(jué)風(fēng)格。

Freshivore截圖

市長(zhǎng)+ Beusch
架構(gòu)組合。在石灰綠色,粉紅色和電藍(lán)色的鼠標(biāo)懸停標(biāo)題是非常大膽的。

市長(zhǎng)+ Beusch截圖

3。混合圖片說(shuō)明

這些圖片標(biāo)題設(shè)計(jì)元素結(jié)合起來(lái),既簡(jiǎn)單又圖形設(shè)計(jì)。他們有點(diǎn)大膽的簡(jiǎn)約的設(shè)計(jì),往往使用不同的顏色或多個(gè)圖形的形狀,但更柔和大膽,圖形圖像字幕以上。

混合中使用的圖片說(shuō)明

弗雷德里卡Cau的
設(shè)計(jì)組合。這些圖片的標(biāo)題上提供了大量的信息,和電藍(lán)色頭配合邊境的圖像的。

弗雷德里卡駒截圖

Klinkov
藝術(shù)組合。這些圖像的字幕設(shè)置的側(cè)面和包括漂亮的藍(lán)綠色和灰色的顏色。

Klinkov截圖

PixelFuze
設(shè)計(jì)組合。另一個(gè)網(wǎng)站的圖片說(shuō)明中使用的灰綠色,電藍(lán)色和淺灰色的組合。

Pixelfuze截圖

BestWebGallery
網(wǎng)頁(yè)設(shè)計(jì)展示。灰綠色小圖標(biāo)設(shè)置除了這些標(biāo)題。

最佳網(wǎng)絡(luò)畫廊截圖

周杰倫Hafling
網(wǎng)頁(yè)設(shè)計(jì)組合。超大的類型和覆蓋的黑色標(biāo)題的空間給這些圖形上訴的,而實(shí)際上是相當(dāng)簡(jiǎn)單的。

周杰倫Hafling截圖

SOObox
設(shè)計(jì)廊“,我認(rèn)為(我不看任何一種語(yǔ)言,這是在)。是平面的,而仍然是簡(jiǎn)約的半透明的黑色與白色的文字覆蓋。圓角覆蓋在左上角加了一點(diǎn)更多的視覺(jué)吸引力。

截圖

信藝術(shù)畫廊
藝術(shù)畫廊網(wǎng)站。最簡(jiǎn)單的,全部大寫,電藍(lán)色的標(biāo)題是簡(jiǎn)單,同時(shí)還提供一些“流行”。

信藝術(shù)畫廊截圖

騰設(shè)計(jì)
的設(shè)計(jì)組合。稍微柔和的藍(lán)電頭提供一些額外的視覺(jué)流行,而其余的淺灰色文本的標(biāo)題保持設(shè)計(jì)是壓倒性的。

騰設(shè)計(jì)截圖

ten24搜索引擎優(yōu)化
SEO的網(wǎng)站。另一種相對(duì)簡(jiǎn)單的淺灰色暗灰色的標(biāo)題設(shè)計(jì),而是采用了一些不錯(cuò)的薄荷綠色環(huán)保型。

1024媒體截圖

羅四維
設(shè)計(jì)組合。簡(jiǎn)單的襯線字體在一個(gè)明亮的背景,但有一個(gè)淡藍(lán)色的標(biāo)題顏色。

羅四維截圖

MSNBC
新聞網(wǎng)站。很簡(jiǎn)單,用暗灰色和藍(lán)色的類型,掀起了一邊。

MSNBC截圖

人民
新聞網(wǎng)站。一個(gè)標(biāo)題,一個(gè)明亮的藍(lán)色背景,白色和淺灰色的襯線字體。

人們截圖

CLD Web畫廊
網(wǎng)頁(yè)設(shè)計(jì)展示。非常簡(jiǎn)單的字幕顯示標(biāo)題的網(wǎng)站,其評(píng)級(jí)的灰色和淡藍(lán)色的黑暗,鋼灰色的背景。

CLD Web畫廊截圖

Junghoon公園
設(shè)計(jì)組合。熱粉紅色和黑色的sans-serif型純白色的背景。

第2天截圖

艾迪科特Web
暗灰色和淡藍(lán)色的淺灰色的背景上,sans-serif字體類型廣泛間隔的標(biāo)題和下面的圖像。

艾迪科特網(wǎng)站截圖

本文作者來(lái)自北京傳誠(chéng)信,轉(zhuǎn)載請(qǐng)注明出處:北京傳誠(chéng)信(saddlebargains.com)


選擇北京網(wǎng)站建設(shè)公司-傳誠(chéng)信,優(yōu)質(zhì)服務(wù),絕對(duì)不容錯(cuò)過(guò) !

1. 優(yōu)秀的網(wǎng)絡(luò)資源,穩(wěn)定的網(wǎng)站和速度保證
(配送雙線獨(dú)立ip空間,國(guó)際A級(jí)BGP機(jī)房,99.5% 的主機(jī)在線時(shí)間)
2. 7年北京網(wǎng)站建設(shè)經(jīng)驗(yàn),優(yōu)秀的技術(shù)和設(shè)計(jì)水平,更放心
3. 全程省心服務(wù),不必?fù)?dān)心自己不懂網(wǎng)絡(luò),更省心。

?

  • 相關(guān)推薦
  • 大家在看
熱文
  • 熱門
  • 最新
客戶服務(wù)
咨詢熱線

010-62199213

24小時(shí)咨詢熱線

139-1050-5354