הכשרות וסדנאות עאסי עומר

מושגים מתחום בניית אתרים

מושגים מתחום בניית אתרים

מערכות לניהול תוכן ואתרים
CMS (Content Management System) – בעברית: מערכות לניהול תוכן ואתרים.
מה זה אומר:
זוהי מערכת המיועדת לניהול, עריכה ופרסום תכנים באינטרנט.
במילים פשוטות, מדובר בתוכנה בשפת ה-PHP היושבת על השרת עם שאר קבצי האתר, ושולחת לגולש דפי HTML . דפדפני האינטרנט מסוגלים להציג דפים אלו בצורת האתרים הרגילים המוכרים לכולנו.
מערכות ה-CMS יכולות להיות מבוססות קוד פתוח ; קוד סגור העומד בפני עצמו (בגדול, יעיל יותר בהגנה מפני פריצות), או קוד פתוח שעבר "הסבה" לקוד סגור.

למה אתם פשוט חייבים מערכת כזו באתר שלכם?

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

Drupal – בעברית דרופל (מערכת לניהול תוכן)

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

Joomla – בעברית ג'ומלה (מערכת לניהול תוכן)

מה זה אומר:
ג'ומלה היא מערכת חופשית המאפשרת ניהול תוכן באתרים ופרסומם באינטרנט, אשר נחשבת לאחת משלוש המערכות החינמיות הנפוצות ביותר בעולם לניהול תוכן, לצד וורדפרס ו-דרופל.
Joomla נכתבה בשפת ה-PHP ,כשהמידע שהיא מכילה נשמר בבסיס הנתונים MySQL. היא תומכת במגוון רחב של שפות, וקיימות מעל 10,000 הרחבות רשמיות למערכת, מטעם ג'ומלה עצמה או ממקורות אחרים באינטרנט.
מי משתמש בה?
מקדמי אתרים, אנשי שיווק, מתכנתים, ומעצבי\מנהלי\בוני אתרים רבים משתמשים בג'ומלה לתפעול ותחזוקת אתריהם, ובין היתר גם אנשים פרטיים. היא צברה מעל 2.5 מיליון הורדות בשנה הראשונה של יציאת גרסאת המקור, ועוד כמה מיליונים בהמשך עדכוני התוכנה. היא מותרת לשימוש לכולם וללא עלות.
מה היא מאפשרת:
ניהול מאמרים – יצירתם, פרסומם, עריכתם, ושיוכם לקטגוריות ,חילוק עמודי האתר לחלקים נפרדים.
לדוגמא:
דף המורכב מחלק עליון, חלק תחתון, וחלקים מרכזיים המחולקים ביניהם לתיבות, למשל של תוכן וטופס השארת פרטים, עריכת תבניות מתקדמת המאפשרת את עריכת קבצי ה-HTML וה-CSS של העמודים הרצויים, הוספת הרחבות לתוכנה ותוספים מסוגים שונים – תכנותיים, פנים-אתריים בתוך עורך הטקסט, או תוספי-חוץ שניתן לשלב בחלק הויזואלי של האתר ועוד ועוד.

WordPress – בעברית וורדפרס (מערכת לניהול תוכן)

מה זה אומר:
וורדפרס יצאה לאור בשנת 2003, וכיום היא מערכת ניהול התוכן הפופולרית ביותר בעולם. היא נכתבה בשפת ה-PHP על בסיס מסד הנתונים של MySQL, וממאפייניה העיקריים שהיא מאפשרת פתיחת אתר או בלוג ברמה גבוהה לכל מי שרק ירצה, בחינם ובקלות. ניתן לבנות באמצעותה אתרי תדמית, פורומים, פורטלי חדשות, רשתות חברתיות עצמאיות (!), ועוד.
מי משתמש בה?
25% מהאתרים בכל רחבי הרשת בנויים עליה (אחד מתוך ארבעה!), והיא מתאימה לבלוגים קטנים וגם לפורטלי-ענק.
נתון מעניין נוסף הוא שגם מתוך מיליון האתרים הגדולים בעולם, לא פחות מ- 23% מהם בנויים על WordPress. זה מצביע על כך שהמערכת שלה ממש לא מתאימה רק לאתרים קטנים, והצפי הוא שעד סוף העשור הנוכחי כשליש מהאתרים בעולם ישתמשו בה. (מקור: ויקיפדיה.)
מה היא מאפשרת?
בניית אתר ללא עלות ושליטה על התוכן והמבנה שלו, ועיצובם באופן אישי לפי הצורך – כל זה בצורה שפשוטה ללמידה ולתפעול, ללא הצורך בידע מקדים בשפות התיכנות. ניתן לשלוט באמצעותה על החלק הויזואלי של כל עמוד באתר, ולמקם בו תכנים ופיצ'רים שונים כמו טפסי יצירת קשר, לוח שנה ועוד – הכל בהתאמה אישית ובקלות רבה.

איך זה עובד?

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

wix

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

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

לוויקס יש יותר מ-110 מיליון משתמשים ביותר מ-190 מדינות.

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

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

יתרונות בחנות אינטרנטית בוויקס 

נוחות

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

הפופולריות שלה עוזרת למצוא לא מעט מידע וטיפים ברשת ורוב המשתמשים בה מרוצים.

כל שינוי שתעשו תוכלו לראות כיצד הוא יראה לאחר מכן בחנות.

עיצוב

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

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

ל-Wix יש מערכת תוספים המאפשרת להוסיף תכונות שונות לאתר שלכם כמו למשל מפות, דירוגים או מערכת בסיסית לרשימות דיוור (עם טופס מתאים). 

מחיר

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

העלות החודשית מתחילה ב- 20 דולר לחודש ואין עמלות על מכירה.

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

חברה לבניית אתרים

(נלקח מאתר startingelectronics.org)

DATABASE – בעברית בסיס נתונים

מה זה אומר:
מכירים את הסרטים האלה, שמתחילים במוזיקת מתח קרה ומלחיצה והאקר היושב מול מחשב, בו רצים במהירות כמויות עצומות של מספרים וקודים? אז אפילו אם לא התעסקתם מעולם בתיכנות, עכשיו גם אתם יודעים שמה שרץ על המסך הוא נתונים, הנקראים באנגלית database.
מדובר בעצם במאגר ענק בו נמצא כל מה שדרוש לאחסון, עיבוד וגיבוי כל המידע הקיים במחשב. קיימים מודלים מגוונים לאחסונם, ומערכות רבות לחיפוש ומיון המידע בדרכים שונות.
למה צריך את זה?
כל בסיס הנתונים יושבים כל תוכנה או אתר, ובעצם כל עולם המחשבים. הוא מסייע בשמירתם של אוסף הנתונים שיש צורך בהם לשם תפעולו של המחשב, ומאחסונו ניתן לשלוף פרטי מידע ולהציגם ברשת.
איך זה עובד?
קיימים סוגים רבים של בסיסי נתונים, כשהנפוץ מכולם הוא המודל היחסי. הוא מתבסס על טבלאות, כשכל טבלה מכילה מידע ספציפי וכל שורה בה מתארת התנהגויות של מקרה העומד בפני עצמו. על מנת לזהות לאן שייכת כל שורה, משתמשים במפתח המקורות – באמצעותו ניתן למנוע ממידע מסוים להתפזר ולהיכנס לטבלאות שאינו שייך אליהן.
דוגמאות:
מערכות נפוצות לניהול בסיסי נתונים הם PHPMYADMI, CPANEL, ו- DIRECTADM.
Domain – בעברית: שם מתחם\כתובת אתר.
מה זה אומר:
לכל דף באינטרנט יש דומיין – שזאת כתובת ה-URL המפנה אליו – שיש לבחור ולקנות אותו עוד בשלב הקמתו של האתר. הוא מאפשר לעבור משרת לשרת במקרה הצורך, מבלי לאבד את כתובת האתר ואת כל עבודת הקידום שנעשתה עבורו.
ההבדל בין דומיין לסאב-דומיין:
אתרים יכולים להיות מאוכסנים על דומיינים ראשיים (למשל, site.co.il) או על סאב-דומיינים (למשל, mini-site.site.co.il) – כמו במקרה של בלוגים שנפתחו בפלטפורמה של אתר גדול כולשהו. היתרון בשימוש בדומיין ראשי הוא חוסר התלות ומניעת בעיות בשירות, שהרי סאב-דומיינים לא מאפשרים להתנתק מהאתר הראשי והוא הופך לכבול אליהם עם אותה כתובת.
סוגי הדומיינים:
הכתובות יכולות להיות מורכבות מסיומות שונות. הן יכולות להיות ייעודיות למדינות, כמו co.il לישראל.
באותה מידה, הן יכולות גם להציג את מטרות האתר, כשסיומת "gov" מתאימה לעסקים ממשלתיים, סיומת “org” המתאימה לארגונים, ו-"ac" למוסדות אקדמאיים.
איך לבחור דומיין?
כדאי לבחור בדומיינים קצרים וקליטים, הזהים לשם העסק או לפחות מכילים אותו.
בנוגע לסיומת, אם האתר פונה לקהל יעד בישראל – מומלץ להשתמש ב"co.il", כשסיומת "com" מתאימה לעסקים שהקהל שלהם נמצא בכל העולם.
כמו כן, כדאי לבחור גם בסיומת ייעודית מתאימה, שכן חוסר התאמה יוביל לבלבול והטעייה במהותו ומטרתו של האתר המחזיק בדומיין.
כמו כן מומלץ לרכוש את הכתובת מגורם מקצועי ובעל מוניטין, כזה שאפשר לסמוך עליו שידאג לרישום תקין של הדומיין ולמתן מענה מהיר במקרים של תקלות – אחרת יכול להיגרם נזק בלתי הפיך עד מצב של איבוד הדומיין.

סוגי בבניית אתרים איך לבחור דומיין

(הדומיין של אתר אמזון)

Directory – בעברית תיקייה 

מה זה אומר:
הכוונה לתיקייה, שהיא חלק מהאתר הראשי, והכתובת שלה תיראה כ – www.site.co.il/subdirectory במקרה הנוכחי התיקייה היא חלק אינטגרלי (בלתי נפרד) מהאתר.
זה בשונה מסאב-דומיין, שהוא אתר נפרד מהאתר הראשי והכתובת שלו תיראה כך subdomain.site.co.il.
מה ההבדל בין תיקייה לסאב-דומיין?
אתרים רבים, לרוב כאלה שהם גדולים ובעלי תוכן רב בנושאים מגוונים, נתקלים במהלך תפעול האתר בשאלה האם למקם תוכן מסוים בתיקייה ייעודית או בסאב דומיין נפרד.
בהערכה גסה, כוחו המיתוגי של הסאב דומיין הוא חזק מזה של תיקייה.
גוגל מתייחסת לסאב דומיין כאתר נפרד. מכאן שיהיה קל יותר לקדם אותו, שכן נדמה שזהו אתר שלם בנושא X, ולא תיקייה בנושא X בתוך אתר בתחום Y. החיסרון הוא שלא תמיד זה אפשרי. לדוגמא לא הגיוני שאתר חדשות ייפתח פורטל לימודים על תיקייה של אותה כתובת, שכן הנושאים לא קשורים זה לזה. לכן יהיה עדיף על אותו אתר החדשות למקם את פורטל הלימודים על סאב דומיין.

Firebug
מה זה אומר:
זוהי הרחבה לדפדפן, שכברירת מחדל מתאימה לשימוש רק ב-"פיירפוקס" אך עם התקנת התוסף "Chromebug" ניתן להריץ אותה גם בגוגל כרום. מטרתה לסייע למפתחי, בוני או מעצבי אתרים בניהול תקין של הקודים באתריהם.
מה זה עושה:
ניתן לבצע באמצעות תוכנה זו פעולות מגוונות בפשטות ובמהירות, כמו למשל איתור בעיות ותקלות בהגדרות הקודים ועמודי ה-HTML של האתר. בעזרתו, פעולות שבעבר נחשבו למסובכות ומייגעות הופכות לנגישות ומאפשרות את ביצוען בקלות רבה יותר מבעבר.
איך משתמשים:
לאחר הורדת והתקנת התוכנה, לחיצה אחת על אלמנט מסוים בדף, מאתרת את קודי ה-HTML וה-CSS שלו, מבלי לצאת מהדפדפן. לאחר מכן יופיעו כל הנתונים הדרושים בצורה נוחה בתחתית האתר, כשלחיצה כפולה על האלמנטים תוביל למסך מיוחד המיועד לעריכתם.
Footer – בעברית: סיומת העמוד.
מה זה:
כל אתר מורכב מאלמנטים רוחביים (sitewide) – כאלה החוזרים על עצמם בכל עמוד באתר, וגם מאלמנטים סטטיים – המופיעים בעמוד מסוים או בכמה דפים בודדים לפי הצורך. ה-Footer הוא הכותרת התחתונה שחוזרת בתחתית כל דף באתר, ולכן זהו אלמנט רוחבי.
מטרת הפוטר:
להציג מידע שיהיה רלוונטי לגולש, בלי קשר לעמוד בו הוא נמצא. מטרתו לספק נתונים חיוניים כמו לוגו האתר, טלפון וכתובת העסק, הפניות לעמודים המתאימים ברשתות החברתיות וכדומה. כותרת תחתונה זו משמשת להנגשה נוחה יותר של הניווט באתר והקלתו, וכמו כן מהווה מקום נוסף להחלפת קישורים.
מה כדאי לכלול בפוטר?

בניית אתרים


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

(חלק ה-Footer באתר של "אדידס ישראל")

Frames – בעברית מסגרות

מה זה אומר:
הגדרת תכונה זו מאפשרת לחלק את הדף לכמה קבצי HTML, כלומר לכמה דפים נפרדים שיוצגו על המסך בו זמנית. היא מאפשרת הצגת נתונים שונים – כמו תכנים, סרגלי ניווט ופסי גלילה, תמונות וקישורים ייחודיים – בכל מסגרת. ניתן לבצע בעזרתה גם פעולות מורכבות כמו שליטה ממסגרת אחת על התכנים המוצגים במסגרת אחרת, למשל ע"י ביצוע פעולות מסוימות של הגולש.
אתרים מבוססי FRAME:
אתרים המבוססים על דף מסגרת אחד, הם כאלה שכל התכנים שלהם מתחלפים ע"י דפדוף בתפריט, אך בעצם מוצגים באותו הדף הבודד.
גם אם אתם בניתם את האתר שלכם בעצמם וגם אם לא – חשוב שתדעו כי לא מומלץ בכלל לבנות אתרים מבוססי Frame. הסיבה לכך היא שמנועי החיפוש מתקשים באינדוקסם ובהצגתם בתוצאות החיפוש, ולרוב הם סובלים ממצבים לא רצויים, בהם הקישור בתוצאות החיפוש יוביל לדף המקור במכל מקרה ויציג את המסגרת בלבד.
כמו כן אי אפשר להפנות או ליצור קישורים לאתר כזה, כיוון שהוא בנוי על כתובת אחת בלבד.
מעוניינים לדעת אם האתר שלכם מבוסס FRAME? בידקו אם לכל הדפים בו יש כתובת URL אחת שהיא זהה בכולם. אם כן, אז זוהי גם התשובה.
או במקום או בנוסף (לבחור את ההגדרה המדויקת יותר משניהם):
למה ומתי משתמשים במסגרות?
הסיבה שמגדירים פריימים, היא כדי להקל על טעינת האתר (או הדף הספציפי) ומשתמשים בה כשמעוניינים לסייע לגולש בניווט פשוט ונוח באתר.
הגדרת המסגרות יעילה בעמודים עמוסים, כיוון שהיא מאפשרת את טעינתו של כל חלק בנפרד, ובכך מקלה על תהליך העלאת הדף.
המסגרות יכולות להיות עצמאיות ולפעול ללא תלות אחת בשנייה, או דווקא כן להיות מושפעות זו מזו.
דוגמא:
במידה ואתם מעוניינים ליצור בעמוד סרגל ניווט קבוע, ותוכן המשתנה לפי גלילה – ניתן להשתמש בהגדרת מסגרות לכל חלק. באמצעות שיטה זו תוכלו לשלוט על כך שהסרגל יישאר קבוע, ואילו התוכן המוצג לגולש ישתנה לפי הצורך.

Header – בעברית ראש העמוד

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

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

(חלק ה-Header מסומן באדום, נלקח מאתר "נייק ישראל")

Heading tag – בעברית תגי כותרות

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

מתי ואיך משתמשים:

 ברוב המקרים, ההגדרה נעשית בקובץ ה-HTML  של האתר, כששפת ה-CSS  אחראית על עיצובן.  תגית h1>> היא הגדולה ביותר, ולכן תשמש ככותרת ראשית. כותרות משניות עיקריות יוגדרו בתור <h2> ותת הכותרות שלהן יוגדרו בתור <h3> , וכן הלאה, כשתגית <h6> היא הכותרת הקטנה ביותר האפשרית.

איך זה קשור לקידום בגוגל?

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

Htaccess

מה זה אומר:
קובץ זה קובע למערכות ההרשאה איך עליהן להתנהג במקרים המוגדרים בו. הוא ממוקם בספריית השרת ומאפשר קביעת חוקים שונים עבור גולשים ספציפיים. כמו למשל נתינת גישה (או חסימתה) לעמודים מסוימים, והרשאות או הגבלות כניסה לעמוד לפי הצורך. לדוגמא התניית הגישה לקבצים מסוימים בהזנת סיסמא או קוד אימות כלשהו.
מתי משתמשים:
מבחינת קידום אתרים, הקובץ משמש להאחדת כתובות על מנת למנוע את שכפולן. מגדירים אותו למשל כשמעוניינים לקבוע למי תהיה גישה לתיקיות מסוימות, או איך האתר יגיב לפעולות שונות ויציג לגולשים את הקבצים. אם למשל מעוניינים להתנות גישה לדפים מסוימים באימות ע"י סיסמא, או לקבוע דפי שגיאה כמו 404, 403 וכד' – ניתן לעשות זאת באמצעות קובץ זה.
איך מגדירים:
הקובץ צריך להיקרא ".htaccess", להכיל את הקוד הנחוץ, ולהיות ממוקם בספריית השורש של השרת.

HTML – בעברית שפת היסוד של בניית אתרים

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

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

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

איך ניתן לראות את קוד המקור?
הכוונה לקוד ה-HTML של העמוד בו גולשים. לכל אתר אינטרנט יש קוד כזה – שכל אחד יכול לגשת אליו. כדי למצוא אותו היכנסו לאתר כלשהו ולחצו על תצוגה>>מקור או באנגלית : View >> source .

חברה לבניית אתרים

(נלקח מאתר http://www.sawyoo.com)

IP – בעברית כתובת איי. פי

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

מושגים בבניית אתרים


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

Meta Data – בעברית "מידע אודות המידע"

מה זה אומר:
מקור המילה META בא מיוונית, והפירוש שלה הוא "על", "מעבר", "אחרי" וכד'. הכוונה ב-Meta data היא "מעל הנתונים", או בפירוש הנפוץ יותר "מידע על מידע". כלומר, מידע המתאר את מאפייני הנתונים הקיימים לפריט או משאב מסוים. מידע זה מאוחסן ונשמר במטרה לאפשר את זמינותם ונגישותם הניצחית של כל אותם נתונים.
למה זה משמש?
מטרתו של מידע זה היא לייעל את זיהויים של דפי האינטרנט ע"י מנועי החיפוש וה"רובוטים של גוגל" והוא מאפשר את אחסונם והצגתם של נתונים שונים.
שימושו העיקרי הוא לחיפוש מידע. למשל איתור דפים באינטרנט בעלי כותרת מסוימת, הדפסת קבצים לפי נושאיהם. כמו כן הוא משמש גם למודלים מתקדמים יותר של ניהול מידע בארגונים.
דוגמאות לMeta data:
שיר שהועלה ליוטיוב יכיל את הנתונים הבאים – שם השיר, שם האמן, גודל הקובץ ואיכותו, אורך השיר, וכדומה.
נתוני Meta data של קובץ JPG לעומת זאת, יכילו נתונים כמו זמן צילום התמונה, סוג המצלמה, גודל התמונה המקורי, ועוד.

Meta Description – בעברית תגית תיאור העמוד

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

Meta Keywords – בעברית תגית מילת מפתח

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

בניית אתר

(נלקח מאתר premium.wpmudev.org)

Meta Tag – בעברית תג מטה

*להבין מה זה ואז להשלים*
הוא מונח המתייחס למיקום שאיננו בגוף הדברים, כלומר מעל או מאחורי גוף העניין. "תג" הוא תווית.
באתרי אינטרנט, או ליתר דיוק בדפי אינטרנט, קיים גוף הדף אותו רואה הגולש והוא מכיל טקסטים, גרפיקה, תמונות וכדומה. מאחורי דף האינטרנט, נמצא קוד ה HTML ( Hyper Text Markup Language ) שהיא השפה ליצירה ועיצוב עמודי אינטרנט ונקרא גם מקור הדף. בגלישה רגילה הגולש אינו רואה את קוד המקור. תגיות המטה נמצאות איפה מאחורי דף האינטרנט ומשמשות את מנועי החיפוש לצרכים שונים.
meta title – בעברית: כותרת העמוד.
מה זה אומר:
תגית זו מתארת את תוכן העמוד ע"י כותרת המוצגת בתוצאות החיפוש כשדף מסוים מופיע בהן, והיא ממוקמת מעל התיאור.
למה צריך אותה?
הגדרת תגית meta title עוזרת למנועי החיפוש להבין מהו התוכן העיקרי באותו דף. שימו לב שהכותרת שתוגדר תופיע גם בחלק העליון ביותר של שורת הדפדפן.
כמו כן, היא מהווה את אחד הגורמים המכריעים ביותר בהחלטתו של הגולש אם להיכנס דווקא לאתר שלכם, או לאחד אחר מתשעת האתרים המופיעים איתכם באותו עמוד תוצאות.
איך מגדירים כותרת טובה?
יש להגדיר אותה בכמה מילים, שיתארו את אותו עמוד בצורה כמה שיותר מדויקת ומעניינת. כמו כן, אם מדובר בכותרת דף הבית, עליה להסביר את מהות האתר בצורה הטובה ביותר ורצוי שתכיל גם את שם העסק.

 Nofollow בעברית קישור שאינו למעקב

מה זה אומר:
מדובר בתכונה שניתן להוסיף לכל סוגי הקישורים. מגדירים אותה בקוד ה-HTML של העמוד והיא אינה נראית לגולשים. מטרתה לגרום לגוגל לא לייחס לקישורים האלה שום חשיבות מבחינת קידום אתרים. זאת בעצם הוראה למנועי החיפוש לא "לעקוב" אחר הלינקים המוגדרים.
מתי משתמשים?
פעמים רבות קורה שנרצה לקשר לעמודים מסוימים באתר שלנו, אך לא נרצה שגוגל תיקבע להם משמעות מסוימת בקידומם. למשל, כשמקשרים לדף ה-"צור קשר" אך לא מעוניינים לחזק אותו – ניתן להוסיף לקישור מאפיין זה וכך הוא לא ייפגע ולא יועיל לקידום העמוד.
ניתן להעזר בקישורי Nofollow גם לניצול יעיל של ה-Link juice, לדוגמא כשמגיבים בפורומים או כשבונים קישורים שהם חסרי ערך לקידום או שאפילו עלולים להזיק לו אם יוגדרו בתור Dofollow.

Noindex – בעברית: דפים שאינם לאינדוקס

מה זה אומר:
ע"י הגדרת תג noindex‏ בקוד ה-HTML של העמוד, אנו בעצם מנחים את גוגל ומנועי החיפש שיסירו את אותו דף בצורה מוחלטת מתוצאות החיפוש (אפילו אם אתרים אחרים מקשרים אליו). זוהי שיטה שימושית ויעילה במידה ואין לכם גישה לספריית השורש של השרת, כיוון שהיא מאפשרת שליטה מלאה ונפרדת על כל דף באתר.
איך ואיפה מגדירים?
בחלק ה-של קוד ה-HTML .הגדרת " robots" בmeta name – תנחה את רוב מנועי החיפוש במניעת ההוספה של אותו דף לאינדקס שלהן. לעומת זאת, הגדרת "googlebot" באותו סעיף תהיה תקפה אך ורק על הזחלנים של גוגל ותנחה אותם בלבד. זה ראוי לציון כי ההגדרה הזאת לא מבטלת את הצגת הדף בתוצאות של מנועי חיפוש אחרים.

Server – בעברית שרת

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

Themes  – בעברית ערכות לעיצוב אתר

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

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

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

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

URL – בעברית כתובת הקישור

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

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

חברה לקידום ובניית אתרים

(נלקח מאתר www.dyclassroom.com)

להגיב

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