האם אתה בלוגר? אז תפיק תועלת מהכרת קוד HTML כלשהו

מבולבל לגבי קוד HTML? אתה לא היחיד.


אני אודה בזה. כשהתחלתי לכתוב לאינטרנט ידעתי על זליץ ‘ קוד HTML. ואני אודה בזה שוב. אני עדיין לא יודע הרבה.

עם זאת, מצאתי שקצת ידע HTML יכול להקל על הדברים בהרבה כתיבה לאינטרנט.

ללמוד שפת סימון טקסט היפר

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

רוצה לבטל את הבלבול הזה וללמוד קצת על קידוד HTML? נתחיל.

מהו קוד HTML?

ראית את זה בסביבה, אבל אתה בטח לא יודע מה פירוש כל הג’יבריש הזה ב- HTML.

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

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

זה טקסט מודגש.

בדף זה נראה כך:

זה טקסט מודגש.

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

מדוע טוב לבלוגרים לדעת

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

להלן כמה מצבים בהם באופן אישי מצאתי שזה מועיל:

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

משתמשים בבלוגרים של קודים נפוצים

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

נשמע מבלבל? זה קל יותר אם אני נותן כמה דוגמאות. בואו נסתכל על כמה מתגי HTML הנפוצים שעליכם להכיר כבלוגר.

תגיות שלד

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

עם זאת, טוב לדעת. למשל, האם עבדת אי פעם עם תוכנית שמבקשת ממך להדביק קוד בקטע “ראש” באתר שלך? תוכל למצוא את זה עם קצת ידע ב- HTML. הנה כמה תגי שלד שכדאי לדעת:

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

    : תגית זו מתארת ​​פסקה.

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

זהו טקסט פסקה.

כותרות תגיות

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

יש להשתמש בכותרת 1 לכותרת הראשית של המסמך, כגון כותרת הפוסט בבלוג שלך. כותרת 2 צריכה להיות מידע משני, כגון כותרות המשנה העיקריות שלך. השתמש בכותרת 3 עבור תת-כותרות וכן הלאה דרך כותרת 6. התגים האלה נראים כך:

להלן דוגמה לאופן התרגום שלה:

זו כותרת 5

זו כותרת 5

תגיות טקסט מוטבעות

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

ו

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

תגי רשימה

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

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

    להלן דוגמה כיצד ייראה קוד HTML לרשימה מסודרת:

    1. רשימת פריט 1
    2. רשימת פריט 2
    3. רשימת פריט 3

    כך הוא מופיע בדף:

    1. רשימת פריט 1
    2.  רשימת פריט 2
    3.  רשימת פריט 3

    תגיות תמונה וקישור

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

    קישור

    טקסט העוגן שלך

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

    בואו נראה דוגמא. אם הייתי רוצה לקשר למאמר הקודם של Hosting Kingdom, הקוד היה נראה כך:

    האם עליך לרשום דומיין דרך מארח האינטרנט שלך?

    הקישור יופיע כך בדף:

    האם עליך לרשום דומיין דרך מארח האינטרנט שלך?

    תמונה

    הקוד לתמונה נראה כך:

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

    ”YOUR

    שוב, וודא שאתה לא מסיר את המרכאות.

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

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

    Jeffrey Wilson Administrator
    Sorry! The Author has not filled his profile.
    follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map