NIGHT_HAN_XU同學提問:
你好老師,我是個創(chuàng)業(yè)者,現(xiàn)在有個小工作室,拍一些寫真和婚紗攝影,我的一個單子拍出來的照片在電腦上顯示很好,但是印刷出來的相冊就有些偏色,是我顯示器的問題嗎?他們都建議我換蘋果的顯示器,老師您給指點一下。
我正使用Datacolor Spyder 5為ThinkPad X1 Yoga校色
葉梓老師回答:
首先,我們說設計師、攝影師喜歡用蘋果電腦是有一些綜合方面的原因,但是并不是因為它的屏幕真的是最好的。蘋果顯示器只是品控不錯,就是說它各個批次出廠的顯示器的品質不會忽高忽低,而且他們比較容易被較色儀校準,但這不代表著它本身的色彩就是準確的。
事實上任何屏幕,包括那些數(shù)萬塊、數(shù)十萬塊買回來的屏幕都需要經過專業(yè)的較色儀校準才能顯示出相對準確的色彩。上圖就是我正在用spyder5這種較色儀,用它背面的那個大面積的感光元件來讀取屏幕所發(fā)出的不同顏色的光來判斷屏幕發(fā)出的這個顏色的光是不是準確的,發(fā)出指令讓屏幕進行反向的校準。也就是說屏幕如果偏藍,它就會告訴你偏黃一點顯示,這就是較色儀的一個基本的原理。
很多同學可能想問廠商為什么不在出品這個顯示器的時候就把它調的比較正確呢?事實上它們各自有各自的小算盤。蘋果和索尼的顯示器都普遍偏藍一些,因為這樣看上去會更顯得明亮,會更顯得高科技,更干凈一些。但是有的廠商喜歡把屏幕做得特別艷,尤其是國產的廠商做得非常鮮艷。因為那這樣的話,不懂的人一看到這個屏幕,這個顏色比那個艷,我就買這個吧,這個顯示器肯定比那個好。所以它都是有市場的考量的。
那么我們攝影人要是要買一塊顯示器的話,到底要買什么樣的呢?事實上可能跟這個顯示器的分辨率關系不是特別大,跟它的面積大小關系也不是特別的大,雖然它們都有影響。
sRGB不能完全覆蓋CMYK色域,但AdobeRGB則幾乎完全覆蓋
我們今天來談一個非常非常重要的值叫做色域,色彩空間。我們都知道人眼對光線的辨別能力是非常強的,對色彩的辨別能力也是非常強的。我們現(xiàn)在沒有任何一種設備,沒有任何一種顯示器,沒有任何一種打印機是能夠還原人眼所有的可識別色彩的。所以我們只是盡量的把這個色域做得更大一些,這個設備就更接近人眼一些。我們現(xiàn)在有兩種常見的色域,一種sRGB,一種是Adobe RGB。這兩個詞好像在相機里面就見過,我們在拍照的時候相機就會讓我們選擇拍的照片是用Adobe RGB還是sRGB。有很多同學搞不清楚它是什么意思,在上面第2張圖片中左邊的那個白色的就是sRGB的范圍,右邊白色區(qū)域是Adobe RGB的范圍,圖例可以很清楚地看到sRGB是明顯小于Adobe RGB的。它的整個小白塊的體積會更小一些,也就是說它能顯示的色彩的多少程度會更少一些。不只是我們相機在拍照的時候會分sRGB和Adobe RGB,甚至我們在顯示器顯示它的時候也會分。有的顯示器就是只能顯示到左邊那么多色彩是sRGB的,有的顯示器顯示的色彩多是Adobe RGB的。
我們需要用哪個模式來拍,哪種顯示器來顯示呢?也不一定是越多越好。我舉個例子,比如說咱們現(xiàn)在已經有了顯示器就是sRGB的,只能顯示這么多色彩,而且我們很多時候都只在手機上觀看照片,我們并不想把這個照片印下來的話,或許你拍的時候就選sRGB,顯示的時候也用sRGB的顯示器來顯示,這樣色彩幾乎是一一對應的,這是一個最好的結果。但是如果你這張照片是要用來印刷,要用來打印的話,那就另當別論了。你可以看到圖2中的那個兩個彩色的部分,左右是一樣的,它們是什么呢?它們是CMYK的色域。CMYK就是我們使用的打印機機里面的黃品青黑四種墨水的顏色。打印的機器能印出來的色彩是圖2中彩色顯示的部分這么多,它比起sRGB來說,雖然沒有sRGB面積那么大,但是請注意,有一部分打印機能打印的藍色和綠色,在sRGB里面沒有,這部分藍色和綠色沒法描述、沒法記錄、也沒法顯示,這就是一個很大的問題。但是相比而言,右邊Adobe RGB幾乎籠罩了整個CMYK的色域。也就是說打印機能印下的所有顏色在Adobe RGB里面都能找到相對應的顏色來顯示。這樣的話你可以想象我們在屏幕上就可以直接模擬出最后所印刷出來的色彩,也可以根據(jù)這個色彩來進行比較仔細的校調。所以如果你的作品是經常要用來輸出,用于印刷和打印,要去沖印的話,我還是推薦你在拍照時就使用了Adobe RGB的色域,而且要有一個Adobe RGB的顯示屏,我們叫寬色域顯示屏。
2015版Macbook Pro只能顯示74%的Adobe色域。
ThinkPad X1 Yoga能顯示98%的Adobe RGB色域。
上面的2張范例照片,是我對兩臺電腦做了一個測試。一臺是我正在使用的2015版macbook pro蘋果筆記本,后面一臺是thinkpad X1 yoga,這是新出的1臺Thinkpad的筆記本。兩個圖片的左邊的紅色三角形都是代表著這個筆記本本身的色彩顯示能力,是用spyder5測出來的。紫色的三角形都代表著Adobe RGB的色域范圍,你可以看到2015版的macbook pro顯示器只能顯示74%的Adobe RGB的色域,它根本就不是一個寬色域屏幕,這是非常糟糕的一個結果。thinkpad X1 yoga能顯示98%的Adobe RGB色域,這是一個非常好的結果。你用后者的顯示屏來調整圖片,顯然是能夠覆蓋你所有的打印所需的色彩的。在屏幕的硬件已經達到要求,能顯示那么多色彩,那么大的色域空間的基礎上,我們對它使用色彩管理的儀器,比如說spyder進行色彩的校調就可以達到一個相對完美的結果。
所以我們要分兩方面說,一方面硬件上要支持,此外還要對它進行色彩校準才可以。我們甚至要每隔一段時間就去校一次屏幕,因為屏幕每隔一段時間會變色、會衰減。大家可能都還記得那種老的顯示器、老投影儀的顏色嚴重發(fā)黃發(fā)綠的樣子吧。所以每隔一個月,我們都會重新校正一次屏幕。
實際上,偏色的問題還不止是跟顯示器有關,還跟打印機的色彩是不是國際標準的有關,也跟相機的偏色程度有關。所以我們需要整套的色彩管理的系統(tǒng)來對相機進行校準,對顯示器進行校準,再對打印機進行校準,三者的顏色才可能統(tǒng)一起來,才可能跟肉眼更接近一些。關于色彩管理的知識實際上是非常系統(tǒng)而復雜的,我在自由職業(yè)攝影師這門課程里面是花了一些時間來詳細的介紹,希望了解更詳細內容的可以在網易云課堂搜索《自由職業(yè)攝影師》課程進行學習。
更多攝影問題歡迎在下方向我留言,我是葉梓,微信公眾號“攝影早自習”,每天早上6:30,不見不散。
注:以上文字由小編整理自葉梓老師錄制的語音。
加入“攝影早自習”微信群:
1、添加葉梓老師微信:leonyee3
2、說明申請加入早自習群(暗號:頭條)
《自由職業(yè)攝影師》、《新媒體視頻導演》課程咨詢請加微信:hello-kato
原文鏈接:
http://www.katoclass.com/zaozixi20161124.html
HTML+CSS+JS網頁設計與制作,我的學校網頁設計與制作實例, 本實例適合于初學HTML+CSS+JS的同學。該案例里面有div+css的樣式布局設置,這個實例比較全面,有一級頁、二級頁、詳情頁、輸入表單等,共6個頁面。本文將介紹如何通過從零開始設計我的學校網站,并將其轉換為代碼的過程來實現(xiàn)設計與制作。(網頁設計與制作分享。源碼分享。)
1.網頁作品簡介方面 :青綠色簡約風格,div+css布局。主要有:首頁、關于暨大、學校新聞、新聞詳情頁、校園風光、 聯(lián)系我們等總共6個頁面html下載。
2.網頁作品技術方面:使用CSS制作了網頁背景圖、鼠標經過及選中導航變色效果等。 首頁制作了搜索表單。
3.網頁作品布局方面:網頁布局整體為LOGO、導航、主體內容布局。子頁面多種布局,圖片居中布局,文本描述對齊方式設置了左對齊。
4.網頁作品編輯方面:此作品為我的學校網頁設計題材,代碼為 html+css 布局制作,作品下載后可使用任意HTML編輯軟件(例如:DW、HBuilder、Vscode 、Sublime 所有編輯器均可使用)
視頻演示:
<script src="https://lf6-cdn-tos.bytescm.com/obj/cdn-static-resource/tt_player/tt.player.js?v=20160723"></script>
截圖演示:
首頁
關于暨大
學校新聞
新聞詳情頁
校園風光
聯(lián)系我們
文件目錄:
HTML代碼:
首頁
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>首頁</title>
<link rel="stylesheet" type="text/css" href="css/reset.css">
<link rel="stylesheet" type="text/css" href="css/index.css">
</head>
<body>
<!-- 頭部 -->
<div class="top-box">
<!-- logo -->
<img src="./images/logo2.svg" class="logo" alt="" />
<div class="right-box">
<a href="#">新門戶</a>
<a href="#">郵件</a>
<a href="#">網上服務大廳</a> |
<a href="#">圖書館</a>
<div class="in-row">
<input type="text" placeholder="請輸入您的關鍵詞">
<button class="button">搜索</button>
</div>
</div>
</div>
<div class="header">
<!-- logo -->
<img src="./images/hw_zxdj.png" class="logo" alt="" />
<!-- 導航欄 -->
<div class="nav">
<ul>
<li>
<a class="active" href="./index.html" target="_self">
<span title="首頁">首頁</span>
</a>
</li>
<li>
<a href="./about.html" target="_self">
<span title="關于暨大">關于暨大</span>
</a>
</li>
<li>
<a href="./news.html" target="_self">
<span title="學校新聞">學校新聞</span>
</a>
</li>
<li>
<a href="./scenery.html" target="_self">
<span title="校園風光">校園風光</span>
</a>
</li>
<li>
<a href="./contact.html" target="_self">
<span title="聯(lián)系我們">聯(lián)系我們</span>
</a>
</li>
</ul>
</div>
</div>
<!-- 主內容 -->
<div class="main-content">
<div class="banner">
<img src="./images/banner.jpg" alt="" />
</div>
<div class="project-content">
<p class="content-title">暨南大學</p>
<div class="detail-content">
<div class="detail-pic">
<img src="./images/dasdasda.jpg" alt="" />
</div>
<div class="detail-desc">
<p>暨南大學是中國第一所由政府創(chuàng)辦的華僑學府。</p>
<p>“暨南”二字出自《尚書·禹貢》:“東漸于海,西被于流沙,朔南暨,聲教訖于四海。”意即面向南洋,將中華文化遠播到五洲四海。
</p>
<p>學校目前是中央統(tǒng)戰(zhàn)部、教育部、廣東省人民政府共建的國家“雙一流”建設高校,直屬中央統(tǒng)戰(zhàn)部管理。</p>
<p> 暨南大學是中國歷史最悠久的大學之一。學校的前身是1906年清政府創(chuàng)立于南京的暨南學堂,后遷至上海,1927年更名為國立暨南大學。</p>
</div>
</div>
<p class="content-title">校園風光</p>
<div class="content-list content-list2">
<ul>
<li>
<div class="cover-pic">
<img src="./images/xy6.jpg" alt="" />
</div>
<p class="title">校園一角</p>
</li>
<li>
<div class="cover-pic">
<img src="./images/xy7.jpg" alt="" />
</div>
<p class="title">校園一角</p>
</li>
<li>
<div class="cover-pic">
<img src="./images/xy8.jpg" alt="" />
</div>
<p class="title">校園一角</p>
</li>
<li>
<div class="cover-pic">
<img src="./images/xy9.jpg" alt="" />
</div>
<p class="title">校園一角</p>
</li>
<li>
<div class="cover-pic">
<img src="./images/xy10.jpg" alt="" />
</div>
<p class="title">校園一角</p>
</li>
<li>
<div class="cover-pic">
<img src="./images/xy11.jpg" alt="" />
</div>
<p class="title">校園一角</p>
</li>
<li>
<div class="cover-pic">
<img src="./images/xy12.jpg" alt="" />
</div>
<p class="title">校園一角</p>
</li>
<li>
<div class="cover-pic">
<img src="./images/xy13.jpg" alt="" />
</div>
<p class="title">校園一角</p>
</li>
</ul>
</div>
<p class="content-title">媒體暨大</p>
<div class="content-list content-list2">
<video src="https://osvc-mediaxbase.jnu.edu.cn/media/mediax/media/202312/25/51c2c04451825398f8c8b734.mp4" class="video" controls></video>
</div>
</div>
</div>
<!-- 底部 -->
<div class="footer">
<div class="contact-container">
<div class="contact-title">
<p>聯(lián)系</p>
<p>Contact</p>
</div>
<div class="contact-content">
<p class="c-name">木番薯科技</p>
<div class="c-addr">
<p>地 點:廣州市天河區(qū)花城大道666號</p>
<p>郵編:510000</p>
</div>
<div class="c-addr">
<p>公眾號名稱:木番薯科技</p>
<p>公眾號號碼:mengchatchat91</p>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/index.js"></script>
</body>
</html>
也適用于:大學生網頁作業(yè)制作 (HTML+CSS)、大學生HTML期末大作業(yè)、web前端期末大作業(yè)、web課程設計網頁規(guī)劃與設計、我的學校網頁設計作業(yè)成品、HTML+CSS+JS網頁設計期末課程大作業(yè)等。
css樣式:
CSS部分比較容易掌握的,但是深入到CSS,并不會太容易。CSS的知識比較零碎,所用到的技巧也相對比較多。一句話“入門容易就,提升難”,今天教授帶你走一趟,一起對CSS的一此冷門知識做個梳理.
關注“教授學苑”,期待帶給你快樂的開發(fā)知識!
*請認真填寫需求信息,我們會在24小時內與您取得聯(lián)系。