நீங்கள் ஒரு டெவலப்பரிடம் "லோகோவை இன்னும் பெரிதாக்குங்கள்" என்று கேட்டிருந்தாலோ அல்லது ஒரு டிசைனரிடம் "டேட்டாபேஸ் பிழையைச் சரிசெய்யுங்கள்" என்று சொல்லியிருந்தாலோ, நீங்கள்

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

Website Design உண்மையில் எவற்றைக் கையாள்கிறது

ஒரு வரியைக் கூட கோட் (code) எழுதுவதற்கு முன்பே பிரச்சனைகளைத் தீர்ப்பதே ஒரு வெப் டிசைனரின் வேலையாகும். ஒரு தளம் எப்படித் தெரிகிறது என்பதையும், மனிதப் பார்வையில் அது எவ்வாறு செயல்படுகிறது என்பதையும் அவர்கள் கவனிப்பார்கள். அவர்களின் வெளியீடுகள் (deliverables) அதற்குப் பிறகு வரும் அனைத்திற்கும் வழிகாட்டியாக அமைகின்றன.

இந்தப் பணி பொதுவாக கட்டமைப்பிலிருந்து தொடங்குகிறது. டிசைனர்கள் லேஅவுட்கள் (layouts) மற்றும் வயர்ஃபிரேம்களை (wireframes) உருவாக்குகிறார்கள் — அதாவது நேவிகேஷன் எங்கு இருக்கும், உள்ளடக்கம் எவ்வாறு பாயும் மற்றும் ஒரு பயனர் 'call-to-action' பட்டனை கிளிக் செய்யும்போது என்ன நடக்கும் என்பதைத் தீர்மானிக்கும் எளிய கிரேஸ்கேல் வரைபடங்கள் இவை. உதாரணமாக, ஒரு ஆன்லைன் அப்பாயிண்ட்மென்ட் முன்பதிவு பக்கத்திற்கான வயர்ஃபிரேம், பயனர்கள் தங்கள் தனிப்பட்ட விவரங்களை உள்ளிடுவதற்கு முன், கிடைக்கக்கூடிய நேர ஸ்லாட்டுகளைப் பார்க்க வேண்டும் என்பதைக் காட்டலாம். அந்த வரிசையைத் தவறாக அமைத்தால், மக்கள் அந்தப் படிவத்தைப் பூர்த்தி செய்யாமல் விட்டுவிடுவார்கள்.

அந்த அடிப்படைத் தளம் (skeleton) அங்கீகரிக்கப்பட்டதும், டிசைனர்கள் அதன் காட்சி மொழியை (visual language) உருவாக்குகிறார்கள். அவர்கள் பிராண்ட் தரநிலைகளைப் பூர்த்தி செய்யும் மற்றும் அணுகல்தன்மை (accessibility) மாறுபாட்டுச் சோதனைகளில் தேர்ச்சி பெறும் வண்ணத் தொகுப்புகளைத் தேர்ந்தெடுக்கிறார்கள். பிரகாசமான சூரிய ஒளியில் கூட போன் திரையில் தெளிவாகத் தெரியக்கூடிய எழுத்துருக்களை (typefaces) அவர்கள் தேர்ந்தெடுக்கிறார்கள். அவர்கள் பட்டன்கள், ஐகான்கள் மற்றும் படிவக் புலங்களை (form fields) சீரான 'hover states' மற்றும் 'feedback loops' உடன் வடிவமைக்கிறார்கள். இவை அனைத்தும் பயனர் இடைமுகம் (User Interface - UI) பணிகளின் கீழ் வருகின்றன.

பிறகு பயனர் அனுபவம் (User Experience - UX) என்ற பரந்த துறை உள்ளது. ஒரு UX டிசைனர் தடைகள் (friction) பற்றிச் சிந்திக்கிறார். சோதனை குழுவில் பாதி பேர் ஏன் ஷிப்பிங் கால்குலேட்டரைக் கண்டறியத் தவறினார்கள்? மொபைல் பயனர்கள் ஏன் தயாரிப்பு கேலரியை 'pinch-zoom' செய்கிறார்கள்? டிசைனர் நேவிகேஷனை மறுசீரமைக்கலாம், நீண்ட செக்-அவுட் முறையைத் தெளிவான படிகளாகப் பிரிக்கலாம் அல்லது கடவுச்சொல் ஏன் நிராகரிக்கப்பட்டது என்பதை விளக்கும் 'micro-copy'-ஐச் சேர்க்கலாம். இதன் நோக்கம் அலங்காரம் அல்ல; தெளிவுதான்.

நவீன டிசைனர்களின் கருவிகளில் கூட்டுப் முன்மாதிரி உருவாக்கத்திற்கு (collaborative prototyping) Figma, Adobe XD, Sketch (இன்னும் Mac-மையிலான ஏஜென்சிகளில் பொதுவானது) மற்றும் படங்கள் சார்ந்த பணிகளுக்கு Photoshop ஆகியவை அடங்கும். டெவலப்பர்கள் ஈடுபடுவதற்கு முன்பே, பங்குதாரர்கள் (stakeholders) பக்கங்களைக் கிளிக் செய்து பார்க்கக்கூடிய ஊடாடும் முன்மாதிரிகளை (interactive prototypes) டிசைனர்கள் வழங்குகிறார்கள். நிலையான ஸ்கிரீன்ஷாட்டுகள் மறைக்கும் புரிதல் குறைபாடுகளை அந்த ஆரம்பக்கால உருவகப்படுத்துதல் (simulation) கண்டறிகிறது.

Website Development உண்மையில் என்ன செய்கிறது

டிசைன் என்பது ஒரு வரைபடம் (blueprint) என்றால், டெவலப்மென்ட் என்பது கட்டுமானக் குழு, மின்சார வேலை மற்றும் கட்டிட ஆய்வு ஆகிய அனைத்தையும் உள்ளடக்கியது. டெவலப்பர்கள் அங்கீகரிக்கப்பட்ட டிசைன்களை எடுத்து, பிரவுசர்கள் திரையில் காட்டக்கூடிய மற்றும் சர்வர்கள் செயலாக்கக்கூடிய கோப்புகளாக மாற்றுகிறார்கள்.

Front-end டெவலப்பர்கள் கண்ணுக்குத் தெரியும் பக்கத்தைக் கையாளுகிறார்கள். அவர்கள் உள்ளடக்கத்தை வடிவமைக்க HTML, லேஅவுட் மற்றும் எழுத்துருவைக் கட்டுப்படுத்த CSS மற்றும் ஊடாடும் தன்மையை (interactivity) நிர்வகிக்க JavaScript ஆகியவற்றை எழுதுகிறார்கள். ஒரு டெவலப்பர் React — மிகவும் பொதுவான JavaScript லைப்ரரிகளில் ஒன்று — பயன்படுத்தும்போது, அவர்கள் பெரும்பாலும் பக்கத்தைப் புதுப்பிக்காமலேயே (reloading) இயங்கும் நிகழ்நேரத் தேடல் வடிகட்டிகள் (real-time search filters) அல்லது டைனமிக் ஷாப்பிங் கார்டுகள் போன்ற சிக்கலான கூறுகளை (components) உருவாக்குகிறார்கள். டிசைனர் வரைந்த பட்டன் உண்மையில் தரவைச் சமர்ப்பிக்கிறதா, லோடிங் நிலையைத் (loading state) காட்டுகிறதா மற்றும் உறுதிப்படுத்தல் செய்தியைக் காட்டுகிறதா என்பதை உறுதி செய்வதே அவர்களின் வேலை.

அந்தத் தெரி 보이는 அடுக்குக்கு பின்னால் பேக்-எண்ட் (back end) உள்ளது. Back-end டெவலப்பர்கள் Node.js, Python அல்லது PHP போன்ற மொழிகளைப் பயன்படுத்தி சர்வர் பக்க லாஜிக்கை (server-side logic) எழுதுகிறார்கள். அவர்கள் லாகின் சரிபார்ப்புகளைச் செய்கிறார்கள், பணப் பரிவர்த்தனைகளைச் செயலாக்குகிறார்கள் மற்றும் ஒரு பயனர் "in stock" அல்லது "out of stock" என்பதைப் பார்க்க வேண்டுமா என்பதைத் தீர்மானிக்கும் வணிக விதிகளைக் கையாளுகிறார்கள். அவர்கள் APIs-களை உருவாக்கும்போது, தரவை எடுத்துச் செல்லும் தூதுவரை உருவாக்குகிறார்கள்.