בדיקות תמונות ואורכי טקסט כדי להבטיח שהאתר שלך מגיב כראוי
כאשר אנו מעצבים אתרי אינטרנט ומתכננים כיצד התוכן של אתרים אלה יוצגו, לעתים קרובות אנו עושים זאת עם מצב אידיאלי בראש. כותרות ואזורי טקסט נתפסים כבעלי אורך מסוים, בעוד שהתמונות המלוות את הטקסט מיועדות להצגה בממדים שיאפשרו להן לעבוד כמתוכנן בעיצוב הכולל. גם אם אלמנטים אלה הם קצת נוזלים כחלק לבנות אתר אינטרנט תגובה (שבו הם צריכים להיות), תהיה גבול עד כמה גמישים הם יכולים להיות.
אם אתה פורס אתר אינטרנט במערכת ניהול תוכן (CMS) ומאפשר ללקוחות לנהל את האתר ולהוסיף תוכן חדש לאורך זמן, המגבלות שתכננת יעמדו במבחן לחלוטין. אמון בעובדה כי הלקוחות שלך ימצאו דרכים לשנות את האתר שאתה מעולם לא חלם שהם יעשו. אם לא היוו מצבים מחוץ לאידאלים האידיאליים שבהם עבדתם בתהליך העיצוב שלכם, פריסת האתר עלולה להיות בסכנה רצינית. זו הסיבה מדוע חשוב במיוחד כי אתה מאמץ לבדוק את כל תוכן האתר ואת ההיבטים של פריסת האתר לפני השקת האתר. הנה כמה טיפים איך אתה יכול לעשות את זה.
בדיקת גודל תמונה
ללא ספק, הדרך הנפוצה ביותר שאנשים פורצים את הפריסה של אתר האינטרנט שלהם היא על ידי הוספת תמונות בגודל בלתי הולם (זה גם הדרך שבה הם משפיעים לרעה על הביצועים הכוללים של האתר ולגרום מהירות הורדה איטי). זה כולל תמונות כי הם גדולים מדי, כמו גם כי הם קטנים מדי לעבוד כפי המיועד באתר האינטרנט שלך.
גם אם אתה משתמש ב- CSS כדי להכריח את גודל התמונות הללו בפריסה שלך, תמונות שאינן נעות בקנה מידה עם המפרט המקורי שלך עבור האתר יגרום לבעיות. אם הממדים של תמונה אינם נכונים, ה- CSS שלך עלול להכריח את התמונה להציג באמצעות הרוחב והגובה המתאימים, אך ייתכן שהתמונה עצמה ויחס הממדים שלה יהיו מעוותים. זה בהחלט תהיה השפעה שלילית על המראה של האתר שלך כתמונה כי הוא קטן מדי יהיה "פוצצו" ויאבד איכות. תמונה גדולה מדי, שנעשית קטנה יותר עם CSS, נראית בסדר ושומרת על איכותה, אך גודל הקובץ עשוי להיות בלתי סביר באופן משמעותי עבור השימוש בו.
בעת בדיקת עבודת האתר שלך, הקפד להוסיף תמונות שאינן שייכות לטווח שלך. הוסף ב CSS ו תגובה טכניקות תמונה כי כתובות אתגרים אלה על ידי שינוי גודל התמונה לפי או, במקרה של יחס גובה לא נכון, גם שוקל להשתמש משהו כמו מאפיין CSS קליפ לחתוך את התמונה לפי הצורך.
בדיקה מדיה אחרים
בנוסף לתמונות, בדוק גם כלי מדיה אחרים כגון סרטונים באתר שלך וראה כיצד רכיבים אלה יופיעו בפריסה באמצעות ערכי שינוי גודל ויחס שונים. שוב, שקול את אופי התגובה של האתר שלך וכיצד הוא יפעל עבור גדלים שונים של מכשירים וגדלים .
בדיקת כותרות טקסט
לאחר תמונות, אזור האתר הבא שגורם לבעיות ביותר עם אתרי אינטרנט חיים המנוהלים על ידי אנשי מקצוע שאינם אינטרנט הוא כותרות טקסט. אלה הם שורות (כביכול) של טקסט קצר, אשר לעתים קרובות להתחיל את התוכן של דף או קטע בדף זה. את הטקסט מעל סעיף זה קורא "בדיקת כותרות טקסט" הוא דוגמה לכך.
אם יש לך עיצוב האתר כדי להתאים כותרת כמו זה:
"בדיקת כותרות טקסט"
אבל הלקוח שלך משתמש ב- CMS כדי להוסיף מאמר עם כותרת כמו זו:
"בדיקת כותרות טקסט על מגוון רחב של דפי אינטרנט כל עם גדלים שונים דרישות משתמש צרכים"
ייתכן שהפריסה שלך לא תהיה מסוגלת להתאים את כל הטקסט הנוסף. בדיוק כמו שאתה צריך להדגיש את התמונות ואת המדיה על ידי הוספת ערכים נופלים גם מחוץ לגדלים שתכננת בתחילה, אז אתה צריך לעשות זאת עם כותרות טקסט כדי לוודא כי הם גמישים מספיק כדי להציג ביעילות אפילו שורות אולטרה ארוך כמו אחד מעל.
בדיקת אורך הטקסט
בהשארתך בנושא הטקסט, תרצה לבדוק גם אורך טקסט שונה עבור התוכן הראשי בדפים . זה כולל טקסט כי הוא מאוד, מאוד ארוך כמו גם טקסט זה מאוד, קצר מאוד - אשר למעשה יכול להיות בעיה כי doums פריסות דף רבים.
מכיוון שדפי אינטרנט, מטבעם, גדלים בגודלה כדי להתאים לגובה של הטקסט שהם מכילים, דפים עם הרבה טקסט בדרך כלל יגדלו לגובה בהתאם לצורך. אלא אם כן הגבלת את גובה הדף (שבו אתה לא צריך לעשות אם אתה רוצה הדף שלך להיות גמישים), אז טקסט נוסף לא צריך להוות בעיה. מעט מדי טקסט הוא נושא אחר - וזה אחד מעצבים רבים שוכחים לבדוק בתהליך העיצוב שלהם.
טקסט מועט מדי יכול לגרום לדף להיראות שלם או אפילו שבור, לכן הקפד לשנות את תוכן הדף שלך למטה כדי לראות מה קורה באותם מקרים ולבצע את ההתאמות הנדרשות ל- CSS של האתר שלך כדי לטפל במצבים אלה.
בדיקת עמוד זום
אנשים עם בעיות ראייה עשויים להשתמש בתכונה 'זום עמוד' של דפדפן אינטרנט כדי להגדיל את הגודל של דף האינטרנט שלך. אם מישהו מתרחב כמות משמעותית, הפריסה שלך עלולה להישבר. זוהי אחת הסיבות לכך שתרצה להשתמש ב- EMs כיחידת המדידה לגדלי גופני האתר שלך וכן לשאילתות המדיה שלך. מכיוון ש - EMs הן יחידת מידה יחסית של מדידה (בהתבסס על גודל הטקסט המוגדר כברירת מחדל של הדפדפן), הן מועילות יותר לפריסות אתר גמישות ונוחות.
בדוק את האתר שלך עבור זום הדף ולא רק לעצור באחת או שתי רמות של זום. הגדל את האתר שלך למעלה ולמטה במגוון רמות כדי להבטיח שהדפים שלך יגיבו כמתוכנן.
אל תשכח על מהירות הורדה וביצועים
כאשר אתה בודק את ההשלכות הפריסה של החלטות הלקוח, אל תשכח לשים לב גם להשפעה שיש להחלטות אלה על ביצועי האתר. התמונות והתוכן שאותם לקוחות יוסיפו, עלולים להפריע למהירות ההורדה של האתר ולהשמיד באופן חמור את השימושיות הכוללת של האתר. לתכנן את ההשפעה של תוספות אלה ולעשות את החלק שלך בתהליך הפיתוח כדי למזער את ההשפעות הללו.
אם האתר שלך נבנה עם תקציב ביצועים, שתף מידע זה עם הלקוחות שלך והראה להם כיצד לבדוק דף אינטרנט עבור ערכי ביצועים. להסביר להם את החשיבות של שמירה על ספים אלה הוקמה עבור גודל הדף ואת מהירות ההורדה ולהראות להם איך תוספות שהם עושים יכול להשפיע על האתר בכללותו. קח את הזמן כדי לאמן אותם כיצד לשמור על האתר עובד ומראה טוב. בנושא אימון ...
אימון לקוח חיוני
חשוב להדגיש את התמונות של האתר שלך, טקסט ואלמנטים אחרים של הדף וליצור סגנונות אשר יחשבו על מקרים קיצוניים, אבל זה אף פעם לא תחליף לאימון הלקוח. העבודה שלך bulletproofing האתר צריך להיות בנוסף הזמן שאתה מבלה אימון ללקוחות שלך איך לטפל ביעילות ולנהל את האתר שלהם. בסופו של דבר, לקוח מאומן היטב שמבין את האחריות שלהם ואת ההשפעה של ההחלטות שהם עושים באתר יהיה יקר למאמציך לשמור על האתר עובד ומסתכלת במיטבה.