# אופטימיזציית איקומרס למובייל: Core Web Vitals, קופה והתיקונים הספציפיים שמזיזים המרה

> 70-85% מתנועת האיקומרס היא מובייל. עשרה תחומים ספציפיים (Web Vitals, מטרות מגע, מילוי אוטומטי בטפסים, Apple Pay, אזורי אגודל) שסוגרים את פער ההמרה בין מובייל למחשב, עם כלים ומדדי ייחוס אמיתיים.

Ryan Badger - 1 במאי 2025 - 8 דקות קריאה

## למה מובייל הוא כל המשחק

70-80% מתנועת האיקומרס שלך היא מובייל. ברוב קטגוריות הצרכנים זה מתקרב ל-85%. המרה במחשב היא בדרך כלל פי 2-3 מהמרה במובייל, וזה אומר פחות על כך שמחשב טוב יותר ויותר על כך שהמובייל שבור ברוב החנויות.

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

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

## 1. Core Web Vitals ולמה Google עוקבת אחריהם

Google משתמשת ב-Core Web Vitals כאות דירוג וכמדד לאיכות החוויה. מעבר לזווית ה-SEO, המדדים עצמם הם מנבאים חזקים של המרה.

### LCP (Largest Contentful Paint)

הזמן עד שהאלמנט הגדול ביותר מעל לקפל (בדרך כלל תמונת הירו או H1) מוצג. יעד: מתחת ל-2.5 שניות ב-4G במובייל.

הסיבות הנפוצות ביותר ל-LCP גרוע:

- תמונת הירו לא דחוסה או גדולה מדי
- טעינת פונט אינטרנט שחוסמת רינדור
- הזרקת סקריפטים של צד שלישי (ווידג'טי צ'אט, אנליטיקה, כלי בדיקות A/B) ב-`<head>`

### INP (Interaction to Next Paint)

הזמן מאינטראקציית משתמש (נגיעה) עד העדכון הוויזואלי הבא. יעד: מתחת ל-200 מילישניות.

הסיבות הנפוצות ביותר ל-INP גרוע:

- דפים כבדי JavaScript (חנויות React/Vue בלי פיצול קוד)
- סקריפטים של אנליטיקה או צ'אט שנורים באופן סינכרוני בעת אינטראקציה
- השהיית נגיעה בדפדפני מובייל ישנים

### CLS (Cumulative Layout Shift)

דברים שקופצים בדף בזמן שהוא נטען. יעד: מתחת ל-0.1.

הסיבות הנפוצות ביותר:

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

### איך לבדוק

בחינם: [PageSpeed Insights](https://pagespeed.web.dev/) מריץ Lighthouse ומדווח על שלושתם. בדוק את דף המוצר המכניס ביותר שלך, לא את עמוד הבית. תקן את מה שאדום, קבל את מה שכתום, והמשך.

בתשלום / לעומק: WebPageTest.org לניתוח מפל, לשונית Performance ב-Chrome DevTools לפרופיילינג מקומי.

## 2. מהירות מובייל מתחת ל-3 שניות (מובייל אמיתי, לא מחשב מוגבל)

"אמולטור המובייל" בדפדפן במחשב משתמש בחיבור מהיר ובמעבד מהיר. לטלפונים אמיתיים יש חיבורים איטיים יותר ומעבדים איטיים יותר. הפער משמעותי.

בדוק בטלפונים אמיתיים ב-4G. אם הדף שלך לוקח 2 שניות באמולטור המובייל של Chrome, הוא כנראה לוקח 4-5 שניות באנדרואיד בינוני ב-4G.

### הניצחונות הגדולים ביותר במהירות (לפי סדר)

1. **אופטימיזציית תמונות:** דחוס לאיכות 80%, שנה לגודל הנדרש בפועל, הגש WebP או AVIF. Shoprocket עושה את זה אוטומטית דרך Cloudflare
2. **טען בעצלות תוכן מתחת לקפל.** תמונות, iframes וסקריפטים כבדים לא צריכים להיטען עד שמגיעים אליהם בגלילה
3. **דחה JavaScript לא קריטי.** אנליטיקה, ווידג'טי צ'אט וכלי בדיקות A/B לא צריכים לחסום רינדור
4. **שמור נכסים סטטיים במטמון באגרסיביות.** מטמון של שנה לתמונות, פונטים, CSS, JS עם כתובות עם טביעת אצבע
5. **השתמש ב-CDN** (Cloudflare, Fastly, או זה המובנה בפלטפורמה שלך). מגיש נכסים משרתי קצה קרובים גאוגרפית
6. **צמצם סקריפטים של צד שלישי.** כל פיקסל ותג מוסיף כ-50-200 מילישניות; בדוק מה באמת נחוץ

## 3. גודל מטרות מגע

הנחיות ה-Human Interface של Apple קובעות מטרות מגע מינימליות של 44×44 פיקסלים. Google Material קובעת 48×48. רוב גרסאות ה"מובייל" של תבניות לא מגיעות לאף אחד מהם.

**תיקונים:**

- כפתורים בגובה 44px לפחות עם ריפוד פנימי של 8-12px
- קישורים בניווט בגובה 44px לפחות
- שדות טופס בגובה 44px לפחות (עוזר גם לנגישות)
- רווח בין מטרות נגיעה סמוכות של 8px לפחות

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

## 4. פרטי הקופה במובייל

העגלה והקופה במובייל הן המקום שבו רוב ההמרה מדממת. רשימת משימות ספציפית:

### טפסים בעמודה אחת

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

### סוגי קלט מתאימים

- שדה אימייל: `type="email"` (מעלה מקלדת אימייל עם הסימן @)
- טלפון: `type="tel"` (מקלדת מספרים)
- מיקוד: `type="text" inputmode="numeric"` למדינות עם מיקוד מספרי
- מספר כרטיס אשראי: `type="text" inputmode="numeric" autocomplete="cc-number"` (גורם למילוי האוטומטי לעבוד)

רוב הפלטפורמות עושות את זה נכון באופן מובנה. שווה לבדוק את הטופס שלך בטלפון; אם עולה מקלדת לא נכונה, תקן.

### ידידותיות למילוי אוטומטי

דפדפנים יכולים למלא אוטומטית שם, כתובת, אימייל, טלפון ופרטי כרטיס אם מאפייני ה-`autocomplete` של הטופס נכונים. לקוח שלוחץ על הצעת מילוי אוטומטי משלים קופה ב-3 שניות. בלי מילוי אוטומטי, הוא מקליד ידנית 12+ שדות.

ערכי autocomplete סטנדרטיים: `name`, `email`, `tel`, `street-address`, `postal-code`, `country`, `cc-number`, `cc-exp`, `cc-csc`, `cc-name`.

### כפתור הוספה לעגלה דביק בדפי מוצר

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

### Apple Pay + Google Pay + Link

אלה העליות הגדולות ביותר בקופה במובייל. תשלום בנגיעה אחת בלי הקלדה; אימות ביומטרי נייטיב.

- **Apple Pay:** מופעל אוטומטית אחרי שמאמתים את הדומיין שלך מול Stripe (Shoprocket מטפלת בזה)
- **Google Pay:** דומה
- **Stripe Link:** ממלא את הכרטיס והכתובת מתוך הזהות של Link בין אתרים

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

## 5. צמצום שדות בטופס

כל שדה בקופה שלך במובייל הוא נקודת חיכוך. בדוק את השדות שלך:

**בדרך כלל נחוצים:**

- אימייל
- כתובת משלוח (שם, רחוב, עיר, מיקוד, מדינה)
- פרטי תשלום (או Apple/Google Pay)

**לעיתים קרובות נאספים יותר מדי:**

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

פחות שדות = קופה מהירה יותר = השלמה גבוהה יותר. כל שדה שאתה מסיר הוא בערך שיפור של 5-10% בהשלמת קופה במובייל, בצבירה.

## 6. טיפוגרפיה קריאה ואורך שורה במובייל

- **גוף הטקסט:** 16px לפחות (ברירת המחדל של iOS והנחיית Material של Google)
- **אורך שורה:** 45-75 תווים
- **גובה שורה:** פי 1.4-1.6 מגודל הפונט
- **ניגודיות:** WCAG AA לפחות (4.5:1 לגוף הטקסט, 3:1 לטקסט גדול)

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

## 7. שיקולים לשימוש ביד אחת

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

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

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

## 8. דף מוצר ייעודי למובייל

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

רצף יעיל לדף מוצר במובייל:

1. תמונת הירו (גלריה שאפשר להחליק)
2. כותרת + מחיר
3. בורר וריאציות (מידה, צבע)
4. הוספה לעגלה (CTA ראשי)
5. אותות אמון (דירוג, משלוח חינם, החזרות)
6. תיאור (מתקפל, קיפול אחרי 3 שורות)
7. מפרטים / פרטים (מתקפלים)
8. סיכום ביקורות עם הרחבה ל"ראה הכול"
9. מוצרים קשורים
10. שאלות נפוצות (מתקפלות)

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

## 9. בדיקה במכשירים אמיתיים

לא DevTools. לא אמולטור המובייל של הדפדפן. טלפונים אמיתיים בחיבורים סלולריים.

סבב בדיקות מינימלי:

- iPhone SE (מסך קטן, מכשיר ישן)
- iPhone 15 Pro (iOS החדש ביותר, Safari)
- Samsung Galaxy בינוני (אנדרואיד, Chrome)
- אנדרואיד ישן ב-4G (חושף בעיות ביצועים)

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

## 10. הימנעות מדפוסים שהורגים מובייל

טעויות נפוצות שהורסות המרה במובייל:

### חלונות קופצים מפריעים

חלון "הירשם וקבל 10% הנחה!" שמכסה את המסך בנחיתה במובייל. Google מענישה אותם בדירוג בחיפוש במובייל. לקוחות פוגשים אותם ועוזבים. השתמש בהרשמות בתוך הדף במקום.

### וידאו שמתנגן אוטומטית עם קול

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

### מצבי ריחוף במגע

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

### כפתורי "סגור" זעירים בחלונות מודאליים

X של 16 פיקסלים בפינה אי אפשר לפגוע בו עם אגודל. הפוך כפתורי סגירה ל-44×44 או השתמש בכפתורי "סגור" ברוחב מלא בתחתית החלונות.

### גלילה אופקית ברשתות מוצרים

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

## במה Shoprocket מטפלת במובייל

רוב הדברים הבסיסיים מהקופסה:

- **אופטימיזציית תמונות אוטומטית:** שינוי גודל + דחיסה + WebP + טעינה עצלה בכל תמונת מוצר
- **מגירת עגלה (לא עגלה בדף מלא)** היא ברירת המחדל במובייל
- **הוספה לעגלה דביקה במובייל** נתמכת בחנויות עם ערכת עיצוב
- **קופה רספונסיבית למובייל** עם סוגי קלט נכונים, autocomplete וסידור בעמודה
- **Apple Pay + Google Pay + Stripe Link** תשלום בנגיעה אחת דרך Stripe
- **ווידג'ט צ'אט חי רספונסיבי למובייל**
- **הפצה ב-CDN** דרך Cloudflare לכל נכס
- **Core Web Vitals מותאמים מהקופסה** לחנות המתארחת

```
<!-- EXAMPLE ONLY. Grab your real snippet from Sales channels → Embeds in your dashboard -->
<script src="https://cdn.shoprocket.io/loader.js" data-pk="pk_yourkey"></script>
<div data-shoprocket="catalog" data-embed-id="emb_xxx"></div>
```

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

> **טיפ:** פעם ברבעון, הרץ PageSpeed Insights על שלושת דפי המוצר המכניסים ביותר שלך במובייל. רשום את שלושת ציוני ה-Core Web Vitals. ברבעון הבא, השווה. מגמת ירידה היא רוצח המרה שקט; תפוס אותה ברבעון ולא אחרי הנזק.

## בקצרה

- **מובייל הוא 70-85% מהתנועה.** רוב החנויות מתייחסות אליו כמחשבה שלאחר מכן; אל תעשה את זה
- **Core Web Vitals הם שלושת המספרים לעקוב אחריהם:** LCP, INP, CLS. מתחת ל-2.5 שניות / 200 מילישניות / 0.1
- **בדוק במכשירים אמיתיים ב-4G,** לא באמולטור דפדפן
- **פרטי הקופה:** טפסים בעמודה אחת, סוגי קלט נכונים, autocomplete, Apple/Google Pay, CTA דביקים
- **פחות שדות בטופס** = השלמה גבוהה יותר. בדוק מה באמת נחוץ
- **מטרות מגע 44×44 לפחות.** רווח בין מטרות 8px לפחות
- **אזור האגודל חשוב.** CTA ראשיים קרוב לתחתית; המבורגרים למעלה בשמאל/ימין
- **הימנע ממה שהורג מובייל:** חלונות קופצים, אודיו שמתנגן אוטומטית, מצבי ריחוף, כפתורי סגירה זעירים

[התחל תקופת ניסיון חינם](https://app-v3.shoprocket.io/signup) וקבל אופטימיזציית תמונות אוטומטית + Apple Pay + קופה מותאמת למובייל מהיום הראשון. 14 יום, בלי כרטיס.

---

- HTML version: https://v3.shoprocket.io/he/blog/mobile-ecommerce-optimisation-core-web-vitals-checkout-and-the-specific-fixes-that-move-conversion
- Language: עברית (he)
- Also in: [العربية](https://v3.shoprocket.io/ar/blog/mobile-ecommerce-optimisation-core-web-vitals-checkout-and-the-specific-fixes-that-move-conversion.md), [Deutsch](https://v3.shoprocket.io/de/blog/mobile-ecommerce-optimierung-core-web-vitals-checkout.md), [Ελληνικά](https://v3.shoprocket.io/el/blog/mobile-ecommerce-optimisation-core-web-vitals-checkout-and-the-specific-fixes-that-move-conversion.md), [English](https://v3.shoprocket.io/blog/mobile-ecommerce-optimisation-core-web-vitals-checkout-and-the-specific-fixes-that-move-conversion.md), [Español](https://v3.shoprocket.io/es/blog/optimizacion-ecommerce-movil-core-web-vitals-checkout-y-arreglos-que-mueven-la-conversion.md), [Français](https://v3.shoprocket.io/fr/blog/optimisation-ecommerce-mobile-core-web-vitals-paiement.md), [हिन्दी](https://v3.shoprocket.io/hi/blog/mobile-ecommerce-optimisation-core-web-vitals-checkout-and-the-specific-fixes-that-move-conversion.md), [Bahasa Indonesia](https://v3.shoprocket.io/id/blog/optimasi-ecommerce-mobile-core-web-vitals-checkout-dan-perbaikan-konversi.md), [Italiano](https://v3.shoprocket.io/it/blog/ottimizzazione-ecommerce-mobile-core-web-vitals-checkout.md), [日本語](https://v3.shoprocket.io/ja/blog/mobile-ecommerce-optimisation-core-web-vitals-checkout-and-the-specific-fixes-that-move-conversion.md), [Lietuvių](https://v3.shoprocket.io/lt/tinklarastis/mobilioji-el-prekyba-core-web-vitals-atsiskaitymas-ir-konkretus-pataisymai-didinantys-konversija.md), [Norsk](https://v3.shoprocket.io/nb/blogg/mobiloptimalisering-nettbutikk-core-web-vitals-kasse.md), [Nederlands](https://v3.shoprocket.io/nl/blog/mobiele-webshop-optimalisatie-core-web-vitals-checkout-conversie.md), [Polski](https://v3.shoprocket.io/pl/blog/optymalizacja-ecommerce-na-mobile-core-web-vitals-kasa-i-poprawki-ktore-ruszaja-konwersje.md), [Português](https://v3.shoprocket.io/pt/blog/otimizacao-ecommerce-mobile-core-web-vitals-checkout-conversao.md), [Română](https://v3.shoprocket.io/ro/blog/optimizare-ecommerce-mobil-core-web-vitals-plata.md), [Русский](https://v3.shoprocket.io/ru/blog/mobile-ecommerce-optimisation-core-web-vitals-checkout-and-the-specific-fixes-that-move-conversion.md), [ไทย](https://v3.shoprocket.io/th/blog/mobile-ecommerce-optimisation-core-web-vitals-checkout-and-the-specific-fixes-that-move-conversion.md), [Türkçe](https://v3.shoprocket.io/tr/blog/mobil-eticaret-optimizasyonu-core-web-vitals-odeme-ve-donusumu-artiran-duzeltmeler.md), [中文](https://v3.shoprocket.io/zh/blog/mobile-ecommerce-optimisation-core-web-vitals-checkout-and-the-specific-fixes-that-move-conversion.md)