פרסומת

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

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

מבוא לאלמנטים סמנטיים

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

לדוגמה,

פשוט אומר לדפדפן שהוא מכיל פסקה.

, שעליה נדבר רגע, אומר לדפדפן שהוא מכיל את התוכן העיקרי של הדף.

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

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

1.

ה

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

 כל הטקסט בקטע העצמי שלך. 

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

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

תגית. לרוב, הוא ישמש בתוכן הראשי של הדף. אך קחו בחשבון שתוכלו להשתמש בו גם בצורה יצירתית יותר.

2.

קשור באופן הדוק ל

הוא

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

יהיה בפנים

… ימין?

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

למה אתה צריך DAC
הכל נשמע טוב יותר.
כיצד להגדיר DAC
הנה מה שאתה צריך לעשות.. .

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

3.

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

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

כל מה שאתה צריך לדעת על DACs
להלן מבוא שימושי ל- DACs ...
 שאר המאמר שלך כאן.

קטעי כותרות בדרך כלל מכילים לפחות תג כותרת אחד - H1, H2 וכן הלאה. הם לא חייבים, אבל באופן כללי, אם אתה משתמש בתג כותרת, יש הימור טוב שתכלול תוכן כותרת.

4.

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

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

5.

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

זהו תג פשוט באמת - זה כל מה שיש בו. השתמש בו כדי להגדיר את קטע הניווט ואל תשתמש בו שוב בדף שלך.

6.

אחד האלמנטים החדשים והמעניינים ביותר ב- HTML5 הוא הצד. W3 מעניקה לו את ההגדרה מעט לא מועיל של "קצת תוכן מלבד התוכן בו הוא ממוקם."

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

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

לדוגמה, אם כללנו מאמר זה סרגל צד שמספר מידע על ההיסטוריה של HTML5, זה יהיה בצד.

אבל ה

 המאמר המרכזי כאן.  המאמר ממשיך כאן.

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

7.

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

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

לחץ כאן כדי לראות מידע.

הנה מידע מפורט יותר שאינך זקוק לו מייד.

פשוט לחץ על החץ כדי לקבל את הפרטים. פשוט. יצירתו היא קלה באותה המידה. להלן הקוד המשמש לדוגמה לעיל:

 לחץ כאן כדי לראות מידע. 
 להלן מידע מפורט יותר שאתה לא צריך מיד. 

ה

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

יש אחרים דברים מגניבים שאתה יכול לעשות עם HTML 8 אפקטים מגניבים של HTML שכל אחד יכול להוסיף לאתר שלואתה לא צריך לדעת CSS או PHP כדי לבנות אתר מפואר. השתמש בטריקים HTML מגניבים אלה כדי ליצור אפקטים מדהימים. קרא עוד גם אם אתה לא יודע הרבה CSS או JSON.

8-9.

ו

אל תדאג, התג בו השתמשת כבר שנים לא נעלם.

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

אם דמות מוסרת מהדף, זה לא ישפיע על זרימת התוכן.

זה נותן לך דרך מובנית להוסיף כיתוב לתמונות שלך. אין צורך לעבור את ה- CMS שלך.

נצל את הכוח של HTML5

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

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

התחלת להשתמש ב- HTML5? אילו אלמנטים חדשים אתה מוצא הכי שימושי? שתף את מחשבותיך בתגובות למטה!