למה אתה צריך להימנע שולחנות עבור דף אינטרנט פריסות

למידה לכתוב CSS פריסות יכול להיות מסובך, במיוחד אם אתה מכיר את השימוש בטבלאות ליצור פריסות דף אינטרנט מפואר. אבל בעוד HTML5 מאפשר טבלאות פריסה, זה לא רעיון טוב.

שולחנות אינם נגישים

בדומה למנועי החיפוש, רוב קוראי המסך קוראים דפי אינטרנט לפי סדר הופעתם ב- HTML, וטבלאות עשויות להיות קשות מאוד לקוראי המסך לנתח. הסיבה לכך היא שהתוכן בפריסת טבלה, בזמן ליניארי, לא תמיד הגיוני כאשר קוראים משמאל לימין ו מלמעלה למטה. בנוסף, עם טבלאות מקוננות, ואת השורות השונות על התאים השולחן יכול להפוך את הדף קשה מאוד להבין.

זו הסיבה המפרט HTML5 ממליץ נגד טבלאות פריסה ומדוע HTML 4.01 לא מאפשר את זה. דפי אינטרנט נגישים לאפשר יותר אנשים להשתמש בהם והם סימן של מעצב מקצועי.

בעזרת CSS, ניתן להגדיר סעיף כשייך בצד השמאלי של הדף, אך במקום האחרון הוא מופיע ב- HTML. אז הקוראים מסך מנועי החיפוש כאחד יקרא את החלקים החשובים (התוכן) הראשון ואת החלקים פחות חשובים (ניווט) האחרון.

שולחנות הם מסובכים

גם אם אתה יוצר טבלה עם עורך אינטרנט, דפי האינטרנט שלך עדיין יהיה מאוד מסובך וקשה לשמור. מלבד העיצובים הפשוטים ביותר של דפי אינטרנט, רוב טבלאות הפריסה מחייבות שימוש רב בתכונות ובטבלאות מקוננות.

בניית השולחן אולי נראה קל בזמן שאתה עושה את זה, אבל ברגע שזה נעשה אתה צריך לשמור את זה. שישה חודשים לאורך הקו זה לא יכול להיות קל לזכור למה אתה מקונן את השולחנות או כמה תאים היו בשורה וכן הלאה. שלא לדבר, אם אתה שומר על דפי אינטרנט כחבר צוות, אתה צריך להסביר לכל המעורבים איך שולחנות העבודה או לצפות מהם לקחת זמן נוסף כאשר הם צריכים לבצע שינויים.

CSS יכול להיות מסובך גם כן, אבל זה שומר את המצגת בנפרד HTML ו עושה את זה הרבה יותר קל לשמור בטווח הארוך. בנוסף, עם פריסת CSS אתה יכול לכתוב קובץ אחד CSS, ואת הסגנון של כל הדפים שלך כדי להיראות ככה. לאחר מכן, כאשר אתה רוצה לשנות את הפריסה של האתר שלך, אתה פשוט לשנות קובץ CSS אחד, ואת כל האתר משתנה - לא עובר יותר כל דף אחד בכל פעם כדי לעדכן את הטבלאות לעדכן את הפריסה.

טבלאות אינן גמישות

אמנם ניתן ליצור פריסות שולחן עם אחוזי רוחב, הם לעתים קרובות לאט יותר לטעון והוא יכול לשנות באופן דרמטי איך הפריסה שלך נראה. אבל אם אתה משתמש רוחב מסוים עבור הטבלאות שלך, אתה בסופו של דבר עם פריסה נוקשה מאוד זה לא ייראה טוב על צגים בגודל שונה משלך.

יצירת פריסות גמישות שנראות טוב על צגים, דפדפנים, ופתרונות רבים הוא קל יחסית. למעשה, עם שאילתות מדיה CSS, אתה יכול ליצור עיצובים נפרדים עבור מסכי גודל שונים.

לוחות מקוננים לטעון לאט יותר מאשר CSS עבור אותו עיצוב

הדרך הנפוצה ביותר ליצור פריסות מפוארות עם טבלאות היא "קן" טבלאות. משמעות הדבר היא כי אחד (או יותר) השולחן ממוקם בתוך אחר. ככל השולחנות יותר כי הם מקוננים, עוד ייקח עבור דפדפן האינטרנט כדי לעבד את הדף.

ברוב המקרים, פריסת טבלה משתמשת בתווים רבים יותר מאשר בתבנית CSS. פחות תווים פירושו פחות להוריד.

לוחות יכול לפגוע אופטימיזציה למנועי חיפוש

הטבלה הנפוצה ביותר שנוצרה בטבלה כוללת סרגל ניווט בצד שמאל של הדף והתוכן הראשי בצד ימין. בעת שימוש בטבלאות, זה (בדרך כלל) דורש שהתוכן הראשון שמוצג ב- HTML הוא סרגל הניווט השמאלי. מנועי החיפוש מסווגים דפים המבוססים על התוכן, ומנועים רבים קובעים שתוכן המוצג בחלק העליון של הדף חשוב יותר מתוכן אחר. לכן, דף עם ניווט שמאלי ראשון, נראה שיש תוכן שהוא פחות חשוב מאשר ניווט.

באמצעות CSS, אתה יכול לשים את התוכן החשוב הראשון ב- HTML שלך ולאחר מכן להשתמש ב- CSS כדי לקבוע איפה זה צריך להיות ממוקם בעיצוב. משמעות הדבר היא כי מנועי החיפוש יראו את התוכן החשוב הראשון, גם אם העיצוב במקומות זה למטה על הדף.

לוחות לא תמיד הדפסה טוב

עיצובים רבים בטבלה אינם מודפסים היטב מכיוון שהם פשוט רחבים מדי עבור המדפסת. אז, כדי להפוך אותם בכושר, דפדפנים יהיה לחתוך את השולחנות ולהדפיס קטעים להלן וכתוצאה מכך דפי משונה מאוד. לפעמים אתה בסופו של דבר עם דפים שנראים בסדר, אבל כל הצד הימני חסר. עמודים אחרים ידפיסו סעיפים על גיליונות שונים.

עם CSS ניתן ליצור גיליון סגנונות נפרד רק להדפסת הדף.

טבלאות לפריסה אינן חוקיות ב- HTML 4.01

מפרט ה- HTML 4 קובע: "אין להשתמש בטבלאות באופן בלעדי כאמצעי לפריסת תוכן מסמכים, מכיוון שהדבר עלול להוות בעיה בעת עיבוד למדיה לא חזותית".

אז, אם אתה רוצה לכתוב HTML חוקי 4.01, אתה לא יכול להשתמש בטבלאות עבור הפריסה. אתה צריך רק להשתמש בטבלאות נתונים טבלאי, ונתונים טבלאיים בדרך כלל נראה כמו משהו שאתה יכול להציג בגיליון אלקטרוני או אולי מסד נתונים.

עם זאת, HTML5 שינה את הכללים ועכשיו טבלאות הפריסה, בעוד לא מומלץ, נחשבים עכשיו HTML חוקי. מפרט HTML5 קובע: "אין להשתמש בטבלאות כעזרי פריסה". הסיבה לכך היא כי טבלאות הפריסה קשה עבור הקוראים המסך להבדיל, כאמור.

השימוש ב- CSS למיקום ופריסת הדפים שלך הוא הדרך היחידה בתוקף HTML 4.01 כדי לקבל את העיצובים שבהם השתמשת כדי להשתמש בטבלאות כדי ליצור, ו- HTML5 ממליץ על שיטה זו גם כן.

לוחות פריסה יכול להשפיע על סיכויי העבודה שלך

ככל שיותר ויותר מעצבים חדשים לומדים HTML ו- CSS, הכישורים שלך בבניית טבלאות בטבלה יהיו בפחות ופחות ביקוש. כן, נכון שלקוחות בדרך כלל לא מספרים לך את הטכנולוגיה המדויקת שבה אתה צריך להשתמש כדי לבנות את דפי האינטרנט שלהם, אך הם מבקשים דברים כגון:

• דפי אינטרנט נגישים: עיצובים שניתן לצפות בהם על ידי קוראי מסך הם המנדט על ידי מדינות רבות ותאגידים למצוא נגישות יותר ויותר חשוב כל יום.
• דפי אינטרנט הניתנים לשמירה: עיצובים הם יכולים לקחת איתם גם אם אתה לא הולך לשמור אותם בעתיד.
• עיצובים גמישים: עיצובים שפועלים בדפדפנים, החלטות ומכשירים רבים.
• הורדה מהירה של דפים: מהירות הופכת יותר ויותר חשוב, אפילו SEO.
• עיצובים להדפסה: דפים המודפסים ללא סקריפטים מיוחדים או דפים נוספים.

אם אתה לא יכול לספק את מה הלקוחות מבקשים, הם יפסיקו לבוא אליך עיצובים - נקודה. האם אתה באמת להרשות לעצמך לתת לעסק שלך לסבול כי אתה לא מוכן ללמוד ולשלב טכניקה כי כבר בשימוש מאז 1990 בסוף?

מוסר: למד להשתמש CSS

CSS עשוי להיות קשה ללמוד, אבל כל דבר כדאי שווה את המאמץ. אל תשמור על היכולות שלך מפני קיפאון. למד CSS ובנה את דפי האינטרנט שלך כפי שהם נועדו להיבנות - עם CSS לפריסה.