டார்க் மோட் செயல்படுத்தல்: CSS மற்றும் JavaScript உடன் ஒரு விரிவான வழிகாட்டி

டார்க் மோட் சமீபத்தில் மிகவும் பிரபலமாகி வருகிறது, குறிப்பாக குறைந்த ஒளி சூழல்களில் மிகவும் வசதியான பார்வை அனுபவத்தை வழங்குகிறது. இந்த வழிகாட்டி, உலகளாவிய பார்வையாளர்களுக்கான தடையற்ற மற்றும் அணுகக்கூடிய பயனர் அனுபவத்தை உறுதிசெய்து, CSS மற்றும் JavaScript பயன்படுத்தி உங்கள் இணையதளத்தில் டார்க் மோடை எவ்வாறு செயல்படுத்துவது என்பது பற்றிய விரிவான கண்ணோட்டத்தை வழங்குகிறது.

டார்க் மோட் ஏன் செயல்படுத்த வேண்டும்?

டார்க் மோட் செயல்படுத்துவதைக் கருத்தில் கொள்ள பல வலுவான காரணங்கள் உள்ளன:

• மேம்படுத்தப்பட்ட பயனர் அனுபவம்: பல பயனர்கள் டார்க் மோட் கண்களுக்கு எளிதாக இருப்பதைக் காண்கிறார்கள், இது கண் அழுத்தத்தைக் குறைக்கிறது, குறிப்பாக இரவில் அல்லது மங்கலான வெளிச்சத்தில் உலாவும்போது. இது பல்வேறு திரை பயன்பாட்டுப் பழக்கங்கள் மற்றும் விளக்கு நிலைமைகளைக் கொண்ட உலகளாவிய பார்வையாளர்களைப் பூர்த்தி செய்கிறது.
• அணுகல்தன்மை: டார்க் மோட் பார்வை குறைபாடுகள் அல்லது ஒளி உணர்திறன் கொண்ட பயனர்களுக்கு அணுகல்தன்மையை மேம்படுத்தும். உயர்-கான்ட்ராஸ்ட் விருப்பத்தை வழங்குவதன் மூலம், உங்கள் வலைத்தளத்தை மேலும் உள்ளடக்கியதாக மாற்றுகிறீர்கள்.
• பேட்டரி ஆயுள்: OLED அல்லது AMOLED திரைகள் கொண்ட சாதனங்களில், டார்க் மோட் மின் நுகர்வைக் குறைத்து, பேட்டரி ஆயுளை நீட்டிக்கிறது. சார்ஜிங் உள்கட்டமைப்புக்கு வரையறுக்கப்பட்ட அணுகல் உள்ள பகுதிகளில் மொபைல் பயனர்களுக்கு இது மிகவும் பொருத்தமானது.
• நவீன வடிவமைப்புப் போக்கு: டார்க் மோட் ஒரு பிரபலமான வடிவமைப்புப் போக்காகும், மேலும் அதைச் செயல்படுத்துவது உங்கள் வலைத்தளத்தை மேலும் நவீனமாகவும் கவர்ச்சியாகவும் மாற்றும். இது பிராண்ட் கருத்து மற்றும் பயனர் ஈடுபாட்டை மேம்படுத்துகிறது.

டார்க் மோடை செயல்படுத்துவதற்கான முறைகள்

டார்க் மோடைச் செயல்படுத்த பல அணுகுமுறைகள் உள்ளன, ஒவ்வொன்றும் அதன் சொந்த நன்மைகள் மற்றும் தீமைகளைக் கொண்டுள்ளன. நாம் மிகவும் பொதுவான முறைகளை ஆராய்வோம்:

• CSS மீடியா வினவல்கள் (prefers-color-scheme): இந்த முறை பயனரின் இயங்குதள அமைப்புகளின் அடிப்படையில் அவர்களின் விருப்பமான வண்ணத் திட்டத்தை தானாகவே கண்டறிகிறது.
• JavaScript மாற்றி: இந்த முறை ஒரு கைமுறை மாற்றி (எ.கா., ஒரு சுவிட்ச் அல்லது பொத்தான்) வழங்குகிறது, இது பயனர்களை லைட் மற்றும் டார்க் மோடுக்கு இடையில் மாற அனுமதிக்கிறது.
• மீடியா வினவல்கள் மற்றும் JavaScript-ஐ இணைத்தல்: இந்த அணுகுமுறை இரண்டு முறைகளின் நன்மைகளையும் ஒருங்கிணைக்கிறது, கணினி விருப்பத்தை மீற பயனர்களை அனுமதிக்கும்போது தானியங்கி கண்டறிதலையும் வழங்குகிறது.

1. CSS மீடியா வினவல்கள் மூலம் டார்க் மோட் செயல்படுத்துதல்

prefers-color-scheme CSS மீடியா வினவல் பயனரின் விருப்பமான வண்ணத் திட்டத்தைக் கண்டறிந்து அதற்கேற்ப வெவ்வேறு ஸ்டைல்களைப் பயன்படுத்த உங்களை அனுமதிக்கிறது. ஏற்கனவே தங்கள் கணினி விருப்பங்களை அமைத்துள்ள பயனர்களுக்கு டார்க் மோடைச் செயல்படுத்த இது மிகவும் நேரடியான மற்றும் திறமையான வழியாகும்.

குறியீடு உதாரணம்

பின்வரும் CSS-ஐ உங்கள் ஸ்டைல்ஷீட்டில் சேர்க்கவும்:

/* இயல்புநிலை (லைட்) தீம் */
body {
  background-color: #fff;
  color: #000;
}

/* டார்க் தீம் */
@media (prefers-color-scheme: dark) {
  body {
    background-color: #222;
    color: #fff;
  }
  /* தேவைக்கேற்ப மற்ற கூறுகளை சரிசெய்யவும் */
  h1, h2, h3 {
    color: #ddd;
  }
  a {
    color: #8ab4f8;
  }
}

விளக்கம்:

• CSS-இன் முதல் தொகுதி இயல்புநிலை (லைட்) தீம் ஸ்டைல்களை வரையறுக்கிறது.
• @media (prefers-color-scheme: dark) தொகுதி பயனரின் கணினி டார்க் மோடுக்கு அமைக்கப்பட்டிருக்கும்போது மட்டுமே ஸ்டைல்களைப் பயன்படுத்துகிறது.
• @media தொகுதிக்குள், பாடி பின்னணி மற்றும் உரை நிறம், தலைப்புகள் மற்றும் இணைப்புகள் போன்ற பல்வேறு கூறுகளுக்கான டார்க் மோட் ஸ்டைல்களை நீங்கள் வரையறுக்கலாம்.

நன்மைகள்

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

தீமைகள்

• வரையறுக்கப்பட்ட கட்டுப்பாடு: பயனர்கள் உங்கள் வலைத்தளத்திற்குள் லைட் மற்றும் டார்க் மோடுக்கு இடையில் கைமுறையாக மாற முடியாது.
• கணினி அமைப்புகளைச் சார்ந்திருத்தல்: தோற்றம் முற்றிலும் பயனரின் கணினி அமைப்புகளைப் பொறுத்தது, அதை அவர்கள் அறிந்திருக்காமல் இருக்கலாம் அல்லது மாற்ற முடியாமல் இருக்கலாம்.

2. ஜாவாஸ்கிரிப்ட் மாற்றி மூலம் டார்க் மோட் செயல்படுத்துதல்

ஜாவாஸ்கிரிப்ட் மாற்றி ஒன்றைப் பயன்படுத்துவது, வலைத்தளத்தின் தீமைக் கட்டுப்படுத்த பயனர்களுக்கு ஒரு கைமுறை சுவிட்சை வழங்குகிறது. இது பயனர்களுக்கு அதிக கட்டுப்பாட்டை அளிக்கிறது மற்றும் அவர்களின் கணினி விருப்பங்களை மீற அனுமதிக்கிறது. கணினி அளவிலான டார்க் மோட் அமைப்புகளை நிலையானதாக ஆதரிக்காத அல்லது வெளிப்படுத்தாத பல்வேறு சாதனங்கள் மற்றும் தளங்களில் உள்ள பயனர்களுக்கு இந்த அணுகுமுறை முக்கியமானது.

HTML கட்டமைப்பு

முதலில், உங்கள் HTML-ல் ஒரு மாற்றி உறுப்பைச் சேர்க்கவும்:

<label class="switch">
  <input type="checkbox" id="darkModeToggle">
  <span class="slider round"></span>
</label>

இது ஒரு செக்பாக்ஸ் மற்றும் சில தனிப்பயன் CSS ஸ்டைலிங்கைப் பயன்படுத்தி ஒரு எளிய மாற்றி சுவிட்சை உருவாக்குகிறது.

CSS ஸ்டைலிங் (விருப்பத்தேர்வு)

நீங்கள் CSS பயன்படுத்தி மாற்றி சுவிட்சை ஸ்டைல் செய்யலாம். இதோ ஒரு உதாரணம்:

.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* வட்டமான ஸ்லைடர்கள் */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

JavaScript குறியீடு

இப்போது, மாற்றி செயல்பாட்டைக் கையாள பின்வரும் ஜாவாஸ்கிரிப்ட் குறியீட்டைச் சேர்க்கவும்:

const darkModeToggle = document.getElementById('darkModeToggle');
const body = document.body;

// டார்க் மோடை மாற்றுவதற்கான செயல்பாடு
function toggleDarkMode() {
  body.classList.toggle('dark-mode');

  // பயனரின் விருப்பத்தை localStorage-ல் சேமிக்கவும்
  if (body.classList.contains('dark-mode')) {
    localStorage.setItem('darkMode', 'enabled');
  } else {
    localStorage.setItem('darkMode', 'disabled');
  }
}

// சேமிக்கப்பட்ட விருப்பத்திற்காக localStorage-ஐச் சரிபார்க்கவும்
if (localStorage.getItem('darkMode') === 'enabled') {
  body.classList.add('dark-mode');
  darkModeToggle.checked = true;
}

// மாற்றிக்கு நிகழ்வு கேட்பவரைச் சேர்க்கவும்
darkModeToggle.addEventListener('change', toggleDarkMode);

விளக்கம்:

• குறியீடு மாற்றி உறுப்பு மற்றும் பாடி உறுப்பைப் பெறுகிறது.
• toggleDarkMode செயல்பாடு பாடி உறுப்பில் dark-mode கிளாஸை மாற்றுகிறது.
• குறியீடு பயனரின் விருப்பத்தைச் சேமிக்க localStorage ஐப் பயன்படுத்துகிறது, எனவே அது அமர்வுகளுக்கு இடையில் நீடிக்கும்.
• பக்கம் ஏற்றப்படும்போது சேமிக்கப்பட்ட விருப்பத்தைப் பயன்படுத்த, குறியீடு localStorage ஐச் சரிபார்க்கிறது.
• மாற்றிக்கு ஒரு நிகழ்வு கேட்பவர் சேர்க்கப்படுகிறார், எனவே மாற்றி கிளிக் செய்யப்படும்போது toggleDarkMode செயல்பாடு அழைக்கப்படுகிறது.

டார்க் மோடுக்கான CSS ஸ்டைலிங் (கிளாஸ் பயன்படுத்தி)

டார்க் தீம் ஸ்டைல்களைப் பயன்படுத்த dark-mode கிளாஸைப் பயன்படுத்த உங்கள் CSS-ஐப் புதுப்பிக்கவும்:

/* இயல்புநிலை (லைட்) தீம் */
body {
  background-color: #fff;
  color: #000;
}

/* டார்க் தீம் */
body.dark-mode {
  background-color: #222;
  color: #fff;
}

body.dark-mode h1, body.dark-mode h2, body.dark-mode h3 {
  color: #ddd;
}

body.dark-mode a {
  color: #8ab4f8;
}

நன்மைகள்

• பயனர் கட்டுப்பாடு: பயனர்கள் உங்கள் வலைத்தளத்திற்குள் லைட் மற்றும் டார்க் மோடுக்கு இடையில் கைமுறையாக மாறலாம்.
• நிலைத்தன்மை: பயனரின் விருப்பம் localStorage ஐப் பயன்படுத்தி சேமிக்கப்படுகிறது, எனவே அது அமர்வுகளுக்கு இடையில் நீடிக்கும்.

தீமைகள்

• அதிக சிக்கலான செயலாக்கம்: இந்த முறைக்கு CSS மீடியா வினவல்களை மட்டும் பயன்படுத்துவதை விட அதிக குறியீடு தேவைப்படுகிறது.
• JavaScript சார்புநிலை: மாற்றி செயல்பாடு பயனரின் உலாவியில் ஜாவாஸ்கிரிப்ட் இயக்கப்பட்டிருப்பதைச் சார்ந்துள்ளது.

3. மீடியா வினவல்கள் மற்றும் ஜாவாஸ்கிரிப்ட் இணைத்தல்

CSS மீடியா வினவல்கள் மற்றும் ஜாவாஸ்கிரிப்ட் மாற்றி ஆகியவற்றை இணைப்பதே சிறந்த அணுகுமுறையாகும். இது இரு உலகங்களின் சிறந்ததை வழங்குகிறது: பயனரின் விருப்பமான வண்ணத் திட்டத்தை தானாகக் கண்டறிதல், அதே நேரத்தில் பயனர்கள் கணினி விருப்பத்தை கைமுறையாக மீற அனுமதிக்கிறது. இது தங்கள் கணினி அளவிலான தீம் அமைப்புகளைப் பற்றி அறியாத அல்லது மாற்ற முடியாதவர்கள் உட்பட பரந்த பார்வையாளர்களைப் பூர்த்தி செய்கிறது.

குறியீடு உதாரணம்

ஜாவாஸ்கிரிப்ட் மாற்றி உதாரணத்திலிருந்து அதே HTML மற்றும் CSS ஐப் பயன்படுத்தவும். கணினி விருப்பத்தைச் சரிபார்க்க ஜாவாஸ்கிரிப்ட்டை மாற்றவும்:

const darkModeToggle = document.getElementById('darkModeToggle');
const body = document.body;

// டார்க் மோடை மாற்றுவதற்கான செயல்பாடு
function toggleDarkMode() {
  body.classList.toggle('dark-mode');

  // பயனரின் விருப்பத்தை localStorage-ல் சேமிக்கவும்
  if (body.classList.contains('dark-mode')) {
    localStorage.setItem('darkMode', 'enabled');
  } else {
    localStorage.setItem('darkMode', 'disabled');
  }
}

// சேமிக்கப்பட்ட விருப்பத்திற்காக localStorage-ஐச் சரிபார்க்கவும், பின்னர் கணினி விருப்பத்தைச் சரிபார்க்கவும்
if (localStorage.getItem('darkMode') === 'enabled') {
  body.classList.add('dark-mode');
  darkModeToggle.checked = true;
} else if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
  body.classList.add('dark-mode');
  darkModeToggle.checked = true;
}

// மாற்றிக்கு நிகழ்வு கேட்பவரைச் சேர்க்கவும்
darkModeToggle.addEventListener('change', toggleDarkMode);

விளக்கம்:

• குறியீடு முதலில் சேமிக்கப்பட்ட விருப்பத்திற்காக localStorage ஐச் சரிபார்க்கிறது.
• localStorage இல் எந்த விருப்பமும் காணப்படவில்லை என்றால், பயனரின் கணினி window.matchMedia ஐப் பயன்படுத்தி டார்க் மோடை விரும்புகிறதா என்று அது சரிபார்க்கிறது.
• கணினி டார்க் மோடை விரும்பினால், dark-mode கிளாஸ் பாடிக்கு சேர்க்கப்பட்டு, மாற்றி சரிபார்க்கப்படுகிறது.

நன்மைகள்

• தானியங்கி கண்டறிதல் மற்றும் பயனர் கட்டுப்பாடு: தானியங்கி கண்டறிதல் மற்றும் கைமுறை கட்டுப்பாடு ஆகிய இரண்டையும் வழங்குகிறது.
• நிலைத்தன்மை: பயனரின் விருப்பம் localStorage ஐப் பயன்படுத்தி சேமிக்கப்படுகிறது.

தீமைகள்

• சற்று அதிக சிக்கலானது: இந்த முறை இரு முறைகளையும் தனியாகப் பயன்படுத்துவதை விட சற்று சிக்கலானது.
• JavaScript சார்புநிலை: ஜாவாஸ்கிரிப்ட் இயக்கப்பட்டிருப்பதைச் சார்ந்துள்ளது.

அணுகல்தன்மை பரிசீலனைகள்

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

• வண்ண வேறுபாடு: லைட் மற்றும் டார்க் மோடு இரண்டிலும் உரைக்கும் பின்னணிக்கும் இடையே போதுமான வண்ண வேறுபாடு இருப்பதை உறுதி செய்யவும். உங்கள் வண்ணக் கலவைகள் அணுகல்தன்மை தரநிலைகளைப் பூர்த்தி செய்கின்றனவா என்பதைச் சரிபார்க்க WebAIM-ன் கான்ட்ராஸ்ட் செக்கர் (webaim.org/resources/contrastchecker/) போன்ற கருவிகளைப் பயன்படுத்தவும். இது குறைந்த பார்வை உள்ள பயனர்களுக்கு மிகவும் முக்கியமானது.
• ஃபோகஸ் குறிகாட்டிகள்: லைட் மற்றும் டார்க் மோடு இரண்டிலும் ஃபோகஸ் குறிகாட்டிகள் தெளிவாகத் தெரிவதை உறுதிசெய்யவும், இதனால் விசைப்பலகை மூலம் வழிநடத்தும் பயனர்கள் எந்த உறுப்பு தற்போது ஃபோகஸ் செய்யப்பட்டுள்ளது என்பதை எளிதாகக் காணலாம்.
• படங்கள் மற்றும் ஐகான்கள்: டார்க் மோடில் படங்கள் மற்றும் ஐகான்கள் எப்படித் தோன்றும் என்பதைக் கவனியுங்கள். உகந்த பார்வைக்கு அவற்றின் வண்ணங்களைச் சரிசெய்ய நீங்கள் மாற்றுப் பதிப்புகளை வழங்க வேண்டும் அல்லது CSS ஃபில்டர்களைப் பயன்படுத்த வேண்டும்.
• பயனர் சோதனை: ஏதேனும் அணுகல்தன்மை சிக்கல்களைக் கண்டறிந்து தீர்க்க, வெவ்வேறு பார்வை குறைபாடுகள் உள்ள பயனர்களுடன் உங்கள் டார்க் மோட் செயலாக்கத்தைச் சோதிக்கவும்.

டார்க் மோட் செயலாக்கத்திற்கான சிறந்த நடைமுறைகள்

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

• CSS மாறிகளைப் பயன்படுத்தவும் (தனிப்பயன் பண்புகள்): CSS மாறிகள் ஒரு மைய இடத்தில் வண்ணங்கள் மற்றும் பிற ஸ்டைல்களை வரையறுக்க உங்களை அனுமதிக்கின்றன, இது உங்கள் தீமை நிர்வகிப்பதையும் புதுப்பிப்பதையும் எளிதாக்குகிறது.
• முழுமையாகச் சோதிக்கவும்: நிலைத்தன்மையை உறுதிசெய்ய வெவ்வேறு சாதனங்கள் மற்றும் உலாவிகளில் உங்கள் டார்க் மோட் செயலாக்கத்தைச் சோதிக்கவும்.
• தெளிவான மாற்றியை வழங்கவும்: மாற்றி சுவிட்சைக் கண்டுபிடித்துப் பயன்படுத்துவதை எளிதாக்கவும். அதன் செயல்பாட்டைக் குறிக்க தெளிவான மற்றும் உள்ளுணர்வு ஐகானைப் பயன்படுத்தவும்.
• பயனர் விருப்பங்களைக் கருத்தில் கொள்ளுங்கள்: பயனரின் விருப்பங்களை மதித்து அவற்றை localStorage அல்லது குக்கீகளைப் பயன்படுத்தி சேமிக்கவும்.
• நிலைத்தன்மையை பராமரிக்கவும்: உங்கள் டார்க் மோட் செயலாக்கம் உங்கள் வலைத்தளம் முழுவதும் சீராக இருப்பதை உறுதிசெய்யவும்.

உதாரணம்: தீமிங்கிற்கான CSS மாறிகள்

CSS மாறிகள் லைட் மற்றும் டார்க் மோட் தீம்களுக்கு இடையில் மாறுவதை எளிதாக்குகின்றன. :root சூடோ-கிளாஸில் மாறிகளை வரையறுக்கவும்:

:root {
  --bg-color: #fff;
  --text-color: #000;
  --link-color: #007bff;
}

body {
  background-color: var(--bg-color);
  color: var(--text-color);
}

a {
  color: var(--link-color);
}

body.dark-mode {
  --bg-color: #222;
  --text-color: #fff;
  --link-color: #8ab4f8;
}

இப்போது, dark-mode கிளாஸ் பாடிக்கு சேர்க்கப்படும்போது, CSS மாறிகள் புதுப்பிக்கப்பட்டு, ஸ்டைல்கள் தானாகவே பயன்படுத்தப்படும்.

முடிவுரை

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

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

சிந்தனையுடன் டார்க் மோடைச் செயல்படுத்துவதன் மூலம், நீங்கள் ஒரு போக்கைப் பின்பற்றுவது மட்டுமல்லாமல், உலகளாவிய பார்வையாளர்களுக்காக மேலும் உள்ளடக்கிய மற்றும் பயனர்-நட்பு வலை அனுபவத்தை உருவாக்குகிறீர்கள். பயனர் அனுபவத்திற்கான இந்த அர்ப்பணிப்பு உங்கள் வலைத்தளத்தின் ஒட்டுமொத்த செயல்திறனுக்கும் ஈர்ப்பிற்கும் பெரிதும் பயனளிக்கும்.