מדריך HTML בסיסי

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

והכל מתחיל מהבסיס שהוא HTML .

אז מה זה בעצם HTML ?

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

תגיות HTML

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

<h1/>תיסגר בתגית<h1>

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

מבנה דף של HTML

מבנה דף בסיסי של HTML מחולק ל2 חלקים:

<head> -ו <body>

  • האזור העליון של המסמך (ראש המסמך) נקרא head. אזור זה יהיה תחום עם תגית.

  באזור זה נכתוב את כל ההגדרות שיאפיינו את המסמך.

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

כך נראה מבנה מסמך HTML –

אנחנו נשתמש באתר CODEPEN כדי להראות במדריכים שלנו את כל הקוד. 

 

See the Pen gzmdXv by henry (@superwebdigital) on CodePen.

תגית ה<DOCTYPE html!> מגדירה את המסמך כמסמך מסוג HTML

תגית ה<html>- היא התגית הפותחת ולכן מה שיהיה בין התגית הזו לתגית הסוגרת שלה יהיה בשפת HTML .

תגית ה <head>- מגדירה את ראש המסמך– מה שנכתוב בין התגית הזו לתגית הסוגרת שלה יהיו ההגדרות שיאפיינו את המסמך.

תגית <title>- מגדירה את כותרת המסמך– מה שאנחנו רואים בעצם בלשוניות של הדפדפן למעלה . ולכן מה שיהיה כתוב בינה ולבין התגית הסוגרת שלה יהיה הכותרת של הדף .

תגית <body>- כל מה שיהיה כתוב בין התגית הזו לתגית הסוגרת שלה יהיה התוכן שאליו ייחשף הגולש.

תגית <h1>- כל מה שיהיה כתוב בין התגית הזו לתגית הסוגרת תראה לגולש את הכותרת של המסמך– ובמקרה הזה "מדריך html למתחילים"

תגית <p>- כל מה שיהיה כתוב בין התגית הזו לתגית הסוגרת תראה לגולש פסקה (תוכן).

סיכום HTML בסיסי

אז למדנו איך נראה דף אינטרנט בסיסי 

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

אשמח לשמוע ממכם בתגובות מה אתם חושבים ואשמח לענות על כל שאלה ! 

למאמר הבא לחצו כאן 

Facebook
Google+
Twitter
LinkedIn
ספאמר בוורדפרס
טיפול בתגובות ספאם בוורדפרס

אם אתם משתמשים ותיקים בוורדפס כבר למדתם להכיר את תגובות הזבל שמקבלים באתר – רוב אתרי הוורדפרס מלאים בטפסים ובתגובות בצורה שלבוט קל מאוד לסרוק,

קרא עוד »
מה זה תבנית בת בוורדפרס
יצירת תבנית בת בוורדפרס

מה זה תבניות בת ואיך עושים אותן תבנית בת בוורדפרס (Child Themes) במאמרים הקודמים הסברנו על תבנית וורדפרס ומה היא יכולה לעשות ולמרות זאת יש

קרא עוד »
עריכת קבצי וורדפרס
עריכת קבצי וורדפרס

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

קרא עוד »
לוגו וורדפרס
מדריך וורדפרס למתחילים חלק ב

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

קרא עוד »
לוגו וורדפרס
מדריך וורדפרס למתחילים

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

קרא עוד »
html-super-web