Guidelines
Edge Cases
விதிவிலக்கான நிலைகள்
Design system rules for handling dynamic Tamil script characteristics, preventing layout shifts, script clipping, word wrap boundaries, and redundant interactions.
தமிழ் எழுத்து வடிவங்களின் தனித்தன்மைகள், வரியின் உயரம், நீண்ட கூட்டுச் சொற்கள் மற்றும் திரும்பத் திரும்ப நிகழும் அழுத்தப் பிழைகளைக் கையாளுவதற்கான வழிகாட்டுதல்கள்.
1. எழுத்துகளின் செங்குத்து அச்சு வெட்டு (Vertical Script Clipping)
தமிழ் எழுத்துக்கள் மேலே புள்ளி (க்), கொம்பு வளைவுகள் (கொ, வௌ) மற்றும் கீழே இறங்கும் குறிகள் (ஸ்ரீ, ஹூ) ஆகியவற்றைக் கொண்டுள்ளன. குறுகலான வரி உயரம் (leading-none) மற்றும் எல்லைக் கட்டுப்பாடு (overflow-hidden) உள்ள வடிவங்கள் பயன்படுத்தப்படும் போது, இந்த உயிர்மெய் குறிகள் வெட்டப்பட்டு எழுத்துக்கள் சிதைவடையும் அபாயம் உள்ளது.
வடிவமைப்புத் தீர்வுகள் & முறைகள்
- குறைந்தபட்ச வரி உயரம்: தமிழ் உரையைக் கொண்ட அனைத்து கூறுகளுக்கும் (பொத்தான்கள், தாவல்கள், லேபிள்கள்) வரி உயரம் குறைந்தது
1.4(leading-relaxed) இருக்குமாறு உறுதி செய்யவும். - எல்லை விளிம்புகள் (Padding): உரைப்பெட்டிகளுக்கு மேலே மற்றும் கீழே குறைந்தது
4pxஇடைவெளி வழங்குவதன் மூலம் அச்சு வெட்டுப் பிழைகளை முழுமையாகத் தவிர்க்கலாம். - W3C மொழி குறிச்சொல் (lang="ta"): தமிழ் எழுத்துக்கள் உள்ள பகுதிகளில்
lang="ta"என்ற HTML5 பண்பைக் கட்டாயம் பயன்படுத்தவும். இது சரியான எழுத்துரு வடிவங்களை வழங்கவும், திரை வாசிப்பான்கள் பிழையின்றி உச்சரிக்கவும் உதவுகிறது.
2. கூட்டுச்சொல் மடங்கல் (Agglutinative Word Wrapping)
தமிழ் ஒரு கூட்டுச்சொல் (Agglutinative) மொழியாகும். பல சொற்கள் ஒன்றாக இணைந்து நீண்ட தொடர்களாக அமையும் (எ.கா: உலகமயமாக்கலினாலுண்டாகும்விளைவுகள்). கைபேசி திரைகளில் இந்த நீண்ட சொற்கள் மடியாமல் திரையை விட்டு வெளியேறி வழிந்தோடி (Horizontal Overflow) வடிவமைப்பைக் குலைக்கும்.
வடிவமைப்புத் தீர்வுகள் & முறைகள்
- சொல் மடங்கல்: நீண்ட சொற்களை மடிய வைக்க உரை கொள்கலன்களில்
overflow-wrap: break-wordபண்பைப் பயன்படுத்தவும். - தலைப்புகள் சீரமைப்பு: முக்கியத் தலைப்புகளுக்கு
text-wrap: balanceஐப் பயன்படுத்தி சொற்கள் சமமாக மடிவதை உறுதி செய்யவும்.
3. இரட்டை அழுத்தத் தடுப்பு (Double-Click Debounce)
மெதுவான இணைய வேகம் உள்ள சூழல்களில், பயனர் விண்ணப்பங்கள் மற்றும் கட்டணப் பொத்தான்களைத் திரும்பத் திரும்ப வேகமாக அழுத்துவதால் இரட்டைப் பணப் பரிவர்த்தனைகள் அல்லது சர்வர் சுமை போன்ற தீவிரப் பிரச்சினைகள் ஏற்படுகின்றன.
வடிவமைப்புத் தீர்வுகள் & முறைகள்
- 350மி.செ முடக்கம்: பயனர் ஒரு முறை அழுத்திய உடனேயே பொத்தான்களை
350msகாலத்திற்கு முடக்கி வைக்க வேண்டும். - செயல்பாட்டுக் குறியீடு: அழுத்தியவுடன் பொத்தானை வட்டச் சுழலி (Loading Spinner) கொண்ட நிலையில் காட்டி செயலாக்கத்தைக் குறிக்கவும். ARIA Live மூலம் இதனைத் திரை வாசிப்பான்களுக்கும் அறிவிக்க வேண்டும்.