התאמת אתר למובייל

[רחל1]

אני מפתחת ומתחזקת אתר הכתוב ב.net - mvc
כעת רוצים להתאים אותו למובייל. האם זה משהו מסובך? איך מתחילים?
האם חיבים מכשירים בשביל זה? אם כן - כיצד בודקים בלי כאלו בשטח..?

 

[efrat1]

בעיקרון רוב ההתאמה בכלל מבוססת צד לקוח ,
יש css וספריות jquery רספונסיביים

אם את דוגמת את האתר דרך ה-f12 של הכרום את יכולה בצד לשנות למצב מובייל
ולבחור רזולוציה או סוג מכשיר

כמו כן, יש את האתר הזה שמזינים את הלינק של האתר שלכם והוא מנתח תצוגה ובודק התאמה לניידים
https://search.google.com/test/mobi...dium=redirect&utm_campaign=mft-redirect&hl=iw

בהצלחה

 

[רחל1]

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

 

[תאו]

יש את האתר הזה בו מזינים את כתובת את האתר והוא מראה איך האתר מוצג בכל סוגי הניידים :
http://troy.labs.daum.net/

 

[efrat1]

את מה שכתבת כבר בדקתי.
השאלה אם אפשר להסתמך על הכלי הזה או שחיבים מכשירים פיזיים בשביל לבדוק

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

וכן האם עדיף אתר חדש מותאם למובייל (שיכיל את הדברים הבסיסים, לא את כל האתר)
או שחובה ממש להתאים את כל האתר? זה אתר מיושן עם המון תוכן וטבלאות.

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

מקווה שעזרתי

 

[yochi000]

אני אענה לך מהצד של מאפיינת ומעצבת, ולא מהצד של מפתחת (כי זה לא התחום שלי)
אבל בגדול, יש הבדל בין רספונסיבי לאדפטיבי.
אדפטיבי - זה עיצוב מיוחד למובייל, ועיצוב מיוחד לדסקטופ אשר המקובל הוא להגדיר-2-3 נקודות שבירה בקיפול התוכן.
היום לא מתייחסים לכל גודל באופן ספציפי, כי הגדלים משתנים כל הזמן, אלא מחשבים רק את שלושת הגדלים השונים: 1920, 768, 320 (שימי לב, המובייל הוא המכשיר הכי קטן שקיים)

רובם הגדול של האתרים מעצבים רספונסיבית עם שבירה של 2-3 נקודות.
חלק התאימו אדפטיבית למובייל.

איך בודקים את זה?
כל כך פשוט-
את עומדת על האתר שלך, ומבחוץ מקטינה את חלון התצוגה של הדפדפן, אם האתר מתקפל יפה, זה רספונסיבי, וכך את יכולה אגב גם לבדוק איך הוא יתקבל במובייל, ואיך בטאבלט (שהולך ופאסה)
אם הוא לא מתקפל, זה אדפטיבי (לדוגמא - פייסבוק)
המאפיין יבדוק בד"כ באופן זה נקודות שבירה ויגדיר אותם.

 

[רחל1]

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

מקווה שעזרתי

עוזר מאד. אני עדיין בשלבי הגישוש
האתר בנוי בMVC - האם הקונטרולרים נשארים זהים ויש רק כמה views?

 

[efrat1]

לא צריך אפילו כמה views אפשר בתוך ה-view פשוט לבנות 2 פריסות ,
if viewbag.xxx = מובייל
תבנה למשל במקום להציג טבלה מציגים רשימה שנפתחת למטה
יש הרבה דוגמאות בררשת
ואם אתה דפדפן תשאיר תצוגה רגילה

 

[Nahum]

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

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

 

[3 פינות]

אני אענה לך מהצד של מאפיינת ומעצבת, ולא מהצד של מפתחת (כי זה לא התחום שלי)
אבל בגדול, יש הבדל בין רספונסיבי לאדפטיבי.
אדפטיבי - זה עיצוב מיוחד למובייל, ועיצוב מיוחד לדסקטופ אשר המקובל הוא להגדיר-2-3 נקודות שבירה בקיפול התוכן.
היום לא מתייחסים לכל גודל באופן ספציפי, כי הגדלים משתנים כל הזמן, אלא מחשבים רק את שלושת הגדלים השונים: 1920, 768, 320 (שימי לב, המובייל הוא המכשיר הכי קטן שקיים)

רובם הגדול של האתרים מעצבים רספונסיבית עם שבירה של 2-3 נקודות.
חלק התאימו אדפטיבית למובייל.

איך בודקים את זה?
כל כך פשוט-
את עומדת על האתר שלך, ומבחוץ מקטינה את חלון התצוגה של הדפדפן, אם האתר מתקפל יפה, זה רספונסיבי, וכך את יכולה אגב גם לבדוק איך הוא יתקבל במובייל, ואיך בטאבלט (שהולך ופאסה)
אם הוא לא מתקפל, זה אדפטיבי (לדוגמא - פייסבוק)
המאפיין יבדוק בד"כ באופן זה נקודות שבירה ויגדיר אותם.

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