ஏப்ரல் 13, 2022

பட சுருக்கமானது உங்கள் இணையதளத்தின் ஏற்ற நேரத்தை எவ்வாறு மேம்படுத்தலாம்

வடிவமைப்பு, மேம்பாடு, நெட்வொர்க் கட்டமைப்பு மற்றும் இறுதி இணைப்பு பயனரின் வேகம் உள்ளிட்ட காரணிகளின் கலவையானது, இணையதளம் எவ்வளவு விரைவாக அல்லது மெதுவாக ஏற்றப்படுகிறது என்பதைத் தீர்மானிக்கிறது. இவற்றில் பல, குறிப்பாக இறுதியானது, உங்கள் கட்டுப்பாட்டிற்கு அப்பாற்பட்டதாக இருக்கும்.

இந்த ஆண்டின் தொடக்கத்தில் நிறுவப்பட்ட இணையதளத்தை நாங்கள் மறுபரிசீலனை செய்தபோது முகப்புப் பக்க கோப்பு அளவு 1.7MBக்கு மேல் இருந்ததைக் குறிப்பிட்டோம். ஒரு இணையப் பக்கத்தைப் பொறுத்தவரை, அது ஒரு அபத்தமான பெரிய (ஆனால் வருந்தத்தக்க வகையில் அடிக்கடி) கோப்பு அளவு. மிகப்பெரிய கிராஃபிக் பக்க பேனர்கள் மூலம் இதேபோன்ற சவால்களை நாங்கள் சந்தித்தோம், இது மற்றொரு சமீபத்திய உயர்-எட் முயற்சியாகும். மந்தமான இணைப்பு அல்லது செல் நெட்வொர்க்கைப் பயன்படுத்தும் நபர்கள் தளத்தைப் பார்ப்பதற்கு இது மிகவும் கடினம். சிறிய சாதனங்களில் அழகாகத் தோன்றும், பதிலளிக்கக்கூடிய, திரவ அகலத் தளத்தை உருவாக்கும் அனைத்துப் பணிகளும், பயனர் பக்கத்தை ஏற்றுவதை முடிப்பதற்குள் கைவிட்டுவிட்டால், அது பயனற்றது.

சிறிய படங்கள் இணைய வேகம் குறைவாக உள்ள பயனருக்கு இணையதளத்தில் உலாவுவதை எளிதாக்குகிறது

வலைத்தளங்களைத் திட்டமிடுதல், உருவாக்குதல் அல்லது நிர்வகித்தல் போன்றவற்றில் நாங்கள் அமர்ந்திருக்கும்போது இது உங்களையோ அல்லது என்னையோ நேரடியாகப் பாதிக்கும் பிரச்சனையாக இல்லாவிட்டாலும், நாங்கள் தளங்களைப் பயன்படுத்தும் சூழல் எப்போதுமே அந்தச் சூழலுடன் ஒத்துப்போவதில்லை என்பதை நினைவில் கொள்ள வேண்டும். அவற்றைப் பயன்படுத்துபவர்கள் செய்கிறார்கள். நகரங்களிலும் உலகெங்கிலும் உள்ள பலருக்கு வீட்டில் இணைய அணுகல் இல்லை மற்றும் ஆன்லைனில் பெற மோசமான மொபைல் இணைப்புகளை நம்பியிருக்க வேண்டும். சந்தேகத்திற்கு இடமின்றி, உங்கள் மொபைல் பயனர்களில் பலர் அதிவேக இணையத்தைப் பயன்படுத்துகின்றனர்; காபி கடைகள், நூலகங்கள் மற்றும் விமான நிலையங்கள் போன்ற மோசமான தரம் வாய்ந்த பொது வைஃபை மூலம் உங்கள் தளத்தை ஏற்ற முயல்பவர்களை என்ன செய்வது?

பக்கச் செயல்திறனைப் பற்றி விவாதிக்கும் போது படச் சுருக்கம் கருத்தில் கொள்ள வேண்டிய ஒரு காரணி மட்டுமல்ல; சுமை நேரத்தை விரைவுபடுத்த வேறு பல விஷயங்களைச் செய்யலாம்.

பட சுருக்கமானது இணையதளத்தின் ஏற்ற நேரங்களை மேம்படுத்தலாம்

இணையப் பக்கம் பெரும்பாலும் தோராயமாக ஏற்றப்பட்ட வெளிப்படையான PNG கோப்பைக் கொண்டிருந்தது-குறிப்பாக, 1.6MB எடை கொண்டது. படக் கோப்புகளின் அளவைக் கணிசமாகக் குறைக்கக்கூடிய இலவச இணைய அடிப்படையிலான பட சுருக்கத் திட்டங்கள் உள்ளன. படத் தரத்தில் உள்ள குறைந்த பட்ச வித்தியாசத்துடன், அந்த 1.6MB படம் 230K ஆகக் குறைக்கப்படலாம். இதன் காரணமாக சுமை நேரம் தோராயமாக 85% குறைக்கப்பட்டது.

உங்கள் உள்ளடக்க இடமாற்றம்/உள்ளீட்டுச் சுழற்சியின் ஒரு பகுதியாக நீங்கள் பயன்படுத்தும் உள்ளடக்க மேலாண்மை அமைப்பில் (Content Management System) பதிவேற்றுவதற்கு முன் படங்களைச் சுருக்கவும் . துரதிர்ஷ்டவசமாக, வணிக உள்ளடக்க மேலாண்மை அமைப்புகள் உட்பட பெரும்பாலானவற்றில் படச் சுருக்க வசதி இல்லை. போட்டோஷாப்பில் 'வலைக்காகச் சேமி' (Save for Web) சுருக்க அமைப்புகள் இருந்தபோதிலும், சிறந்த சுருக்க மென்பொருட்களுக்கு இணையான சுருக்க அளவை அதனால் அடைய முடியவில்லை.

உங்கள் பக்கங்கள் சுமார் 200 அல்லது 300K இருந்தால் அது அற்புதம். 600K க்கு கீழ் வரைகலை தீவிர பக்கங்களை உங்களால் வைத்திருக்க முடிந்தால், அதைத்தான் நீங்கள் குறிக்கோளாகக் கொள்ள வேண்டும். மேஜிக் எண் இல்லை, எனவே பக்க அளவை முடிந்தவரை குறைவாக வைத்திருக்க முயற்சிக்கவும். உங்கள் புகைப்படங்கள் முன்பு சுருக்கப்பட்டிருந்தால், நீங்கள் பல படக் கோப்புகளை ஏற்றிக்கொண்டிருக்கலாம். பக்கங்களுக்கான செயல்திறன் வரவு செலவுத் திட்டங்களை அமைப்பது இந்த கருத்தை நடைமுறைப்படுத்துவதற்கான சிறந்த அணுகுமுறையாகும். பக்க எடைக்கான இலக்கு இலக்கை நீங்கள் குறிப்பிடலாம் மற்றும் பட்ஜெட்டை அமைப்பதன் மூலம் அதைக் கட்டுப்படுத்தலாம்.

  • CSS Sprites ஐப் பயன்படுத்தவும்

பக்க வேகத்தை மேம்படுத்தவும் HTTP கோரிக்கைகளைச் சேமிக்கவும் CSS ஸ்பிரிட்ஸ் அணுகுமுறை பல படங்களை ஒரே படமாக இணைக்கிறது. உங்கள் பக்கத்தில் உள்ள ஐகான்கள், லோகோக்கள் மற்றும் பிற காட்சி கூறுகளுக்கு பலமுறை இது சிறந்தது. "இந்த முறையைப் பற்றிய கூடுதல் விவரங்களுக்கு CSS ஸ்ப்ரிட்கள் எப்படி வேகம் மற்றும் நிலைத்தன்மையை மேம்படுத்துகின்றன" என்பதைப் பார்க்கவும்.

  • சரியான கோப்பு வகையைத் தேர்ந்தெடுக்கவும்

நீங்கள் ஒரு படத்தை உருவாக்கி அதைச் சேமிக்கும்போது, ​​​​அது சுருக்கத்திற்கு உட்படுகிறது, இது கோப்பின் அளவைக் குறைக்கிறது. கோப்பு அளவைக் குறைக்கும் போது வெவ்வேறு கோப்பு வகைகள் வெவ்வேறு வழிகளைக் கோருகின்றன. கொடுக்கப்பட்ட படத்திற்கான சரியான கோப்பு வடிவமைப்பைத் தேர்ந்தெடுப்பது பொதுவாக குறைவான கோப்பு அளவை ஏற்படுத்தும்.

• நிறைய நிழல்கள் கொண்ட படங்கள் மற்றும் விளக்கப்படங்களுக்கு, JPEGகளைப் பயன்படுத்தவும்; வரி கலை, வரைகலை மற்றும் உரைக்கு GIF அல்லது SVG ஐப் பயன்படுத்தவும். தள சிலந்திகள் மற்றும் குறைபாடுகள் உள்ள நபர்களுக்கான ஸ்கிரீன் ரீடர்கள் போன்ற உதவி உபகரணங்களால் படத்தில் உட்பொதிக்கப்பட்ட வகையைப் பார்க்க முடியாது என்பதை நினைவில் கொள்ளவும். அலங்கார நோக்கங்களுக்காக இந்த முறையில் வகையைப் பயன்படுத்தவும்.

• நிறுவனத்தின் லோகோ போன்ற ஜேபிஜியின் சில தெளிவுகளைப் பாதுகாக்கும் அதே வேளையில் பகுதி வெளிப்படைத்தன்மை தேவைப்படும் படங்களுக்கான சிறந்த கோப்பு வகையாக PNG உள்ளது.

  • ஃபோட்டோஷாப்பில், படத்தின் தரத்துடன் பரிசோதனை செய்யுங்கள்.

கீழே உள்ள எடுத்துக்காட்டில் காலநிலை சவாரியில் பைக்கர்களின் ஷாட்க்காக JPEG கோப்பு வகையைத் தேர்ந்தெடுத்துள்ளோம். ஒரு படத்திற்கான கோப்பு வகையைத் தேர்ந்தெடுத்த பிறகு நீங்கள் JPEG தரத்தை மாற்றலாம். நீங்கள் சரியான கோப்பு வடிவத்தில் சிறிய கோப்பு அளவைத் தேடுகிறீர்கள்.

நீங்கள் தெளிவுத்திறனுடன் வேறு வகையான மாறுபாட்டைப் பயன்படுத்தலாம் மற்றும் உங்கள் படத்தை கவர்ச்சிகரமானதாக மாற்றலாம்.

ஆசிரியர் பற்றி 

எல்லே கெல்ரிச்

இன்றைய தொழில்நுட்பத்தின் இடைவிடாத அணிவகுப்பு மக்கள் வாழும் உலகத்தை உருவாக்கியுள்ளது


email "மின்னஞ்சல்": "மின்னஞ்சல் முகவரி தவறானது", "url": "வலைத்தள முகவரி தவறானது", "தேவை": "தேவையான புலம் இல்லை"}