Core Web Vitals מייצגים סט של מדדים שאינם קשורים לאיכות התוכן באתר ומשמשים את גוגל בכדי להעריך את חווית המשתמש (UX) של אתר מסויים. מדדים אלו הולכים להצטרף לאחרים כסט של מדדים בעלי השפעה על SEO ודירוג האתר בתוצאות החיפוש [...]
קטגוריה: עיצוב וחווית משתמש | עמוד 2
flex-wrap היא תכונה ספציפית הקיימת במודול CSS flexbox. באמצעות תכונה זו ניתן לקבוע כיצד flex items יוצגו ויתנהגו ב flex container כשאין לרשותם מספיק מקום. התכונה flex-wrap אף מספקת לנו דרך מהירה להפוך flex container לרספונסיבי יותר, ולעיתים אף מסירה [...]
עם כניסת הספסיפיקציות CSS Scroll Snap, קיימת עבורינו המפתחים האפשרות לשלוט על התנהגות הגלילה של עמוד אינטרנטי (עד דרגה מסויימת בכל אופן), וזאת על ידי שימוש בסטנדרטים של הרשת וללא צורך להסתמך על ספריות חיצוניות כבדות.
חזרה בזמן לשנת 2011, אפקט פרלקס בגלילה (parallax scrolling effect) יצר הדים והסתמן כטרנד חדש בעיצוב אתרים. אופנות רבות הגיעו ועזבו מאז אך אפקט זה ביסס מקומו ואינו מתכוון לעזוב בקרוב. בפוסט זה נסביר מה זה parallax scrolling ונשחק מעט [...]
ב CSS קיימות שתי תכונות האחראיות למיזוג (blending במיים אחרות). התכונה mix-blend-mode אחראית למיזוג אלמנטים ב DOM, ולעומתה, התכונה background-blend-mode אחראית לשילוב של מספר תמונות רקע (background-image ב CSS), או שילוב של background-image יחד עם background-color.
לבטח יצא לכם לראות אתרים בהם מתבצעות אנימציות שונות בזמן שאתם גוללים מטה (On Scroll Animations). אז אשתף אתכם בספרייה בה נתקלתי בשם AOS, המאפשרת להוסיף אנימציות אלו בקלות ועם שליטת CSS מלאה על אותן אנימציות. הרעיון מאחורי AOS הוא [...]
עיצוב פסי הגלילה (Scrollbars) של הדפדפן נראה כפופולרי לאחרונה ואני נתקל בלא מעט אתרים המעצבים זה בצורה שונה, כזו המתאימה לעיצוב הכללי ולמיתוג האתר שלהם. ישנם מספר דרכים לעצב פסי גלילה אלו, ובפוסט זה נראה כיצד לעשות זאת באמצעות CSS3.
רבים מאיתנו מעדיפים להשתמש ב CSS כשניתן ולהמנע מ Javscript אם ניתן עבור פונקציונליות של אלמנטים. פתרונות CSS טהורים מאד נוחים לתחזוקה וחוסכים עבודת JS היכולה להשפיע במקרים מסויימים על זמן הטעינה של העמוד. עם זאת, אין להשתמש בפתרונות אלו [...]