בקשה | עזרה בתיכנות | כללי

[מוטי אורן]

@שיהיה אמר בבקשה | עזרה בתיכנות | כללי:

@מתכנת-חובב

את זה הכנסתי, ככה אומרים לפי האתר של @מוטי-אורן ..

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

[שיהיה]

@מוטי-אורן מה זאת אומרת נתיב יחסי/מוחלט ?
לא הבנתי מהם

[מוטי אורן]

@שיהיה נתיב יחסי זה אומר שאתה נותן נתיב שהוא יחסית למיקום שהדף נמצא בו כרגע. כלומר, אם האתר שלך נמצא תחת דומיין של www.shtuyot.com לצורך הענין ואתה רוצה לתת קישור לתמונה שנמצאת על אותו שרת, אתה לא תתן את הקישור ככה: www.shtuyot.com/images/tucki.jpg, אלא פשוט תתן את המיקום יחסית למיקום שהדף נמצא בו ככה: images/tucki.jpg/. ומיקום אבסולוטי (מוחלט) פירושו שאתה נותן את המיקום של תמונה שנמצאת לצורך הענין בשרת אחר, ואז לא תוכל לכתוב מיקום יחסי (כמו במקרה שלך), אלא אתה צריך לכתוב את כל הקישור המלא לאותה תמונה.
ואם כבר, אני יראה לך שהם כן מדברים על זה באתר שם בקישור הבא: https://www.w3schools.com/html/html_filepaths.asp
שם הם מפרטים על זה כמו שצריך.

[AVI KLAINE]

@מוטי-אורן אמר בבקשה | עזרה בתיכנות | כללי:

אתה צודק לגמרי. התכונה alt לא הכרחית.

לא מומלץ לדלג על התכונה alt (טקסט קצר לתיאור התמונה).זה אחד מהדברים שגוגל מתגמלת או מענישה עליהם .
משני סיבות 1. בעיקרון זה נועד לנוחות המשתמשים במקרה שהתמונה לא מופיעה , למשל תמונה לא קיימת ,דפדפן לא תומך , בעיות ברשת . שידעו מה היה אמור להופיע וגול כמובן דואגת למשתמשים.
2. גוגל צריכה את התיאור בשביל יצירת האינדקס שלה . זה אחד הדברים שגורמים ל חיפוש גוגל לפי תמונה להיות אפשרי .
alt ניתן לכתוב בעברית.
תכונה נוספת שכדאי להשתמש הרבה פעמים בתמונות היא title
""=title תכונה זו עושה שכשיעמדו על התמונה עם העכבר יופיע בלון צף קטן כזה

ובו הכיתוב שבין הגרשיים , הכיתוב נועד לתאר את התמונה או לתת קרדיט למקור התמונה (שימוש נפוץ)

[AVI KLAINE]

@שיהיה אמר בבקשה | עזרה בתיכנות | כללי:

@avi-klaine סימן קריאה ואנטר עזר לזה..

@מוטי-אורן אמר בבקשה | עזרה בתיכנות | כללי:

@avi-klaine אמר בבקשה | עזרה בתיכנות | כללי:

סימן קריאה ואז לחיצה על Tab נותנת את הקיצור דרך המבוקש

אפשר Tab ואפשר גם אנטר. לא באמת משנה.

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

[מוטי אורן]

@avi-klaine אמר בבקשה | עזרה בתיכנות | כללי:

לא מומלץ לדלג על התכונה alt

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

[AVI KLAINE]

@שיהיה אמר בבקשה | עזרה בתיכנות | כללי:

@מוטי-אורן מה זאת אומרת נתיב יחסי/מוחלט ?
לא הבנתי מהם

הכלל הוא אם התמונה נמצאת באותה תיקיה עם קובץ ה HTML שלך , פשוט כתוב את שם התמונה המלא והמדויק כולל סיומת . אם היא נמצאת במיקום אחר לגמרי אין ברירה אלא לכתוב את הנתיב המלא
אם היא נמצאת בסמיכות לקובץ שלך אך לא באותה תיקיה עליך לנווט .
.. כתיבת נקודה פעמיים ברציפות משמעותה חזור תיקיה אחת אחורה,
ובכל פעם שברצונך להכנס לתקייה שים /
למשל : אם פתחת תיקיה בשביל הפרויקט שלך ובה שני תיקיות files בה קובץ ה-HTML ו-images בה התמונה שלך
בכדי לנווט לתמונה , עליך לחזור תיקיה אחת אחורה לתיקיה הראשית ושם להכנס ל-images
הנתיב א''כ יראה בערך כך : <img src="../images/YourImg.png">

שים לב: אם תצרף את כל התיקיה שלך ל- vs ע''י לחיצה על File > Open folder אמור ליהות לך השלמה אוטומטית לשמות התיקיות והקבצים שלך.

[AVI KLAINE]

@מוטי-אורן אמר בבקשה | עזרה בתיכנות | כללי:

@avi-klaine אמר בבקשה | עזרה בתיכנות | כללי:

לא מומלץ לדלג על התכונה alt

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

צודק .
ראיתי ששאל על alt אז כבר עניתי לו מה זה ולמה זה .

נ''ב : תודה לכולם על הלייקים עכשיו אוכל גם אני להשיב לכם .

[AVI KLAINE]

@שיהיה אמר בבקשה | עזרה בתיכנות | כללי:

@avi-klaine יש לך מושג איך אני עושה הטמעת תמונה כמו זה:

אני פושט כותב IMG PARROT לדוגמא, ויוצא לי תמונה של תוכי??

דרך אגב יש משהו דומה למה שרצית עיין כאן
שאם תייבא את ערכת הסמלים של Font Awesome לפרויקט/קובץ שלך
תוכל לכתוב <i class='fas fa-crow'></i> ותקבל תמונה כזו (זה עורב ולא תוכי אני יודע שחשוב לך דוקא תוכי , מה לעשות ? זה מה מצאתי )
זה לא תמונות אלו סמלים כמו אלו שיש כאן בפורום הנהדר הזה
המעלה היא שניתן לשחק להם ב-style לשנות להם צבע וגודל .
אז למרות שזה לא תמונות זה מזכיר את מה שבקשת כי אתה פשוט כותב את שם הסמל שתרצה כמו clockבשביל שעון ו-search בשביל זכוכית מגדלת וכ'ו עיין ברשימה המלאה

[שיהיה]

@avi-klaine חשבתי שtitle זה כותרת?

@avi-klaine אמר בבקשה | עזרה בתיכנות | כללי:

@שיהיה אמר בבקשה | עזרה בתיכנות | כללי:

@avi-klaine  יש לך מושג איך אני עושה הטמעת תמונה כמו זה:

אני פושט כותב IMG PARROT לדוגמא, ויוצא לי תמונה של תוכי??

[(זה עורב ולא תוכי אני יודע שחשוב לך דוקא תוכי , מה לעשות ? זה מה מצאתי )]*

זה היה רק דוגמא...

:::

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

:::

[sara21]

@שיהיה ממש לא! צריך להדביק קישור (מקוון או כתובת נתיב של תמונה)

[שיהיה]

@sara21 הבנתי אבל מוזר שזה מה שכתבו לעשות וזה גם עובד. (רואים סימון של תמונה)

[שיהיה]

"יחסית - קישורים לתמונה שמתארחת בתוך האתר. כאן, כתובת האתר אינה כוללת את שם הדומיין. אם כתובת האתר מתחילה ללא קו נטוי, היא תהיה יחסית לדף הנוכחי. דוגמה: src = "img_girl.jpg". אם כתובת האתר מתחילה עם קו נטוי, היא תהיה יחסית לדומיין. דוגמה: src = "/ images / img_girl.jpg".

מישהו מוכן להסביר לי את המשפט הזה??

[sara21]

@שיהיה נכון כי יש אפשרות להוסיף כיתוב שיהיה עד שתטען התמונה ואז מופיע סמל של תמונה וכיתוב שאומר מה היה אמור להופיע תמונה

[AVI KLAINE]

@שיהיה אמר בבקשה | עזרה בתיכנות | כללי:

@avi-klaine חשבתי שtitle זה כותרת?

• יש את האלמנט title שמופיע ב-head הוא משמש לשני דברים

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

• ויש את התכונה title שהיא תכונה של האלמנט img ואולי גם עוד אלמנטים

[AVI KLAINE]

) @שיהיה אמר בבקשה | עזרה בתיכנות | כללי:

"יחסית - קישורים לתמונה שמתארחת בתוך האתר. כאן, כתובת האתר אינה כוללת את שם הדומיין. אם כתובת האתר מתחילה ללא קו נטוי, היא תהיה יחסית לדף הנוכחי. דוגמה: src = "img_girl.jpg". אם כתובת האתר מתחילה עם קו נטוי, היא תהיה יחסית לדומיין. דוגמה: src = "/ images / img_girl.jpg".
מישהו מוכן להסביר לי את המשפט הזה??

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

מה שהבאת

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

אתה יכול לראות גם כאן
ב-w3schools הם מתמצתים את זה טוב , הנה ציטוט :

!!! important []: נתיב קבצים מוחלט הוא כתובת האתר המלאה לקובץ
דוגמא:
<img src="h ttps://www.w3schools.com/images/picture.jpg" alt="Mountain">

!!! important []: נתיב קבצים יחסי מצביע על קובץ ביחס לדף הנוכחי
דוגמא: <img src="/images/picture.jpg" alt="Mountain">

[chv]

@avi-klaine אמר בבקשה | עזרה בתיכנות | כללי:

למשל הלוגו של הפורום כבר נמצא כאן

סתם הערה לנושא הזה (כי הוא גם ככה ארוך)
הקישור שהבאת הוא
https://mitmachim.top/assets/uploads/system/site-logo.png?v=nv51koiba9k
שים לב כל מה שאחרי ה-site-logo.png הוא מיותר

זה מזהה של הסשן הנוכחי שלך (מול השרת של הפורום, ככה עובדת nodeJS) (לא מדויק אלא יותר נכון לומר שזה קשור למטמון - cache שנמצא אצלך)

עריכה למטה

כלומר הקישור האמיתי לתמונה המדוברת הוא
https://mitmachim.top/assets/uploads/system/site-logo.png

עריכה
הסתכלתי מה כתבתי כאן בקיצור ואני לא רוצה להטעות אז אכתוב מה זה בדיוק
ה-=v? הזה הוא בעצם מהווה מנגנון לשמירה על גרסאות במטמון.
יבואר: כאשר הדפדפן שלך שולח בקשה לשרת של הפורום להביא לו את האתר (אני לוקח את הפורום הזה כדוגמא להסבר) השרת מחזיר בתגובה את הדף HTML ועוד המון רכיבים (תמונות, סקריפטים - JS, עיצוב - CSS, פונטים ועוד כל מיני)
הרכיבים הנ"ל מוטמעים על ידי הדפדפן במטמון cache כדי לחסוך באינטרנט + מהירות עלייה של האתר בכניסה הבאה. (לא תמיד כל הרכיבים נכנסים למטמון, זה תלוי אבל לא משנה)
מה קורה אם השתנה משהו ברכיבים הללו? נגיד השתנתה אחת התמונות. הדפדפן שלך יעלה לך את התמונה שנמצאת אצלו במטמון (אנחנו מדברים על זה שהקובץ עדיין עם אותו שם)
כדי למנוע כזה מצב משתמשים במתן גרסאות לקבצים מהשרת. ה-=v? הוא בעצם גרסה נוכחית של הקובץ (מה שספציפית כאן בפורום נקבע על פי האש של הגיט כמדומני, ככה זה בד"כ ב-nodeJS) כך שברגע שקובץ משתנה - הוא נשלח לדפדפן עם =v? שונה והדפדפן לא ייטען את מה שבמטמון אלא מה שהוא מקבל הפעם מהשרת.

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

[AVI KLAINE]

@chv

כלומר הקישור האמיתי לתמונה המדוברת הוא
https://mitmachim.top/assets/uploads/system/site-logo.png

מה לעשות האתר הנהדר הזה מקצר רק קישורים לדרייב