ನಾನು ಬಳಕೆದಾರರ ಅನುಭವ ವಿನ್ಯಾಸದ ಕಂದಕಗಳಲ್ಲಿ ಎರಡು ದಶಕಗಳ ಕಾಲ ಕಳೆದಿದ್ದೇನೆ. ಟೇಬಲ್-ಆಧಾರಿತ ಲೇಔಟ್ಗಳಿಂದ CSS ಗೆ ಪರಿವರ್ತನೆ, ಐಫೋನ್ ಅನ್ನು ಪ್ರಾರಂಭಿಸಿದಾಗ ಸ್ಪಂದಿಸುವ ವಿನ್ಯಾಸಕ್ಕೆ ಪಿವೋಟ್ ಮತ್ತು "ಗಮನ ಆರ್ಥಿಕತೆಯ" ಏರಿಕೆ ನನಗೆ ನೆನಪಿದೆ. ಆದರೆ ನಾವು 2026 ರಲ್ಲಿ ನ್ಯಾವಿಗೇಟ್ ಮಾಡುತ್ತಿರುವಾಗ, ಉದ್ಯಮವು ಇನ್ನೂ ತನ್ನ ಅತ್ಯಂತ ಮಹತ್ವದ ಬದಲಾವಣೆಯನ್ನು ಎದುರಿಸುತ್ತಿದೆ. ನಾವು "ಯಾವುದೇ ವೆಚ್ಚದಲ್ಲಿ ವಿನ್ಯಾಸ" ಯುಗದ ಹಿಂದೆ ಸುಸ್ಥಿರ UX ಯುಗಕ್ಕೆ ಹೋಗುತ್ತಿದ್ದೇವೆ. ನಾನು ಇದನ್ನು ಪರಿಕಲ್ಪನೆಯಾಗಿ ಕೇಳುವವರೆಗೂ ನಾನು ಸೇರಿದಂತೆ ಹೆಚ್ಚಿನ ವಿನ್ಯಾಸಕರು ಯೋಚಿಸುವ ವಿಷಯವಲ್ಲ. ವರ್ಷಗಳಿಂದ, ನಾವು ಇಂಟರ್ನೆಟ್ ಅನ್ನು ಅಲೌಕಿಕ, ತೂಕವಿಲ್ಲದ ಮೋಡವೆಂದು ಪರಿಗಣಿಸಿದ್ದೇವೆ. ಡಿಜಿಟಲ್ ಉತ್ಪನ್ನಗಳನ್ನು ಕಾಗದದ ಮೇಲೆ ಮುದ್ರಿಸದ ಕಾರಣ "ಹಸಿರು" ಎಂದು ನಾವು ಊಹಿಸಿದ್ದೇವೆ. ನಾನು ಕೂಡ ಅದನ್ನು ಯೋಚಿಸುತ್ತಿದ್ದೆ ಮತ್ತು ಹವಾಮಾನ ಬದಲಾವಣೆಯ ಪರಿಕಲ್ಪನೆಯು ಹೊರಹೊಮ್ಮುವ ಮೊದಲು, ಅದು ಮರಗಳನ್ನು ಉಳಿಸುವ ಬಗ್ಗೆ ಹೆಚ್ಚು. ನಾವು ತಪ್ಪಾಗಿದ್ದೇವೆ. ಮೋಡವು ಭೌತಿಕ ಮೂಲಸೌಕರ್ಯವಾಗಿದೆ, ಡೇಟಾ ಕೇಂದ್ರಗಳ ವಿಸ್ತಾರವಾದ ನೆಟ್ವರ್ಕ್, ಸಮುದ್ರದೊಳಗಿನ ಕೇಬಲ್ಗಳು ಮತ್ತು 24/7 ಹಮ್ ಮಾಡುವ ಕೂಲಿಂಗ್ ವ್ಯವಸ್ಥೆಗಳು. AI-ಕೇಂದ್ರಿತ ಡೇಟಾ ಕೇಂದ್ರಗಳು ಬೃಹತ್ ಅಲ್ಯೂಮಿನಿಯಂ ಸ್ಮೆಲ್ಟರ್ಗಳ ವಿದ್ಯುತ್ ಬಳಕೆಗೆ ಹೊಂದಿಕೆಯಾಗುತ್ತವೆ, ಅವುಗಳ ಹೆಚ್ಚಿನ ಭೌಗೋಳಿಕ ಸಾಂದ್ರತೆಯು ಇನ್ನೂ ಹೆಚ್ಚು ತೀವ್ರವಾದ ಮತ್ತು ಸ್ಥಳೀಯ ಪರಿಸರದ ಒತ್ತಡವನ್ನು ಸೃಷ್ಟಿಸುತ್ತದೆ. UX ವಿನ್ಯಾಸಕರಾಗಿ, ನಾವು ಈ ಶಕ್ತಿಯ ಬಳಕೆಯ ವಾಸ್ತುಶಿಲ್ಪಿಗಳು. ಪ್ರತಿ ಹೈ-ರೆಸಲ್ಯೂಶನ್ ಹೀರೋ ಇಮೇಜ್, ಪ್ರತಿ ಸ್ವಯಂ-ಪ್ಲೇಯಿಂಗ್ ಹಿನ್ನೆಲೆ ವೀಡಿಯೊ, ಮತ್ತು ನಾವು ಅನುಮೋದಿಸುವ ಪ್ರತಿಯೊಂದು ಸಂಕೀರ್ಣವಾದ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಅನಿಮೇಷನ್ ವಿದ್ಯುತ್ ಅನ್ನು ಸೇವಿಸಲು ಪ್ರೊಸೆಸರ್ಗೆ ನೇರ ಸೂಚನೆಯಾಗಿದೆ. ನಾವು ಬಾಳಿಕೆ ಬರುವ ಭವಿಷ್ಯವನ್ನು ನಿರ್ಮಿಸಲು ಬಯಸಿದರೆ, ನಾವು "ವಾವ್" ಗಾಗಿ ವಿನ್ಯಾಸಗೊಳಿಸುವುದನ್ನು ನಿಲ್ಲಿಸಬೇಕು ಮತ್ತು ದಕ್ಷತೆಗಾಗಿ ವಿನ್ಯಾಸವನ್ನು ಪ್ರಾರಂಭಿಸಬೇಕು. ಡಾರ್ಕ್ ಮೋಡ್ 2000 ರ ದಶಕದ ಆರಂಭದಲ್ಲಿ, ಬಿಳಿ ಹಿನ್ನೆಲೆಗಳು ಪ್ರಮಾಣಿತವಾಗಿದ್ದವು ಏಕೆಂದರೆ ಅವುಗಳು ಕಾಗದದ ಪರಿಚಿತತೆಯನ್ನು ಅನುಕರಿಸಿದವು. ಆದಾಗ್ಯೂ, ಹಾರ್ಡ್ವೇರ್ ವಿಕಸನಗೊಂಡಿದೆ ಮತ್ತು ನಮ್ಮ ವಿನ್ಯಾಸ ತತ್ವವನ್ನು ಅನುಸರಿಸಬೇಕು. LCD ಯಿಂದ OLED (ಆರ್ಗ್ಯಾನಿಕ್ ಲೈಟ್ ಎಮಿಟಿಂಗ್ ಡಯೋಡ್) ತಂತ್ರಜ್ಞಾನಕ್ಕೆ ಬದಲಾವಣೆಯು ಬಣ್ಣವು ಶಕ್ತಿಯ ಮೇಲೆ ಹೇಗೆ ಪರಿಣಾಮ ಬೀರುತ್ತದೆ ಎಂಬುದನ್ನು ಮೂಲಭೂತವಾಗಿ ಬದಲಾಯಿಸಿದೆ.
ದಿ ಲಾಜಿಕ್ ಸಾಂಪ್ರದಾಯಿಕ LCD ಪರದೆಯಂತಲ್ಲದೆ, ಯಾವಾಗಲೂ ಆನ್ ಆಗಿರುವ ಬ್ಯಾಕ್ಲೈಟ್ ಅಗತ್ಯವಿರುತ್ತದೆ (ಕಪ್ಪು ಪ್ರದರ್ಶಿಸಿದಾಗಲೂ), OLED ಪರದೆಗಳು ಪ್ರತಿ ಪಿಕ್ಸೆಲ್ ಅನ್ನು ಪ್ರತ್ಯೇಕವಾಗಿ ಬೆಳಗಿಸುತ್ತವೆ. ಪಿಕ್ಸೆಲ್ ಅನ್ನು ನಿಜವಾದ ಕಪ್ಪು (#000000) ಗೆ ಹೊಂದಿಸಿದಾಗ, ನಿರ್ದಿಷ್ಟ ಡಯೋಡ್ ಸಂಪೂರ್ಣವಾಗಿ ಆಫ್ ಆಗುತ್ತದೆ. ಇದು ಶೂನ್ಯ ಶಕ್ತಿಯನ್ನು ಸೆಳೆಯುತ್ತದೆ. ಗಾಢವಾದ ಪ್ಯಾಲೆಟ್ಗಳನ್ನು ಬೆಂಬಲಿಸುವ ಇಂಟರ್ಫೇಸ್ಗಳನ್ನು ವಿನ್ಯಾಸಗೊಳಿಸುವ ಮೂಲಕ, ನಾವು ಕೇವಲ ಪ್ರವೃತ್ತಿಯನ್ನು ಅನುಸರಿಸುತ್ತಿಲ್ಲ; ನಾವು ಬಳಕೆದಾರರ ಸಾಧನದ ಶಕ್ತಿಯ ಅಗತ್ಯವನ್ನು ಭೌತಿಕವಾಗಿ ಕಡಿಮೆ ಮಾಡುತ್ತಿದ್ದೇವೆ. ಡೇಟಾ ಶಕ್ತಿಯ ಉಳಿತಾಯವು ಅತ್ಯಲ್ಪದಿಂದ ದೂರವಿದೆ. 2021 ರಲ್ಲಿ ಪರ್ಡ್ಯೂ ವಿಶ್ವವಿದ್ಯಾನಿಲಯದ ಹೆಗ್ಗುರುತು ಅಧ್ಯಯನವು ಈ ಚರ್ಚೆಗೆ ಚಿನ್ನದ ಮಾನದಂಡವಾಗಿದೆ, 100% ಹೊಳಪಿನಲ್ಲಿ, ಲೈಟ್ ಮೋಡ್ನಿಂದ ಡಾರ್ಕ್ ಮೋಡ್ಗೆ ಬದಲಾಯಿಸುವುದರಿಂದ ಸರಾಸರಿ 39% ರಿಂದ 47% ಬ್ಯಾಟರಿ ಶಕ್ತಿಯನ್ನು ಉಳಿಸಬಹುದು. ಜಾಗತಿಕ ಮಟ್ಟದಲ್ಲಿ, ಪ್ರತಿಯೊಂದು ಪ್ರಮುಖ ಅಪ್ಲಿಕೇಶನ್ ಡಾರ್ಕ್ ಮೋಡ್ಗೆ ಡೀಫಾಲ್ಟ್ ಆಗಿದ್ದರೆ, ಗ್ರಿಡ್ ಬೇಡಿಕೆಯಲ್ಲಿನ ಕಡಿತವು ಖಗೋಳಶಾಸ್ತ್ರೀಯವಾಗಿರುತ್ತದೆ. ವಿನ್ಯಾಸ ಗುರಿ 2026 ರಲ್ಲಿ, ಸೆಟ್ಟಿಂಗ್ಗಳ ಮೆನುವಿನಲ್ಲಿ ಡಾರ್ಕ್ ಮೋಡ್ ಇನ್ನು ಮುಂದೆ ದ್ವಿತೀಯ “ಥೀಮ್” ಆಗಿರಬಾರದು. ನಾವು "ಡಾರ್ಕ್-ಫಸ್ಟ್" ಮನಸ್ಥಿತಿಯೊಂದಿಗೆ ವಿನ್ಯಾಸ ಮಾಡಬೇಕು. ಪ್ರತಿ ಸೈಟ್ ಮ್ಯಾಟ್ರಿಕ್ಸ್ನಂತೆಯೇ ಇರಬೇಕು ಎಂದರ್ಥವಲ್ಲ, ಆದರೆ ಇದು ಡೀಫಾಲ್ಟ್ ಸಿಸ್ಟಮ್-ಆದ್ಯತೆಯ ಸ್ಥಿತಿಯಾಗಿ ಹೆಚ್ಚಿನ ಕಾಂಟ್ರಾಸ್ಟ್ ಡಾರ್ಕ್ ಥೀಮ್ಗಳಿಗೆ ಆದ್ಯತೆ ನೀಡುವುದು ಎಂದರ್ಥ. ಇದು ಸಾಧನದ ಹಾರ್ಡ್ವೇರ್ ಜೀವಿತಾವಧಿಯನ್ನು ವಿಸ್ತರಿಸುತ್ತದೆ ಮತ್ತು ಪ್ರತಿ ಪರಸ್ಪರ ಕ್ರಿಯೆಯ ಇಂಗಾಲದ ಹೆಜ್ಜೆಗುರುತನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ. ನಾನು ವೈಯಕ್ತಿಕವಾಗಿ ಓದಲು ಲೈಟ್-ಮೋಡ್ಗೆ ಆದ್ಯತೆ ನೀಡುತ್ತೇನೆ, ಆದ್ದರಿಂದ ಲೈಟ್ ಮತ್ತು ಡಾರ್ಕ್ ಮೋಡ್ ಆಯ್ಕೆಗಳು ಲಭ್ಯವಿರುವುದು ಅರ್ಥಪೂರ್ಣವಾಗಿದೆ. ಎರಡೂ ಆಯ್ಕೆಗಳನ್ನು ಒದಗಿಸುವುದರೊಂದಿಗೆ ಪ್ರವೇಶದ ಪರಿಗಣನೆಗಳೂ ಇವೆ. ಚಿತ್ರ ಮತ್ತು ವೀಡಿಯೊ ಆಪ್ಟಿಮೈಸೇಶನ್ ನಾವು ಸೋಮಾರಿ ವಿನ್ಯಾಸಕರಾಗಿ ಮಾರ್ಪಟ್ಟಿದ್ದೇವೆ. ಹೆಚ್ಚಿನ ವೇಗದ 5G ಮತ್ತು ಫೈಬರ್ ಆಪ್ಟಿಕ್ಸ್ನೊಂದಿಗೆ, ನಾವು ಫೈಲ್ ಗಾತ್ರಗಳ ಬಗ್ಗೆ ಚಿಂತಿಸುವುದನ್ನು ನಿಲ್ಲಿಸಿದ್ದೇವೆ. ಕಳೆದ ದಶಕದಲ್ಲಿ ಸರಾಸರಿ ಮೊಬೈಲ್ ಪುಟದ ತೂಕವು 500% ಕ್ಕಿಂತ ಹೆಚ್ಚಾಗಿದೆ, ಹೆಚ್ಚಾಗಿ ಆಪ್ಟಿಮೈಸ್ ಮಾಡದ ದೃಶ್ಯ ಸ್ವತ್ತುಗಳ ಕಾರಣದಿಂದಾಗಿ. ದಿ ಲಾಜಿಕ್ ವೆಬ್ಸೈಟ್ನ "ಡಿಜಿಟಲ್ ಫ್ಯಾಟ್" (ಆ 4MB ಅನ್ಸ್ಪ್ಲಾಶ್ ಫೋಟೋಗಳು ಮತ್ತು 15MB ಹಿನ್ನೆಲೆ ವೀಡಿಯೊಗಳು) ಪುಟ-ಲೋಡ್ ಶಕ್ತಿಗೆ ಏಕೈಕ ದೊಡ್ಡ ಕೊಡುಗೆಯಾಗಿದೆ. ಸರ್ವರ್ನಿಂದ ಕ್ಲೈಂಟ್ಗೆ ವರ್ಗಾಯಿಸಲಾದ ಪ್ರತಿ ಮೆಗಾಬೈಟ್ಗೆ ಪ್ರಸರಣ, ಸರ್ವರ್ನ ಪ್ರಕ್ರಿಯೆ ಮತ್ತು ಬಳಕೆದಾರರ ರೆಂಡರಿಂಗ್ ಎಂಜಿನ್ಗೆ ವಿದ್ಯುತ್ ಅಗತ್ಯವಿರುತ್ತದೆ. ನಾವು ಬೃಹತ್ ಫೈಲ್ಗಳನ್ನು ಬಳಸುವಾಗ, ಗಾತ್ರದ ಒಂದು ಭಾಗದಲ್ಲಿ ಪರಿಣಾಮಕಾರಿಯಾಗಿರಬಹುದಾದ ಚಿತ್ರವನ್ನು ತೋರಿಸಲು ನಾವು ಮೂಲಭೂತವಾಗಿ ಶಕ್ತಿಯನ್ನು "ಸುಡುತ್ತೇವೆ". ನಮೂದಿಸಬಾರದು, ನೀವು ಹೆಚ್ಚು ವೇಗವಾಗಿ ಲೋಡ್ ಆಗುವ ಪುಟದೊಂದಿಗೆ ಉತ್ತಮ ಬಳಕೆದಾರ ಅನುಭವವನ್ನು ಒದಗಿಸುತ್ತಿರುವಿರಿ.
ಡೇಟಾ HTTP ಆರ್ಕೈವ್ ಪ್ರಕಾರ, ಚಿತ್ರಗಳು ಮತ್ತು ವೀಡಿಯೊಗಳು ಪುಟದ ಒಟ್ಟು ತೂಕದ ಸಿಂಹದ ಪಾಲನ್ನು ಸ್ಥಿರವಾಗಿ ಹೊಂದಿವೆ. ಆದಾಗ್ಯೂ, AVIF ಮತ್ತು WebP ನಂತಹ ಆಧುನಿಕ ಸ್ವರೂಪಗಳಿಗೆ ಬದಲಾವಣೆಯು JPEG ಗೆ ಹೋಲಿಸಿದರೆ ಚಿತ್ರದ ತೂಕವನ್ನು 50% ವರೆಗೆ ಕಡಿಮೆ ಮಾಡುತ್ತದೆ, ಗುಣಮಟ್ಟದಲ್ಲಿ ಯಾವುದೇ ಗ್ರಹಿಸಬಹುದಾದ ನಷ್ಟವಿಲ್ಲದೆ. ಈ ಸ್ವರೂಪಗಳು ನನಗೆ JPG ಮತ್ತು PNG ಯಷ್ಟು ಪರಿಚಿತವಾಗಿಲ್ಲದಿದ್ದರೂ, ಪುಟದ ಗಾತ್ರವನ್ನು ಕಡಿಮೆ ಮಾಡಲು ನಾನು ಖಂಡಿತವಾಗಿಯೂ ಅವುಗಳನ್ನು ಬಳಸಲು ಎದುರು ನೋಡುತ್ತಿದ್ದೇನೆ. ದಿವಿನ್ಯಾಸ ಗುರಿ ನಾನು ಇತ್ತೀಚೆಗೆ ಸೈಬರ್ ಸೆಕ್ಯುರಿಟಿ ಪ್ಲಾಟ್ಫಾರ್ಮ್ಗಾಗಿ ಮರುವಿನ್ಯಾಸವನ್ನು ನಡೆಸಿದೆ. "ಮೊದಲು ಮತ್ತು ನಂತರ" ಆಡಿಟ್ ಅನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸುವ ಮೂಲಕ, ಅವರ ಮುಖಪುಟವು 5.5MB ಡೇಟಾವನ್ನು ಲೋಡ್ ಮಾಡುತ್ತಿದೆ ಎಂದು ನಾವು ಪತ್ತೆಹಚ್ಚಿದ್ದೇವೆ. ಹೈ-ರೆಸ್ ಛಾಯಾಗ್ರಹಣವನ್ನು SVG (ಸ್ಕೇಲೆಬಲ್ ವೆಕ್ಟರ್ ಗ್ರಾಫಿಕ್ಸ್) ಕಲೆಯೊಂದಿಗೆ ಬದಲಾಯಿಸುವ ಮೂಲಕ ಮತ್ತು ಇಮೇಜ್ ಸ್ವತ್ತುಗಳ ಬದಲಿಗೆ ಬುದ್ಧಿವಂತ CSS ಗ್ರೇಡಿಯಂಟ್ಗಳನ್ನು ಬಳಸುವ ಮೂಲಕ, ನಾವು ಲೋಡ್ ಅನ್ನು 1.2MB ಗೆ ಇಳಿಸಿದ್ದೇವೆ. ಅದು ಶಕ್ತಿಯ ಹೊರೆಯಲ್ಲಿ 78% ಕಡಿತವಾಗಿದೆ! ಡಿಸೈನರ್ ಆಗಿ, ನಿಮ್ಮ ಮೊದಲ ಪ್ರಶ್ನೆ ಯಾವಾಗಲೂ ಹೀಗಿರಬೇಕು: "ಇದಕ್ಕಾಗಿ ನನಗೆ ಫೋಟೋ ಅಗತ್ಯವಿದೆಯೇ ಅಥವಾ ಕೋಡ್ನೊಂದಿಗೆ ಅದೇ ಭಾವನಾತ್ಮಕ ಅನುರಣನವನ್ನು ನಾನು ಸಾಧಿಸಬಹುದೇ?"
ಉದ್ದೇಶಪೂರ್ವಕ ಚಲನೆ: "ಜೋರಾಗಿ" ಅನಿಮೇಷನ್ಗಳನ್ನು ಕತ್ತರಿಸುವುದು ನಾವು "ಸ್ಕ್ರಾಲ್-ಜಾಕಿಂಗ್" ಮತ್ತು ಸಂಕೀರ್ಣ 3D ಭ್ರಂಶ ಪರಿಣಾಮಗಳ ಯುಗದಲ್ಲಿ ವಾಸಿಸುತ್ತಿದ್ದೇವೆ. ಇವುಗಳು Awwwards.com ನಲ್ಲಿ ಪ್ರಶಸ್ತಿಗಳನ್ನು ಗೆಲ್ಲಬಹುದಾದರೂ, ಅವು ಸಾಮಾನ್ಯವಾಗಿ ಪರಿಸರ ವಿಪತ್ತುಗಳಾಗಿವೆ. ದಿ ಲಾಜಿಕ್ ಅನಿಮೇಷನ್ ಉಚಿತವಲ್ಲ. ಸಂಕೀರ್ಣ ಅನಿಮೇಶನ್ ಅನ್ನು ನಿರೂಪಿಸಲು, ಸಾಧನದ GPU (ಗ್ರಾಫಿಕ್ಸ್ ಪ್ರೊಸೆಸಿಂಗ್ ಯುನಿಟ್) ಹೆಚ್ಚಿನ ಸಾಮರ್ಥ್ಯದಲ್ಲಿ ಕೆಲಸ ಮಾಡಬೇಕು. ಇದು CPU ತಾಪಮಾನವನ್ನು ಹೆಚ್ಚಿಸುತ್ತದೆ, ಕೂಲಿಂಗ್ ಫ್ಯಾನ್ಗಳನ್ನು (ಲ್ಯಾಪ್ಟಾಪ್ಗಳಲ್ಲಿ) ಪ್ರಚೋದಿಸುತ್ತದೆ ಮತ್ತು ಬ್ಯಾಟರಿಯನ್ನು ವೇಗವಾಗಿ ಖಾಲಿ ಮಾಡುತ್ತದೆ. ಹಿನ್ನೆಲೆಯಲ್ಲಿ ನಿರಂತರವಾಗಿ ಚಲಿಸುವ ಅಥವಾ ಬ್ರೌಸರ್ನ ಬೃಹತ್ ಮರು-ಬಣ್ಣಗಳನ್ನು ಪ್ರಚೋದಿಸುವ "ಲೌಡ್" ಅನಿಮೇಷನ್ಗಳು ನಿಮ್ಮ ಕಾರನ್ನು ಡ್ರೈವಾಲ್ನಲ್ಲಿ ನಿಷ್ಕ್ರಿಯಗೊಳಿಸುವುದಕ್ಕೆ ಸಮಾನವಾದ ಶಕ್ತಿಯಾಗಿದೆ.
ಡೇಟಾ Google ನ ವಸ್ತು ವಿನ್ಯಾಸ ಮಾರ್ಗಸೂಚಿಗಳು "ಅರ್ಥಪೂರ್ಣ ಚಲನೆಯನ್ನು" ಒತ್ತಿಹೇಳುತ್ತವೆ. ಬಳಕೆದಾರರನ್ನು ಓರಿಯಂಟ್ ಮಾಡಲು ಅಥವಾ ಪ್ರತಿಕ್ರಿಯೆ ನೀಡಲು ಮಾತ್ರ ಅನಿಮೇಶನ್ ಅನ್ನು ಬಳಸಬೇಕು ಎಂದು ಅವರು ವಾದಿಸುತ್ತಾರೆ. ಮತ್ತು JPEG ಬದಲಿಗೆ WebP ಅನ್ನು ಬಳಸುವುದರಿಂದ ಪುಟದಲ್ಲಿ 25-50% ಡೇಟಾವನ್ನು ಉಳಿಸಬಹುದು. ವಿನ್ಯಾಸ ಗುರಿ ನಾವು ಅರ್ಥಪೂರ್ಣ ಚಲನೆಯನ್ನು ಅಳವಡಿಸಿಕೊಳ್ಳಬೇಕು. ಅನಿಮೇಷನ್ ಬಳಕೆದಾರರಿಗೆ ಕಾರ್ಯವನ್ನು ಪೂರ್ಣಗೊಳಿಸಲು ಅಥವಾ ಕ್ರಮಾನುಗತವನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳಲು ಸಹಾಯ ಮಾಡದಿದ್ದರೆ, ಅದು ವ್ಯರ್ಥವಾಗುತ್ತದೆ. ಸಾಧ್ಯವಿರುವಲ್ಲಿ GSAP ಅಥವಾ Lottie ನಂತಹ ಭಾರೀ JavaScript ಲೈಬ್ರರಿಗಳ ಮೇಲೆ CSS ಪರಿವರ್ತನೆಗಳಿಗೆ ನಾವು ಒಲವು ತೋರಬೇಕು, ಏಕೆಂದರೆ CSS ಹಾರ್ಡ್ವೇರ್-ವೇಗವರ್ಧಿತ ಮತ್ತು ಬ್ರೌಸರ್ಗೆ ಲೆಕ್ಕಾಚಾರ ಮಾಡಲು ಹೆಚ್ಚು ಪರಿಣಾಮಕಾರಿಯಾಗಿದೆ. UX ಡಿಸೈನರ್ ಆಗಿ, ನಾನು ಈ ವಿಧಾನವನ್ನು ವಾದಿಸಲು ಸಾಧ್ಯವಿಲ್ಲ. ಇದು ಡೇಟಾ ವ್ಯರ್ಥವನ್ನು ಕಡಿಮೆ ಮಾಡಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ ಆದರೆ ನಮ್ಮ ಬಳಕೆದಾರರಿಗೆ UX ಅನ್ನು ಸುಧಾರಿಸುತ್ತದೆ. ಪ್ರತಿ ಯೋಜನೆಗೆ "ಡೇಟಾ ಬಜೆಟ್" ಅನ್ನು ಹೊಂದಿಸುವುದು ನನ್ನ 20+ ವರ್ಷಗಳ UX ನಲ್ಲಿ, ಅತ್ಯಂತ ಯಶಸ್ವಿ ಯೋಜನೆಗಳು ಸಾಮಾನ್ಯವಾಗಿ ಬಿಗಿಯಾದ ನಿರ್ಬಂಧಗಳನ್ನು ಹೊಂದಿವೆ. ಯೋಜನೆಯು ಹಣಕಾಸಿನ ಬಜೆಟ್ ಅನ್ನು ಹೊಂದಿರುವಂತೆ, ಅದು ಕಾರ್ಬನ್ ಮತ್ತು ಡೇಟಾ ಬಜೆಟ್ ಅನ್ನು ಹೊಂದಿರಬೇಕು. ದಿ ಲಾಜಿಕ್ ಡೇಟಾ ಬಜೆಟ್ ಒಂದು ಪುಟದ ಒಟ್ಟು ಗಾತ್ರದ ಮೇಲೆ ಹಾರ್ಡ್ ಕ್ಯಾಪ್ ಆಗಿದೆ (ಉದಾ., "ಈ ಲ್ಯಾಂಡಿಂಗ್ ಪುಟವು 1MB ಅನ್ನು ಮೀರಬಾರದು"). ಇದು ಕಷ್ಟಕರವಾದ, ಉದ್ದೇಶಪೂರ್ವಕ ಆಯ್ಕೆಗಳನ್ನು ಮಾಡಲು ವಿನ್ಯಾಸ ತಂಡವನ್ನು ಒತ್ತಾಯಿಸುತ್ತದೆ. ನೀವು ಹೊಸ ಟ್ರ್ಯಾಕಿಂಗ್ ಸ್ಕ್ರಿಪ್ಟ್ ಅಥವಾ ಅಲಂಕಾರಿಕ ಫಾಂಟ್ ತೂಕವನ್ನು ಸೇರಿಸಲು ಬಯಸಿದರೆ, ಬೇರೆ ಯಾವುದನ್ನಾದರೂ ಆಪ್ಟಿಮೈಜ್ ಮಾಡುವ ಮೂಲಕ ಅಥವಾ ತೆಗೆದುಹಾಕುವ ಮೂಲಕ ನೀವು ಅದನ್ನು "ಪಾವತಿಸಬೇಕು". ಇದು "ಫೀಚರ್ ಕ್ರೀಪ್" ಅನ್ನು "ಕಾರ್ಬನ್ ಕ್ರೀಪ್" ಆಗಿ ಪರಿವರ್ತಿಸುವುದನ್ನು ತಡೆಯುತ್ತದೆ. ಡೇಟಾ ಹೋಲ್ಗ್ರೇನ್ ಡಿಜಿಟಲ್ನಂತಹ ಪ್ರವರ್ತಕರು ಅಭಿವೃದ್ಧಿಪಡಿಸಿದ ಸುಸ್ಥಿರ ವೆಬ್ ವಿನ್ಯಾಸ ಮಾದರಿಯು ಪ್ರತಿ ಪುಟ ವೀಕ್ಷಣೆಗೆ CO2 ಅನ್ನು ಲೆಕ್ಕಾಚಾರ ಮಾಡಲು ಸೂತ್ರವನ್ನು ಒದಗಿಸುತ್ತದೆ. ಸರಾಸರಿ ವೆಬ್ಸೈಟ್ ಪ್ರತಿ ವೀಕ್ಷಣೆಗೆ ಸುಮಾರು 0.5 ಗ್ರಾಂ CO2 ಅನ್ನು ಉತ್ಪಾದಿಸುತ್ತದೆ. 1 ಮಿಲಿಯನ್ ಮಾಸಿಕ ವೀಕ್ಷಣೆಗಳನ್ನು ಹೊಂದಿರುವ ಸೈಟ್ಗಾಗಿ, ಅದು ವರ್ಷಕ್ಕೆ 6 ಮೆಟ್ರಿಕ್ ಟನ್ CO2 ಆಗಿದೆ, ಇದು ಕಾರನ್ನು 15,000 ಮೈಲುಗಳಷ್ಟು ಓಡಿಸುವುದಕ್ಕೆ ಸಮಾನವಾಗಿದೆ. ವಿನ್ಯಾಸ ಗುರಿ ಸಸ್ಟೈನಬಲ್ UX ಪರಿಶೀಲನಾಪಟ್ಟಿ
ಚಿತ್ರಗಳು ಪ್ರತಿ ದೃಶ್ಯದ ಅಗತ್ಯವನ್ನು ಪ್ರಶ್ನಿಸಿ ಮತ್ತು ಡೇಟಾ ವರ್ಗಾವಣೆಯನ್ನು ಕಡಿಮೆ ಮಾಡಲು ಚಿಕ್ಕ ರೆಸಲ್ಯೂಶನ್ ಮತ್ತು ಅತ್ಯಂತ ಪರಿಣಾಮಕಾರಿ ಫೈಲ್ ಫಾರ್ಮ್ಯಾಟ್ಗಳನ್ನು (AVIF ನಂತಹ) ಬಳಸಿ. ವೀಡಿಯೊವನ್ನು ಆಪ್ಟಿಮೈಜ್ ಮಾಡಿ ಸ್ವಯಂ-ಪ್ಲೇಯಿಂಗ್ ಮಾಧ್ಯಮವನ್ನು ಎಲಿಮಿನೇಟ್ ಮಾಡಿ ಮತ್ತು ಬಳಕೆದಾರರು ವೀಕ್ಷಿಸಲು ಉದ್ದೇಶಿಸಿರುವ ವಿಷಯಕ್ಕೆ ಮಾತ್ರ ಶಕ್ತಿಯನ್ನು ವ್ಯಯಿಸುವುದನ್ನು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಹೆಚ್ಚು ಸಂಕುಚಿತ, ಚಿಕ್ಕ ಲೂಪ್ಗಳಿಗೆ ಆದ್ಯತೆ ನೀಡಿ. ಮಿತಿ ಫಾಂಟ್ಗಳು ಗರಿಷ್ಠ ಎರಡು ವೆಬ್ ಫಾಂಟ್ ತೂಕಗಳನ್ನು ಬಳಸಿ ಅಥವಾ ಅನಗತ್ಯ ಸರ್ವರ್ ವಿನಂತಿಗಳನ್ನು ಮತ್ತು ರೆಂಡರಿಂಗ್ ಬ್ಲೋಟ್ ಅನ್ನು ತೆಗೆದುಹಾಕಲು ಕ್ಲಾಸಿಕ್ ಸಿಸ್ಟಮ್ ಫಾಂಟ್ಗಳಿಗೆ ಅಂಟಿಕೊಳ್ಳಿ. ಮರುಬಳಕೆ ಸ್ವತ್ತುಗಳು ಒಟ್ಟು ಪುಟದ ತೂಕವನ್ನು ಹೆಚ್ಚಿಸದೆಯೇ ದೃಶ್ಯ ವೈವಿಧ್ಯತೆಯನ್ನು ರಚಿಸಲು CSS ಫಿಲ್ಟರ್ಗಳು ಮತ್ತು ಓವರ್ಲೇಗಳನ್ನು ಬಳಸಿಕೊಂಡು ಒಂದೇ ಚಿತ್ರ ಅಥವಾ ವೀಡಿಯೊವನ್ನು ಹಲವು ಬಾರಿ ಮರುಬಳಕೆ ಮಾಡಿ. ಗ್ರೀನ್ ವೆಬ್ ಫೌಂಡೇಶನ್ ಪರಿಶೀಲಿಸಿದ ಸರ್ವರ್ಗಳಲ್ಲಿ ನಿಮ್ಮ ಡಿಜಿಟಲ್ ಉತ್ಪನ್ನಗಳನ್ನು ನವೀಕರಿಸಬಹುದಾದ ಇಂಧನ ಮೂಲಗಳಿಂದ ನಡೆಸಲಾಗುತ್ತಿದೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಗ್ರೀನ್ ಹೋಸ್ಟಿಂಗ್ ಹೋಸ್ಟ್ ಅನ್ನು ಆಯ್ಕೆಮಾಡಿ. ಡೇಟಾ ದೂರವನ್ನು ಕಡಿಮೆಗೊಳಿಸಿ ಭೌತಿಕ ಮೂಲಸೌಕರ್ಯದ ಮೂಲಕ ಡೇಟಾ ಪ್ರಯಾಣಿಸಲು ಅಗತ್ಯವಿರುವ ಶಕ್ತಿಯನ್ನು ಕಡಿಮೆ ಮಾಡಲು ನಿಮ್ಮ ಪ್ರಾಥಮಿಕ ಪ್ರೇಕ್ಷಕರಿಗೆ ಭೌಗೋಳಿಕವಾಗಿ ಹತ್ತಿರವಿರುವ ಸರ್ವರ್ ಸ್ಥಳಗಳನ್ನು ಆಯ್ಕೆಮಾಡಿ.
ಪರಿಸರ ಸ್ನೇಹಿ ವಿನ್ಯಾಸಕ್ಕಾಗಿ ವ್ಯಾಪಾರ ಪ್ರಕರಣ "ಗ್ರೀನ್ ಯುಎಕ್ಸ್" ಗುಣಮಟ್ಟದ ಮೇಲೆ ರಾಜಿಯಂತೆ ಧ್ವನಿಸುತ್ತದೆ ಎಂದು ಕೆಲವರು ವಾದಿಸಬಹುದು. ಇದಕ್ಕೆ ವಿರುದ್ಧವಾಗಿ, ಇದು ಸ್ಪರ್ಧಾತ್ಮಕ ಪ್ರಯೋಜನವಾಗಿದೆ. ಸಮರ್ಥನೀಯ ವಿನ್ಯಾಸವು ಕಾರ್ಯಕ್ಷಮತೆಯ ವಿನ್ಯಾಸವಾಗಿದೆ. ನೀವು ಪುಟದ ತೂಕವನ್ನು ಕಡಿಮೆ ಮಾಡಿದಾಗ, ನಿಮ್ಮ ಸೈಟ್ ವೇಗವಾಗಿ ಲೋಡ್ ಆಗುತ್ತದೆ. ನಿಮ್ಮ ಸೈಟ್ ವೇಗವಾಗಿ ಲೋಡ್ ಆಗುವಾಗ, ನಿಮ್ಮ ಕೋರ್ ವೆಬ್ ವೈಟಲ್ಗಳು ಸುಧಾರಿಸುತ್ತವೆ. ನಿಮ್ಮ ಕೋರ್ ವೆಬ್ ವೈಟಲ್ಸ್ ಸುಧಾರಿಸಿದಾಗ, ನಿಮ್ಮ ಎಸ್ಇಒ ಶ್ರೇಯಾಂಕವು ಹೆಚ್ಚಾಗುತ್ತದೆ. ಇದಲ್ಲದೆ, ಹಳೆಯ ಸಾಧನಗಳು ಅಥವಾ ನಿಧಾನವಾದ ಡೇಟಾ ಯೋಜನೆಗಳಲ್ಲಿನ ಬಳಕೆದಾರರು (ವಿಶೇಷವಾಗಿ ಉದಯೋನ್ಮುಖ ಮಾರುಕಟ್ಟೆಗಳಲ್ಲಿ) ನಿಮ್ಮ ಉತ್ಪನ್ನವನ್ನು ಪ್ರವೇಶಿಸಬಹುದು. ಇದು "ಅಂತರ್ಗತ ವಿನ್ಯಾಸ" ದ ವ್ಯಾಖ್ಯಾನವಾಗಿದೆ. "ಡಿಜಿಟಲ್ ಕೊಬ್ಬನ್ನು" ಕತ್ತರಿಸುವ ಮೂಲಕ, ನಾವು ತೆಳ್ಳಗಿನ, ವೇಗವಾದ ಮತ್ತು ಹೆಚ್ಚು ಪ್ರವೇಶಿಸಬಹುದಾದ ವೆಬ್ ಅನ್ನು ರಚಿಸುತ್ತೇವೆ. ನಾವು 2010 ರ "ಬಿಸಾಡಬಹುದಾದ ವಿನ್ಯಾಸ" ದಿಂದ ಎ ಕಡೆಗೆ ಚಲಿಸುತ್ತಿದ್ದೇವೆಹೆಚ್ಚು ಶಾಶ್ವತ, ಗೌರವಾನ್ವಿತ ಡಿಜಿಟಲ್ ಆರ್ಕಿಟೆಕ್ಚರ್. ತೀರ್ಮಾನ: "ಕ್ಲೀನ್" ವಿನ್ಯಾಸದ ಭವಿಷ್ಯ ನನ್ನ ಎರಡು ದಶಕಗಳ ವಿನ್ಯಾಸದಲ್ಲಿ, ಅನೇಕ ಪ್ರವೃತ್ತಿಗಳು ಬಂದು ಹೋಗುವುದನ್ನು ನಾನು ನೋಡಿದ್ದೇನೆ. ಸ್ಕೀಯೊಮಾರ್ಫಿಸಮ್, ಫ್ಲಾಟ್ ಡಿಸೈನ್, ನ್ಯೂಮಾರ್ಫಿಸಮ್ - ಇವೆಲ್ಲವೂ ಸೌಂದರ್ಯದ ಆಯ್ಕೆಗಳಾಗಿವೆ. ಆದರೆ ಸಮರ್ಥನೀಯ UX ಒಂದು ಪ್ರವೃತ್ತಿಯಲ್ಲ; ಇದು ಈಗ ಅಗತ್ಯವಾಗಿದೆ. ನಮ್ಮ ಡಿಜಿಟಲ್ ಕೆಲಸದ ಭೌತಿಕ ಪರಿಣಾಮಗಳನ್ನು ಪರಿಗಣಿಸಬೇಕಾದ ಮೊದಲ ತಲೆಮಾರಿನ ವಿನ್ಯಾಸಕರು ನಾವು. ಸಸ್ಟೈನಬಲ್ UX "ಗೆಲುವು-ಗೆಲುವು-ಗೆಲುವು" ಆಗಿದೆ. ಇದು ಗ್ರಹಕ್ಕೆ ಉತ್ತಮವಾಗಿದೆ ಏಕೆಂದರೆ ಇದು ಶಕ್ತಿಯ ಬಳಕೆಯನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ. ಇದು ಬಳಕೆದಾರರಿಗೆ ಉತ್ತಮವಾಗಿದೆ ಏಕೆಂದರೆ ಇದು ವೇಗವಾದ, ಹೆಚ್ಚು ಸ್ಪಂದಿಸುವ ಇಂಟರ್ಫೇಸ್ಗಳಿಗೆ ಕಾರಣವಾಗುತ್ತದೆ. ಮತ್ತು ಇದು ವ್ಯವಹಾರಕ್ಕೆ ಉತ್ತಮವಾಗಿದೆ ಏಕೆಂದರೆ ಇದು ಹೋಸ್ಟಿಂಗ್ ವೆಚ್ಚವನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ ಮತ್ತು ಪರಿವರ್ತನೆ ದರಗಳನ್ನು ಸುಧಾರಿಸುತ್ತದೆ. "ಅನಿಯಮಿತ ಪಿಕ್ಸೆಲ್ಗಳ" ಯುಗವು ಮುಗಿದಿದೆ. 2026 ರಲ್ಲಿ, ಅತ್ಯಂತ ಅತ್ಯಾಧುನಿಕ ವಿನ್ಯಾಸವು ಚಿಕ್ಕ ಹೆಜ್ಜೆಗುರುತನ್ನು ಬಿಡುತ್ತದೆ. ನಾವು ಇನ್ನು ಮುಂದೆ ಕೇವಲ ವಿನ್ಯಾಸಕರಲ್ಲ; ನಾವು ಬಳಕೆದಾರರ ಬ್ಯಾಟರಿ, ಅವರ ಡೇಟಾ ಯೋಜನೆ ಮತ್ತು ಅಂತಿಮವಾಗಿ ಪರಿಸರದ ರಕ್ಷಕರು. ಕ್ರಿಯೆಗೆ ಕರೆ ಇಂದು ನಿಮ್ಮ ಪ್ರಸ್ತುತ ಯೋಜನೆಯ ಒಂದು ಪುಟವನ್ನು ಆಡಿಟ್ ಮಾಡಲು ನಾನು ನಿಮಗೆ ಸವಾಲು ಹಾಕುತ್ತೇನೆ. ಅದರ ಪರಿಣಾಮವನ್ನು ನೋಡಲು ವೆಬ್ಸೈಟ್ ಕಾರ್ಬನ್ ಕ್ಯಾಲ್ಕುಲೇಟರ್ನಂತಹ ಉಪಕರಣವನ್ನು ಬಳಸಿ. ನಂತರ, "ಅದೃಶ್ಯ ತ್ಯಾಜ್ಯ" ಗಾಗಿ ನೋಡಿ. ಆ ಚಿತ್ರ SVG ಆಗಿರಬಹುದೇ? ಆ ವಿಡಿಯೋ ಸ್ಟಾಟಿಕ್ ಹೀರೋ ಆಗಿರಬಹುದೇ? ಆ "ಜೋರಾಗಿ" ಅನಿಮೇಷನ್ ಅನ್ನು ಮೌನಗೊಳಿಸಬಹುದೇ? ಚಿಕ್ಕದಾಗಿ ಪ್ರಾರಂಭಿಸಿ. ಅತ್ಯಂತ ಸೊಗಸಾದ ಪರಿಹಾರವು ಸಾಮಾನ್ಯವಾಗಿ ಕಡಿಮೆ ಬೈಟ್ಗಳನ್ನು ಹೊಂದಿದೆ.