2026 में मुफ्त में Static Website कैसे होस्ट करें: GitHub Pages, Cloudflare Pages और Contact Forms

सही स्टैटिक वेबसाइट होस्टिंग प्लेटफ़ॉर्म चुनने से आप हर साल सैकड़ों डॉलर बचा सकते हैं - और साथ ही आपकी साइट तेज़, सुरक्षित और मेंटेन करने में आसान रहती है। फ्री टियर विकल्प अब काफी परिपक्व हो चुके हैं, और GitHub Pages तथा Cloudflare Pages जैसे प्लेटफ़ॉर्म बिना किसी लागत के प्रोडक्शन-रेडी इन्फ्रास्ट्रक्चर देते हैं। लेकिन एक चुनौती है जिसे ज़्यादातर ट्यूटोरियल छोड़ देते हैं: जब कोई सर्वर नहीं है तो स्टैटिक साइट पर कॉन्टैक्ट फ़ॉर्म कैसे काम करेगा? यह गाइड आपको पूरा सेटअप प्रोसेस समझाती है - प्लेटफ़ॉर्म चुनने से लेकर काम करने वाला कॉन्टैक्ट फ़ॉर्म लगाने तक, ठोस उदाहरणों के साथ और उन असली सीमाओं के बारे में भी जो आपको पहले जाननी चाहिए।

फ्री स्टैटिक होस्टिंग क्यों है फायदेमंद

एक स्टैटिक वेबसाइट पहले से बने HTML, CSS और JavaScript फ़ाइलें सीधे ब्राउज़र को सर्व करती है। इसमें कोई PHP नहीं, कोई Node.js रनटाइम नहीं, और हर पेज लोड पर कोई डेटाबेस क्वेरी नहीं। यही सादगी फ्री स्टैटिक पेज होस्टिंग को इतना भरोसेमंद बनाती है: क्रैश होने, पैच करने या स्केल करने के लिए कुछ है ही नहीं।

छोटे बिज़नेस, पोर्टफोलियो, SaaS लैंडिंग पेज और डॉक्युमेंटेशन साइट्स के लिए स्टैटिक होस्टिंग हर मानदंड पर खरी उतरती है:

• स्पीड: फ़ाइलें CDN एज नोड से सर्व होती हैं, अक्सर ग्लोबली 100ms से भी कम में।
• सुरक्षा: सर्वर-साइड रनटाइम न होने से अटैक सर्फेस काफी कम हो जाती है।
• लागत: GitHub Pages और Cloudflare Pages दोनों पब्लिक और कई प्राइवेट प्रोजेक्ट्स के लिए मुफ्त हैं।
• सरलता: रिपोज़िटरी में कोड पुश करें और साइट अपने आप डिप्लॉय हो जाती है।

एकमात्र असली सीमा है डायनामिक फंक्शनैलिटी। जिस भी चीज़ में सर्वर-साइड लॉजिक चाहिए - जैसे यूज़र ऑथेंटिकेशन, शॉपिंग कार्ट या फ़ॉर्म प्रोसेसिंग - उसके लिए किसी एक्सटर्नल सर्विस की ज़रूरत होगी। सेटअप स्टेप्स देखते वक्त यह बात ध्यान में रखें।

प्लेटफ़ॉर्म तुलना: GitHub Pages बनाम Cloudflare Pages

सारांश: अगर आपका ऑडियंस ग्लोबल है और आप सबसे तेज़ लोड टाइम चाहते हैं, तो Cloudflare Pages बेहतर है। अगर आपकी टीम पहले से GitHub पर काम करती है और आप सबसे सरल सेटअप चाहते हैं, तो GitHub Pages बिल्कुल ठीक है।

स्टेप-बाय-स्टेप: GitHub Pages पर डिप्लॉय करें

यह उदाहरण मानता है कि आपके पास पब्लिश करने के लिए एक सिंपल HTML/CSS साइट तैयार है। अगर आप Hugo या Jekyll जैसा स्टैटिक साइट जनरेटर इस्तेमाल कर रहे हैं, तो प्रोसेस लगभग एक जैसी है।

1. GitHub रिपोज़िटरी बनाएं। github.com/new पर जाएं और एक पब्लिक रिपोज़िटरी बनाएं। अगर आप इसे रूट डोमेन पर सर्व करना चाहते हैं तो इसका नाम your-username.github.io रखें, या कोई भी नाम रखें अगर इसे सबडायरेक्टरी पाथ पर चाहते हैं।
2. साइट फ़ाइलें पुश करें। अपने लोकल प्रोजेक्ट फ़ोल्डर से यह कमांड चलाएं:

   git init
   git remote add origin https://github.com/your-username/your-repo.git
   git add .
   git commit -m "Initial deploy"
   git push -u origin main

3. GitHub Pages सक्षम करें। रिपोज़िटरी में Settings > Pages पर जाएं। "Source" के अंतर्गत main ब्रांच और /root फ़ोल्डर चुनें (या /docs अगर आपका बिल्ड आउटपुट वहाँ जाता है)। Save पर क्लिक करें।
4. डिप्लॉयमेंट का इंतज़ार करें। GitHub 1-3 मिनट में बिल्ड और डिप्लॉय कर देगा। Pages सेटिंग्स पैनल में लाइव URL (जैसे https://your-username.github.io) दिखने लगेगा।
5. कस्टम डोमेन जोड़ें (वैकल्पिक)। अपनी रिपोज़िटरी रूट में एक CNAME फ़ाइल जोड़ें जिसमें आपका डोमेन नाम हो (जैसे www.yoursite.com)। फिर अपने DNS प्रोवाइडर पर CNAME रिकॉर्ड को your-username.github.io की तरफ पॉइंट करने के लिए अपडेट करें। GitHub कुछ ही मिनटों में SSL सर्टिफिकेट अपने आप प्रोविज़न कर देगा।

स्टेप-बाय-स्टेप: Cloudflare Pages पर डिप्लॉय करें

1. Cloudflare पर साइन अप करें या लॉग इन करें। pages.cloudflare.com पर जाएं और अपना GitHub या GitLab अकाउंट कनेक्ट करें।
2. नया प्रोजेक्ट बनाएं। "Create a project" पर क्लिक करें, फिर "Connect to Git" पर। लिस्ट से अपनी रिपोज़िटरी चुनें।
3. बिल्ड सेटिंग्स कॉन्फिगर करें। अगर आपकी साइट सादा HTML है, तो बिल्ड कमांड खाली छोड़ें और आउटपुट डायरेक्टरी / या जहाँ आपका index.html है वहाँ सेट करें। Hugo के लिए बिल्ड कमांड hugo और आउटपुट public सेट करें। Jekyll के लिए jekyll build और आउटपुट _site इस्तेमाल करें।
4. डिप्लॉय करें। "Save and Deploy" पर क्लिक करें। Cloudflare आपकी रिपोज़िटरी क्लोन करेगा, बिल्ड रन करेगा और ग्लोबल एज नेटवर्क पर पब्लिश करेगा। आपकी साइट को तुरंत एक *.pages.dev सबडोमेन मिल जाएगा।
5. कस्टम डोमेन जोड़ें। अपने प्रोजेक्ट डैशबोर्ड में "Custom domains" पर जाएं और अपना डोमेन दर्ज करें। अगर आपका डोमेन पहले से Cloudflare DNS पर मैनेज हो रहा है, तो सेटअप एक क्लिक में हो जाता है। अगर नहीं, तो आपको अपने रजिस्ट्रार पर एक CNAME रिकॉर्ड जोड़ना होगा जो आपके *.pages.dev एड्रेस की तरफ पॉइंट करे।

मेन ब्रांच पर हर बाद का git push ऑटोमेटिक रिडिप्लॉय ट्रिगर करता है। Cloudflare पुल रिक्वेस्ट के लिए प्रीव्यू डिप्लॉयमेंट भी बनाता है, जो लाइव होने से पहले बदलाव रिव्यू करने में उपयोगी है।

स्टैटिक साइट पर कॉन्टैक्ट फ़ॉर्म कैसे जोड़ें

यहीं पर ज़्यादातर गाइड रुक जाती हैं, और यहीं ज़्यादातर लोग अटक जाते हैं। स्टैटिक वेबसाइट पर कॉन्टैक्ट फ़ॉर्म अपने आप डेटा सबमिट नहीं कर सकता - कोई सर्वर सुन नहीं रहा। आपके पास तीन व्यावहारिक विकल्प हैं:

• फ़ॉर्म बैकएंड सर्विस (अनुशंसित): आप अपने फ़ॉर्म के action एट्रिब्यूट को किसी थर्ड-पार्टी एंडपॉइंट की तरफ पॉइंट करते हैं जो सबमिशन रिसीव करता है, वैलिडेट करता है और आपको ईमेल करता है।
• सर्वरलेस फंक्शन: आप एक छोटा फंक्शन (Cloudflare Workers, AWS Lambda) लिखते हैं जो फ़ॉर्म प्रोसेस करे। यह काम करता है लेकिन इसमें कोड और चल रही मेंटेनेंस चाहिए।
• JavaScript fetch(): आप ब्राउज़र का fetch API इस्तेमाल करके फ़ॉर्म डेटा किसी बैकएंड एंडपॉइंट पर पोस्ट करते हैं। तकनीकी विवरण के लिए हमारी गाइड देखें: JavaScript fetch() से HTML फ़ॉर्म डेटा कैसे भेजें।

काम करने वाला फ़ॉर्म बनाने का सबसे तेज़ तरीका है एक डेडिकेटेड फ़ॉर्म सर्विस। यहाँ Sendform का उपयोग करते हुए एक ठोस उदाहरण है:

ठोस उदाहरण: 5 मिनट में काम करने वाला कॉन्टैक्ट फ़ॉर्म

अपनी साइट में कोई कोड जोड़ने से पहले, आपको Sendform अकाउंट सेट अप करना होगा और एक फ़ॉर्म एंडपॉइंट बनाना होगा। इस प्रोसेस में लगभग दो मिनट लगते हैं:

1. Sendform.net पर रजिस्टर करें। एक मुफ्त अकाउंट बनाएं - क्रेडिट कार्ड की ज़रूरत नहीं। रजिस्ट्रेशन के बाद एक डिफ़ॉल्ट प्रोजेक्ट तैयार होगा।
2. फ़ॉर्म बनाएं। अपने डैशबोर्ड में "New Form" पर क्लिक करें। इसे एक नाम दें, एक प्रोजेक्ट चुनें और वह ईमेल एड्रेस डालें जहाँ आप सबमिशन पाना चाहते हैं। Sendform एंडपॉइंट एक्टिवेट करने से पहले इस एड्रेस को वेरिफाई करेगा।
3. अपना एंडपॉइंट URL कॉपी करें। फ़ॉर्म बनने के बाद आपको https://sendform.net/!your-form-id फॉर्मेट में एक यूनिक एंडपॉइंट URL दिखेगा। इसे कॉपी करें - यही आप अपने HTML में पेस्ट करेंगे।

एंडपॉइंट मिलने के बाद, अपनी स्टैटिक साइट में निम्नलिखित HTML जोड़ें:

<form action="https://sendform.net/!your-form-id" method="POST">
  <label for="name">Your Name</label>
  <input type="text" id="name" name="name" required>

  <label for="email">Your Email</label>
  <input type="email" id="email" name="email" required>

  <label for="message">Message</label>
  <textarea id="message" name="message" rows="5" required></textarea>

  <button type="submit">Send Message</button>
</form>

your-form-id की जगह अपने Sendform डैशबोर्ड में दिखने वाली ID डालें। हर सबमिशन उस ईमेल एड्रेस पर भेजा जाएगा जो आपने सेटअप के दौरान कन्फर्म किया था। न बैकएंड कोड, न सर्वर, न कोई मासिक इन्फ्रास्ट्रक्चर बिल। सबमिशन के बाद रीडायरेक्ट पेज और कन्फर्मेशन ईमेल जैसे एडवांस्ड UX पैटर्न के लिए हमारी गाइड पढ़ें: स्टैटिक वेबसाइट फ़ॉर्म के बेस्ट प्रैक्टिस।

अगर आप अपनी स्टैटिक साइट के साथ कोई वेबसाइट बिल्डर भी इस्तेमाल कर रहे हैं, तो इंटीग्रेशन प्रोसेस के बारे में हमारा विस्तृत लेख देखें: Sendform को अपने वेबसाइट बिल्डर के साथ कैसे इंटीग्रेट करें।

इन गलतियों से बचें

हज़ारों यूज़र्स को फ्री स्टैटिक वेब होस्टिंग सेट अप करने में मदद करने के बाद, ये वे गलतियाँ हैं जो सबसे ज़्यादा परेशानी पैदा करती हैं:

1. 404 पेज भूल जाना

GitHub Pages और Cloudflare Pages दोनों एक जेनेरिक एरर पेज दिखाते हैं जब कोई रूट नहीं मिलता। अपनी रूट डायरेक्टरी में एक कस्टम 404.html फ़ाइल बनाएं। इससे यूज़र आपकी साइट पर बने रहते हैं और उनका अनुभव सुरक्षित रहता है।

2. पब्लिक रिपोज़िटरी में सीक्रेट कमिट करना

API कीज़, फ़ॉर्म एंडपॉइंट सीक्रेट और ईमेल एड्रेस कभी भी पब्लिक GitHub रिपोज़िटरी में नहीं होने चाहिए। Cloudflare Pages में एनवायरनमेंट वेरिएबल इस्तेमाल करें, या .gitignore में लिस्टेड एक प्राइवेट कॉन्फिगरेशन फ़ाइल रेफर करें।

3. बैकएंड प्लान के बिना फ़ॉर्म बनाना

यह सबसे आम गलती है। डेवलपर्स एक सुंदर कॉन्टैक्ट फ़ॉर्म बनाते हैं, GitHub Pages पर पुश करते हैं, और लॉन्च के दिन पता चलता है कि फ़ॉर्म चुपचाप फेल हो रहा है। एक भी <input> टैग लिखने से पहले अपना फ़ॉर्म बैकएंड तय करें। Sendform जैसे टूल आपको बिना किसी कोड के ईमेल पर सीधे सबमिशन भेजने वाला कॉन्टैक्ट फ़ॉर्म सेट अप करने देते हैं, जिससे बैकएंड की समस्या पूरी तरह खत्म हो जाती है।

4. बिल्ड कैश समस्याओं को नज़रअंदाज़ करना

अगर पुश करने के बाद आपकी साइट अपडेट नहीं हो रही, तो CDN कैश पुरानी फ़ाइलें सर्व कर रहा हो सकता है। Cloudflare Pages डिप्लॉयमेंट पर अपना कैश अपने आप पर्ज करता है। GitHub Pages पर बदलाव फैलने में ज़्यादा समय लगता है; 10 मिनट तक इंतज़ार करें, या टेस्टिंग के दौरान अपने एसेट URLs में क्वेरी स्ट्रिंग जोड़ें।

5. रिलेटिव पाथ गलत इस्तेमाल करना

अगर आपकी GitHub Pages साइट username.github.io/project-name/ (एक सबडायरेक्टरी) पर है, तो सभी एसेट पाथ में वह प्रीफिक्स होना चाहिए। /styles.css का लिंक टूट जाएगा। रिलेटिव पाथ (./styles.css) इस्तेमाल करें या अपने स्टैटिक साइट जनरेटर की baseURL सेटिंग को सबडायरेक्टरी से मैच करने के लिए कॉन्फिगर करें।

6. फ़ॉर्म वर्कफ़्लो ऑटोमेशन छोड़ना

एक बार जब आपका फ़ॉर्म सबमिशन कलेक्ट करने लगे, तो आप सिर्फ ईमेल पाने से कहीं ज़्यादा कर सकते हैं। Sendform वेबहुक और इंटीग्रेशन सपोर्ट करता है जो सबमिशन को Slack, किसी CRM या स्प्रेडशीट पर अपने आप रूट करने देता है। हमारी गाइड देखें: वेबहुक और API से फ़ॉर्म वर्कफ़्लो ऑटोमेट कैसे करें - बिना बैकएंड कोड लिखे।

निष्कर्ष

फ्री स्टैटिक वेबसाइट होस्टिंग पहले से कहीं ज़्यादा सक्षम हो गई है। GitHub Pages उन टीमों के लिए उपयुक्त है जो पहले से GitHub इकोसिस्टम में हैं, जबकि Cloudflare Pages बेहतर ग्लोबल परफॉर्मेंस और ज़्यादा उदार फ्री टियर देता है। असली चुनौती होस्टिंग नहीं है - बल्कि डायनामिक फीचर्स हैं, खासकर कॉन्टैक्ट फ़ॉर्म, जो लोगों को उलझाते हैं। किसी भी प्लेटफ़ॉर्म को एक डेडिकेटेड फ़ॉर्म सर्विस के साथ जोड़कर आप बिना किसी इन्फ्रास्ट्रक्चर लागत के पूरी तरह फंक्शनल, प्रोफेशनल वेबसाइट पा सकते हैं। ऊपर दिए गए प्लेटफ़ॉर्म गाइड में से किसी एक से शुरुआत करें, अपनी साइट लाइव करें, और फिर Sendform से अपना कॉन्टैक्ट फ़ॉर्म वायर अप करें ताकि पहले दिन से सबमिशन भरोसेमंद तरीके से मिलें।

मिनटों में अपनी स्टैटिक साइट पर कॉन्टैक्ट फ़ॉर्म जोड़ें

Sendform का उपयोग करके GitHub Pages या Cloudflare Pages पर होस्ट किसी भी स्टैटिक साइट से फ़ॉर्म सबमिशन कलेक्ट करें। न बैकएंड कोड, न सर्वर सेटअप, न कोई झंझट। बस अपने फ़ॉर्म के action एट्रिब्यूट को अपने एंडपॉइंट की तरफ पॉइंट करें और काम हो गया।

Sendform.net पर मुफ्त शुरुआत करें →

अक्सर पूछे जाने वाले सवाल