מאז תחילתו של האינטרנט , HTML כבר חיוני כדי להפוך את העולם רחב עבודה באינטרנט נראה כמו שאנחנו רוצים את זה. בואו נסתכל על מה HTML הוא ואיך זה הופך לדפים שאתה רואה כל יום.
עמוד השדרה של האינטרנט
HTML מייצג שפת "Hypertext Markup". זהו שפת קידוד המשמשת ליצירת דפים שדפדפן אינטרנט יכול להציג. רוב דפי האינטרנט שאתה מוצא באינטרנט, כולל אחד שאתה קורא את המאמר הזה עכשיו, מאוחסנים כקובץ HTML. אתרי אינטרנט הם חבורה של דפי HTML קשורים המאוחסנים בשרת איפשהו. לכן השפה נקראת לעתים קרובות " עמוד השדרה של האינטרנט . "
בכל פעם שאתה הולך לדף באינטרנט, אתה מבקש למעשה קובץ HTML המאוחסן בשרת. לאחר מכן, הדפדפן אתה משתמש, כגון Chrome או Firefox, יהיה לנתח את ה- HTML ולהציג אותו אליך באופן שהוא מיועד.
האוניברסליות והרבתות של HTML להפוך אותו הפופולרי ביותר שפת סימון בעולם. רוב מפתחי האינטרנט הקדמיים מתחילים ללמוד כיצד קוד ב- HTML. כלי גרור ושחרר ועורכי WYSIWYG מתורגמים בסופו של דבר ל- HTML כך שדפדפנים יכולים לנתח אותם.
קָשׁוּר: מהי שפת סימון?
כיצד עובד HTML
כמו כל שפת תכנות, HTML נראה כמו חבורה של פקודות בלוקים טקסט לפני שהוא הפך חזותית מול חזית. אם אתה סקרן לראות מה HTML בדף מסוים נראה כמו ואתה על שולחן עבודה או מחשב נייד, נסה לחיצה ימנית בכל מקום בדף זה ובחר "צפה מקור הדף" (האפשרות עשויה להשתנות בהתאם לדפדפן שלך ). זה אמור לקחת אותך לקיר ענק של קוד.
רוב HTML בנוי באמצעות "בלוקים אלמנטים", אשר קטעי HTML של קוד HTML כי להפריד אלמנטים שונים בדף. לדוגמה, גוף של מאמר זה הוא בלוק אלמנט, כמו גם את התפריט, ההמלצות להלן, ואת כותרת התחתונה של הדף. אלמנטים אלה מקודדים בדרכם שלהם, כפי שהם עשויים להתנהג אחרת.
חלק מכריע של בניית דפי HTML הוא השימוש בגליונות סגנון מדורגים (CSS). אלה הם מסמכים שמגדירים אילו אלמנטים מסוימים של דף צריך להיראות. לדוגמה, כמה תמונות גדולות צריך להיות, מה גופנים צריכים להופיע בדף, ו כיצד דף אינטרנט צריך להגיב כאשר הוא גודלם או מתוח. כל אלה הם כולם קריטיים ליצירת אתרים אטרקטיביים, מלוכדים ומסוגננים. אם אתה שם לב לאתרים המתחילים להיראות טוב יותר בעשור האחרון, השימוש הגובר של CSS הוא הסיבה הגדולה ביותר. אתה יכול לקרוא עוד על CSS פה .
אחד הדברים הטובים ביותר על HTML הוא היכולת שלה להפעיל סקריפטים דינמיים באמצעות JavaScript או JS. סקריפטים אלה יכולים ליצור אלמנטים דינמיים. לדוגמה, באתרי אינטרנט מסוימים, מרחף על תמונה יאפשר לך להתקרב אליו. אתה יכול לעשות את האפקט הזה על ידי קידוד באלמנט JavaScript.
קָשׁוּר: כיצד להשבית (ולאפשר) JavaScript ב - Google Chrome
יסודות HTML.
בעוד HTML היא שפה מורכבת למדי עם טונות של תגים שונים בלוקים, יש כמה קודי HTML שעשויים לבוא שימושי כמו שאתה גלישה באינטרנט. הנה כמה תגי HTML בסיסיים שאתה עלול להיתקל.
& LT; a href = "https://www.howtogeek.com" & GT; כיצד לחנוך & LT; / A & GT;
כיצד לחנוך
אתה משתמש ב
& LT; A & GT;
פקודה כדי ליצור קישור. כתובת האתר היא המקום שבו הקישור יצביע, ואת הטקסט שקורא "כיצד לחנוך" הוא איך זה יופיע למשתמש קצה.
& LT; B & GT; BOLD & LT; / B & GT; & lt; i & gt; italic & lt; / i & gt; & lt; u & gt; קו תחתון & lt; / u & gt;
נוֹעָז נטוי לָשִׂים דָגֵשׁ
אתה יכול להשתמש
& LT; B & GT;
,
& lt; i & gt;
, ו
& lt; u & gt;
כדי להחיל את אפשרויות עיצוב הטקסט הרגיל: מודגש, נטוי וטקסט בקו תחתון.
& LT; IMG SRC = "Picture.jpg" & GT;
ה
& lt; img & gt;
התג משמש להטביע תמונה לדף. זה יהיה למשוך את התמונה מאותו תחום, או שאתה יכול להצביע על זה לתחום חיצוני. ניתן גם להתאים אישית אותו עם כמה תכונות נוספות, כגון שינוי גודל ו Alt טקסט.
& LT; H1 & GT; כותרת 1 & LT; / H1 & GT; & LT; P & GT; פסקה & LT; / P & GT;
האמור לעיל הם תגים ופסקה. בדומה לאופן שבו מילה של Microsoft מאפשרת לך למיין את הטקסט לכותרות וטקסט של גוף, HTML יכול גם לעצב טקסט בהתבסס על כותרת ברירת המחדל ואפשרויות פסקאות. פורמטים אלה מוגדרים באמצעות סגנונות CSS.
& LT; P Style = "צבע: EDR;" & GT; סעיף אדום & LT; / P & GT;
אתה יכול גם להשתמש
"סִגְנוֹן"
התכונה כדי להתאים אישית את הטקסט עם הגדרות סגנון שונים, כגון צבע טקסט, צבע רקע וגודל גופן.
אם אתה מעוניין ללמוד עוד אפשרויות עיצוב HTML, לבדוק את משאבים חופשיים של W3Schools . תמצא רשימה מלאה של תגי HTML שבה תוכל להשתמש כדי להתחיל בבניית דפי האינטרנט שלך.