לדלג לתוכן

משתמש:אור פ/עיצוב רספונסיבי

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

עיצוב רספונסיבי (נקרא גם "עיצוב מגיב" או “אתר רספונסיבי”, באנגלית: Responsive Web Design) הוא עיצוב אתר המשתנה בהתאם לגודל הדפדפן והרזולוציה של המכשיר ממנו צופים באתר. כלומר, אלמנטים שונים באתר מתאימים את עצמם בגודל ובמיקום באופן אוטומטי כדי ליצור חוויה אופטימלית ללא תלות בפלטפורמה ממנה גולשים לאתר.


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

סמארטפונים: 320px. טאבלטים: לאורך – 768px, לרוחב – 1024px. דסקטופ + ניידים: 1024px ומעלה.

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


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

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

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

קישורים חיצוניים[עריכת קוד מקור | עריכה]

הערות שוליים[עריכת קוד מקור | עריכה]