הסוד שגורם לאתר להיראות מסודר ולא אקראי
אתרים שנבנו ב-AI נראים כמעט טוב, ומשהו בהם לא יושב, כי המרווחים בהם אקראיים: 13 פיקסלים בסקשן אחד ו-27 בשני. סקאלה אחידה סוגרת את הרשימה, וכל מרווח וגודל טקסט מגיע ממנה. בוחרים יחידת בסיס של 4 או 8 פיקסלים, גודל טקסט בסיסי בין 16 ל-18, וקצב הגדלה אחד משלושה: 1.2, 1.25 או 1.333. יוצאות עשר מדרגות מרווח ושמונה גדלי טקסט, מהערת שוליים ועד כותרת ראשית, וכל מדרגה מוצגת בפועל. הקוד להדבקה הוא בלוק :root עם משתני CSS ביחידות rem. הכול מחושב בדפדפן.
זו היחידה המקובלת במערכות עיצוב מודרניות. כל המרווחים הם כפולות שלה, ומשם מגיעה התחושה המסודרת.
היחס בין גודל טקסט אחד לזה שאחריו. יחס גבוה יותר יוצר הבדל דרמטי יותר בין כותרות לטקסט.
rem נגזר מגודל הגופן שהגולש הגדיר בדפדפן. מי שהגדיל טקסט מסיבות נגישות יקבל את כל האתר מוגדל באותו יחס, ובפיקסלים זה לא קורה. החישוב הוא 16 פיקסלים ל-rem אחד.
מדביקים לו את בלוק המשתנים וכותבים במפורש שכל מרווח וכל גודל טקסט ייקחו רק מהמשתנים האלה. בלי המשפט הזה הוא ימשיך להמציא ערכים.
1.25 מתאים לרוב האתרים. 1.2 עדיף כשיש הרבה טקסט רציף, ו-1.333 לעמוד נחיתה עם כותרות גדולות. בבסיס 16, הכותרת הראשית יוצאת 49 פיקסלים בקצב 1.25 ו-67 בקצב 1.333.
כליקס לא הצליח להיטען
נסו קודם לרענן את העמוד. אם בדיוק עלתה גרסה חדשה, רענון פותר את זה מיד.
אם הרענון לא עזר, ייתכן שהדפדפן ישן מדי: כליקס מריץ את הכלים על המכשיר שלכם ולא בשרת, ולכן הוא זקוק לדפדפן מ-2022 ומעלה. מה עושים: לעדכן את Chrome או את Firefox, ולפתוח שוב את klixtools.com.