העלמת טקסט באתר אינטרנט וסכנותיו

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

אחת מהתגיות היותר שימושיות אך היותר מסוכנות שאנו מכירים ב CSS היא תגית ה display: none;

מתי משתמשים בתכונה display: none

display: none
היא תכונת CSS פופולרית שגורמת לאלמנט באתר אינטרנט להעלם. כאשר אני מצרף את התכונה הזו לאלמנט כלשהו (פסקה, div, רשימה וכו') הוא פשוט 'נעלם' מדף האינטרנטולא מופיע בו. זה שימושי במיוחד כאשר אני רוצה לחשוף את החלק הזה יותר מאוחר – כמו למשל הודעת שגיאה שתצוץ אך ורק אם המשתמש באתר האינטרנט מבצע פעולה מסוימת (כמו למשל לכתוב בעברית בשדה של שם משתמש ולחיצה על Submit).

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

הבעיה המרכזית בתכונה display: none

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

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

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

למה זה קורה?

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

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

מה עושים?

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

במקומות שבהם אי אפשר להשתמש בפתרון אחר (כמו למשל טקסט חלופי ל-flash שחייב להיות בקוד ולהראות למנוע החיפוש) אז אפשר להשתמש בdisplay: none – אך בזהירות מרובה.

פוסטים נוספים שכדאי לקרוא

תמונה מצוירת של רובוט שמנקה HTML
יסודות בתכנות

סניטציה – למה זה חשוב

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

ספריות ומודולים

מציאת PII באמצעות למידת מכונה

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

DALL·E 2024-09-06 12.34.24 - A visually engaging post about Python and cryptographic problems. The image should feature a dark-themed background with a glowing, futuristic Python
פתרונות ומאמרים על פיתוח אינטרנט

בעיות במימוש של פונקציות קריפטוגרפיות בפייתון

היום (16 לספטמבר) ממש, אני מעביר הרצאה ב-PyconIL 2024 על בעיות קריפטוגרפיות באפליקציות פייתון. לצערי אי אפשר להכניס את כל הבעיות הקריפטוגרפיות להרצאה אחת או

רספברי פיי

הרצת גו על רספברי פיי

עולם הרספברי פיי והמייקרים ניתן לתפעול בכל שפה – לא רק פייתון או C – כאן אני מסביר על גו

גלילה לראש העמוד