Site Navigation - ניווט באתר

תמלול ההרצאה: Site Navigation - ניווט באתר

הטקסט המלא של הדקות הראשונות בהרצאה «Site Navigation - ניווט באתר» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.

1. 00:01

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

2. 00:22

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

3. 00:50

   אני רואה גם שבספורט יש לנו אפילו דף נוסף, פינג פונג. בנוסף יש לנו דף בית, הום פייג', ויש לנו דף Contact Us לצורך יצירת קשר. עכשיו, אם אני אריץ לדוגמה את ה-Home Page, בואו נשים פה Set as Start Page ואז נריץ, ואנחנו הולכים לראות רק דף אחד של ה-Home Page, ובכל דף הגדרתי כותרת שמתארת מה הדף בדיוק, לדוגמה כאן אני רואה

4. 01:23

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

5. 01:44

   אפשר להגיד שהדף המרכזי באתר זה ה-Home Page, וממנו יש שני נושאים, יש לנו את נושא הספורט ויש לנו את נושא החדשות.

6. 01:55

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

7. 02:08

   בנוסף יש לנו דף צור קשר שניתן להגיד שהוא לא קשור לשאר הדפים אבל הוא כן כמובן קשור לאתר שלנו. בשביל להגדיר את הקשרים הלוגיים בין הדפים השונים, וכך אנחנו יכולים אחר כך להגדיר רכיבי תצוגה שיסבירו אותם, אנחנו צריכים להוסיף קובץ מיוחד לאתר שלנו, נקרא site map אז בואו נוסיף עכשיו קובץ add new item ונאתר כאן קובץ שנקרא

8. 02:43

   site map הנה הוא כאן הקובץ הזה צריך להישאר בשם web.site map אנחנו מוסיפים אותו ואנחנו רואים שהקובץ הזה זה קובץ תגיות קובץ הזה נכתב בשפה שנקראת xml שפת xml קיצור של Extensible Markup Language זאת שפת תגיות דומה ל-HTML אנחנו רואים תגית אבל התגיות האלה לא מוכרות על ידי דפדפנים אלא תגיות שמחזיקות מידע שמתארות פריטי אינפורמציה כלשהו כלשהם.

9. 03:21

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

10. 03:54

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

11. 04:25

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

12. 04:44

    url מציין את הנתיב לדף שלנו, או במקרה שלנו בגלל שקובץ ה-web.sitemap והדפים עצמם נמצאים כולם בתיקיית האתר, אותה עתיקייה אז קובץ ה-URL או אטריביוט ה-URL מספיק שיהיה רק שם הדף.

13. 05:04

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

14. 05:30

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

15. 05:45

    אז אנחנו ניקח את התגית המרכזית הזאתי שמתחילה לתאר את הדפים שלנו ונגדיר אותה כאחראית על ה-Homepage.

16. 05:54

    אז כל מה שאנחנו צריכים לעשות זה באטריביוט ה-URL פשוט להגדיר Homepage כמובן ASPX כי אנחנו מתארים פה את הדף עצמו. וכותרת בואו ניתן כותרת בעברית.

17. 06:10

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

18. 06:38

    אז בתוך הומפייג' מבחינה לוגית, מבחינה רעיונית הדפים שקשורים לאתר שלנו הם ספורט, news ו-contact us אז אלה התגיות שאנחנו נגדיר בתוך אז בתוך התגית שמתארת לי את ה-home page יש לנו תגית עבור sports את ה-title ניתן sport יש לנו תגית news עבור דף החדשות ה-title יהיה חדשות ויש

19. 07:23

    לנו תגית עבור contact us וה-title הוא צור קשר אבל בתוך ספורט יש לנו שלושה דפים אחרים יש לנו יש לנו את בסקטבול, יש לנו את פוטבול ויש לנו את פינג פונג.

20. 07:47

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

21. 08:18

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

22. 08:57

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

23. 09:10

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

24. 09:24

    sitemap node ה-url הוא עבור local news, ה-spx, הטייטל הוא חדשות מקומיות, ותגית אחרונה wordnews, והטייטל הוא חדשות מהעולם.

25. 09:56

    כעת סיימנו להגדיר את קובץ web.sitemap.