ब्लॉग

Webflow से Astro माइग्रेशन: कंटेंट, डिज़ाइन और रैंकिंग खोए बिना Webflow साइट कैसे ले जाएँ

Webflow से Astro माइग्रेशन: कोड एक्सपोर्ट में CMS, फ़ॉर्म, सर्च और लोकलाइज़ पेज नहीं आते। क्या निकालें, Astro में क्या दोबारा बनाएँ और रैंकिंग कैसे बचाएँ।

लेखक: Nicolás Cerón ·

रात में पत्थर का एक पुराना नहर लॉक, जिसके लकड़ी के फाटक खुले हैं, और एक छोटी गहरे लाल रंग की नाव तेज़ बहाव वाली नहर से निकलकर शांत बंदरगाह में जा रही है; ऊपर पहाड़ी पर एक रोशन वेधशाला है।
इस पेज पर

संक्षिप्त उत्तर

Webflow छोड़ना Framer छोड़ने से आसान है, क्योंकि Framer HTML एक्सपोर्ट देता ही नहीं, लेकिन यह आसानी एक हद तक ही है। पेड Workspace प्लान पर आप अपनी साइट का HTML, CSS, JavaScript और इमेज एक्सपोर्ट करके कहीं भी होस्ट कर सकते हैं। Webflow का हेल्प सेंटर उतनी ही साफ़ तरह से यह भी बताता है कि क्या पीछे छूट जाता है: CMS कंटेंट, फ़ॉर्म प्रोसेसिंग, साइट सर्च, पासवर्ड प्रोटेक्शन, लोकलाइज़ किए गए पेज और code components एक्सपोर्ट में शामिल नहीं होते, और Collection lists खाली दिखती हैं (Webflow Help)।

इसलिए Webflow से Astro माइग्रेशन का एक हिस्सा एक्सपोर्ट है और एक हिस्सा रीबिल्ड। Webflow जो देता है उसे आप एक्सपोर्ट करते हैं, CMS को CSV में या API के ज़रिए बाहर निकालते हैं, हर टेम्पलेट को Astro कंपोनेंट के रूप में दोबारा बनाते हैं, फ़ॉर्म और सर्च के लिए नया इंतज़ाम करते हैं, जो इंटरैक्शन रखने हैं उन्हें दोबारा बनाते हैं और बदलने वाले हर URL को एक स्थायी रीडायरेक्ट देते हैं। इसी क्रम में किया जाए तो नई साइट का डिज़ाइन, कंटेंट और रैंकिंग, तीनों बने रहते हैं।

टीमें Webflow से Astro पर क्यों जाती हैं

Webflow एक मज़बूत विज़ुअल बिल्डर है, और कई मार्केटिंग टीमों को उसी पर बने रहना चाहिए। उसे छोड़ने की वजहें आमतौर पर डिज़ाइन से नहीं, बल्कि मालिकाना हक और खर्च से जुड़ी होती हैं:

  • साइट की ज़िम्मेदारी इंजीनियरिंग टीम के पास आ जाती है। जब ज़्यादातर बदलाव डेवलपर करते हैं, तो आपकी अपनी रिपॉज़िटरी में रखे कोडबेस पर काम करना विज़ुअल कैनवस से ज़्यादा तेज़ होता है, और वह आपके प्रोडक्ट, बैकएंड और टेस्ट के साथ रह सकता है।
  • हर साइट के प्लान का खर्च। Webflow के प्राइसिंग पेज पर, 13 अक्टूबर 2026 को देखने पर, Basic साइट प्लान USD 15 प्रति माह और Premium, यानी Webflow CMS वाला प्लान, USD 25 प्रति माह था, दोनों सालाना बिलिंग पर। लोकलाइज़ेशन एक ऐड-ऑन है, जो USD 9 प्रति माह से शुरू होता है।
  • ऐसे फ़ीचर जिन्हें असली बैकएंड चाहिए: आपके CRM में डेटा लिखने वाले फ़ॉर्म, गेटेड कंटेंट, एक से ज़्यादा साइटों में सर्च, या कुछ भी जिसे आपके अपने इन्फ्रास्ट्रक्चर पर चलना हो।
  • सिर्फ़ एक्सपोर्ट से आप बाहर नहीं निकल पाते। कोड एक्सपोर्ट के लिए सिर्फ़ साइट प्लान नहीं, बल्कि पेड Workspace प्लान चाहिए, और उसमें CMS शामिल नहीं होता। किसी भी हाल में, Webflow से साफ़-सुथरे ढंग से निकलने के लिए योजना चाहिए।

अगर आपकी मार्केटिंग टीम हर हफ़्ते विज़ुअली पेज पब्लिश करती है और साइट अपना काम कर रही है, तो Webflow पर बने रहना एक सही फ़ैसला है। माइग्रेशन से कुछ ठोस हासिल होना चाहिए।

Webflow के कोड एक्सपोर्ट में क्या आता है और क्या छूट जाता है

साइट का हिस्साकोड एक्सपोर्ट में?Astro में क्या करें
स्टैटिक पेजहाँ, .html फ़ाइलों के रूप में, सिर्फ़ प्राइमरी लोकेल मेंAstro पेज और कंपोनेंट के रूप में दोबारा बनाएँ
स्टाइलहाँ: आपकी साइट की CSS, webflow.css और normalize.cssरेफ़रेंस के तौर पर इस्तेमाल करें; सिर्फ़ ज़रूरी CSS रखें
इंटरैक्शन और कंपोनेंटहाँ, Webflow की JavaScript फ़ाइलों के ज़रिएCSS या एक छोटी स्क्रिप्ट से दोबारा बनाएँ
Assets पैनल की इमेजहाँastro:assets से ऑप्टिमाइज़ करें
CMS Collection आइटम और लिस्टनहीं; लिस्ट खाली दिखती हैंCSV में एक्सपोर्ट करें या API से पढ़ें
फ़ॉर्म सबमिशनप्रोसेसिंग नहीं होतीहर फ़ॉर्म को अपने एंडपॉइंट से जोड़ें
साइट सर्चनहींस्टैटिक सर्च इंडेक्स या कोई सर्च सर्विस जोड़ें
पासवर्ड प्रोटेक्शननहींपेजों को अपने होस्ट या ऐप में सुरक्षित करें
सेकेंडरी लोकेलनहीं; सिर्फ़ प्राइमरी लोकेलAstro की i18n रूटिंग से दोबारा बनाएँ
ईकॉमर्स, यूज़र अकाउंट, code componentsनहींहर एक को अलग प्रोजेक्ट की तरह प्लान करें

स्रोत: साइट कोड एक्सपोर्ट करने के बारे में Webflow का हेल्प आर्टिकल।

पब्लिश हुई Webflow साइटों की जाँच में हमने क्या देखा

13 अक्टूबर 2026 को हमने Webflow से बनी सात साइटों के होमपेज डाउनलोड किए, जिनमें खुद webflow.com भी शामिल थी, और देखा कि माइग्रेशन में किन चीज़ों को साथ ले जाना पड़ेगा:

  • सातों साइटें jQuery और अपनी इमेज Webflow के सर्वरों से लोड करती हैं। इमेज cdn.prod.website-files.com से आती हैं, और Webflow का अपना हेल्प सेंटर बताता है कि CSV में एक्सपोर्ट किए गए इमेज और फ़ाइल फ़ील्ड मूल प्रोजेक्ट की होस्टिंग के लिंक होते हैं, जो उस प्रोजेक्ट के डिलीट होते ही टूट जाते हैं (Webflow Help)। हर एसेट को डाउनलोड करके दोबारा होस्ट करना पड़ता है।
  • सातों अपनी सोशल शेयर इमेज भी Webflow से ही सर्व करती हैं। Open Graph इमेज को भूल जाना आसान है, और पुराना प्रोजेक्ट बंद होते ही LinkedIn या WhatsApp पर लिंक प्रीव्यू की इमेज गायब हो जाती है।
  • सातों अपनी CMS लिस्ट सीधे पब्लिश हुए HTML में रेंडर करती हैं, हर होमपेज पर 3 से 19 Collection lists। यह अच्छी खबर है: Framer साइट को, जैसा हमारी Framer से Astro गाइड में बताया गया है, लोड होने के बाद एक रनटाइम दोबारा बनाता है, जबकि पब्लिश हुआ Webflow पेज इस बात का पूरा रेफ़रेंस है कि कौन-सा कंटेंट कहाँ जाता है, भले ही कोड एक्सपोर्ट में ये लिस्ट खाली आती हों।
  • सात में से पाँच साइटें Webflow Interactions इस्तेमाल करती हैं, जिनकी पहचान data-w-id एट्रिब्यूट से होती है; एक ही होमपेज पर ऐसे एलिमेंट 109 तक थे। हर इंटरैक्शन या तो दोबारा बनाया जाने वाला एक छोटा-सा बिहेवियर है, या उसे हटाने का फ़ैसला।

Webflow से Astro, चरण दर चरण

  1. हर URL की सूची बनाएँ। संबंधित विकल्प चालू होने पर Webflow /sitemap.xml अपने-आप बनाता है (Webflow Help)। हर Collection पेज जोड़ें, Google Search Console से उपलब्ध सबसे लंबी अवधि की Pages रिपोर्ट निकालें, और Site settings, Publishing से अपने मौजूदा 301 रीडायरेक्ट CSV में एक्सपोर्ट करें (Webflow Help)।
  2. कंटेंट एक्सपोर्ट करें। हर CMS Collection को CMS पैनल से CSV में एक्सपोर्ट करें, अगर आप Localize इस्तेमाल करते हैं तो हर लोकेल के लिए एक बार, और Item ID कॉलम संभालकर रखें। CSV में संरचना सपाट हो जाती है: reference फ़ील्ड सादे टेक्स्ट के रूप में, multi-reference कॉमा से अलग किए गए टेक्स्ट के रूप में और rich text HTML के रूप में आता है। जिस भी कंटेंट में reference हों, उसके लिए Webflow Data API आइटम को उनके फ़ील्ड और लोकेल के साथ लिस्ट करती है, जो आमतौर पर CSV फ़ाइलों को फिर से जोड़ने से ज़्यादा साफ़ तरीका है।
  3. हर एसेट डाउनलोड करें। इमेज, PDF, वे फ़ॉन्ट जिन्हें सेल्फ़-होस्ट करने का लाइसेंस आपके पास है, Open Graph इमेज और favicon। जब तक नई साइट website-files.com की ओर इशारा करना बंद न कर दे, Webflow प्रोजेक्ट बंद न करें।
  4. कोड को रेफ़रेंस के तौर पर एक्सपोर्ट करें। अगर आप पेड Workspace प्लान पर हैं, तो HTML और CSS एक्सपोर्ट करें। इसे नई साइट के रूप में डिप्लॉय न करें: इसके साथ webflow.js, jQuery और खाली CMS लिस्ट आएँगी। इसका इस्तेमाल सटीक स्पेसिंग, ब्रेकपॉइंट और क्लास स्ट्रक्चर पढ़ने के लिए करें।
  5. Astro में कंटेंट मॉडल करें। हर Collection को Astro के content collection या headless CMS मॉडल में बदलें, reference को reference ही रहने दें, फिर हर टेम्पलेट को Astro कंपोनेंट के रूप में दोबारा बनाएँ और इमेज को astro:assets में ले जाएँ।
  6. वही इंटरैक्शन दोबारा बनाएँ जिनका कोई मतलब है। ज़्यादातर Webflow Interactions CSS transitions, keyframes या JavaScript की कुछ लाइनें बन जाते हैं। भारी मोशन के लिए GSAP है, जिसे Webflow ने अप्रैल 2025 में कमर्शियल इस्तेमाल के लिए मुफ़्त कर दिया था (Webflow)। दोनों ही सूरतों में prefers-reduced-motion का सम्मान करें।
  7. फ़ॉर्म, सर्च और सुरक्षित पेजों का नया इंतज़ाम करें। हर फ़ॉर्म को एक असली एंडपॉइंट दें (Cloudflare Worker, कोई फ़ॉर्म सर्विस या आपका CRM), अगर साइट को सर्च चाहिए तो Pagefind जैसा स्टैटिक सर्च इंडेक्स जोड़ें, और पासवर्ड प्रोटेक्शन को अपने होस्ट या ऐप पर ले जाएँ।
  8. लोकलाइज़ किए गए पेज ठीक से दोबारा बनाएँ। कोड एक्सपोर्ट में सिर्फ़ प्राइमरी लोकेल आता है, इसलिए हर भाषा को Astro की i18n रूटिंग से बनाएँ: हर भाषा के लिए एक URL, और उनके बीच hreflang।
  9. URL का फ़ॉर्मेट मिलाएँ। Webflow पेजों को बिना ट्रेलिंग स्लैश के सर्व करता है और /pricing/ को /pricing पर रीडायरेक्ट करता है। Astro में trailingSlash और build.format ऐसे सेट करें कि नई साइट वही पते बनाए (Astro कॉन्फ़िगरेशन रेफ़रेंस); हर अंतर एक ऐसा रीडायरेक्ट है जिसकी आपको ज़रूरत नहीं थी।
  10. रीडायरेक्ट सर्वर पर करें, फिर लॉन्च करें और नज़र रखें। बिना एडैप्टर वाला स्टैटिक Astro बिल्ड कॉन्फ़िगर किए गए रीडायरेक्ट को meta-refresh पेजों में बदल देता है, इसलिए जहाँ साइट होस्ट है वहीं 1:1 301 रीडायरेक्ट सेट करें, जैसे Cloudflare की _redirects फ़ाइल में। DNS बदलें, नई साइट वेरिफ़ाई होने तक Webflow प्रोजेक्ट बनाए रखें, और अगले कुछ हफ़्तों तक Search Console की इंडेक्सिंग रिपोर्ट देखते रहें। हमारी वेबसाइट माइग्रेशन SEO चेकलिस्ट लॉन्च के दिन और उसके बाद के 90 दिनों को कवर करती है।

माइग्रेशन के बाद क्या बदलता है

क्षेत्रWebflow परAstro पर
एडिटिंगविज़ुअल Designer और Webflow CMS एडिटरCMS फ़ील्ड या कोड, जो भी आप चुनें
होस्टिंगWebflow की होस्टिंग, हर साइट का अलग बिलकोई भी स्टैटिक होस्ट या एज प्लेटफ़ॉर्म, जैसे Cloudflare
CMSWebflow CollectionsContent collections या headless CMS
फ़ॉर्मWebflow की फ़ॉर्म हैंडलिंगआपका अपना एंडपॉइंट और स्टोरेज
सर्चWebflow साइट सर्च (Premium)स्टैटिक इंडेक्स या कोई सर्च सर्विस
लोकलाइज़ेशनWebflow Localize ऐड-ऑनAstro की i18n रूटिंग, हर भाषा के लिए एक URL
मोशनWebflow Interactions और GSAPCSS और JavaScript, जो आपके अपने हैं और जिन्हें आप माप सकते हैं

SEO को सुरक्षित रखना

Google की URL बदलाव के साथ साइट मूव की गाइड यहाँ भी लागू होती है: हर पुराने URL को उसके सबसे नज़दीकी नए समकक्ष से मैप करें, स्थायी सर्वर-साइड रीडायरेक्ट इस्तेमाल करें और उन्हें कम से कम एक साल तक रखें। अगर URL बिल्कुल वही रहते हैं, जो Webflow के मामले में सावधानी से किए गए रीबिल्ड में अक्सर संभव होता है, तो ज़्यादातर आपको बस यह जाँचना है कि टाइटल, डिस्क्रिप्शन, canonical टैग, स्ट्रक्चर्ड डेटा और Open Graph इमेज नई साइट पर ठीक से आ गए हैं।

Webflow से जुड़े खास जाल पीछे छूटी चीज़ें हैं: website-files.com से अब भी सर्व हो रही कोई Open Graph इमेज या PDF, अब भी इंडेक्स हुआ webflow.io का स्टेजिंग पता, या कोई CMS पेज जिसका slug माइग्रेशन में बदल गया। Webflow प्रोजेक्ट बंद करने से पहले इन तीनों की जाँच करें।

Dardo Webflow माइग्रेशन कैसे करता है

हम Webflow से माइग्रेशन अपनी वेबसाइट माइग्रेशन सेवा के तहत करते हैं: URL और कंटेंट की सूची, CMS एक्सपोर्ट, पहले एक प्रतिनिधि पेज दोबारा बनाकर तय की गई चौड़ाइयों पर उसकी समीक्षा, फिर बाकी टेम्पलेट, फ़ॉर्म और रीडायरेक्ट। बिल्ड अपने आप में Astro में वेब डेवलपमेंट है, और मोशन का काम क्रिएटिव डेवलपमेंट के तहत आता है। यह साइट, dardo.studio, Cloudflare Workers पर Astro से चलती है और इसका कंटेंट एक headless CMS में है; यह ब्लॉग भी हम उसी CMS के ज़रिए लिखते और पब्लिश करते हैं।

अगर आप Webflow छोड़ने पर विचार कर रहे हैं, तो हमें अपनी साइट भेजें और बताएँ कि आप क्या बदलना चाहते हैं। कोटेशन देने से पहले हम बताएँगे कि Webflow छोड़ना फ़ायदेमंद है या नहीं।

आम सवाल

क्या मैं अपनी Webflow साइट को HTML में एक्सपोर्ट कर सकता हूँ?

हाँ, पेड Workspace प्लान पर: Webflow HTML, CSS, JavaScript और इमेज एक्सपोर्ट करता है, और आप उन्हें बिना एट्रिब्यूशन के कहीं भी होस्ट कर सकते हैं। सिर्फ़ साइट प्लान में कोड एक्सपोर्ट शामिल नहीं है, और एक्सपोर्ट में CMS कंटेंट, फ़ॉर्म प्रोसेसिंग, साइट सर्च, पासवर्ड प्रोटेक्शन और सेकेंडरी लोकेल शामिल नहीं होते।

क्या Webflow के कोड एक्सपोर्ट में CMS कंटेंट शामिल होता है?

नहीं। Collection lists खाली दिखती हैं और Collection पेजों से उनके फ़ील्ड से जुड़ा कंटेंट गायब हो जाता है। हर Collection को CMS पैनल से CSV में एक्सपोर्ट करें, या Webflow Data API से पढ़ें, जो फ़ील्ड और लोकेल को एक साथ रखती है।

क्या Webflow से Astro पर जाने से मेरी Google रैंकिंग चली जाएगी?

नहीं, अगर ट्रैफ़िक लाने वाला हर URL काम करता रहे। वही पाथ रखें, Webflow का बिना ट्रेलिंग स्लैश वाला फ़ॉर्मेट भी, जो भी बदले उसके लिए स्थायी 301 रीडायरेक्ट जोड़ें, टाइटल, डिस्क्रिप्शन और स्ट्रक्चर्ड डेटा साथ ले जाएँ, और लॉन्च के बाद कुछ हफ़्तों तक Search Console पर नज़र रखें।

क्या Webflow इंटरैक्शन Astro में चलते हैं?

जैसे के तैसे नहीं। वे Webflow की JavaScript पर चलते हैं, इसलिए जो भी इंटरैक्शन आप रखते हैं उसे CSS या एक छोटी स्क्रिप्ट से दोबारा बनाया जाता है। भारी मोशन के लिए, GSAP अप्रैल 2025 से कमर्शियल इस्तेमाल के लिए मुफ़्त है।

माइग्रेशन के बाद Webflow फ़ॉर्म का क्या होता है?

एक्सपोर्ट किए गए फ़ॉर्म कहीं सबमिट नहीं होते, क्योंकि Webflow सबमिशन अपनी ही होस्टिंग पर प्रोसेस करता है। हर फ़ॉर्म को अपने एंडपॉइंट से जोड़ें, जैसे Cloudflare Worker, कोई फ़ॉर्म सर्विस या आपका CRM, लॉन्च से पहले डिलीवरी टेस्ट करें, और पुराने सबमिशन Webflow से अलग से एक्सपोर्ट करें।

Webflow छोड़ने के बाद क्या मेरी टीम बिना कोड के साइट एडिट कर पाएगी?

हाँ, अगर Astro साइट headless CMS इस्तेमाल करती है। एडिटर एक वेब इंटरफ़ेस में काम करते हैं और साइट उसी कंटेंट से दोबारा बिल्ड होती है। dardo.studio इसी तरह काम करती है।

स्रोत और आगे पढ़ें

इस पेज के स्रोत, साथ में मूल प्रकाशकों से और जानकारी।