HTML ज्ञान के बिना साइट बनाएं? वेबसाइट बनाने के लिए ऑनलाइन संपादकों की लोकप्रियता बढ़ रही है, अक्सर सुंदर टेम्पलेट्स के कारण। यदि आप ऐसे तैयार डिज़ाइन से शुरू नहीं करना पसंद करते हैं, जो अक्सर एक भुगतान विकल्प में समाप्त होता है, तो रॉकेटकेक एक डेस्कटॉप प्रोग्राम है जिसके साथ आप कुछ भी नहीं से एक सुंदर साइट बना सकते हैं।
अंग्रेजी भाषा के कार्यक्रम में प्रेरणा के लिए केवल पंद्रह टेम्पलेट (टेम्पलेट्स) हैं। विचार यह है कि रॉकेटकेक के साथ आप अपनी खुद की साइट बनाते हैं जिसे आप बाद में आसानी से अपडेट कर सकते हैं। रॉकेटकेक एक तथाकथित WYSIWYG संपादक है। इसलिए आपको कोई HTML कोड टाइप करने की जरूरत नहीं है। आप काम की सतह पर तत्वों को रखकर और फिर केस को अपलोड करके अपनी साइट को एक साथ रखते हैं। तत्वों में टेक्स्ट बॉक्स, बटन, चित्र, मेनू, स्लाइडशो, मूवी, ऑडियो क्लिप और बहुत कुछ शामिल हैं। रॉकेटकेक जो खास बनाता है वह यह है कि यह तथाकथित उत्तरदायी वेबसाइट बनाने के लिए एक संपादक है। ऐसी प्रतिक्रियाशील वेबसाइट मोबाइल के अनुकूल होती है, क्योंकि लेआउट उस डिवाइस की स्क्रीन के अनुकूल हो जाता है जिसके साथ कोई साइट पर जाता है।
एक उत्तरदायी वेब पेज अभी भी साफ-सुथरा दिखेगा, चाहे आप इसे बड़े मॉनिटर या छोटे स्मार्टफोन स्क्रीन पर देखें। इसके लिए वेबसाइट कई भागों को समायोजित करेगी, जैसे कि फ़ॉन्ट आकार, कुछ तत्वों की व्यवस्था और स्क्रीन पर मेनू प्रदर्शित करने का तरीका।
यहां रॉकेटकेक डाउनलोड करें। विंडोज़ के लिए एक संस्करण है और मैकोज़ के लिए एक संस्करण है। इस वर्कशॉप में हम फ्री एडिशन का इस्तेमाल करते हैं। इससे सुचारू रूप से कार्य करने वाली उत्तरदायी वेबसाइट बनाना आसान हो जाता है। रॉकेटकेक का एक पेशेवर संस्करण भी है, जिसकी कीमत 39 यूरो है। पेशेवर संस्करण आपको असीमित संख्या में वेबसाइट बनाने की अनुमति देता है। सीएसएस समर्थन भी है, जिसके साथ आप पूरी साइट पर लेआउट शैलियों को जल्दी से समायोजित कर सकते हैं। रॉकेटकेक के संस्करण 3.1 में सुधार किया गया है ताकि आपकी वेबसाइट Google और अन्य खोज इंजनों के साथ बेहतर रैंक कर सके। इसके अलावा, मुफ्त संस्करण में कुछ विशेषताएं शामिल हैं जो पहले केवल भुगतान किए गए संस्करण में थीं।
काम का माहौल और प्रदर्शन
कार्यस्थान के शीर्ष पर एक नया पृष्ठ जोड़ने, इंटरनेट एक्सप्लोरर के साथ पूर्वावलोकन करने और वेबसाइट को इंटरनेट पर प्रकाशित करने के लिए बटनों वाला बार है। दाईं ओर आप पाएंगे टूलसेट उन सभी तत्वों के साथ जिन्हें आप वेब पेज पर रख सकते हैं। ऊपर बाईं ओर आप अपनी वेबसाइट के सभी पृष्ठों की संरचना देखते हैं।
नीचे हैं गुण। यहां आप अपने द्वारा चुने गए प्रत्येक तत्व के गुणों को बदलते हैं। मान लीजिए कि आप किसी पृष्ठ पर एक छवि जोड़ना चाहते हैं, तो आप गुणों में छवि फ़ाइल का चयन करते हैं और इंगित करते हैं कि छवि में गोल या नुकीले कोने होने चाहिए और इसी तरह ...
सबसे नीचे आप डिस्प्ले की चौड़ाई निर्धारित करते हैं। डिफ़ॉल्ट रूप से, वह है डेस्कटॉप-प्रदर्शन। नीचे बाईं ओर छोटे ड्रॉप-डाउन मेनू के माध्यम से आप आईफोन, आईपैड, सैमसंग गैलेक्सी, एलजी जैसे कई लोकप्रिय मोबाइल उपकरणों के प्रदर्शन में भी काम कर सकते हैं ... यदि आपको इसमें वांछित चौड़ाई नहीं मिलती है मेनू में, आप कस्टम का चयन भी कर सकते हैं और स्क्रीन पर प्रदर्शित होने के लिए एक स्लाइडर निर्दिष्ट चौड़ाई निर्दिष्ट कर सकते हैं। वह चौड़ाई सेटिंग ब्रेकप्वाइंट निर्धारित करने के लिए महत्वपूर्ण है, जिस पर हम बाद में चर्चा करेंगे।
रंग और होमपेज
आइए होम पेज से शुरू करते हैं। इस उदाहरण में, हम एक महत्वाकांक्षी रॉक बैंड की वेबसाइट बना रहे हैं। टेम्पलेट से शुरू करने के बजाय, चुनें खाली पृष्ठ. गुण अनुभाग आपके द्वारा चुने गए प्रत्येक तत्व के अनुकूल होगा। उदाहरण के लिए, पहले पृष्ठ की पृष्ठभूमि पर क्लिक करें, फिर आप पहुंच सकते हैं पीछे का रंग एक पृष्ठभूमि रंग चुनें। डिफ़ॉल्ट रूप से 000000 है, सफेद के लिए एचटीएमएल कोड। तीन बिंदुओं वाले बॉक्स पर क्लिक करके आप रंग बीनने वाले को लाते हैं। प्रॉपर्टीज में आप इस वेबपेज को एक टाइटल देते हैं। यह जल्द ही ब्राउज़र विंडो के शीर्ष पर दिखाई देगा। होमपेज का नाम index.html पर छोड़ दें। एक ब्राउज़र हमेशा होमपेज के रूप में प्रदर्शित करने के लिए इंडेक्स पेज की तलाश करता है।
इसके नीचे आप चार प्रकार के हाइपरलिंक के रंग निर्धारित करते हैं। लिंक रंग उन लिंक का रंग निर्धारित करता है जिन्हें अभी तक नहीं देखा गया है, LinkColorActive लिंक को संदर्भित करता है कि कोई वर्तमान में जा रहा है, लिंककलरहोवर एक लिंक का रंग है जिस पर माउस पॉइंटर इंगित कर रहा है और LinkColor विज़िट किया गया उन लिंक्स को संदर्भित करता है जिन्हें कोई पहले ही देख चुका है।
नेविगेशन बार और इंट्रो इमेज
नेविगेशन बार लगाने के लिए, टूलसेट में आइटम का चयन करें संचालन सूची और फिर कार्यक्षेत्र पर क्लिक करें। इस नेविगेशन बार में आप वह मेनू आइटम टाइप करते हैं जिसके लिए आप वेब पेज बनाना चाहते हैं। उन चीजों के नाम छोटे रखें। हमारे उदाहरण में ये हैं द बैंड, हू, व्हेयर, व्हेन, व्हाई और मीडिया। शीर्ष पर उन नेविगेशन आइटम के टेक्स्ट को प्रारूपित करने के लिए बटन हैं। यदि आप नेविगेशन बार पर ही क्लिक करते हैं, तो आप गुण में बार के रंग और आकार को समायोजित करते हैं। इस तरह आप कर सकते हैं पृष्ठभूमि फैशन के लिए चुनें रंग, छवि, ढाल तथा स्टाइल बटन. ग्रैडिएंट में आप ट्रांजिशन के कलर टोन निर्धारित करते हैं और स्टाइल बटन में मेन्यू बार को गोलाकार रूप मिलता है।
हम एक बैनर या इंट्रो इमेज भी जोड़ना चाहते हैं। उसके लिए आप सबसे पहले आइटम रखें पात्र. गुणों में छवि का नामआपके द्वारा पहले से तैयार की गई तस्वीर का चयन करने के लिए तीन बिंदुओं पर क्लिक करें। यदि यह बहुत बड़ा है, तो रॉकेटकेक पूछता है कि क्या यह छवि का आकार बदल सकता है। वह ठीक है। शीर्षक 'मैड डॉग' जो आप इस लेख के शीर्ष पर बैनर पर देखते हैं, हमने छवि में खुद को एक और कार्यक्रम के साथ जोड़ा है। मूल रूप से आप आइटम के साथ टेक्स्ट भी कर सकते हैं फ्लोटिंग टेक्स्ट एक छवि के ऊपर रखें। दुर्भाग्य से, यह मोबाइल उपकरणों पर अप्रत्याशित परिणाम देता है।
जब आप संतुष्ट हों, तो कार्यशील फ़ाइल को हार्ड डिस्क पर कहीं .rcd फ़ाइल के रूप में सहेजें।
कॉलम
बैनर के नीचे आप होम पेज को एक, दो या तीन कॉलम में सामग्री प्रदान करना चाहते हैं। ऐसा करने के लिए, टूलसेट में आइटम चुनें कॉलम के साथ कंटेनर. रॉकेटकेक पूछता है कि आपको कितने कॉलम चाहिए। एप्लिकेशन कॉलम की न्यूनतम चौड़ाई भी जानना चाहता है। यहां हम दो कॉलम चुनते हैं और डिफ़ॉल्ट सेटिंग 150 है। इसका मतलब है कि कॉलम एक दूसरे के बगल में एक विस्तृत स्क्रीन पर बड़े करीने से देखे जा सकते हैं। यदि छोटी स्क्रीन पर कोई स्तंभ 150 पिक्सेल से छोटा हो जाता है, तो वह आगे नहीं, बल्कि पिछले स्तंभ के नीचे दिखाई देगा.
इस उदाहरण में हमने बाएं कॉलम को सेट किया है मिनविड्थ 500. 500 बाएँ स्तंभ के लिए विराम बिंदु है। यदि स्क्रीन की चौड़ाई बहुत छोटी हो जाती है, तो आगंतुक बाएं कॉलम के नीचे दाएं कॉलम की सामग्री को पढ़ेगा। इसके अलावा, हमने बैनर को सेट किया है मैक्सविड्थ 1000.
दाएं कॉलम को बाएं से संकरा बनाने के लिए सबसे पहले बाएं कॉलम पर क्लिक करें। NS आकार वहाँ डिफ़ॉल्ट रूप से है 50%, कार. उदाहरण के लिए, इसे बदल दें 70%, कार. यह दूसरे कॉलम को अस्थायी रूप से पहले के नीचे तैरने का कारण बनता है। जब आप दूसरे कॉलम और साइज पर क्लिक करते हैं तो आप इसे हल कर सकते हैं 30%, कार भरता है। यह आपको 70/30 का अनुपात देगा। फिर आप कॉलम को टेक्स्ट से भरते हैं, जिसे आप वर्ड प्रोसेसर की तरह डिजाइन भी करते हैं। ऐसे कॉलम में आप भी कर सकते हैं शीर्षकों (कप)। शीर्षक 1, 2, 3 कपों को अच्छा बनाए रखता है।
एक छवि जोड़ने के लिए, कर्सर को टेक्स्ट में रखें और टूलसेट में क्लिक करें छवि. फिर उस स्थान पर नेविगेट करें जहां छवि प्रतीक्षा कर रही है। समय-समय पर बटन पर क्लिक करें पूर्व दर्शन ब्राउज़र में अपना काम देखने के लिए।
यदि आप ऐसे टेक्स्ट कॉलम पर क्लिक करते हैं, तो आप गुणों में देखेंगे कि गद्दी डिफ़ॉल्ट 10, 10, 10, 10 पर सेट है। पैडिंग टेक्स्ट से कॉलम बॉर्डर तक की दूरी है। पहला नंबर सबसे ऊपर, दूसरा सबसे नीचे, तीसरा दाईं ओर और चौथा बाईं ओर स्टोर होता है। यदि आप टेक्स्ट बॉक्स में दाईं ओर कुछ और पैडिंग चाहते हैं, तो आपको तीसरा मान 20 पर सेट करना चाहिए, उदाहरण के लिए।
इसलिए पैडिंग एक बॉक्स के अंदर की दूरी है, हाशिया बाहर की दूरी है। यदि आप फोटो के नीचे और उसके नीचे के टेक्स्ट के शीर्ष के बीच अधिक स्थान चाहते हैं, तो मार्जिन को 0, 0, 0, 0 से बदलें, उदाहरण के लिए, 0.10, 0, 0।
अतिरिक्त पृष्ठ
अब जब होमपेज तैयार हो गया है, तो आप निश्चित रूप से अपने प्रोजेक्ट के लिए और पेज बनाना चाहेंगे। वह बटन के साथ जाता है पृष्ठ जोड़ें. प्रोग्राम पूछता है कि क्या आप पूरी तरह से नया पेज बनाना चाहते हैं या पहले से मौजूद वेब पेज की कॉपी बनाना चाहते हैं। इस उदाहरण में हम अपने होमपेज की शैली का उपयोग करेंगे: काली पृष्ठभूमि, फ़ॉन्ट, फ़ॉन्ट आकार, कंटेनर की चौड़ाई... तो हम दूसरे विकल्प के लिए जाते हैं। फिर हम बैनर हटाते हैं और टेक्स्ट कंटेनर की सामग्री को बदलते हैं।
यदि आप प्रत्येक पृष्ठ के नीचे एक पादलेख चाहते हैं, तो वहां भी एक पाद लेख जोड़ें पात्र या कॉलम के साथ कंटेनर और टाइप करें, उदाहरण के लिए, संपर्क जानकारी या कॉपीराइट जानकारी। कॉपीराइट प्रतीक जैसे विशेष वर्ण सीधे कीबोर्ड से दर्ज नहीं किए जा सकते हैं। रॉकेटकेक में आप मेनू के माध्यम से ऐसे विशेष पात्रों का चयन करते हैं सम्मिलित करें, पाठ चिह्न सम्मिलित करें.
लिंक
बेशक आप चाहते हैं कि नेविगेशन मेनू के बटन सही पृष्ठों की ओर इशारा करें। ऐसा करने के लिए, पहले नेविगेशन मेनू में बटन का चयन करें और फिर चेन वाले बटन पर क्लिक करें। या आप राइट-क्लिक करें और चुनें हाइपरलिंक डालें. यह एक चयन बॉक्स खोलता है जहां आपको बाहरी वेब पेज से लिंक करने, एक ई-मेल पता, इस प्रोजेक्ट का एक पेज या एक विशिष्ट फ़ाइल के बीच चयन करना होता है। विकल्प चुनें प्रोजेक्ट में पेज. फिर आपको बनाए गए वेब पेजों की एक सूची दिखाई देगी जिसमें आप सही का चयन करते हैं।
मधुमक्खी लक्ष्य वेब पेज को एक नई ब्राउज़र विंडो में या खुली ब्राउज़र विंडो में खोलना चुनें। यह अंतिम विकल्प आम है। यदि आप नेविगेशन मेनू से एक बटन की ओर इशारा करते हुए बाईं माउस बटन को दबाए रखते हैं, तो आप सबमेनस जोड़ते हैं जो फिर उसी तरह मौजूदा वेब पेजों को संदर्भित करता है।
मास्टर पेज
रॉकेटकेक तथाकथित मास्टर पेजों के साथ भी काम करता है। यदि आप कई पृष्ठों वाली वेबसाइट बना रहे हैं, तो यह तकनीक स्वरूपण को काफी तेज कर देगी। एक मास्टर पेज एक प्रारूपित मॉडल है जो अन्य पेजों के लिए एक टेम्पलेट के रूप में कार्य करता है। इसलिए ऐसा मास्टर पेज एक नियमित वेब पेज नहीं है। यहां एक बनाने का तरीका बताया गया है: एक नया वेब पेज बनाएं, ड्रॉप-डाउन मेनू रखें, सुनिश्चित करें कि मेनू उसी तरह काम करता है जैसा उसे करना चाहिए, और इस पेज को बिना किसी वास्तविक टेक्स्ट सामग्री के प्रारूपित करें। फिर आप टूलसेट से . जोड़ें सामग्री प्लेसहोल्डर यूपी। इस तत्व के बिना, मास्टर पेज काम नहीं करेगा। इस विशेष पृष्ठ को एक सार्थक नाम दें, उदाहरण के लिए Masterpage.html। फिर आप एक या अधिक वेब पेज बनाते हैं जो आप लेआउट के साथ प्रदान नहीं करते हैं।
आप टेक्स्ट टाइप करें, यदि आवश्यक हो तो एक इमेज जोड़ें और इस पेज को सेव करें। सामग्री वाले इन पृष्ठों पर, नीचे फ़ील्ड में गुण देखें मास्टर पेज. वहां आप विकल्प को सक्रिय करें मास्टरपेज का प्रयोग करें. यदि आपने बॉक्स को चेक किया है, तो एक नया बॉक्स दिखाई देगा जिसमें आप इच्छित मास्टर पेज का नाम चुनेंगे। आप कई मास्टर पेजों का उपयोग कर सकते हैं। इस समय आपको अभी तक कुछ दिखाई नहीं दे रहा है, लेकिन यदि आप बटन पर क्लिक करते हैं पूर्व दर्शन क्लिक करें, आप देखेंगे कि इस पृष्ठ की सामग्री को चयनित मास्टर पेज के सामग्री प्लेसहोल्डर में बड़े करीने से प्रकाशित किया गया है।
मीडिया डालें
RocketCake के साथ आप टूलसेट में आइटम का चयन करके YouTube वीडियो जोड़ते हैं यूट्यूब वीडियो चयन करना। फिर गुण में वीडियो का वेब पता दर्ज करें। फोटो गैलरी जोड़ना उतना ही आसान है। आप के बाद छवि गैलरी टूलसेट से चुना है, बक्सों में अलग-अलग फ़ोटो चुनें इमेजफाइल1, इमेजफाइल2 इत्यादि। गैलरी में तस्वीरों को बड़ा करने के कई तरीके हैं। उदाहरण के लिए, आप उन्हें एक नई विंडो में, एक पॉप-अप विंडो में खोल सकते हैं, लेकिन हमें एक अलग परत पर एक बड़ी छवि के रूप में सबसे अच्छी पसंद है।
प्रकाशित करने के लिए
आप कर चुके हैं? फिर आप वेबसाइट को इंटरनेट या स्थानीय डिस्क पर प्रकाशित कर सकते हैं। RocketCake आपके प्रदाता द्वारा उपलब्ध कराए गए फ़ोल्डर में सर्वर पर सब कुछ बड़े करीने से रखने के लिए एक ftp फ़ंक्शन से लैस है। FTP पता, उपयोगकर्ता नाम और पासवर्ड दर्ज करें। विकल्प का प्रयोग करें पासवर्ड को बचाओ पासवर्ड बचाने के लिए। जब आप वेबसाइट को अपनी हार्ड ड्राइव पर प्रकाशित करते हैं, तो आप अपने इंटरनेट प्रोग्राम के साथ index.html फ़ाइल खोलकर होमपेज पर जा सकते हैं।
