上傳圖片之圖片大小迷思 - 部落格

Skylar DavisLinda avatar
By Skylar DavisLinda
at 2014-09-15T17:59

Table of Contents

網誌好讀版: http://weilife.pixnet.net/blog/post/390614531

以下純文字複製-------------------------------------------------------

不是痞客VIP的朋友,上傳圖片時痞客會自動幫你的圖片降低解析度

若想要以原圖呈現該怎麼做?

又或是以照片為主的痞客VIP部落格,文章中放了許多照片拖慢了網頁下載速度

非常惱怒啊!

這篇文章是要告訴大家,在痞客上傳的圖片,我們可以做哪些事情



上傳圖片時,會有顯示尺寸這個選項

VIP會員與非VIP會員的差別在於多了最後的 "原始尺寸" 這項

不過多了這項根本沒有用,請讓我娓娓道來

總之"顯示尺寸"這個目的在於想讓訪客看到圖片的大小是多少



同一張照片上傳到痞客相簿後,有不同的尺寸可以選擇,更有VIP會員擁有的原始尺寸權


以本篇文章的首圖來說,原始尺寸為1500*1000

上傳圖片時選擇的顯示尺寸為"中(不超過600)"

所以插入文章時,圖片寬度變成600 pixel,此時將文章編輯模式切換成HTML模式

檢查該圖片的網址: http://pic.pimg.tw/weilife/1410698597-2635055827_n.jpg
(若後面有?v...請忽略)

檔名最後的 _n 是關鍵,把 _n 去掉了會怎樣呢?會是原始尺寸的圖檔喔!

對於像banner的圖檔很容易超過寬度1024,可用這個方法得到原始大小

其實痞客將我們上傳的每一張照片經過處理,分別存成不同的尺寸,以供它之後方便使用

例如上方的三張圖,都是同一次上傳的照片,只是後方的網址做了些修改

那這些不同尺寸的照片有甚麼好處呢?

正方形的縮圖之後可以當作文章的代表圖示,像我個人會拿來做相關文章的整理

範例如該篇文章的最下方 http://weilife.pixnet.net/blog/post/85766404

另一優點是依據用途載入不同尺寸的圖片,可以減少網頁的下載流量,讓訪客瀏覽更順暢

好,說了這麼多,以下整理各個不同尺寸的修改方式,以首圖做例子

原始尺寸 http://pic.pimg.tw/weilife/1410698597-2635055827.jpg
大 1024 "_l" http://pic.pimg.tw/weilife/1410698597-2635055827_l.jpg
中 600 "_n" http://pic.pimg.tw/weilife/1410698597-2635055827_n.jpg
小 450 "_m" http://pic.pimg.tw/weilife/1410698597-2635055827_m.jpg
大縮圖 170*170 "_q" http://pic.pimg.tw/weilife/1410698597-2635055827_q.jpg
中縮圖 120*120 "_s" http://pic.pimg.tw/weilife/1410698597-2635055827_s.jpg
小縮圖 90*90 "_t" http://pic.pimg.tw/weilife/1410698597-2635055827_t.jpg


圖文部落格該知道的事

很多攝影為主的VIP部落格,通常為了展示高畫質的照片

上傳照片時會選擇 "原始尺寸" 上傳

因為部落格版面 / 設定會幫照片縮小至適合部落格寬度

所以在瀏覽文章時看起來沒有甚麼太大的問題

但是,這個縮小的動作並不是像痞客對圖片的處理,而是顯示時看起來較小

對訪客來說還是下載原始尺寸的圖片,原始尺寸檔案都非常大

訪客通常會花一段時間等待常常看到一些攝影部落格是以照片的原始尺寸顯示

每張都是4000*3000左右的尺寸或以上,看到電腦都要當掉了

(快檢查一下你的部落格是否造成訪客的負擔呢?)

所以寫部落格時,切記要選擇適合的顯示尺寸上傳啊!

不過痞客的上傳圖片的寬度最大就是1024,會覺得1024小了一些嗎?

若寬度1024不夠表達圖片的細節

那麼建議將所有上傳的照片都先壓縮到寬度2000以下再上傳

不僅可以節省上傳時間,對訪客來說也是一個很大的幫助 :)

ps. 免費軟體XnView可以批次將照片調整大小,非常方便


--

All Comments

Rebecca avatar
By Rebecca
at 2014-09-16T20:41
感謝原po的樣式分享,拿走一個了
Damian avatar
By Damian
at 2014-09-19T19:08
大貓耶
Cara avatar
By Cara
at 2014-09-23T10:11
Ula avatar
By Ula
at 2014-09-27T17:04
推詳細整理

有沒有網站會彙整每天blog有趣的文章?

Hedwig avatar
By Hedwig
at 2014-09-10T23:22
※ [本文轉錄自 ask 看板 #1K46oSq6 ] 作者: Xmmmmmmmmmmm (X蠶) 看板: ask 標題: [請問] 有沒有網站會彙整每天blog有趣的文章? 時間: Wed Sep 10 23:22:01 2014 比如說 你點開pixnet的首頁 他會推薦pixnet裡每天有哪些熱門 ...

天空部落格壞掉了?

Yuri avatar
By Yuri
at 2014-09-05T01:13
我要開通服務怎麼一直跑出error2 根本鬼打牆 好幾天都這樣 哪招 -- Sent from my Android - ...

Chrome無法正常讀取河道

Lily avatar
By Lily
at 2014-08-26T21:32
借問~ 小弟用中華光世代 今天看噗發噗都正常 可是回噗就要我一直重新整理 整理過後看起來確實有回成功 但這樣好不方便啊 也有人跟我一樣嗎?? ※ 引述《smiledreamsy (ゆうき★)》之銘言: : 借版發問, : 我的噗浪也是變成跟原PO一樣的情況,無法正確讀取河道。 : 但我更悲劇的是無論是GC ...

Re: PTT Blog板友簽到簿(PTTBlogRolling!)

Aaliyah avatar
By Aaliyah
at 2014-08-25T18:09
ID: pylonps 站名: 可能不是妹控 網址: http://girl.ahao.com.tw/ 架站環境: Wordpress 簡介: 最新日系正妹偶像貼圖, 想看就上 #可能不是妹控 http://girl.ahao.com.tw/ - ...

給想自行架站的朋友

Quanna avatar
By Quanna
at 2014-08-19T15:50
如題 目前個人把所有網站轉到VPS上面了 所以空出來了一個Web Hosting(虛擬主機) 基本上這間公司是在網路上十大推薦的主機 還有十五個月的租期 linux系統 LAMP 環境 所以想要拿出來分租給想架站的朋友 ...