רעיונות מבריק & מגמות עבור בולט תכונה פוסט יישומונים
הפעלת מגזין מקוון מוצלח דורש קהל מוצק והרבה באיכות גבוהה הכתיבה. אבל הפריסה של המגזין גם משחק גורם מכריע בביקור המבקרים. אחת הטכניקות היא ליצור יישומון הודעות מובלט בחלק העליון של דף הבית. זה מציג את המאמרים הפופולריים ביותר כדי לקדם את הקוראים בצורה נוספת לתוך האתר.
בהודעה זו אני רוצה לכסות טכניקות עיצוב שניתן להשתמש בהם כדי ליצור יישומון מוצלח פוסט מוצלח. למרות שהווידג'ט הזה עובד בצורה הטובה ביותר על פריסה בסגנון מגזין, ניתן גם להחיל את זה על בלוגים קטנים יותר או אתרי תוכן דינמי.
ניגוד טיפוגרפי
רוב ההודעות המוצעות מסתמכות על תמונות ממוזערות כדי למשוך תשומת לב. זה בדרך כלל לוקח את הטופס של תמונת רקע קשורה לכל כותרת המאמר.
טכניקה זו נראית פנטסטית אבל זה קשה ליצור ניגוד בולט בין טיפוגרפיה ותמונות רקע דינמיות. על ידי לימוד מגזינים אחרים אתה יכול להרים טכניקות עדינות כדי לעזור לשפר את הקריאות.
האינטרנט הבא הוא מגזין מקוון גדול עם יישומון הודעות בולטים בדף הבית. כל תמונה ממוזערת משתנה אך כולם משתמשים מחוונים כהים עבור ניגודיות משופרת.
כותרות מאמרים ממוקמות בחלק התחתון של בלוקים ממוזערים על גבי gradients כהה. ה קל טקסט קל לצרוך על רקע כהה, אבל זה לא מכסה גם את כל התמונה.
התקדמות מודרנית ב CSS3 לאפשר למפתחים לשחזר את ההשפעות הללו בקלות. קבוע gradients הם מושלמים אם אתה יכול לקבל אותם לזרום באופן טבעי על גבי כל תמונה ממוזערת ועדיין להשוויץ מספיק של התמונה כדי ללכוד את תשומת הלב.
טכניקה שונה במקצת משמש בדף הבית של Digital Trends. זה לכתוב יישומון משתמש ניגודיות גבוהה רקע מוצק מאחורי טקסט כדי להפוך כל כותרת חדה תוססת.
ההבדל כאן הוא שכל צבע הרקע הוא 100% מוצק. לא ניתן לראות את התמונה הממוזערת כולה מנות קטנות אבדו מן הנוף. אבל הטקסט הוא קריא בבירור אשר יכול להיות בדיוק כמו appealing למבקרים הראשון הנחיתה על הבית דיגיטלי מגמות.
מציאת כמות הניגוד הנכונה מסובכת. אתרי אינטרנט מסוימים, כגון TechCrunch, מנסים להציב טקסט ליד התמונה הממוזערת כדי להסיר בעיה זו לחלוטין.
אבל אם אתה אוהב את סגנון העיצוב של כותרת טקסט על גבי תמונה ממוזערת שתרצה שקול כיצד ניגודים גורמים לתוך המשוואה.
גודל תמונה ספוראדי
הערך של יישומון פוסט מובלט הוא תוכן תכונה בתחילת הדף. אסימטריה היא דרך נהדרת להביא תשומת לב למשהו, ובמקרה זה גודל א-סימטרית של תמונות ממוזערות נהדר.
קחו לדוגמה את דף הבית של ZDNet. ב יישומון בהשתתפות שלהם את המאמר הגדול ביותר בצד שמאל משתמשת תמונה ממוזערת רחב ביותר כדי לתפוס יותר מקום בתקווה למשוך יותר תשומת לב. תמונות ממוזערות אחרות נכנסות לגדלים קטנים יותר עם כותרות קטנות יותר.
שימו לב איך זה מבנה הרשת באופן טבעי מוביל את העין שלך סביב הדף. כל מבקר של מבקר נוטה ליפול באזור מסוים, ואז לעבור בין כל תמונה ממוזערת עד שקופץ משהו החוצה.
גם ZDNet מקומות א שיפוע כהה על גבי כל תמונה ממוזערת ל לבנות ניגודיות טיפוגרפית לטקסט קריא יותר. ביסודו של דבר זה אחד העיצובים הכי טוב יישומון יישומון ההודעה ראיתי אי פעם.
סגנון עיצוב דומה מאוד ניתן למצוא בדף הבית של CNET. התמונה הממוזערת הגדולה ביותר תופסת את מקומה בצד שמאל, שכן רוב המבקרים קוראים משמאל לימין.
בעת עיצוב משלך הודעה בהשתתפות יישומון לא מרגיש מחויב לבצע את אותה טכניקה. אתה יכול ללכת עם כל גודל תמונה ממוזערת כל עוד הם מתאימים יחד יחד וליצור פריסת רשת מאוחדת.
סגנונות ממוזערים מותאמים אישית
אפשרויות העיצוב משתנות באופן נרחב מפריסה לפריסה ולכן אין פתרון מושלם אחד. מוצעים לכתוב יישומונים הם בהחלט מורכבים יותר לעצב, ולכן הם דורשים ללמוד סבלנות כדי להתאים לפריסה מותאמת אישית.
הסגנון של כל תמונה ממוזערת משפיע על האופן שבו יישומון כולו נראה לקהל שלך. קח לדוגמה את סגנון הווידג'ט המוצג שנמצא ב- The Verge.
לכל תמונה ממוזערת יש שיפוע צבעוני על גבי התמונה. זה מגביר את הניגודיות ומשפר את הקריאות, אבל זה גם מוסיף כשרון מסוים לאתר גם כן.
כמה אנשים לא אוהבים את הסגנון הזה כי הם מוצאים אותו צוחק או unappealing. אבל זה גם פופולרי למדי בקרב קוראי Verge ומעצבים אחרים מחקים את הסגנון הזה.
אבל צבעים טכניקות מפוארות אינם הגורם היחיד שיש לקחת בחשבון. רשתות וגדלים ממוזערים גם צריך להיבחר בקפידה כפי שהם עוזרים להגדיר את הסגנון הכולל המוצעים יישומון הודעות.
אולי אחת הדוגמאות הטובות ביותר היא העיצוב של Mashable אשר עברה שלבים רבים לאורך השנים. עכשיו נחשב מקור המיינסטרים לחדשות, Mashable עובד לדחוס מספר רב של הודעות על דף הבית עבור גלישה קלה.
כמה הודעות להשתמש תמונות ממוזערות מרובע קטן בעוד leaderboard הראשי שלהם מתקן גדול כרזה תמונה ממוזערת למאמר. זה חייב לדרוש עבודה נוספת מן העורך כדי להבטיח כי כל ההודעות יש תמונות המתאימות שלהם בגדלים הנכונים.
אבל מיד לאחר הנחיתה באתר תבחין בכך נותן תחושה של אמינות. סגנון זה מרגיש המיינסטרים מאוד והוא יכול לשמש כמעט כל סוג של מגזין מקוון לבנות אמון עם readerbase. הבעיה היחידה היא כתיבת תוכן מספיק כדי למלא את הדף!
Multi-Widgets פוסט
כמה המוצעים יישומונים לכתוב להציג מאמרים ב רשת סטטית. זה לעתים קרובות הבחירה הפופולרית ביותר כי זה יכול להיות עשה תגובה ו blends יפה לתוך כל פריסה.
יישומונים אחרים מסתמכים על אינטראקציות דינמיות כמו מצגת שקופיות. קח למשל את דף הבית של Vanity Fair עם הבלוק ההודעה שלהם בהשתתפות בחלק העליון של הדף. רק פוסט אחד מוצג בכל פעם, אך מאמרים חדשים מוצגים בעת העברת העכבר מעל לכותרת מסוימת.
הן את התמונות הממוזערות והן את העדכון האוטומטי של הכותרת באמצעות אינטראקציה פשוטה עם העכבר. דבר אחד לציין כי זה יכול להיות מאוד מבלבל עבור משתמשי אינטרנט שאינם מכירים את טכניקה זו דינמי לרחף.
אבל בצד החיובי טכניקה זו תהיה לחסוך מקום בדף על ידי הסתרת תוכן עודף.
נסו לא לחשוב על ההודעה יישומונים לכתוב כמו שחור ולבן. הם רק קטעי דף המשמש תכונה המאמרים המעניינים ביותר או פופולרי. טכניקה (ים) שבו אתה משיג את המשימה הזאת תמיד יכול להיות פתוח לדיון.
מגזין קומפלקס משתמש בהצגת שקופיות מלאה עבור יישומון בהשתתפות שלהם. לכל פוסט יש תמונה ממוזערת יחד עם שיפוע התחתון עבור בניגוד טיפוגרפי.
אבל במקום לשים כל תמונה ממוזערת זה לצד זה, את המאמרים זרם דינמי דרך תיבת שקופיות. ניווט ניתן להגדיר באופן אוטומטי או נשלט על ידי קישורים החץ. עיצוב זה חוסך הרבה מקום ומשאיר את המשתמש מוכן יותר ליצור אינטראקציה עם הדף.
לעטוף
אין עיצוב נכון או לא נכון כשמדובר מציג הודעות מובלט. כולם חולקים תכונות דומות רבות, אך כל מגזין משתמש בסגנון משלהם לארגון תוכן מובלט.
אני מקווה הודעה זו מציעה עצות מעשיות לשימוש בעת עיצוב משלך הודעות יישומון הודעות. אם אי פעם אתה מרגיש תקוע רק להסתכל על מגזינים אחרים להשראה. מצא תכונות שאתה אוהב להבין איך לשכפל אותם להתמזג לתוך עיצוב המגזין שלך.
