CSS וקידום אתרים (SEO)

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

כיצד CSS מסייע בקידום אתרים?

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

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

CSS מאפשר שימוש בתגיות לכותרות דוגמת <h1>, שהם משמעותיים ביותר למנועי חיפוש, במיוחד אם הם מכילים, והם אכן צריכים להכיל, את מילות המפתח של האתר. בעבר השתמשו בתגיות <font> כדי לעצב כותרות מובחנות ויפות. הבעיה היא שתגיות אילו אינן משמעותיות למנועי החיפוש, ולא עוזרות בקידום האתר, אבל כשמשתמשים ב-CSS אפשר להוסיף ללא בעיה כותרות מעוצבות שהן משמעותיות למנועי חיפוש, דוגמת h1 וכיו"ב.

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

איך לשפר את ה-SEO באמצעות CSS?

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

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

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

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

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

אילו טריקים של CSS עלולים לפגוע ב-SEO?

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

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

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

משתמשים כמה שפחות ב-in-line. המשמעות של in-line היא שאת כללי ה-CSS משבצים לתוך תגיות ה-html. ב-in-line עושים שימוש חובבנים מוחלטים, או בוני אתרים שרוצים להעניק לדפים ולאלמנטים מסוימים תחושה מיוחדת. לפעמים, זה עשוי להיות פתרון נכון לבעיה ספציפית בדף מסוים. אבל בדרך כלל, השימוש ב-in-line מכביד על הקוד שנושא עליו הדף, וכתוצאה מכך, זמן הטעינה של הדף מתארך, ויותר חמור מכך, קשה יותר לעצב את האתר באופן אחיד, ולכן נפגעת חוויית הגלישה באתר, ועלול להיפגע ה-SEO. לכן, מומלץ להימנע מ-in-line. 

לסיכום

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

אהבתם? לא אהבתם? דרגו!

0 הצבעות, ממוצע 0 מתוך 5 כוכבים