אחד התגים כי תלמד מוקדם בחינוך שלך עיצוב אתרים הוא זוג תגים הידועים בשם "תגי דגש". בואו נסתכל על מה התגים האלה וכיצד הם משמשים עיצוב אתרים היום.
חזרה ל- XHTML
אם למדת HTML לפני שנים, הרבה לפני עליית HTML5, אתה כנראה השתמשו הן את התגים מודגש ונטוי. כפי שהיית מצפה, תגים אלה הפכו אלמנטים לתוך טקסט מודגש או טקסט נטוי בהתאמה. הבעיה עם התגים האלה, ומדוע הם נדחקו הצדה לטובת אלמנטים חדשים (אשר נתבונן בהם בקרוב), היא שהם אינם מרכיבים סמנטיים. הסיבה לכך היא שהם מגדירים כיצד הטקסט צריך להיראות ולא מידע על הטקסט. זכור, HTML (שבו תגים אלה יהיה כתוב) הוא הכל על מבנה, לא סגנון חזותי! חזותיים מטופלים על ידי CSS ועיצוב אתרים שיטות עבודה מומלצות יש זמן רב כי אתה צריך הפרדה ברורה של סגנון ומבנה דפי האינטרנט שלך. משמעות הדבר היא לא באמצעות אלמנטים שאינם סמנטיים ואיזה פרט נראה ולא מבנה. זו הסיבה התגים מודגש ונטוי הוחלפו בדרך כלל על ידי חזק (עבור מודגש) ואת הדגש (עבור נטוי).
& lt; strong & gt; & lt; em & gt;
האלמנטים החזקים והדגש מוסיפים מידע לטקסט שלך, המפרט תוכן שיש לטפל בו באופן שונה ומדגיש את התוכן המדובר. אתה משתמש באלמנטים האלה פחות או יותר באותו אופן שבו היית משתמש מודגש ונטוי בעבר. פשוט הקף את הטקסט שלך עם תגי הפתיחה והסגירה ( ו- עבור הדגשה ו ו- להדגשה חזקה) והטקסט המצורף יודגש.
אתה יכול לקנן את התגים האלה וזה לא משנה איזה תג חיצוני. הנה כמה דוגמאות.
טקסט זה מודגש , ורוב הדפדפנים יציגו אותו כסימנים נטויים. טקסט זה מודגש מאוד , ורוב הדפדפנים יציגו אותו כסוג מודגש.בשתי הדוגמאות הללו, אנחנו לא מכתיבים מראה חזותי עם HTML. כן, מראה ברירת המחדל של התג יהיה נטוי, ואילו יהיה מודגש, אך ניתן יהיה לשנות בקלות את המבטים האלה ב- CSS. זה הטוב משני העולמות. ניתן למנף את סגנונות הדפדפן המוגדרים כברירת מחדל כדי לקבל טקסט נטוי או מודגש במסמך מבלי לחצות את הקו ואת מבנה הסגנונות והסגנון. נניח שרצית ש- טקסט לא רק להיות מודגש, אלא גם לאדום, תוכל להוסיף אותו ל- CSS
חזק {
צבע אדום;
}
בדוגמה זו, אינך צריך להוסיף מאפיין עבור משקל הגופן המודגש, מכיוון שזו ברירת המחדל. אם אתה לא רוצה להשאיר את זה סיכוי, עם זאת, אתה תמיד יכול להוסיף אותו:
חזק {
מודגש;
צבע אדום;
}
עכשיו יהיה לך כמעט כל מובטחת יש דף עם טקסט מודגש (ואדום) בכל מקום שבו תג משמש.
דגש על הדגש
דבר אחד שמתי לב במהלך השנה הוא מה קורה אם אתה מנסה להכפיל את הדגש. לדוגמה:
טקסט זה אמור לכלול גם טקסט מודגש ו / או בתוכו.הייתם חושבים כי קו זה יפיק אזור שיש בו טקסט מודגש ונטוי. לפעמים זה קורה באמת, אבל ראיתי כמה דפדפנים מכבדים רק את השני של שני סגנונות הדגש, הקרוב ביותר לטקסט בפועל המדובר, ורק להציג את זה כמו נטוי. זוהי אחת הסיבות מדוע אני לא להכפיל על תגי דגש.
סיבה נוספת להימנע זה "הכפלת" הוא למטרות סגנוניות. צורה אחת של דגש אם בדרך כלל מספיק כדי להעביר את הטון שאתה רוצה להגדיר. אתה לא צריך מודגש, italicize, צבע, להגדיל, ואת הטקסט הדגיש כדי שזה יתבלט. טקסט זה, יהיה כל אלה סוגים שונים של דגש, יהפוך להיות עסיסי. אז תיזהר בעת שימוש בתגיות דגש או סגנונות CSS כדי לספק דגש לא להגזים.
הערה על מודגש ו נטוי
מחשבה אחרונה אחת - בעוד שהתגיות הנועזות () והאיטלקיות () אינן מומלצות עוד לשימוש כאלמנטים של דגש, ישנם מעצבי אתרים המשתמשים בתגים אלו כדי לסווג את האזורים הטבועים בטקסט. ביסודו של דבר, הם משתמשים בו כמו אלמנט . זה נחמד כי התגים הם קצרים מאוד, אבל באמצעות אלמנטים אלה בדרך זו לא מומלץ בדרך כלל. אני מזכיר את זה במקרה שאתה רואה את זה שם על כמה אתרים בשימוש לא כדי ליצור טקסט מודגש או italicized, אבל כדי ליצור וו CSS עבור סוג אחר של סגנון ויזואלי.
מאמר מקורי מאת ג'ניפר קרינין. בעריכת ג'רמי ג'ירארד ב 12/2/16.