曾經(jīng)有客戶跟我說在網(wǎng)站后臺上傳了新聞圖片,是相機(jī)拍攝的,傳上去了但是超出了網(wǎng)頁顯示的范圍,出現(xiàn)了滾動條,問我怎么處理,我告訴他先用圖片處理軟件將圖片處理到合適的大小然后再上傳,比如處理成600像素的寬度,高度按比例縮放,他告訴我說之前的網(wǎng)站都不用處理圖片,傳上去大小都是一樣的,不會出現(xiàn)這種情況,后來經(jīng)過一番解釋他明白這樣做的好處。
圖片處理
在用div和css制作網(wǎng)站內(nèi)容頁的模板時(shí),我們會對其中的一些內(nèi)容進(jìn)行樣式固定,比如標(biāo)題用幾號字、什么顏色,發(fā)布時(shí)間用什么字體、什么顏色等等,內(nèi)容頁面中自然也少不了圖片,這些圖片是通過相應(yīng)的網(wǎng)站內(nèi)容管理系統(tǒng)上傳到服務(wù)器上的,在內(nèi)容頁中用img標(biāo)簽做了引用得以在網(wǎng)頁上顯示。
用相機(jī)拍攝的圖片像素一般遠(yuǎn)遠(yuǎn)超過了網(wǎng)頁內(nèi)容區(qū)域?yàn)g覽范圍的大小,而圖片本身的大小也在1M左右,有時(shí)候?yàn)榱朔奖悖苯影褕D片傳上去,然后用css來統(tǒng)一控制圖片的寬度,高度自動適應(yīng),但是這樣做僅僅能讓網(wǎng)頁瀏覽者看到的圖片像素變小了,似乎與內(nèi)容很協(xié)調(diào),實(shí)際上網(wǎng)頁已經(jīng)加載了這張1M左右的圖片,如果一頁有好幾張新聞圖,就要連續(xù)加載好多1M大小的圖片,這時(shí)網(wǎng)頁打開的速度明顯變慢,而且有些圖片會有一定程度的失真。
另外,如果把內(nèi)容中圖片的尺寸寫死,有時(shí)候上傳一些附件時(shí),在附件前會有一個小圖標(biāo),由于這個小圖標(biāo)也是用img標(biāo)簽引入的,因此也會被“放大”,要解決這個問題又必須要單獨(dú)修改這個圖標(biāo)的樣式,很是麻煩,而且一般內(nèi)容的更新人員往往不懂這些技術(shù)活。
當(dāng)網(wǎng)站進(jìn)行改版時(shí),可能不是原來的公司負(fù)責(zé)了,而這些上傳到服務(wù)器上的圖片如果是沒有處理過的,“圖片加載慢”的問題仍然會的不到解決,因?yàn)樨?fù)責(zé)改版的人員不可能對你所有的圖片一一進(jìn)行處理。
從技術(shù)上能實(shí)現(xiàn)的效果有很多,但不是所有的方案都是合理的,因此,作為網(wǎng)站建設(shè)的技術(shù)人員,要養(yǎng)成這種對于圖片先處理、后上傳的習(xí)慣,即網(wǎng)頁顯示需要多少像素,就事先處理成多少像素再上傳,不但可以節(jié)約磁盤空間,而且提高了瀏覽者的打開頁面的速度。
本文來自成都品牌網(wǎng)站建設(shè)網(wǎng)站設(shè)計(jì)公司-創(chuàng)新互聯(lián)
網(wǎng)頁題目:分析為什么不建議用img標(biāo)簽來控制圖片大小
文章轉(zhuǎn)載:http://jinyejixie.com/news43/313193.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供電子商務(wù)、移動網(wǎng)站建設(shè)、用戶體驗(yàn)、網(wǎng)站營銷、動態(tài)網(wǎng)站、關(guān)鍵詞優(yōu)化
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源:
創(chuàng)新互聯(lián)