אף פעם אל תקנן טבלאות
הדבר הברור ביותר שמאט אתרים הוא השימוש בטבלאות "מקוננות": הכנסת הטבלאות לתוך
תאים בטבלאות אחרות. בגלל שהדפדפן חייב לעבוד מבפנים החוצה - הערכת גודל הטבלה
הפנימית תיקרה לפני שמבנה הטבלה החיצונית יחושב - טבלאות מקוננות גורמות לזמן ביצוע
מגעיל.
כך שכדאי להימנע מטבלאות מקוננות עד כמה שאפשר, אפילו אם זה אומר שצריך לעשות
שנויים קטנים בפריסה של העמוד. אם אתה חייב להשתמש בטבלאות מקוננות לפחות תעשה
אותן פשוטות עד כמה שאפשר, ואף פעם - לעולם - אל תשתמש בשלוש רמות עומק- כלומר,
טבלה בתוך טבלה בתוך טבלה. אנחנו בונים פה אתרים, לא את הבובות הרוסיות הקטנות
האלו.
אלא אם כן...
טבלאות מקוננות: הטאבו האולטימטיבי!. טוב, טבלה פשוטה בתוך טבלה פשוטה בתוך טבלה
פשוטה (במילה "פשוטה" הכוונה שאני מגדיר רק טור אחד או שניים ותא אחד או שניים)
מתורגמת לשורות קוד מעטות, מה שיכול להיות קל יותר לדפדפן לקרוא מאשר טבלה
מסובכת מאוד.
.This is not that big a deal |
|
|
קומפוזיצית שולחן השח הזו לא מערבת טבלאות בקן, אבל הסיבוך שלה אומר שזמן הביצוע
איטי.
על ידי שימוש בטבלאות מקוננות, החלק הפשוט של הקומפוזיציה מופרד מהחלק המסובך של
השח. התוצאה הסופית דומה, אבל טבלת השח המסובכת לא מפריעה לביצוע של ההעתקה
הקלה הזו.
המפתח לטבלאות הוא למצוא את הדרך החסכנית ביותר לארגן אותן. לפעמים טבלאות
מקוננות הן באמת התשובה, ולפעמים לא.
מבנה טוב יותר, דף מהיר יותר
למטה יש דוגמה של עמוד אתר טיפוסי: המותג למעלה, הניווט בתחתית צד שמאל, והתוכן
ביתר העמוד. זה גם טיפוסי שעמוד כזה יושג על ידי יצירת טבלה גדולה שמגדירה את כל
הסורג. עם טבלאות המותג, הניווט והתוכן בקינון בתוך טבלת המסגרת, זה יהפוך לדף קשה
מאוד להעלאה על ידי הדפדפן.
Branding
|
|
.nav
|
|
content content
content content
content content
content content
content content
content content
content content |
|
הנה אותו מבנה עמוד, רק שהפעם המותג, הניווט והתוכן מוגדרים כטבלאות עצמאיות
(האפור מייצג את הדף עצמו).
Branding
|
|
align= left
.nav
|
|
content content
content content
content content
content content
content content
content content
content content |
|
על ידי יצירת טבלאות נפרדות ועצמאיות, הדפדפן יכול להעלות כל אלמנט ברגע שהוא מסיים
לקרוא אותו. כך שהאלמנטים הראשונים של העמוד מופיעים מהר יותר והגולש יכול לנצל את
מה שמופיע למעלה מייד.
בדוגמה השנייה שלמעלה, טבלת המותג עולה ראשונה על העמוד, ובעקבותיה טבלת הניווט.
ומכיוון שקבענו את מיקום טבלת הניווט ל"שמאל", התוכן עולה אחריה, מותאם לימין. הדף
כולו עולה במהירות ולגולש יש משהו לראות ולהשתמש בו כמעט מייד.
כך שכמו עם תמונות, בכדי להגיע לתוצאות הטובות ביותר עם הטבלאות שלך, אתה צריך
לשחק קצת עם מגוון פתרונות עד שתקבל את הפרישה שגם אתה וגם הגולשים שלך יכולים
להסתדר איתה. זה אולי נראה כמו מאמץ גדול מדי רק בכדי לחסוך כמה שניות מזמן ההורדה
של עמוד, אבל ככל שהתחרות על הגולשים גדלה, השניות האלו יכולות להיות מה שיעמוד בין
המבקרים שלך וכפתור ה"אחורה" (BACK).
|