הסבר על DTD

HTML

שישי, 05 פברואר 2010 12:25

DTD

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

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

 <html> <head>Header Data</head> <body>Visible Content</body> </html>

הנ"ל קרוב לוודאי יהיה מאוד מוכר לכם. בתקווה, אתם תהיו מודעים למאות התגיות האחרות אשר זמינות לשימוש. אבל האם ידעתם שהקוד הבא יכול להיות גם נכון וגם לא נכון?‏

<P align="center">Text here</P>

ב - ‏XHTML‏, שהוא תלוי רשיות (רגיש להבדל בין אותיות גדולות וקטנות), הקוד מעל אינו ברור, תגית שאינה מובנת. ב - ‏HTML‏, זוהי פיסקה ממורכזת.‏

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

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

DTD‏ נוצר משני חלקים, ונראה כמו זה:‏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

הנ"ל הוא ‏DTD‏ ל – ‏XHTML 1.1‎‏. למספר שפות יש ווריאציות שונות (למשל, ‏HTML‏ יכול להיות ‏Strict‏ (לכתיבה נכונה ומדויקת של דפים), ‏Transitional‏ (לדפים עם תגיות מגוונות או שאינן כתובות עם קוד מושלם), או ‏Frameset‏ (לדפים עם ‏Frames‏)), ואחרות, כמו ‏XHTML 1.1‎‏ ללא. לכל אחת מהווריאציות האלה יהיה ‏DTD‏ משלה גם כן. חלקן דורשות אותיות גדולות ב - "‏HTML‏" וחלקן אותיות קטנות. כל אחת מהן יכולה להימצא באתר של ‏W3C‏, ורשימה קצרה של היותר שכיחות נכללו בדף הבא.‏

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en">

זה קשה להוסיף ‏DTD‏ לאחר שהעמוד נכתב, במיוחד אם אתם משתמשים ב‏CSS‏ להצגת מראה ותבנית. כאשר דפדפן יוצא מ"‏Quirks Mode‏" ומציג את הדף נכון, מרבית ה - ‏Positions‏, ‏Margin ‎‏ ו – ‏Padding ‎‏ (מאפייני תגית מעוצבת בתוך מסמך ‏CSS‏), עשויים להיראות בצורה שגויה.
‏
אם תרצו להוסיף ‏DTD‏ לדף שכבר נכתב, אתם הולכים להיתקל במספר בעיות. זאת עובדה. זה לא עושה את זה פחות כדאי להוסיף אחד. בנוסף לכל, אתם יכולים להיות בטוחים שתזכרו להוסיף אותו ראשון באתר הבא שתכתבו. אתם תעדיפו ללכת על ‏DTD‏ "‏Transitional‏", שמאפשר לכם גמישות יחסית (‏Transitional DTD‏ היא שפה המאפשרת תגיות שעברו זמנן, כמו "<‏b‏>", ובאופן יחסי וותרנית, בשונה מהשפות הנוקשות).‏

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

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

XHTML 1.1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

XHTML 1.0 Strict

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML 1.0 Transitional

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML 1.0 Frameset

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

HTML 4.01 Strict

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

HTML 4.01 Transitional

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

HTML 4.01 Frameset

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

HTML 3.2

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

HTML 2.0

<!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN">

Original Article

עדכון אחרון ב-שני, 19 אפריל 2010 13:08

תגובות

#2 UMAN_TRAVEL 19-07-2011 11:46

תודה רבה על ההסבר, אתה יכול לאמר לי מה ההבדל בין הגרסאות השונות של html 4.01?
תודה אומן

צטט

#1 אבנר 18-06-2010 14:08

למדתי! תודה :)

צטט

רענן רשימת תגובות
עדכוני RSS לתגובות הפוסט הזה

הוסף תגובה

JComments

תגובות

הוסף תגובה

בואו שתפו חברים...

תגובות אחרונות

טוויטים על עבודה מהבית

בלוגרים מהצד

הטוויט שלי

הכי נצפים

קטגוריות

מי זה שיקו?