वेब पृष्ठ लेआउटसाठी आपण टेबल टाळत का ठेवावे?

CSS हे वेब पृष्ठ डिझाइन तयार करण्याचा सर्वोत्तम मार्ग आहे

CSS लेआउट लिहायला शिकणे अवघड असू शकते, खासकरून जर आपण फॅन्सी वेब पृष्ठ मांडणी तयार करण्यासाठी सारण्या वापरण्यास परिचित असाल. पण जेव्हा HTML5 ने लेआउटसाठी टेबल्सची परवानगी दिली, तेव्हा ही एक चांगली कल्पना नाही

टेबल प्रवेशयोग्य नाहीत

अगदी शोध इंजिनांप्रमाणे, बहुतेक स्क्रीन रीडर वेब पृष्ठे वाचतात ज्या क्रमाने ते HTML मध्ये प्रदर्शित होतात. स्क्रीन वाचकांना विश्लेषित करण्यासाठी आणि टेबल्स कठीण असू शकतात. कारण टेबल मांडणीमधील सामग्री, रेषेचा असताना, नेहमी डाव्याकडून-उजवीकडे आणि वरून खालपर्यंत वाचताना ते जाणत नाही. प्लस, नेस्टेड टेबल्ससह आणि टेबल सेलवरील विविध स्पेन्स हे पृष्ठ अतिशय आवेगपूर्वक सांगू शकतात.

हेच कारण आहे की HTML5 स्पष्टविराम मांडणीसाठी तक्त्यांच्या विरोधात शिफारस करतो आणि HTML 4.01 ने ते त्यास नकार देतो. प्रवेशयोग्य वेब पृष्ठे अधिक लोकांना त्यांचे वापरण्यास अनुमती देतात आणि व्यावसायिक डिझाइनरचे चिन्ह आहेत.

CSS सह, आपण एका विभागात पृष्ठाच्या डाव्या बाजूवरील एक भाग म्हणून परिभाषित करू शकता परंतु त्यास एचटीएमएलमध्ये कायम ठेवू शकता. मग स्क्रीन रीडर आणि सर्च इंजिन्स सारखाच महत्त्वाचे भाग (कंटेंट) आधी वाचतील आणि शेवटचे महत्त्वाचे भाग (नेव्हिगेशन).

टेबल फसव्या आहेत

जरी आपण वेब संपादकासह एक टेबल तयार केले असले तरीही, आपले वेब पृष्ठे अजूनही अतिशय क्लिष्ट आणि राखणे कठीण आहे. सर्वात सोप्या वेब पृष्ठ डिझाइन वगळता बहुतेक लेआउट सारण्यांसाठी नेहेस्टेड टेबर्स आणि पुष्कळशा विशेषता आणि गुणधर्मांचा वापर करणे आवश्यक आहे.

आपण ते करत असताना टेबल तयार करणे सोपे वाटते, परंतु नंतर आपण ते देखरेख करणे आवश्यक आहे रेषा खाली सहा महिने तरी हे लक्षात ठेवणे तितके सोपे नाही की आपण कोलेस्ट्रेट्सची का नेस्टेड केली किंवा किती सरोवर आहेत आणि इत्यादी. तसेच, आपण वेब पृष्ठे कार्यसंघ सदस्य म्हणून राखून ठेवल्यास, आपल्याला प्रत्येक व्यक्तीला हे कसे स्पष्ट करावे लागेल की टेबल कसे काम करतात किंवा बदल करण्याची गरज असताना त्यांना अतिरिक्त वेळ घेण्याची अपेक्षा करते.

सीएसएस सारखीच गुंतागुंतीची असू शकतात, पण हे सादरीकरण एचटीएमएलहून वेगळे ठेवते आणि लांब पल्ल्यात टिकवून ठेवणे अधिक सोपे करते. प्लस, सीएसएस लेआउटसह आपण एक सीएसएस फाइल लिहू शकता आणि आपल्या सर्व पृष्ठांना त्या पद्धतीने शोधू शकता. आणि जेव्हा आपण आपल्या साइटचे लेआउट बदलू इच्छिता, तेव्हा आपण फक्त एक CSS फाइल आणि संपूर्ण साइट chnges बदलू शकता-लेआउट अद्यतनित करण्यासाठी सारणी अद्यतनित करण्यासाठी एकावेळी प्रत्येक पृष्ठावर जाणार नाही.

टेबल अस्पृश्य आहेत

टक्केवारीची रूंदी असलेल्या सारणी मांडणी तयार करणे शक्य असताना, ते बहुतेक लोड होण्यास मंद होते आणि आपले लेआउट कसे दिसते हे नाटकात बदलले जाऊ शकते. परंतु आपण आपल्या सारण्यांसाठी विशिष्ट रूंदी वापरत असल्यास, आपण खूप कठोर लेआउटसह समाप्त होतात जे आपल्या स्वत: च्या आकाराच्या मॉनिटर्सवर चांगले दिसणार नाही.

अनेक मॉनिटर, ब्राऊझर आणि ठरावांवरील चांगले दिसणारे लवचिक लेआउट तयार करणे हे तुलनेने सोपे आहे. खरेतर, CSS मीडिया क्वेरींसह, आपण वेगवेगळ्या आकाराच्या स्क्रीनसाठी वेगळे डिझाइन तयार करू शकता.

नेस्टेड टेबल्स त्याच डिझाइनसाठी CSS पेक्षा अधिक धीमे लोड करा

टेबलसह फॅन्सी मांडणी तयार करण्याचा सर्वात सामान्य मार्ग म्हणजे "घरटे" सारण्या. याचा अर्थ एक (किंवा अधिक) सारणी दुसर्या आत ठेवले आहे. नेस्टेड केलेले अधिक सारणी, हे वेब ब्राउझरला पृष्ठ रेंडर करण्यासाठी जास्त वेळ घेईल.

बहुतांश घटनांमध्ये, एक CSS लेआउट सीएसएस डिझाइन पेक्षा तयार करण्यासाठी अधिक वर्ण वापरते. आणि डाउनलोड करण्यासाठी कमी वर्णांचा अर्थ कमी असतो.

सारण्या शोध इंजिन ऑप्टिमायझेशन दुखू शकतात

तयार केलेली सर्वात सामान्य सारणीत पृष्ठाच्या डाव्या बाजूवरील नेव्हिगेशन बार आणि उजवीकडील मुख्य सामग्री आहे सारण्या वापरताना, (सामान्यत:) HTML मध्ये प्रदर्शित करणारी प्रथम सामग्री डाव्या-हाताकडील नॅव्हिगेशन बारची आवश्यकता असते. शोध एन्जन्स सामग्रीवर आधारित पृष्ठे वर्गीकृत करते आणि अनेक इंजिने हे निर्धारित करतात की पृष्ठाच्या शीर्षस्थानी प्रदर्शित केलेली सामग्री अन्य सामग्रीपेक्षा अधिक महत्वाची आहे. तर, प्रथम डावीकडील नेव्हीगेशन असलेले एक पृष्ठ, नेव्हीगेशनपेक्षा कमी महत्त्वाची असलेली सामग्री दिसून येईल.

सीएसएस वापरून, आपण प्रथम आपल्या HTML मध्ये महत्वाची सामग्री ठेवू शकता आणि नंतर डिझाइनमध्ये कुठे ठेवावे हे निर्धारित करण्यासाठी सीएसएसचा वापर करा. याचा अर्थ शोध इंजिने प्रथम महत्वाची सामग्री पाहतील, जरी हे डिझाइन पृष्ठावर कमी करेल तरीही

सारण्या नेहमी नेहमी छान प्रिंट करु नका

बर्याच टेबलचे डिझाइन चांगले प्रिंट करत नाहीत कारण ते प्रिंटरसाठी खूपच विस्तृत आहेत. म्हणून, त्यांना फिट करण्यासाठी, ब्राऊजर तक्त्याबाहेर कट करतील आणि खालील विभाग मुद्रित करतील ज्यामुळे अतिशय विचित्र पृष्ठे होतील. काहीवेळा आपण पृष्ठांकडे दुर्लक्ष करतो जे ठीक आहे, परंतु संपूर्ण उजव्या बाजूला गायब आहे इतर पृष्ठे वेगवेगळ्या शीटवर विभाग प्रिंट करतील.

CSS सह आपण पृष्ठ छपाईसाठी वेगळी शैली पत्रक तयार करू शकता.

लेआउटसाठी टेबल HTML 4.01 मध्ये अवैध आहेत

एचटीएमएल 4 स्पेसिफिकेशन मध्ये असे म्हटले आहे: "टेबल्स पूर्णपणे लेआउट डॉक्युमेंट्स सामग्रीचे एक साधन म्हणून वापरु नये म्हणून हे वापरता येत नाही कारण हे गैर-व्हिज्युअल मिडियावर रेंडर करतेवेळी समस्या निर्माण करू शकतात."

म्हणून, आपण वैध HTML 4.01 लिहू इच्छित असल्यास, आपण मांडणीसाठी सारण्या वापरू शकत नाही. आपण फक्त टॅब्युलर डेटासाठी सारण्या वापरु नयेत. आणि सारणीचा डेटा सामान्यतः एखाद्या स्प्रेडशीट किंवा संभाव्य डाटाबेसमध्ये आपल्याला दिसतो असा काहीतरी दिसतो.

परंतु HTML5 ने नियम बदलले आणि आराखड्याच्या लेआउट्ससाठी आता पॅकेजेस, शिफारस केलेली नाही, आता वैध HTML आहेत एचटीएमएल 5 विनिर्देशन: "लेबले एड्सच्या रूपात टेबल्स वापरु नयेत."

कारण स्क्रीनवर वाचण्यासाठी वेगवेगळी लेआउट्स टेबल्स कठीण असतात कारण मी वर उल्लेख करतो.

आपल्या पृष्ठांची स्थिती मांडण्यासाठी आणि लेआउट करण्यासाठी सीएसएस वापरणे हा केवळ वैध एचटीएमएल 4.01 आहे, जे आपण डिझाइन तयार करण्यासाठी वापरण्यासाठी डिझाइन वापरतात. आणि HTML5 जोरदार ही पद्धत तसेच शिफारस करते

लेआउटसाठी सारण्या आपल्या ईयोब संभाव्यतेवर प्रभाव टाकू शकतात

जास्तीतजास्त नवीन डिझाइनर HTML आणि CSS जाणून घेतात, टेबल लेआउट बनविण्यासाठी आपले कौशल्य कमी आणि कमी मागणीत असेल होय, हे खरे आहे की ग्राहक आपल्याला त्यांचे वेब पृष्ठ तयार करण्यासाठी आपण वापरत असलेल्या अचूक तंत्रज्ञानास सामान्यतः सांगू शकत नाहीत. परंतु ते आपल्याला अशा गोष्टींसाठी विचारतात:

• प्रवेशयोग्य वेब पृष्ठे: स्क्रीन वाचकांद्वारे पाहिल्या जाऊ शकणार्या डिझाइनना अनेक देश आणि कंपन्यांद्वारे अनिवार्य केले जात आहे दररोज अधिक आणि अधिक महत्वाचे प्रवेश शोधणे
• सुसंगत वेब पृष्ठे: भविष्यामध्ये आपण त्यांचे पालन केले नाही तरीही डिझाइनसह ते त्यांच्यासोबत घेऊ शकतात.
• लवचिक डिझाईन्स: अनेक ब्राउझर, ठराव आणि डिव्हाइसेसवर कार्य करणारे डिझाइन
• फास्ट डाऊनलोड पृष्ठेः एसइओला गती अधिक आणि अधिक महत्त्वपूर्ण होत आहे.
• प्रिंट करण्यायोग्य डिझाईन्स: विशेष स्क्रिप्ट किंवा अतिरिक्त पृष्ठांशिवाय मुद्रित करणारे पृष्ठे.

क्लायंट काय विचारतात हे तुम्ही जर देऊ शकत नसाल, ते तुमच्यासाठी डिझाईन्ससाठी थांबू शकतील, कदाचित आज नाही, परंतु कदाचित पुढील वर्षी किंवा वर्षानंतर आपण 1 99 0 पासूनच्या दशकापासून वापरात असलेले तंत्र शिकण्यास प्रारंभ करण्यास तयार नसल्यामुळे आपल्या व्यवसायाला दुःख होऊ देऊ शकता का?

नैतिक: सीएसएस वापरायला शिका

सीएसएस शिकणे कठीण होऊ शकते, पण फायदेशीर काहीही प्रयत्न वाचतो. आपल्या कौशल्याची कसरत करू नका सीएसएस जाणून घ्या आणि आपले वेब पृष्ठे तयार करावीत म्हणजे मांडणीसाठी सीएसएस सह बिल्ट होईल.