વેબ પૃષ્ઠ લેઆઉટ માટે શા માટે તમારે કોષ્ટકો ટાળવા જોઈએ

સીએસએસ વેબ પૃષ્ઠ ડિઝાઇન્સ બનાવવાની શ્રેષ્ઠ રીત છે

CSS લેઆઉટ લખવાનું શીખવું મુશ્કેલ હોઈ શકે છે, ખાસ કરીને જો તમે ફેન્સી વેબ પૃષ્ઠ લેઆઉટ બનાવવા માટે કોષ્ટકોનો ઉપયોગ કરવાથી પરિચિત છો. પરંતુ જ્યારે HTML5 લેઆઉટ માટે કોષ્ટકોની પરવાનગી આપે છે, તે એક સારો વિચાર નથી.

કોષ્ટકો ઍક્સેસિબલ નથી

શોધ એંજીન્સની જેમ, મોટાભાગનાં સ્ક્રીન રીડર્સ વેબ પૃષ્ઠોને તે ક્રમમાં વાંચે છે જે HTML માં પ્રદર્શિત થાય છે. સ્ક્રીન વાંચકોને પાર્સ કરવા માટે અને કોષ્ટકો ખૂબ જ મુશ્કેલ હોઈ શકે છે આનું કારણ એ છે કે ટેબલ લેટેગરીની સામગ્રી, જ્યારે રેખીય હોય છે, ત્યારે જમણે-થી-જમણે અને ઉપરથી નીચે સુધી વાંચી શકાતું નથી. વત્તા, નેસ્ટેડ કોષ્ટકો અને કોષ્ટક કોશિકાઓ પરના વિવિધ સ્પાન્સને પૃષ્ઠને ખૂબ જ મુશ્કેલ લાગે છે.

આ કારણ એ છે કે HTML5 સ્પષ્ટીકરણ લેટેગરી માટે કોષ્ટકો વિરુદ્ધ આગ્રહ રાખે છે અને શા માટે એચટીએમએલ 4.01 એ તેને નામંજૂર કરે છે. સુલભ વેબ પૃષ્ઠો વધુ લોકોને તેનો ઉપયોગ કરવાની મંજૂરી આપે છે અને વ્યાવસાયિક ડિઝાઇનરનું ચિહ્ન છે.

CSS સાથે, તમે પૃષ્ઠની ડાબી બાજુ પરના ભાગ તરીકે વિભાગને વ્યાખ્યાયિત કરી શકો છો પરંતુ તેને HTML માં સમાપ્ત કરો. પછી સ્ક્રીન વાચકો અને શોધ એન્જિન એકસરખું મહત્વપૂર્ણ ભાગોને (સામગ્રી) પ્રથમ અને ઓછી મહત્વપૂર્ણ ભાગો (સંશોધક) છેલ્લા વાંચશે.

કોષ્ટકો ટ્રીકી છે

જો તમે વેબ એડિટર સાથે કોષ્ટક બનાવો છો, તો પણ તમારા વેબ પૃષ્ઠો હજુ પણ ખૂબ જ જટીલ અને જાળવણી માટે મુશ્કેલ હશે. સૌથી સરળ વેબ પૃષ્ઠ ડિઝાઇન્સ સિવાય, મોટાભાગના લેઆઉટ કોષ્ટકોને ઘણાં અને વિશેષતાઓ અને નેસ્ટેડ કોષ્ટકોનો ઉપયોગ કરવાની જરૂર છે.

તમે તેને કરી રહ્યાં હોવ ત્યારે કોષ્ટકનું નિર્માણ સરળ લાગે શકે છે, પરંતુ તે પછી તમારે તેને જાળવવાની જરૂર છે. રેખા નીચે છ મહિના નીચે યાદ રાખો કે તમે શા માટે કોષ્ટકો નેસ્ટ કરેલ છે અથવા કેટલા કોશિકાઓ હરોળમાં છે અને એટલા માટે સરળ નથી. પ્લસ, જો તમે ટીમના સભ્ય તરીકે વેબ પૃષ્ઠોને જાળવી રાખતા હોવ તો, તમારે દરેક વ્યક્તિને કેવી રીતે કોષ્ટકો કામ કરે છે તે સમજાવવું જોઈએ કે જ્યારે તેઓ ફેરફારો કરવા માટે વધારાના સમય લેશે.

CSS એ જટિલ પણ હોઈ શકે છે, પરંતુ તે પ્રસ્તુતિને HTML થી અલગ રાખે છે અને લાંબા ગાળે જાળવવા માટે તેને વધુ સરળ બનાવે છે. પ્લસ, સીએસએસ લેઆઉટ સાથે તમે એક સીએસએસ ફાઇલ લખી શકો છો, અને તે રીતે જોવા માટે તમારા બધા પૃષ્ઠોને શૈલીમાં મૂકી શકો છો. અને જ્યારે તમે તમારી સાઇટનું લેઆઉટ બદલવા માંગો છો, ત્યારે તમે ફક્ત એક સીએસએસ ફાઇલ અને સમગ્ર સાઇટ chnges ને બદલી શકો છો- લેઆઉટને અપડેટ કરવા માટે કોષ્ટકોને અપડેટ કરવા માટે એક સમયે કોઈ એકથી વધુ નહીં.

કોષ્ટકો અનિવાર્ય છે

જ્યારે ટકાવારી પહોળાઈ સાથે ટેબલ લેઆઉટ્સ બનાવવાનું શક્ય છે, ત્યારે તે ઘણીવાર લોડ થવામાં ધીમા હોય છે અને તમારા લેઆઉટ કેવી રીતે જુએ છે તે નાટ્યાત્મક રીતે બદલાય છે. પરંતુ જો તમે તમારા કોષ્ટકો માટે ચોક્કસ પહોળાઈનો ઉપયોગ કરો છો, તો તમે ખૂબ જ સખત લેઆઉટ સાથે અંત કરો છો જે મોનિટરથી તમારા પોતાનાથી જુદાં જુદાં માપવાળા હોય છે.

ઘણા મોનિટર, બ્રાઉઝર્સ, અને ઠરાવો પર સારી દેખાય તેવા લવચીક લેઆઉટને બનાવવા પ્રમાણમાં સરળ છે. વાસ્તવમાં, CSS મીડિયા ક્વેરીઝ સાથે, તમે વિવિધ કદની સ્ક્રીનો માટે અલગ ડિઝાઇન બનાવી શકો છો.

નેસ્ટેડ કોષ્ટકો જ ડિઝાઇન માટે CSS કરતાં વધુ ધીમેથી લોડ કરો

કોષ્ટકો સાથે ફેન્સી લેઆઉટ બનાવવાની સૌથી સામાન્ય રીત "માળો" કોષ્ટકો છે આનો અર્થ એ છે કે એક (અથવા વધુ) કોષ્ટક બીજામાં મૂકવામાં આવે છે. વધુ કોષ્ટકો જે નેસ્ટ કરવામાં આવે છે, તે લાંબા સમય સુધી વેબ બ્રાઉઝરને પૃષ્ઠ રેન્ડર કરવા માટે લેશે.

મોટા ભાગના કિસ્સાઓમાં, એક ટેબલ લેઆઉટ CSS ડિઝાઇન કરતાં બનાવવા માટે વધુ અક્ષરોનો ઉપયોગ કરે છે. અને ઓછા અક્ષરો ડાઉનલોડ કરવા માટે ઓછું છે.

કોષ્ટકો શોધ એન્જિન ઓપ્ટિમાઇઝેશન હર્ટ કરી શકો છો

સૌથી સામાન્ય કોષ્ટક બનાવેલ લેઆઉટમાં પૃષ્ઠની ડાબી બાજુ અને જમણી બાજુની મુખ્ય સામગ્રી પર એક સંશોધક બાર છે. કોષ્ટકોનો ઉપયોગ કરતી વખતે, આ (સામાન્ય રીતે) એ જરૂરી છે કે HTML માં દર્શાવેલી પ્રથમ સામગ્રી ડાબા હાથની સંશોધક પટ્ટી છે. શોધ એંજીન સામગ્રી પર આધારિત પૃષ્ઠોને વર્ગીકૃત કરે છે, અને ઘણા એન્જિન નિર્ધારિત કરે છે કે પૃષ્ઠની ટોચ પર દર્શાવવામાં આવેલી સામગ્રી અન્ય સામગ્રી કરતા વધુ મહત્વપૂર્ણ છે. તેથી, ડાબેરી નેવિગેશન સાથેનું પ્રથમ પૃષ્ઠ, એવી સામગ્રી દેખાશે જે નેવિગેશન કરતાં ઓછું મહત્વપૂર્ણ છે.

CSS નો ઉપયોગ કરીને, તમે પહેલા તમારા HTML માં મહત્વપૂર્ણ સામગ્રી મૂકી શકો છો અને પછી ડિઝાઇનમાં તેને ક્યાં મૂકવો તે નક્કી કરવા માટે CSS નો ઉપયોગ કરો. આનો અર્થ એ થાય છે કે શોધ એંજીન્સ પ્રથમ મહત્વપૂર્ણ સામગ્રીને જોશે, પછી ભલે તે ડિઝાઇન પૃષ્ઠ પર નીચે આવે.

કોષ્ટકો હંમેશા હંમેશા છાપો નહીં

ઘણા કોષ્ટક ડિઝાઇન સારી રીતે છાપી નથી કારણ કે તેઓ પ્રિન્ટર માટે ખૂબ વિશાળ છે. તેથી, તેમને યોગ્ય બનાવવા માટે, બ્રાઉઝર્સ નીચે કોષ્ટકોને કાપી દેશે અને નીચે વિભાગો છાપે છે જેના પરિણામે ખૂબ જ અસંબદ્ધ પૃષ્ઠો બની શકે છે. કેટલીકવાર તમે તે પૃષ્ઠો સાથે અંત કરો છો જે ઠીક લાગે છે, પરંતુ સમગ્ર જમણી બાજુ ખૂટે છે. અન્ય પૃષ્ઠો વિવિધ શીટ્સ પરના વિભાગોને છાપશે.

CSS સાથે તમે પૃષ્ઠને છાપવા માટે એક અલગ શૈલી શીટ બનાવી શકો છો.

લેઆઉટ માટે કોષ્ટકો HTML 4.01 માં અમાન્ય છે

એચટીએમએલ 4 સ્પેસિફિકેશન જણાવે છે: "કોષ્ટકોને લેઆઉટ ડોક્યુમેન્ટ સામગ્રીના માધ્યમ તરીકે સ્પષ્ટ રીતે વાપરવામાં આવવી જોઈએ નહીં કારણ કે તે બિન-દ્રશ્ય માધ્યમમાં પ્રસ્તુત કરતી વખતે સમસ્યા ઊભી કરી શકે છે."

તેથી, જો તમે માન્ય HTML 4.01 લખવા માંગો છો, તો તમે લેઆઉટ માટે કોષ્ટકો વાપરી શકતા નથી. તમારે કોષ્ટક ડેટા માટે કોષ્ટકોનો ઉપયોગ કરવો જોઈએ. અને ટેબ્યુલર ડેટા સામાન્ય રીતે કોઈ સ્પ્રેડશીટ અથવા કદાચ ડેટાબેઝમાં પ્રદર્શિત થઈ શકે છે તેવું લાગે છે.

પરંતુ HTML5 એ નિયમો બદલ્યો છે અને હવે લેઆઉટ માટે કોષ્ટકો, જ્યારે આગ્રહણીય નથી, હવે માન્ય HTML છે HTML5 સ્પષ્ટીકરણ જણાવે છે: "કોષ્ટકો લેઆઉટ એડ્સ તરીકે ઉપયોગમાં લેવાતા નથી."

કારણ કે સ્ક્રીન વાચકોને અલગ કરવા માટે લેઆઉટ માટે કોષ્ટકો મુશ્કેલ છે, કારણ કે હું ઉપર ઉલ્લેખ કરું છું.

તમારી પૃષ્ઠોને ગોઠવવા અને ગોઠવવા માટે CSS નો ઉપયોગ કરવો એ એકમાત્ર માન્ય HTML 4.01 છે જેનો ઉપયોગ તમે કોષ્ટકો બનાવવા માટે ઉપયોગમાં લેવાતા ડિઝાઇન્સ બનાવવા માટે કરો છો. અને HTML5 આ પદ્ધતિને ખૂબ ભારપૂર્વક આગ્રહ રાખે છે

લેઆઉટ માટેની કોષ્ટકો તમારી જોબ પ્રોસ્પેક્ટ્સને પ્રભાવિત કરી શકે છે

જેમ જેમ વધુ અને વધુ નવા ડિઝાઇનર્સ HTML અને CSS શીખે છે તેમ, કોષ્ટક લેઆઉટ નિર્માણમાં તમારી કુશળતા ઓછી અને ઓછી માંગમાં હશે. હા, એ વાત સાચી છે કે ગ્રાહકો તમને સામાન્ય રીતે તેમના વેબ પૃષ્ઠો બનાવવા માટે તમે ઉપયોગમાં લેવાતી ચોક્કસ તકનીકને નથી જણાતા. પરંતુ તેઓ તમને આ બાબતો માટે પૂછે છે:

• સુલભ વેબપૃષ્ઠ: સ્ક્રીન રીડર્સ દ્વારા જોઈ શકાય તેવા ડિઝાઇન ઘણા દેશો અને કોર્પોરેશનો દ્વારા ફરજિયાત છે, દરેક દિવસ વધુ અને વધુ મહત્વપૂર્ણ ઍક્સેસિબિલિટી શોધે છે.
• જાળવી શકાય તેવા વેબ પૃષ્ઠો: ભવિષ્યમાં તેમને જાળવી રાખવા માટે નહી હોય તો પણ તે તેમની સાથે લઇ શકે તેવા ડિઝાઇન.
• લવચિક ડિઝાઇન: ડિઝાઇન કે જે ઘણા બ્રાઉઝર્સ, ઠરાવો, અને ઉપકરણો પર કામ કરે છે.
• ઝડપી ડાઉનલોડ પૃષ્ઠો: ઝડપ વધુ અને વધુ મહત્વપૂર્ણ બની રહી છે, પણ SEO પર
• છાપવાયોગ્ય ડિઝાઇન્સ: વિશિષ્ટ સ્ક્રિપ્ટો અથવા વધારાની પૃષ્ઠો વિના છાપેલા પૃષ્ઠો.

જો ક્લાઈન્ટ શું માંગે છે તે તમે પહોંચાડી શકતા ન હોય તો, તેઓ ડિઝાઇન્સ માટે તમારી પાસે આવવાથી રોકી શકશે, કદાચ આજે નહીં પરંતુ આગામી વર્ષ અથવા પછીના વર્ષમાં. શું તમે ખરેખર તમારા વ્યવસાયને દુઃખ પહોંચાડવા પરવડી શકો છો કારણ કે તમે 1990 ના દાયકાના અંતથી ઉપયોગમાં લેવાતી તકનીક શીખવા માટે તૈયાર નથી?

નૈતિક: સી.એસ.એસ.નો ઉપયોગ કરવો શીખો

સીએસએસ શીખવા માટે મુશ્કેલ હોઈ શકે છે, પરંતુ યોગ્ય કંઈપણ પ્રયાસ વર્થ છે. તમારી કુશળતાને સ્થિર રાખતા નથી. CSS જાણો અને તમારા વેબપૃષ્ઠોને લેઆઉટ માટે CSS સાથે બિલ્ટ-ઇન બનાવવાના હેતુથી બનાવવામાં આવ્યા છે.