כניסה / הרשמה טופס רעיונות ודוגמאות יפות

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

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

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

שקול תשומות מרובות

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

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

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

תיבות כניסה jQuery

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

Pixel2Life מציעה כמה תובנות פנטסטי לתוך שדה חדש של קלט נתונים. מתוך דף הבית שלהם אתה יכול ללחוץ על קישור הכניסה ולהביא תיבת כניסה דינמי מופעל על ידי jQuery. טופס זה מכיל שיחת אייאקס ל PHP סקריפט חיצוני אשר בודק את האישורים של פרטי הכניסה שלך, לאחר עיבוד, או מעניקה או מונע גישה.

הולך עוד צעד נוסף את astute עשוי להבחין קישור רישום ישירות מתחת לתיבת הכניסה. זה מציע חוויית משתמש חלקה הרבה יותר עבור אלה המעוניינים להירשם לאתר אבל לא מצליח לאתר את הקישור אחת.

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

רישומים פשוטים של עמוד אחד

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

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

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

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

לבנות את האפקטים Flashy

אחד החוויות ההרשמה הגדולה ביותר שהיה לי אי פעם היה יצירת חשבון Tumblr הראשון שלי. דף הבית של האתר שלהם מציע גם כניסה טופס ההרשמה ממוקם ישירות מתחת אחד עם השני CSS3 הדגשת / אפקטים לדעוך.

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

יש כמה באגים עם מערכת זו. בעיקר בתוך IE6 / IE7 לא תומך אלה תכונות CSS חדש. משמש גם בדף הבית היא מערכת להוספת אלמנטים תווית לתוך ערכי קלט טופס - בעצם overruling “ברירת המחדל” תווים המשמשים לתיבות דואר אלקטרוני / סיסמה.

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

20 + דוגמאות של עיצוב טופס יפה

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

סנוגל חדשות