डेविड जे मालन: ठीक है।
हम वापस आ गए।
तो, यह अंतिम सत्र का लक्ष्य कुछ अधिक अवधारणाओं को लागू करने के लिए है
लेकिन यह भी हर किसी को एक मौका देना एक तरह से अपनी उंगलियों को फैलाने के लिए
और वास्तव में कुछ करना एक छोटे हाथ पर।
लक्ष्य नहीं की बारी है हमें सभी वेब डेवलपर्स में
किसी भी तरह, लेकिन वास्तव में बस के द्वारा आप में से कुछ की एक स्वाद देने के लिए
क्या के मौलिक निर्माणों की वेब प्रोग्रामिंग और आज वेब में चला जाता है
विकास, इसलिए things-- के स्थिर पक्ष
कोई तर्क, कोई प्रोग्रामिंग भाषा, बस स्थैतिक सामग्री।
और यह हमें एक मौका दे देंगे वास्तव में देखने के लिए क्या एक वेब सर्वर है,
देखते हैं कि क्या एक HTML फ़ाइल है, क्या देखना यह HTTP वास्तव में ऊपर की सेवा कर रहा है।
लेकिन इससे पहले कि हम किसी भी पूर्वव्यापी में डुबकी क्लाउड कंप्यूटिंग के बारे में प्रश्न
या सुरक्षा या बीच में कुछ भी?
>> नहीं?
ठीक है, ठीक है, चलो चलो सिर्फ मामले में यह करते हैं,
के लिए साइन अप करने की प्रक्रिया कुछ कुछ मिनट लगते हैं।
हम यह पृष्ठभूमि में यह कर दूँगा।
आगे बढ़ो, अगर तुम सकता है, इस यूआरएल here-- c9.io. करने के लिए
यह एक तीसरी पार्टी है service-- एक सेवा के रूप में मंच, अगर आप will--
कि आप को आमंत्रित करने के लिए जा रहा है एक खाते के लिए साइन अप करने,
और यह आप में से प्रत्येक को देने के लिए जा रहा है तथाकथित बादल में एक खाता
किसी और के बुनियादी ढांचे पर, एक कंपनी Cloud9 बुलाया।
लेकिन क्या बारे में अच्छा है यह है कि वे तुम्हें दे रहा है
एक के एक सन्निकटन वास्तविक वास्तविक दुनिया विकास
पर्यावरण, यद्यपि में बादल और एक वेब ब्राउज़र में,
और हम वास्तव में करने के लिए इस का उपयोग करेंगे आज एक सा प्रयोग।
और फिर आगे जाना है और सिर्फ नेविगेट साइन-अप प्रक्रिया के लिए अपने रास्ते
यदि आपके लिए संभव हो।
इसलिए हम कक्षा में इस का उपयोग करने के लिए होता मैं हमारे सभी छात्रों के लिए सिखाने के लिए,
दोनों परिसर और अब बंद है, और यह क्या ऐतिहासिक जगह है
अन्यथा सॉफ्टवेयर डाउनलोड किया गया था।
तो क्या आप के लिए पहुँच प्राप्त कर रहे थे इन आभासी मशीनों में से एक है,
अनिवार्य रूप से, मैंने पहले बताया कि।
तो इस कंपनी Cloud9 शायद वास्तव में एक तिहाई party-- से किराए
इस मामले में, एक पूरे Google-- आभासी मशीनों का गुच्छा
वे किसी भी तरह में काट कि व्यक्तिगत सर्वर का भ्रम
हम में से प्रत्येक को पूरा नियंत्रण खत्म हो गया है।
यह कहना काफी सटीक नहीं है कि वे आभासी मशीनों रहे हैं,
हालांकि, क्योंकि क्या Cloud9 वास्तव में उपयोग करता है
कुछ हद तक एक नई तकनीक है containerization बुलाया।
और मुझे इस तस्वीर को हड़पने चलो यहाँ इस तस्वीर उभर आती है।
>> एक कंटेनर है, अगर आप चित्र को याद
हल्का से पहले, एक छोटे से एक आभासी मशीन से वजन।
वास्तव में, जबकि पिछले समय के बारे में हम वहाँ बात की
एक ऑपरेटिंग किया जा रहा है प्रणाली और एक हाइपरविजर
और फिर अतिथि ऑपरेटिंग सिस्टम, अतिथि ऑपरेटिंग सिस्टम, अतिथि ऑपरेटिंग
प्रणाली, के शीर्ष पर अपने भौतिक हार्डवेयर,
इस नए के साथ अंतर प्रौद्योगिकी, containerization,
कि वे सभी किसी न किसी तरह का हिस्सा है एक ही ऑपरेटिंग सिस्टम।
लेकिन वे अभी भी बना सकते हैं हर किसी का भ्रम
अपने या अपने विशेष होने प्रशासनिक अधिकारों और फ़ाइलें
सर्वर पर।
लेकिन वहाँ भी कम समय में सॉफ्टवेयर है आप और हार्डवेयर के बीच।
जिनमें से परिणाम है, में सिद्धांत, एक उच्च प्रदर्शन,
क्योंकि आप उपयोग कर रहे हैं या कम संसाधनों को बर्बाद कर
कि तथाकथित वर्चुअलाइजेशन परत पर।
तो यह कहा जाता है स्वभाव से containerization
एक प्रौद्योगिकी गोदी श्रमिक कहा जाता है के माध्यम से, जो बहुत ज्यादा अपने आप में आ रहा है।
और यह कुछ है कि आपकी कंपनी में इंजीनियर
तरह तरह के की बात शुरू हो सकता है के बारे में जल्द ही वे पहले से ही नहीं है,
हालांकि वहाँ निश्चित रूप से कोई कारण किसी भी bandwagons पर कूद करने के लिए।
>> तो साथ ही कहा, क्या आप शायद अब देखना
एक स्क्रीन है कि इस तरह एक सा दिखता है।
ठीक।
और सिर्फ मुझ पर फोन नहीं तो।
और अगर so-- मैं आ नहीं तो कर देंगे।
आगे बढ़ो और क्लिक करें कि बड़ा प्लस एक कार्यक्षेत्र बनाने के लिए,
और आप इस तरह एक स्क्रीन देखेंगे।
आप कार्यक्षेत्र कॉल कर सकते हैं कुछ भी आप के लिए अब चाहते नाम है।
और बस वास्तव में सादगी के लिए, और-- अच्छी तरह से जाना है, आप में से कुछ
पहले से ही कार्यस्थान हैं।
इसे आप जो व्यवसाय want--, हार्वर्ड, गुरुवार, जो कुछ भी आप चाहते हैं।
आप एक विवरण जरूरत नहीं है।
आप इसे निजी छोड़ सकते हैं, जब तक आप पहले से ही कार्यस्थानों का एक गुच्छा है।
आप इसे सार्वजनिक करने के लिए मजबूर कर रहे हैं, कि आज के उद्देश्यों के लिए ठीक है।
यहां भी, upsells में से एक है।
आप के बाद एक निजी कार्यक्षेत्र मिल चूक। लेकिन आप और अधिक चाहते हैं,
आप अधिक के लिए भुगतान करना होगा।
अन्यथा, वे के लिए मजबूर अपने काम को सार्वजनिक करने के लिए।
लेकिन यह है कि ठीक है, क्योंकि वे भी ओपन-सोर्स समुदायों में इस लक्ष्य
के लिए लोगों को प्रोत्साहित करने के लिए वास्तव में सहयोग।
>> और आखिरी बात है कि महत्वपूर्ण है, हालांकि, यह है कि आप एक नाम का चयन करने के बाद
और आप निजी या सार्वजनिक चयन करने के बाद, एचटीएमएल 5, बड़ा नारंगी आइकन पर क्लिक करें
बाएं से दूसरे, और तब कार्यस्थान बनाएँ क्लिक करें।
और यह शायद होगा एक मिनट ले या ऐसा है,
लेकिन आप तो एक होगा पर्यावरण, आप एक बार
कि, उस की याद ताजा लग रहा है क्या मैं यहाँ अब स्क्रीन पर है।
लेकिन, फिर से, यह एक मिनट ले सकता है या उससे अधिक इस स्क्रीन को पाने के लिए
एक बार जब आप क्लिक किया है कार्यस्थान बनाएँ।
लेकिन सिर्फ मुझ पर ध्वज अगर तुम मुझे पसंद हैं कुछ भी या सलाह पर एक नज़र लेने के लिए।
ठीक है।
इसलिए मैं अब के लिए पृष्ठभूमि को यह जा रहा हूँ।
मुझ पर कॉल करता है, तो आप को लगता है किसी भी तकनीकी कठिनाइयों है।
लेकिन, फिर से, यह एक ले सकता है कि खोलने के लिए छोटा सा।
और आगे बढ़ते हैं और के बारे में बात करते हैं क्या यह वास्तव में एक वेब पेज बनाने के लिए इसका मतलब है,
क्या HTML है, और कैसे यह सब अब interconnects के रूप में हम शुरू कर रहे हैं
वास्तव में प्रौद्योगिकी से कुछ का उपयोग करने के लिए।
तो यह पता चला है कि मैं कर सकता हूँ यहां पर मेरे छोटे मैक जाना है,
एक साधारण बुलाया कार्यक्रम खुला TextEdit, या Windows पर मैं कर सकता
खुले कुछ Notepad.exe बुलाया।
और मैं बस यूँ ही कुछ कर सकता है this-- "हैलो, दुनिया।" की तरह
और फिर मैं इस रूप में बचा सकता है hello.txt तो वहाँ कोई जादू।
यह वेब के साथ कुछ नहीं करना है प्रोग्रामिंग, HTML के साथ कोई लेना देना नहीं।
सिर्फ एक साधारण पाठ फ़ाइल बनाने।
लेकिन यह एक वेब पता चला है कि पेज सचमुच है कि बस है।
यह एक साधारण पाठ फ़ाइल युक्त पाठ है है कि आप अपने कीबोर्ड पर टाइप सकता है,
लेकिन यह आम तौर पर, लेकिन हमेशा नहीं समाप्त होता है .txt नहीं लेकिन .html या .htm।
और तुम बस नहीं है फ़ाइल में शब्द टाइप करें।
आप वास्तव में कुछ कहा जाता का उपयोग किया है टैग या अधिक आम तौर पर, कुछ
मार्कअप भाषा कहा जाता है।
>> तो मैं बहुत जल्दी टाइप करने के लिए जा रहा हूँ और उसके बाद निम्न समझाओ।
मैं पहली बार करने जा रहा हूँ यह है, जो कहते हैं टाइप करें,
अरे, ब्राउज़र, यहाँ आता है एक वेब पेज HTML में लिखा।
और ये दो चीजें एक साथ कहते हैं, अरे, ब्राउज़र, निम्नलिखित वास्तव में HTML है।
अरे, ब्राउज़र, यहाँ आता है सिर या मेरे पेज के शीर्ष।
अरे, ब्राउज़र के शीर्ष के अंदर मेरा पेज, एक शीर्षक है कि है, "नमस्ते डाल
विश्व।"
अरे, ब्राउज़र, के बाद से सिर मेरे पेज, यहाँ मेरे पृष्ठ के शरीर आता है।
और, हे, ब्राउज़र का शव मेरा पेज का यह भी कहना चाहिए, "हैलो दुनिया।"
तो क्या मुख्य विवरण यहाँ हैं?
यह वही है जो आम तौर पर है एक डॉक्टर-प्रकार घोषणा कहा जाता है,
और, सच में, यह एक छोटे से है पहली बार में यह याद करने के लिए मेहनत की है।
आप बस की तरह कॉपी-पेस्ट यह।
यह औपचारिक तरीका है कह, हे की, ब्राउज़र,
मैं HTML 5 संस्करण का उपयोग कर रहा है जो कुछ हद तक हाल ही में बाहर आया था।
यह कुछ है कि एक जादुई जादू है डिजाइन के एक गरीब भावना के साथ मनुष्य
पर डालने का फैसला किया फ़ाइल के ऊपर से ही।
एक यह है हालांकि थोड़ा रहस्यमय, वह सब है
यह means-- अरे, ब्राउज़र, यहाँ HTML के 5 संस्करण के साथ आता है।
>> इस के बाकी हमारे साथ किया गया है अब कुछ समय के लिए, ऐतिहासिक,
लेकिन यह विकसित किया गया है, और यह है शायद एक छोटे से सरल हो रही किया गया।
नोटिस में कुछ विशेषताओं मैं क्या प्रकाश डाला है की।
वहाँ कोण के साथ इन बातों है बाईं ब्रैकेट brackets--
और सही ब्रैकेट।
और समरूपता यहां नोटिस।
और समरूपता के द्वारा, मैं बस के रूप में मतलब है, मैं इस शुरू टैग यहाँ या एक खुला टैग है
अगर तुम जाएगा, यहाँ नीचे मैं एक है करीब टैग या एक अंत टैग है कि
केवल insofar इसे इस रूप में अलग है शब्द के आरंभ में स्लेश
एचटीएमएल।
और अगर आप सोच सकते हैं इस रूप में मैं लापरवाही था
, इससे पहले कि प्रस्ताव अरे, ब्राउज़र, यहाँ कुछ HTML आता है।
और, इसके विपरीत, अरे, ब्राउज़र, कि यह HTML-- शुरू और अंत के लिए।
>> इस बीच अरे, ब्राउज़र, यहाँ मेरे पृष्ठ के सिर आता है।
अरे, ब्राउज़र, कि यह सिर के लिए है।
अरे, ब्राउज़र, यहाँ है मेरे पृष्ठ के शरीर।
अरे, ब्राउज़र, कि यह शरीर के लिए है।
कुछ और के अंदर यह है कि अब के लिए मनमाने ढंग से पाठ।
और सिर के अंदर, इस बीच, कुछ मनमाना लेकिन टैग है
तो बात है, पाठ का कहना है कि, शीर्षक मेरे पृष्ठ के हो जाएंगे "हैलो, दुनिया।"
अब, अब के लिए, आप कर सकते हैं कि ब्राउज़रों मान
only-- है या यों कहें, वेब पृष्ठों है केवल दो सिर और शरीर parts--।
और आम तौर पर सिर्फ सिर है मेनू पट्टी की तरह, सामान
वास्तव में सिर्फ ऊपर से ही।
और शरीर पेज की हिम्मत है, कि बड़ा आयत में सब कुछ
कि स्क्रीन भरता है।
इसलिए मुझे आगे जाना है और यह करने के लिए जा रहा हूँ।
मैं आगे जाने के लिए जा रहा है और सहेजें क्लिक करें, फ़ाइल सहेजें।
और मुझे बचाने के लिए जा रहा हूँ इस hello.html के रूप में,
और मैं बस करने के लिए जा रहा हूँ अपने डेस्कटॉप पर डाल दिया।
और मैं जाने के लिए जा रहा हूँ आगे और सहेजें क्लिक करें।
और कम से अपने मैक notice-- कम से कम मुझ पर चिल्ला रहा है।
क्या आप वास्तव में इसे करना चाहते हैं?
और मैं कहता हूँ, हाँ, HTML का उपयोग जा रहा हूँ।
मैं इस मामले में बेहतर जानते हैं।
और अब मैं अपने डेस्कटॉप के लिए जाने के लिए जा रहा हूँ जहां मैं इस फाइल अचानक लोगों की है।
और मैं इसे डबल क्लिक करने के लिए जा रहा हूँ।
और तुम उस पर ध्यान देंगे, द्वारा डिफ़ॉल्ट, क्रोम खोला।
वह है कि क्योंकि है मेरा डिफ़ॉल्ट ब्राउज़र।
और यह सिर्फ कहते हैं, "हैलो, दुनिया।"
लेकिन यह कहते हैं, "हैलो, दुनिया "दो स्थानों पर।
सूचना है ऊपर छोड़ दिया।
सुंदर है कि खोने के लिए मुश्किल।
यह बड़ा और बोल्ड है।
और कहाँ और यह प्रतीत होता है कहते हैं, "हैलो, दुनिया"?
>> दर्शकों: टैब।
>> डेविड जे मालन: हाँ, टैब ही।
तो जब मैं के प्रमुख ने कहा पेज सब कुछ top-- है
और वास्तव में यह शीर्षक है।
यह सिर्फ टैब यहाँ है।
और मैं इस टैब खींच सकते हैं भ्रमित करने के लिए तो नहीं के रूप में बाहर।
यह सिर्फ एक ही टैब अब है, और वास्तव में हम देखते हैं "नमस्ते, दुनिया"
यहाँ और "नमस्ते, दुनिया" यहाँ नीचे।
तो बहुत सीधा।
लेकिन यह भी काफी आसान है।
और, वास्तव में, मैं में तेजी से बढ़ी है।
मैं फ़ॉन्ट आकार बस को बदल सकते हैं पहुँच के लिए बढ़ाना।
लेकिन अब कुछ ऐसा ही करे एक छोटे से अधिक दिलचस्प है।
>> मैं go-- को वूप्स, चलो जा रहा हूँ मुझे मेरे पाठ फ़ाइल के लिए वापस जाओ।
मैं वापस जा रहा हूँ मेरे पाठ फ़ाइल है, और मैं जा रहा हूँ
इस परिवर्तन और कहने के लिए "हैलो, डिज्नी वर्ल्ड।"
बचाना।
और करने के लिए वापस जाना मेरी ब्राउज़र और पुनः लोड क्लिक करें।
और अब, जाहिर है, यह कहते हैं, "डिज्नी वर्ल्ड।"
और मैं कृत्रिम रूप से ज़ूम करने के लिए जा रहा हूँ बस इतना में यह देखने के लिए आसान है।
तो अब, दुर्भाग्य से, मैं एक तरह से चाहते हैं है-- वास्तव में, कि एक मैक सुविधा है।
मैं डिज्नी वर्ल्ड पर क्लिक करें और disney.com की तरह कहीं जाना है,
लेकिन वह काम नहीं करता।
तो वेब की एक बुनियादी सिद्धांत है हाइपरलिंक, लिंक है कि कहीं और जाना।
इसलिए मुझे लगता है कि कैसे करते हो?
खैर, मैं सिर्फ कह सकते हैं, "हैलो, http://www.disney.com।"
इसे बचाएं।
लोड करें।
लेकिन यह भी, क्लिक करने योग्य नहीं है।
और क्या, यहाँ अच्छा है, भले ही यह अभी तक कार्य नहीं है,
ऐसा लगता है कि वह यह है कि ब्राउज़र सचमुच ही करता है
मुझे क्या करना है यह बताओ।
तो अगर मैं सिर्फ इस तरह एक यूआरएल टाइप करें, यह सिर्फ मेरे यूआरएल को दिखाने के लिए जा रहा है।
मैं टैग या मार्कअप का उपयोग करने की जरूरत है भाषा वास्तव में बताने के लिए
ब्राउज़र भी अधिक करने के लिए।
तो मैं आगे जाने के लिए जा रहा हूँ और एक पल के लिए इसे हटाना।
और मैं कहने जा रहा हूँ, हे, ब्राउज़र, यहाँ एक लंगर शुरू,
एक लिंक तो बात है।
और अति संदर्भ, गंतव्य कि लंगर की, इस URL होना चाहिए।
और मेरे उद्धरण नोटिस।
मैं एक उद्धरण का इस्तेमाल कर सकते हैं, भी, लेकिन आप लगातार होना है,
और मैं आम तौर पर सिर्फ प्रयोग करेंगे डबल कोट्स इसे सरल रखने के लिए।
सूचना मैंने टैग बंद करने के लिए जा रहा हूँ।
और फिर यहाँ मैं जा रहा हूँ कहते हैं, "डिज्नी वर्ल्ड।"
और अब मैं कुछ symmetry-- जरूरत खुले ब्रैकेट, / ए, ब्रैकेट बंद कर दिया।
>> तो मैं क्या पेश किया है?
हम कुछ टैग पहले से ही लिया है।
एचटीएमएल, प्रमुख, शीर्षक, शरीर, सभी टैग कर रहे हैं, तो बात है,
खुले और बंद समकक्षों के साथ।
लेकिन नोटिस, इस प्रकार है के मौलिक रूप से अलग।
यह हम क्या कहते हैं जाएगा HTML में एक विशेषता।
और एक विशेषता है सिर्फ एक महत्वपूर्ण मूल्य जोड़ी।
यह एक आम बात है कंप्यूटर science-- महत्वपूर्ण मूल्य जोड़ी।
यह व्यापार के उपकरण की तरह है।
एक चाबी और एक मूल्य।
एक शब्द है और फिर कुछ अन्य शब्द या शब्दों।
और इस मामले में, कुंजी href है, और मूल्य है कि पूर्ण यूआरएल है।
और क्या एक विशेषता यह है करता है एक टैग के व्यवहार को प्रभावित करती है।
और इस मामले में, हम को प्रभावित करने की जरूरत है लंगर टैग के व्यवहार,
क्योंकि हम लंगर की जरूरत कहीं के लिए इस लिंक।
और आप कैसे यह है कि ऐसा विशेषता के माध्यम से।
>> तो मैं आगे जाने के लिए जा रहा हूँ और अब फाइल को बचाने के।
वापस अपने ब्राउज़र और फिर से लोड करने के लिए जाओ।
और, देखा, अब हम एक वैध वेब पेज की शुरुआत।
सुपर सरल है, लेकिन खत्म करता है, तो मैं उड़ना नीचे बाएँ कोने में this-- नोटिस
यह सुपर छोटा है।
लेकिन आप www.disney.com देखते हैं।
और अगर मैं इसे क्लिक करें, वास्तव में यह मेरे disney.com को दूर whisks।
अब, दिलचस्प बात यहाँ है कि यह नहीं है
सबसे ज्यादा बिक्री यूआरएल best--, लेकिन क्योंकि इस फाइल नहीं करता है वह ठीक है
वर्ल्ड वाइड वेब पर मौजूद हैं।
यह जाहिरा तौर पर में एक स्थानीय फ़ाइल के रूप में मौजूद है अपने उपयोगकर्ताओं directory-- / jharvard--
जॉन Harvard-- / डेस्कटॉप के लिए।
लेकिन यह एक यूआरएल है।
यह सिर्फ स्थानीय होना होता है।
दुर्भाग्य से, आप में से कोई भी यात्रा कर सकते हैं इसका कारण यह है कि आप इस यूआरएल टाइप करते हैं, तो
यदि आप अपने ब्राउज़र कह रही होगी एक फ़ाइल कहा जाता hello.html के लिए देखो
अपनी हार्ड ड्राइव पर।
और जाहिर है, जब तक आप है मैन्युअल के साथ पालन किया गया,
यह वहाँ मौजूद नहीं जा रहा है।
>> तो वह ठीक है।
हम अभी भी एक तरह की जरूरत है, अंत में वेब में इस फाइल को पाने के लिए,
लेकिन हम में से एक जोड़ी के अलावा तंग करते हैं की सुरक्षा के निहितार्थ क्या हम सिर्फ
देखा है और इसे वापस टाई पहले करने के लिए आज सुबह से चर्चा।
यह पता चला है कि, अगर एक ब्राउज़र सचमुच सिर्फ करता है
मुझे क्या करना है यह बताने, और ऐसा लगता है मामला एक लंगर टैग है कि हो
के मान से प्रभावित इस विशेषता को बुलाया href
लेकिन यह इस प्रदर्शित करता है पाठ, इस प्रतीत होता है
समझा जाए कि मैं यूआरएल डाल सकता है दोनों स्थानों में और उसके बाद फिर से लोड
और अब यूआरएल को देखते हैं और URL पर जाएं।
सूचना, अगर मैं नीचे बाएँ पर जाएँ, मैं वास्तव में disney.com करने के लिए अभी भी जा रहा हूँ।
>> तो अगर आप कभी गया है phished-- पी-एच-मैं-एस-एच-ई-D--
उन फर्जी ईमेल के साथ पेपैल के लिए अपने बैंक की तरह से,
आप शायद लिंक के अंदर मिल गया है ईमेल को आप पढ़ रहे हैं कि इस बात का
आप यहां क्लिक के लिए कहता है की पुष्टि जाना आपका पासवर्ड या अपनी जन्मतिथि की पुष्टि
या सामाजिक या कुछ और सामाजिक रूप से खुलासा करने के लिए आप इंजीनियरिंग
जानकारी।
खैर, मैं एक तरह से ले सकता है इस का लाभ, मैं नहीं कर सकता?
मैं कुछ कह सकते हैं जैसे, www.paypal.com।
और disney.com के बजाय, मैं करने के लिए, जैसे, badguy.com जा सकते हैं।
लोड करें।
और कितना आसान शिकार करने के लिए है, विशेष रूप से एक गैर तकनीकी पाठक
या एक सरसरी तौर पर पढ़ने क्लिक करने के लिए की तुलना में पाठक
जो अगर मैं it-- क्लिक करें इस तरह एक कड़ी है, मैं वास्तव में badguy.com जाने के लिए नहीं करना चाहती।
मैं क्या वास्तव में वहाँ है पता नहीं है।
तो paypal.com, सूचना, है क्या यह कहते हैं कि यह करने के लिए जा रहा है,
लेकिन ज़ाहिर है, अगर मैं नीचे देखो सुपर कम, यह एक छोटे से धुँधली है,
लेकिन यह badguy.com कहते हैं।
यही कारण है कि केवल सही अब बताओ कि मैं गलत जगह पर जा रहा हूँ।
और जब मैंने पहले कहा है कि बैंकों वास्तव में प्रोत्साहित करते हैं या ट्रेन नहीं करना चाहिए
क्लिक लिंक में उपयोगकर्ताओं, इस यह सिर्फ एक मिसाल है।
और यह इतना आसान है।
अब आप एक विरोधी है, तो आप कुछ इस तरह करते
और एक उपयोगकर्ता चाल की कोशिश अपनी वेबसाइट पर जाकर में।
लेकिन अब के लिए, हम रखेंगे बातों अच्छा और साफ।
हम आगे जाने के लिए जा रहे हैं और इन परिवर्तनों को उल्टा।
पृष्ठ को पुन: लोड करें।
और मैं वापस disney.com के पास जाओ।
>> चलो देखते हैं अगर हम तंग नहीं कर सकता इस के अलावा एक छोटे से अधिक।
तो "हैलो, डिज्नी वर्ल्ड।"
मैं यहाँ नीचे कहने जा रहा हूँ।
शायद मैं कुछ जगह बनाने के लिए जा रहा हूँ।
"हमें उम्मीद है कि आप अपने प्रवास का आनंद ले रहे हैं!"
बचाना।
लोड करें।
ऐसा नहीं है rea-- नहीं कर रहा है क्या मैं सही इरादा?
मेरा मतलब है, अगर मैं अपने पाठ इलाज कर रहा हूँ एक शब्द संसाधक तरह फ़ाइल,
क्या आप यहाँ क्या होगा आशा थी?
हाँ, मैं वहाँ की तरह लग रहा है एक पंक्ति विराम यहाँ होना चाहिए,
तो यह किसी तरह से छोटी गाड़ी लगता है।
लेकिन यह है कि वास्तव में जानबूझकर है, क्योंकि बस के रूप में पहले,
ब्राउज़र केवल करने के लिए जा रहा है क्या आप ऐसा करने में बताऊँ।
मैं यह नहीं बताया है कि लाइनों को तोड़ने के लिए।
मैं इसे नीचे स्थानांतरित करने के लिए, नहीं भी बता दिया है हालांकि, intuitively, मुझे लगता है जैसे मैंने किया।
तो यह पता चला हम की जरूरत है एक छोटे से अधिक मार्कअप,
और मैं के रूप में इसे ठीक करने के लिए जा रहा हूँ।
मैं पहली बार इस प्रस्तावना को नमस्ते जा रहा हूँ क्या एक पैरा टैग कहा जाता है के साथ।
और फिर मैं आगे जाने के लिए जा रहा हूँ और यह अन्य की सजा को कपड़े में लपेटकर
एक और पैरा टैग में, भले ही वे सुपर-छोटे पैराग्राफ रहे हैं।
अब मैं बचाने के लिए जा रहा हूँ।
लोड करें।
और अब हम उस राशि अंतरिक्ष, और हम एक तरह से
का अर्थ विज्ञान है दो अलग-अलग पैराग्राफ।
>> यही कारण है कि सब ठीक है और अच्छा है, लेकिन यह होगा इस पृष्ठ पर एक छवि को जोड़ने के लिए अच्छा होगा,
तो मैं देखने के लिए जाना जा रहा हूँ गूगल छवियाँ पर मिकी माउस।
और सिर्फ मनोरंजन के लिए, मैं हूँ इस छवि को हड़पने के लिए जा रहा है।
अब मैं आगे जाने के लिए जा रहा हूँ और इस छवि का URL ले लो,
हालांकि अलग-अलग है उपाय यह है।
अभी के लिए, मैं सिर्फ यूआरएल को कॉपी करने के लिए जा रहा हूँ।
मैं अपने पाठ में वापस जाने के लिए जा रहा हूँ फ़ाइल, और मैं यहाँ कहने जा रहा हूँ,
img src = बोली गंदें शब्द बोलना कि यूआरएल, सुपर लंबे समय।
और फिर एक की धारणा छवि एक छोटे से अलग है।
वहाँ वास्तव में शुरू की कोई धारणा है एक छवि और एक छवि को समाप्त,
एक शुरुआत की तरह एक अंत टैग टैग।
तो यह थोड़ा करने के लिए अजीब लगता है मेरे शब्दार्थ यह करने के लिए,
एक करीबी छवि टैग के लिए है।
यह गलत नहीं है।
यह पूरी तरह से सही है, और इसे प्रोत्साहित किया है,
लेकिन वहाँ आशुलिपि संकेतन है।
मैं एक साथ की तरह कर सकते हैं खोलने के लिए और एक ही टैग बंद करते हैं,
और उस ब्राउज़र को खुश कर देगा।
तो यह सिर्फ एक छोटा सा है बातों के लिए अधिक संक्षिप्त
धारणात्मक वास्तव में नहीं है कि समझ में शुरू और अंत करने के लिए बनाते हैं।
वे बस देखते हैं, या वे नहीं कर रहे हैं।
>> इसलिए मैं इस बचाने के लिए और वापस जाने के लिए जा रहा हूँ मेरी "हैलो, दुनिया" पेज और पुनः लोड करने के लिए।
और यह नियंत्रण से बाहर एक छोटे से है, क्योंकि उस छवि वास्तव में है
एक छोटे बड़े, लेकिन यह ठीक है।
मैं एक कार्यक्रम में इसे आकार सकता है।
या फिर आप क्या जानते हैं।
बस प्रदर्शित करने के लिए, मैं हूँ वास्तव में कहने जा रहा
है कि इस बात की चौड़ाई चाहिए केवल 200 पिक्सल, 200 डॉट्स हो।
मुझे आगे जाना है और बचाने के लिए करते हैं और फिर से लोड, और अब पेज
एक छोटे से अधिक उचित लग रहा है।
लेकिन पैटर्न नोटिस।
खैर, मैं एक तरह से सिखाया है कि आप सभी कुछ समझ में HTML के, कम से कम
धारणात्मक है, क्योंकि सभी HTML है इन खुले टैग, टैग बंद कर दिया tags--,
और विशेषताओं है कि उनके व्यवहार को संशोधित।
और, जाहिर है, हर टैग शून्य या एक हो सकता है
या दो या अधिक गुण है, में से प्रत्येक के जो कुछ थोड़ा अलग है।
अब, आप कैसे जानते हैं कि क्या अस्तित्व है?
तुम सिर्फ किसी को सुनने के लिए मैं आपको बता दूँ की तरह क्या मौजूद है,
या आप बस एक ट्यूटोरियल के लिए चारों ओर गूगल एचटीएमएल पर, और यह वास्तव में यह आसान है।
>> सच में, जब मैं एक छात्र था साल पहले और एचटीएमएल सीखा है,
मेरी गणित शिक्षण में से एक सहायकों बस खर्च
मेरे पढ़ा समय का एक छोटा सा जैसे आधे घंटे के लिए, एक घंटा,
और फिर मैं अपने रास्ते पर था।
मैं बनाने की ओर अपने रास्ते पर था कभी सबसे घृणित वेबसाइटों,
जो, जाहिर है, मैं नहीं किया है वास्तव में आगे प्रगति।
लेकिन मुद्दा यह है कि, एक बार आप इन सरल ideas-- को समझने
यदि रहस्यमय text-- लेकिन इन सरल एक विचार शुरू करने के विचारों
और एक सोचा बंद करने, रखने सब कुछ अच्छी तरह से, संतुलित
कुछ देख, संशोधित कि टैग के व्यवहार, कि वास्तव में सभी के लिए है
वहाँ यह है।
और वास्तव में, हम अब के लिए जाना है वास्तव में google.com-- तरह कुछ है,
की एक जगह के लिए एक छोटे से अधिक चलते हैं reasonable-- stanford.edu।
और मैं, देखें में जाने के लिए जा रहा हूँ डेवलपर, स्रोत देखें।
यह बदसूरत है, लेकिन notice-- और मैं नोटिस में ज़ूम करता हूँ
कुछ सामान है कि पहले से ही परिचित है।
इस, यहाँ हो रहा है जो एक ब्राउज़र है।
यहाँ एचटीएमएल 5 आता है।
वहाँ HTML है।
जाहिरा तौर पर, वहाँ है विशेषता यह है कि मैं नहीं था
का उपयोग करें कि निर्दिष्ट करता है पेज की भाषा,
और यह स्वत: के साथ मदद कर सकता है अनुवाद और सामान है कि पसंद है।
यहाँ पेज के सिर है।
यहाँ स्टैनफोर्ड के पृष्ठ का शीर्षक है।
वहाँ एक टैग मैंने नहीं किया है yet-- मेटा टैग के बारे में बात करते हैं।
यह बस की तरह है पृष्ठभूमि की जानकारी।
यह एसईओ के साथ मदद करता है, या खोज इंजिन अनुकूलन,
या गूगल-खोज परिणामों या पसंद है।
लेकिन अगर हम तलाश में रहते हैं, रख तलाश में, यहाँ शरीर टैग है।
और वहाँ अन्य के गुच्छों है टैग हम अभी तक के बारे में बात नहीं की है।
लेकिन डिव एक के लिए एक है पेज का विभाजन।
यह एक अदृश्य आयत की तरह है आप की तरह मानसिक रूप से करना चाहते हैं
में अपने पेज को विभाजित विभिन्न इकाइयों ऑनलाइन।
और फिर divs के बहुत सारे मैं देखते हैं, कुछ वर्ग कहा जाता है,
लेकिन हम वापस आ जाएगा।
>> इस interesting-- रूपों है।
फार्म सभी वेब पर कर रहे हैं।
किसी भी खोज बॉक्स आप कर रहे हैं कभी इस्तेमाल एक रूप है।
और, हां, वास्तव में देखते हैं।
प्रपत्र।
कार्रवाई।
इस फार्म की कार्रवाई की है, जो कुछ के लिए ऐतिहासिक कारणों से, कि यूआरएल है।
विधि "पोस्ट है।"
पता चला है कि HTTP अनुरोध उपयोग कर सकते हैं क्रिया "मिलता है," जैसे हम पहले देखा था,
या "के बाद।"
और कोई फर्क देखेंगे एक पल में इस बात का।
चलो वास्तव में देखते हैं कि यह क्या है।
मुझे वापस स्टैनफोर्ड के पृष्ठ पर चलते हैं।
क्या फार्म वे बात कर रहे हैं के बारे में, आप क्या सोचते हैं?
क्या तुम पर बाहर कूदता है?
>> दर्शकों: खोज बॉक्स।
>> डेविड जे मालन: हाँ।
ऊपर सही में तो यहाँ इस खोज बॉक्स है।
और है कि कैसे वे it-- एक कार्यान्वित किया है टैग सचमुच खुले ब्रैकेट रूप है कि।
और फिर कुछ के लिए खोज करते हैं।
चलो, एक की तलाश के लिए खोज करते हैं mine-- "निक Parlante।" की
दर्ज।
और हां, यह करने के लिए चला गया एक अलग URL।
मुझे यहाँ वापस जाओ।
के लिए खोज करने दें "पाठ्यक्रमों।"
लानत है।
एक अलग यूआरएल के लिए गया था।
तो, स्टैनफोर्ड की कुछ जादू जोड़ने कि वे मेरे यूआरएल के लिए नहीं ले जा रहे
हम में देखा है कि कार्रवाई नहीं बताते हैं।
लेकिन इस फॉर्म को यहां विशुद्ध रूप से कार्यान्वित किया जाता है यहाँ इस मार्कअप के माध्यम से, इन टैग।
वास्तव में, यहाँ के लिए इनपुट है खोज के प्रकार है कि आप चाहते हैं।
यहां के लिए इनपुट है खोज का एक और प्रकार।
यहाँ स्ट्रिंग खुद के लिए इनपुट है।
और तो लक्ष्य को लपेटने के लिए नहीं है इन टैग के चारों ओर हमारे मन
लेकिन सिर्फ देखने के लिए।
यह सिर्फ उद्घाटन और समापन है टैग और चीजों को देख।
हाँ?
विक्टोरिया?
>> दर्शकों: [सुनाई]
डेविड जे मालन: यह एक अच्छा सवाल है।
यही कारण है कि देखने के लिए थोड़ा पेचीदा मामला है।
मुझे उस पर वापस आते हैं बस कुछ ही मिनटों में सवाल
जब हम कुछ देखो बुलाया सीएसएस, या व्यापक स्टाइल शीट्स,
और हम अनुमान की कोशिश कर सकते पेज से ज्यादा के रूप में।
तो अगर हम अब google.com पर एक नज़र रखना, चलो देखते हैं उनकी पेज की तरह दिखता है क्या करते हैं।
तुम्हें पता है कि आज प्यारा है they're-- जाएगा।
ठीक।
सब कुछ कर दिया।
ठीक है, तो स्रोत देखें।
आप गूगल है सोचना होगा वास्तव में अच्छा स्रोत कोड।
तो, जाहिर है, पर क्या यहाँ हो रहा है?
और वास्तव में, यह भी HTML नहीं है।
यह कुछ जावास्क्रिप्ट कहा जाता है।
और हम जा रहे हैं और जारी रखते हैं।
मैं यह भी नहीं पता है, जहां पेज शुरू होता है।
मैं आदेश का उपयोग करने के लिए जा रहा हूँ एफ, खुला ब्रैकेट एचटीएमएल।
ठीक है, वहाँ यह है।
मैं पृष्ठ के शुरू पाया, और यहाँ में इतना सामान है।
>> क्या वास्तव में हो रहा है?
ठीक है, तुम जानते हो क्या, हम यह साफ कर सकते हैं।
मैं बजाय के लिए जाना है इस का निरीक्षण टूलबार, इस विशेष नैदानिक ​​उपकरण,
और नेटवर्क के लिए नहीं जाना है, जहां हम आज चलते रहो,
लेकिन अगर मैं तत्वों के लिए जाना है, क्या वास्तव में अच्छा है
एक ब्राउज़र एक बहुत है कि है ज्यादा बेहतर आँखों से मुझे क्या करना।
और ब्राउज़र पढ़ सकते हैं एक वेब पेज के उस गंदगी,
कि HTML मेल हम बस देखा, और यह कर सकते हैं
यह पार्स या पढ़ा है और यह विश्लेषण और यह reformat
एक अच्छा मानव के अनुकूल तरीके से।
तो क्या अब मैं देख रहा हूँ इस स्क्रीन में यहाँ
तत्वों के तहत, सटीक एक ही सामग्री, लेकिन वे सब कुछ खिसका हुआ है,
वे इसे colorized है, लेकिन यह ठीक उसी पाठ है
मैं सर्वर से डाउनलोड किया है।
>> और क्या अच्छा है अब मैं देख सकता है शरीर में, instance-- सूचना के लिए,
पेज अभी भी बना है का सिर्फ एक सिर और एक शरीर है,
और मैं पदानुक्रम में यहाँ गोता लगा सकता हूँ।
सूचना है गूगल के लिए लगता है कि इस एक है और यह एक divs-- करने के लिए।
मुझे लगता है कि विस्तार कर सकते हैं।
वहाँ अन्य divs की एक पूरी गुच्छा है।
तो यह थोड़ा जटिल है।
लेकिन रुकें।
यह इतना अधिक लगती है पठनीय, अपेक्षाकृत, इस से।
क्यों गूगल शर्मनाक है खुद को सिर्फ भेजकर
कुछ के कोड के इस विशाल गड़बड़ क्रमबद्ध सिर्फ कुछ को लागू करने के लिए
कि पहली नज़र में इतना आसान लग रहा है?
की तरह, क्यों वे अधिक खाली स्थान न?
क्यों वे हिट दर्ज नहीं किया जैसे मैंने किया था?
देखो कितना अच्छा रहा था एक वेब पेज लिखने में।
मैं इतनी लगन हिट दर्ज करें।
मैं तो सब कुछ दांतेदार इतनी सुंदर और पठनीय है।
क्यों गूगल नहीं एक ही अभ्यास करता है?
>> दर्शकों: [सुनाई]
डेविड जे मालन: अच्छा।
बहुत ही उचित।
वे कुछ भी नहीं है गूगल पर व्यक्ति मैन्युअल
मुख पृष्ठ अब और अद्यतन।
यह 1999 अब और नहीं है।
इसलिए वे सॉफ्टवेयर है।
वे अन्य उपकरण है कि गतिशील वे HTML रहे उत्पन्न करते हैं।
बेशक, कि कोड ही मनुष्यों द्वारा लिखा गया था,
लेकिन वास्तविकता यह है, यह काफी कहना उचित है,
ब्राउज़र निश्चित रूप से नहीं करता है परवाह कैसे गन्दा कोड है।
लेकिन वहाँ एक और भी है सम्मोहक तकनीकी कारण
गूगल अपने एचटीएमएल वितरित करता है कि इस तरह के एक मैला में कोड, मालूम होता है
भारी जिस तरह से सभी एक साथ पैक बहुत कम way-- बहुत कम के साथ
स्वरूपण जैसे मैंने किया था के रास्ते में।
>> दर्शकों: [सुनाई]
>> डेविड जे मालन: तेजी से है?
क्यूं कर?
और तुमने क्या कहा, लिडा?
और तेज?
क्यों तेजी से?
दर्शकों: [सुनाई]
डेविड जे मालन: वहाँ है कोई जगह पढ़ने के लिए।
हाँ।
तो क्या एक जगह नहीं है के बारे में सोचते हैं।
तो कीबोर्ड पर प्रत्येक चरित्र लेता है अंतरिक्ष की कुछ राशि का प्रतिनिधित्व करने के लिए,
या तो शारीरिक रूप से, यह पसंद है बहुत जगह है कि ऊपर ले जाता है,
या किसी भी तरह के नीचे डाकू, कि स्मृति की आवश्यकता है।
और एक aside-- के रूप में और हम करेंगे इस tomorrow-- बारे में अधिक बात
कीबोर्ड पर हर चरित्र आम तौर पर 8 बिट्स, या एक बाइट की आवश्यकता है।
तो 8 शून्य का एक पैटर्न या लोगों, या सिर्फ 1 बाइट, हम के रूप में
मनुष्य आम तौर पर कहना चाहूँगा।
तो यह है कि छोटा है, लेकिन यह अभी भी गैर शून्य है।
यह अभी भी अंतरिक्ष में से कुछ राशि है।
तो अगर एक इंजीनियर या गूगल हिट अंतरिक्ष बार सिर्फ एक बार, और लगता है
Google-- यह सुपर popular-- मान लीजिए कि एक अरब है कि लोग
एक दिन उनके घर पृष्ठ पर जाएँ, या लोगों में से कुछ नंबर
यात्रा के मुख पृष्ठ पर एक अरब बार एक दिन,
कितने अतिरिक्त बाइट्स है सॉफ्टवेयर इंजीनियर सिर्फ गूगल का खर्च
एक बार अपने या अपने अंतरिक्ष बार मार से?
>> दर्शकों: [सुनाई]
डेविड जे मालन: काफी है कि बुरा नहीं है।
बस एक बाइट बार एक अरब।
तो एक--
दर्शकों: 8 अरब गीगाबाइट।
डेविड जे मालन: ऐसा नहीं है 8 अरब।
8 अरब बाइट्स।
लेकिन 1 गीगाबाइट।
1 गीगाबाइट मापने की इकाई होगी।
अगर वह या वह दो करता है रिक्त स्थान, 2 गीगाबाइट।
तीन गीगाबाइट।
सही?
यह खर्च तराजू।
और तो गूगल जैसे मामलों में, जो दी, चरम मामलों रहे हैं,
वहाँ अन्य मुद्दों है कि अभी पैदा कर रहे हैं बहुत ही उचित निर्णय लेने के द्वारा
या बहुत सरल मानवीय कार्यों ले रही है, यह इस बढ़ाया प्रभाव पड़ता है क्योंकि।
कारणों में से एक तो यह ऐसा लग रहा है संकुचित
बिल्कुल के रूप में विक्टोरिया said-- यह था बस वैसे भी कंप्यूटर द्वारा उत्पन्न।
तो कोई बड़ी बात नहीं।
ब्राउज़र यह समझ से बाहर हैं।
लेकिन यह भी जानबूझ ज्यादा जगह नहीं है,
क्योंकि अंतरिक्ष आवश्यक नहीं है।
और अंतरिक्ष वास्तव में पैसा खर्च होता है।
>> यह या तो समय की लागत, क्योंकि सिर्फ पुश करने के लिए
से बाहर है कि बहुत अधिक डेटा google.com के मुख्यालय सिर्फ
के कुछ राशि लेने के लिए मिल गया है समय, भले ही वह मिसे है
या microseconds, लेकिन उस के लिए कहते हैं तो कई उपयोगकर्ताओं से अधिक है, या अधिक संभावना है,
यह शायद पैसा खर्च होता है।
गूगल शायद करने के लिए जोड़ता दुनिया, एक में किसी और को
उन में से peering अंक, और अगर वे
वित्तीय संबंध में किसी तरह का जिससे उनके डाटा पैसा खर्च होता है,
वे अच्छी तरह से हो सकता है के रूप में कितना डाटा को कम
वे पर बाहर थूकना रहे हैं अपने इंटरनेट कनेक्शन।
>> तो अजीब बात है, हालांकि, अंत में, या हो सकता है आश्वस्त बात है,
कि भले ही यह बहुत अच्छा लग रहा है भारी, दिन के अंत में,
यह अभी भी रूप में सटीक एक ही सिद्धांत है यह बहुत ही सरल एक HTML के यहां पेज
पृष्ठ।
तो बस संक्षेप में और इतनी है कि आप अगर तुम नहीं थे एक विहित संस्करण है
यहाँ पसंद से साथ निम्नलिखित, यहाँ वेब पृष्ठों की सबसे सरल हो सकता है,
तो कुछ शायद बाद में साथ खेलने के लिए।
>> ठीक है, चलो एक परिचय अब अन्य विचारों की जोड़ी।
हम कर रहे हैं के बारे में लागू करने के लिए कुछ एक शैली टैग कहा जाता है।
हम इस पेज stylize सकते हैं अधिक दिलचस्प तरीके में।
तो, जबकि HTML ईमेल सब के बारे में अंकन किया गया है
डेटा, की तरह एक करने के लिए निर्दिष्ट करने के ब्राउज़र कैसे डेटा संरचना करने के लिए,
जहां डाल करने के लिए यह, सीएसएस, या व्यापक शैली पत्रक,
एक दूसरी भाषा है कि आम तौर पर HTML के साथ मिश्रित हो जाता है
हम see-- करेंगे लेकिन हम साफ कर सकते हैं के रूप में कि ऊपर एक moment-- कि लेता है
यह अंतिम मील, और यह stylizes।
यह रंग सिर्फ सही हो जाता है, फ़ॉन्ट सिर्फ सही आकार,
स्थिति सिर्फ सही।
यह सौंदर्यशास्त्र के बारे में सब है या स्वरूपण, के बारे में नहीं
मौलिक डेटा ही।
और आसान तरीका दिखाने के लिए इस उदाहरण से शायद है।
तो मैं पर जाने के लिए जा रहा हूँ मेरे सरल पाठ फ़ाइल के लिए।
और बस एक पल में, मैं हूँ प्रक्रिया के माध्यम से हमें चलना
की अपने आप को इस कर रही है।
>> मैं अपनी फाइल करने के लिए वापस जाने के लिए जा रहा हूँ यहाँ और बस पृष्ठ को फिर से लोड
इस बात की पुष्टि के लिए यह कैसा लग रहा है।
यही कारण है कि जहां हम अब कम हो रहा है।
मुझे लगता है कि बच्चों को पसंद करता है की तरह इस वेब पेज के लिए कुछ रंग कर रही है।
तो मैं यहाँ तक जाने के लिए जा रहा हूँ पेज के सिर में।
और मैं शैली, / शैली क्या करने जा रहा हूँ।
और फिर इस के अंदर, मैं जा रहा हूँ मेरे page-- के शरीर को बताने के लिए
और इस स्वरूपण पर है पहली नज़र में, शायद एक छोटे से
अजीब है, लेकिन पारंपरिक।
मैं पृष्ठभूमि कि कहने जा रहा हूँ इस पेज के रंग हरा होना चाहिए।
और यह दुर्भाग्य है एक तरह से नहीं सबसे अच्छा डिजाइन।
सूचना है कि पहले से एचटीएमएल की दुनिया में,
कि गुण मैंने कहा इन महत्वपूर्ण मूल्य जोड़े हैं।
कुछ बोली के बराबर होती है गंदें शब्द बोलना "कुछ और।"
सीएसएस की दुनिया है, जो था कुछ अलग अलग लोगों द्वारा डिजाइन,
वे कहते हैं कि फैसला किया है, उनके दुनिया, महत्वपूर्ण मूल्य जोड़े
शब्द पेट के कुछ होगा।
तो यह एक ही विचार है, यद्यपि।
यह एक मूल्य जोड़ रहा है कुछ महत्वपूर्ण यह है कि किसी भी तरह के साथ
इस पेज के व्यवहार को प्रभावित करती।
>> और आप शायद अनुमान लगा सकते हैं।
क्या यह शायद जा रहा है भले ही आप कभी नहीं किया है क्या करने के लिए
पहले HTML या सीएसएस देखा है?
दर्शकों: पृष्ठभूमि रंग बदलें।
डेविड जे मालन: हाँ, पृष्ठभूमि का रंग बदल जाते हैं।
और विशेष रूप से शरीर की पृष्ठभूमि का रंग।
लेकिन जहां तक अब के लिए शरीर वेब है
page-- यह केवल एक चीज है शीर्षक पट्टी really-- नीचे
यह शायद करने के लिए जा रहा है एक ही बात को प्रभावित करते हैं।
तो चलो देखते हैं।
चलो इस बचा लो।
यहाँ जाओ और पुनः लोड।
यह बहुत घृणित है।
और बताओ क्या यहाँ एक पक्ष प्रभाव है।
मैं तो बस इस छवि को बेतरतीब ढंग से चुना है।
क्यों नहीं हरा है मिकी के पीछे permeating?
दर्शकों: [सुनाई]
डेविड जे मालन: बिल्कुल।
ऐसा नहीं है कि छवियों पता चला है, सुंदर ज्यादा सभी छवियों है कि हम इस्तेमाल कर सकते हैं,
आयतों के सभी rectangles-- हैं।
यहां तक ​​कि अगर मिकी कुछ घटता है खुद के लिए और एक पृष्ठभूमि है,
कि पृष्ठभूमि कुछ हो गया है।
यह सफेद हो गया है।
यह काला या कुछ और हो गया है।
यह पारदर्शी हो सकता है।
और वास्तव में, मैं कर सकता यहाँ मिकी माउस खोलने
कहा जाता है फ़ोटोशॉप में एक कार्यक्रम में या कुछ इसी तरह
और कहा कि सफेद सब बदल पारदर्शी पृष्ठभूमि,
इसलिए हरी माध्यम से चमक जाएगी।
लेकिन जो कुछ मैं की आवश्यकता होगी अपने आप को या एक ग्राफिक कलाकार के पूछने के लिए
या कम से एक डिजाइनर मेरी कंपनी, उदाहरण के लिए,
ऐसा करने के लिए, खासकर के बाद से मैं सिर्फ इंटरनेट से यह एक उधार लिया।
लेकिन यह है कि यह क्यों हो रहा है।
>> तो और क्या हम क्या करना चाहते हो सकता है?
खैर, हम हम कहना चाहते हो सकता है वास्तव में आप अपने प्रवास का आनंद उम्मीद है।
और जोर देने के लिए, मैं चाहता हूँ इस मजबूत बनाने के लिए,
और इसलिए मैं कहूँगा खुला और मजबूत मजबूत बंद हैं और फिर पुनः लोड।
और यह थोड़ा मुश्किल है प्रोजेक्टर पर देखने के लिए
लेकिन शायद वास्तव में अब थोड़ा और अधिक तुम पर बाहर कूदता है।
तो अगर आप इस में इटैलिक में जोड़ सकते हैं जिस तरह से, इस तरह से बोल्ड सामना करना पड़।
हम रंग बदल सकता है।
वास्तव में, बस kicks के लिए, मैं हूँ आगे जाना है और यह करने के लिए जा रहा है।
मैं सच में कैसे पसंद नहीं है मेरी पैराग्राफ एक साथ इस बंद कर रहे हैं,
इसलिए मैं इस तरह से कुछ कर सकता है।
मैं ब्राउज़र बताने जा रहा हूँ, हर पैरा टैग बदलने के लिए है,
वास्तव में say-- आप जानते हैं कि क्या करते हैं, चलो यह text-align, केंद्र संरेखित करते हैं।
और फिर, मैं यह सिर्फ इतना पता है क्योंकि किसी को यह मुझे सिखाया
या मैं इसे ऊपर देखा में एक ऑनलाइन संदर्भ।
तो मुझे यह बचाने के लिए करते।
और, आह, अब मैं वहाँ छवि केंद्रित।
और वास्तव में, आप जानते हैं कि क्या है, अगर मैं एक पैराग्राफ में मेरी छवि को स्थानांतरित
tag-- तो एक तीसरे पैरा, यहां तक ​​कि यह पाठ नहीं है, हालांकि।
का है कि बचाने के लिए और फिर से लोड करते हैं।
अब पेज तरह लग शुरू होता है of-- मेरा मतलब है, यह अभी भी बहुत बदसूरत,
लेकिन कम से कम यह लग रहा है जैसे मैं बिताया के बजाय दो मिनट एक मिनट
इसे बना रहे हैं।
>> और हां, तो संवर्द्धित, हम कर सकते हैं पृष्ठ के लिए अब इन सौंदर्य बदलाव?
मैं वास्तव में नहीं है में डेटा को बदल दिया है शब्द वास्तव में जोड़ने के अलावा अन्य पेज।
मैं मेटाडाटा, अगर तुम जाएगा जोड़ दिया है।
अरे, ब्राउज़र, बनाना शब्द "वास्तव में" बोल्ड।
लेकिन डेटा मजबूत नहीं है।
यही कारण है कि मेटाडाटा है।
डेटा "वास्तव में है।"
इसलिए हम अभी भी के कुछ है एक ही अवधारणाओं के रूप में पहले।
अब जाहिर है, यह नहीं वेब पर है, तो मैं एक अंतिम कदम यहाँ करने के लिए जा रहा हूँ।
>> मैं hello.html के लिए जाने के लिए जा रहा हूँ और सिर्फ प्रकाश डाला और इस कॉपी।
और अब मैं जा रहा हूँ Cloud9, में जाने के जो
मैं बस एक पल में आप के माध्यम से चलना होगा।
और बाधाओं, यदि आप जल्द ही हो जाएगा रहे हैं पहले से ही नहीं, इस तरह एक स्क्रीन पर।
और मुझे तो बस आप एक त्वरित दे क्या Cloud9 वास्तव में है के दौरे।
तो फिर क्लाउड 9 है इस क्लाउड-आधारित सेवा
कि तुम्हारे और मेरे भ्रम देता है के बारे में हमारी खुद की आभासी मशीन होने
बादल में, तकनीकी रूप से बादल में एक कंटेनर,
हम पूर्ण है प्रशासनिक विशेषाधिकारों के लिए।
इसलिए सिद्धांत रूप में, कोई नहीं दुनिया में चुना गया है
स्क्रीन मैं कर रहा हूँ करने के लिए उपयोग अभी देख,
शायद लोगों को छोड़कर जो साइट चलाने के लिए,
क्योंकि तकनीकी रूप से वे राशि शारीरिक का उपयोग और बहुत आगे है।
>> इसलिए हम इस माहौल में क्या देखते हैं?
मैं बाहर ज़ूम करने के लिए जा रहा हूँ, यह एक छोटे से छोटा है, क्योंकि।
और मुझ पर बात कर देना यहां सिर्फ एक पल के लिए।
के बाएं हाथ की तरफ मेरी और आपकी स्क्रीन, वहाँ छोड़ दिया पर एक फ़ाइल ब्राउज़र है।
तो भावना में समान मैक ओएस और Windows के लिए।
इन सब के सब हैं अपने खाते में फ़ाइलों।
और डिफ़ॉल्ट रूप से, अगर आपके खाते, खान की तरह है
आप देखेंगे या जल्द ही मिलते हैं helloworld.html और readme.md।
यहीं पर खत्म हो गया है, यह है जहाँ मेरे पाठ फ़ाइलों को जाने के लिए जा रहे हैं।
क्या आपने कभी माइक्रोसॉफ्ट का इस्तेमाल किया गया है वर्ड या नोटपैड या TextEdit,
इस शब्द मेरे संपादन है फाइल का जाना जा रहा है।
और फिर सबसे रहस्यमय इस माहौल की सुविधा
हम वास्तव में उपयोग करने के लिए है की जरूरत नहीं होगी कि यहाँ नीचे एक टर्मिनल विंडो कहा जाता है।
आप से डॉस इस्तेमाल किया गया है पुराने, यह लिनक्स है
या डॉस के लिनक्स बराबर।
यह एक पाठ आधारित interface-- है कोई माउस क्लिक करता है, कोई खींच रहा है।
सब आप कर सकते टाइप है आदेशों, लेकिन उन आदेशों
, फाइल बना सकते हैं फ़ाइलों को स्थानांतरित, खुले निर्देशिका, बंद निर्देशिका,
चीजों की कोई संख्या नहीं है।
लेकिन अब के लिए, हम सिर्फ हूँ यहाँ हमारे समय खर्च करते हैं।
>> और तो चलो यह करते हैं।
आप इस में हैं पर्यावरण, जो आपको चाहिए
यदि आप एक कार्यक्षेत्र बनाया हो पहले से ही, आगे बढ़ो और सिर्फ ऊपर जाना
फाइल करने के लिए, एक पल के लिए नई।
और कहा कि आप एक नया दे देंगे टैब सही बीच में यहाँ।
और मैं just-- दो और आगे जाना है और यह करते हैं।
आगे बढ़ते हैं और अब फाइल करते हैं, को बचाने करते हैं और आगे जाना है और यह hello.html कहते हैं,
साथ भ्रमित नहीं होना चाहिए helloworld.html, जो
, अपने नए मुक्त खाते के साथ आया था जो सिर्फ एक नमूना फाइल है।
आप इसे अचानक प्रकट होते देखेंगे, बाएं हाथ की ओर सबसे अधिक संभावना है,
और टैब अभी भी खुला हो जाएगा।
और मुझे विश्राम करने के लिए अब आपको प्रोत्साहित करते हैं इस फ़ाइल या उसके कुछ वेरिएंट।
और अगर आप काफी पर इसे देख नहीं कर सकते हैं अगर स्क्रीन, इस स्लाइड के समान है
आप शायद एक और टैब में है।
>> तो संक्षेप में, अपने पहले वेब पेज बनाना बचाने के लिए यह, और फिर बस एक पल में,
मैं आपको बताएंगे कि कैसे आप करेंगे वास्तव में यह देख सकते हैं।
लेकिन कम से कम एक बात बदल जाते हैं।
करने के लिए HelloWorld बदलें अपनी खुद की पसंद के कुछ और,
इतनी है कि आप आश्वस्त कर रहे हैं कि यह आपकी है फाइल और नहीं एक मैं अभी बनाया।
ठीक है।
और आप कोई ready-- रहे हैं जब rush-- जब आप तैयार हैं,
आगे जाना है और फाइल को बचाने के एक बार जब आप इन परिवर्तन किए हैं।
और अगर आप क्लिक करें भागो बटन ऊपर, इस
एक नया टैब कि बता देंगे खोलने चाहिए आप क्या यूआरएल आप पर अपनी फ़ाइल यात्रा कर सकते हैं,
लेकिन यह करने के लिए एक क्षण ले सकता है बोली "अपाचे शुरू," गंदें शब्द बोलना जो
वेब सर्वर का नाम है।
तो क्या वास्तव में क्या करने के लिए सावधान रहना होगा जो अंततः फ़ाइल में है।
इसलिए अभी, मैं में ज़ूम करेंगे।
अगर मैं टाइपिंग शुरू खुले ब्रैकेट एचटीएमएल, नोटिस
यह मेरे विचार खत्म करने के लिए मेरे उत्साह है।
और अगर मैं मेरे विचार समाप्त हो यह, स्वचालित रूप से मेरे बंद टैग देता है।
लेकिन उम्मीद तो मैं मारा हूँ है दर्ज करें, और फिर वहाँ के अंदर ले जाने के लिए
और अंदर सिर करना और फिर मैं शरीर के अंदर से करते हैं।
और यह पहली बार में थोड़ा अजीब है, क्योंकि यह आप के लिए काम कर रहा है,
लेकिन अंततः का एहसास है कि यह आप कीस्ट्रोक्स बचाता है।
और वास्तव में, एक की बहुत आम सुविधा प्रोग्रामिंग इन दिनों वातावरण
दोनों तरह वेब विकास के लिए इस और वास्तविक प्रोग्रामिंग,
जो हम कल के बारे में बात करेंगे, इन स्वत: पूर्ण सुविधाओं है,
चीजें हैं जो सिर्फ एक की अनुमति देते हैं प्रोग्रामर या एक डिजाइनर
करने के लिए कम कीस्ट्रोक्स टाइप करने के लिए एक ही बात को पूरा।
कभी कभी यह अच्छा है, यद्यपि।
कभी कभी यह सिर्फ कष्टप्रद है।
और, फिर, एक बार आप लिखित गए स्लाइड या उसके कुछ संस्करण,
आप शीर्ष तक चला बटन क्लिक कर सकते हैं।
और फिर नीचे में खिड़की, आपको सूचित किया जाएगा
क्या URL पर आप अपने वेब पेज पर जा सकते।
मेरा, उदाहरण के लिए, पर है business-daharvard.c9users.io
इत्यादि।
ठीक है, तो, me-- किसी भी सवाल करते हैं?
सिर्फ होने के बारे में किसी भी अन्य प्रश्न इस काम करने से पहले हम सुविधाओं को जोड़ने?
और, मेरे प्रस्ताव चलो बस लोगों comfortable-- पाने के लिए
क्योंकि यह सिर्फ एक बात है आँख बंद करके कॉपी-पेस्ट मैंने क्या किया है।
लेकिन सिर्फ इतना है कि लोगों को कुश्ती इसलिए करने के लिए करते कम से कम एक साथ,
मैं कुछ संगीत पर बारी करने के लिए जा रहा हूँ।
मैं की एक सूची का प्रस्ताव करने जा रहा हूँ चीजें आप संभावित जोड़ सकते हैं।
और आप निश्चित रूप से गूगल का उपयोग कर सकते हैं।
और क्यों नहीं हम बस प्रस्ताव है कि आप को हल करने की कोशिश
कम से कम एक विशेष समस्या है यहाँ।
तो टैग के मामले में, मुझे इस यहाँ पुन: उपयोग करते हैं।
>> वास्तव में, मुझे डाल दिया यह एक शाब्दिक रूप में।
का कहना है कि हो सकता है कि हम टैग के बीच चलो यहाँ का उपयोग यहाँ पर कुछ टैग कर रहे हैं।
हम पैरा टैग देखा है।
अब यह स्वत: पूर्ण करने के लिए जा रहा है।
अनुच्छेद टैग, लंगर टैग।
कहते हैं कि आप करना चाहते हैं कुछ बड़ा करना,
ताकि आप like-- सकता है अवधि टैग कर सकते हैं।
वैसे, अगर आप कुछ मदद की जरूरत हो सकती है कि बस एक पल में लिए।
हम div देखा है।
आप वहाँ तालिका दिखाई देगी।
कुछ वहाँ टीआर कहा जाता है, टीडी।
गु, टीडी।
एक पल में वापस आ।
और क्या काम किया जा सकता है?
वहाँ मजबूत है।
वहाँ जोर है, या बल्कि उन्हें।
There's-- और क्या आप यहाँ कल्पना कर सकते हैं?
खैर, हम एक ले लेंगे उस पर एक साथ देखो।
रूप है, जो हमने देखा है।
वहाँ रूप है।
वहाँ इनपुट और कुछ अन्य लोगों के लिए है।
ठीक है, तो चलो यह करते हैं।
एक विक्टोरिया की जवाब देने के लिए सवाल है, मुझे पहले देना
सिर्फ यकीन है कि हर कोई कर उनकी हैलो काम पाने के लिए सक्षम है।
तो फिर मुझे परिचय कुछ अन्य विचारों।
तो फिर हम लोगों का समाधान दूँगा अपने दम पर कुछ समस्या है।
तो फिर हम वास्तव में वापस आ गया हूँ एक फार्म की उस धारणा को,
और हम वास्तव में फिर से लागू करेंगे एक साथ सामने के अंत इंटरफेस,
इतनी बात करने के लिए गूगल से खुद के लिए।
हम पीछे के अंत के रूप में गूगल का इस्तेमाल करेंगे और जाने उन्हें कड़ी मेहनत करते हैं, खोज,
लेकिन हम सामने के छोर को विश्राम करेंगे गूगल और खोज के रूप में
वे अपने स्वयं के मुख पृष्ठ पर है।
और इसलिए हम करने के लिए वापस आ गया हूँ बस एक पल में इन टैग।
>> तो यह था कि मैं क्या बस एक पल पहले प्रस्ताव रखा।
हम एक के लिए stylization जोड़ सकते हैं इस शैली टैग के अंदर पृष्ठ
और हम पृष्ठभूमि stylize सकते हैं रंग, पाठ संरेखण,
चाहे वह केंद्र या छोड़ दिया है या सही है।
लेकिन बहुत जल्दी तुम करोगी खोजने के लिए या एक वेब डिजाइनर
मिल जाएगा यह है कि एक छोटे बोझल हो जाता है,
क्योंकि तुम क्या कर रहे है मिश्रण सामग्री बुलाया
प्रस्तुति के साथ क्या है।
आप अपने डेटा मिश्रण कर रहे हैं और सौंदर्यशास्त्र क्या है।
और वास्तव में, अगर आप समझते हैं क्या time-- खत्म होने जा रहा है
यह एक बहुत ही छोटा है वेब पेज, बिल्कुल।
लेकिन अगर मैं इस पेज के लिए सामग्री जोड़ने और मैं इस पृष्ठ पर शैली को जोड़ने,
पेज बहुत जल्दी हो जाता है अब और अब और लंबी है।
और लगता है कि मैं चाहता हूँ एक दूसरे वेब पेज है कि
इन विशेषताओं में से कुछ शेयरों।
के लिए मेरी दूसरी वेब पेज मान लीजिए मेरा site-- भी, मैं सब कुछ केंद्र चाहते हैं,
और मैं भी सब कुछ चाहते हैं एक हरे रंग की पृष्ठभूमि के साथ।
मैं बहुत ज्यादा करने के लिए जा रहा हूँ कॉपी और इन पंक्तियों के कुछ पेस्ट
कि दूसरी फाइल है, जो ठीक लगता है में।
यह समस्या का समाधान होगा।
>> लेकिन क्या अगर मैं एक तिहाई पेज चाहते हैं या एक 30 पेज या 40 वीं पेज?
अब मैं कॉपी करने जा रहा हूँ और डुप्लीकेट कोड का एक बहुत चिपकाने
कई फाइलों में।
और ऐसा लगता है कि मैं तय या मुझे बताया गया है,
अरे, हम का उपयोग नहीं कर रहे हैं अब और हरे रंग की पृष्ठभूमि।
हम नारंगी का उपयोग शुरू करने जा रहे हैं।
क्या आप को बदलने की क्या ज़रूरत है?
खैर, आप उस शैली को बदलना होगा नारंगी हरे रंग से कितने स्थानों में?
30 या 40 स्थानों की तरह।
यह थकाऊ है।
यह त्रुटि की संभावना है।
वहाँ कारणों की एक संख्या है आप को प्रेरित करने के लिए नहीं चाहेगा जहां
खुद के लिए दर्द की तरह।
और तो यह अच्छा नहीं होगा अगर हम ले सकता है क्या मैं बस
इन दोनों के बीच पीले रंग डाल टैग, इन शैली टैग,
इसे बाहर कारक है, और के सभी डाल मेरी एक केंद्रीय फ़ाइल में stylization
कि सभी 30 या 40 मेरे अन्य फाइलों की से उधार लेने या किसी भी तरह का संदर्भ,
नेटवर्किंग के विपरीत नहीं आरेख हम पहले कर रहे थे?
>> तो अगर मैं यहाँ में जाओ, मैं कर रहा हूँ वास्तव में प्रस्ताव करने जा रहा
हम जगह है कि कुछ के साथ शैली टैग
लिंक टैग कहा जाता है, जो बुरी, बुरी नाम पर है,
क्योंकि आप प्रयोग नहीं करते लिंक टैग क्या बनाने के लिए
हम इंसानों के लिए एक वेब पेज में एक कड़ी के रूप में जानते हैं।
उस के लिए, आप जो टैग का उपयोग करें?
कैसे आप एक वेब पेज में एक लिंक बना सकता हूँ?
दर्शकों: एक।
डेविड जे मालन: एक, या लंगर टैग, उससे पहले डिज्नी के लिए चला गया।
लिंक यहाँ टैग कह रहा है नामक एक फाइल करने के लिए लिंक this--
styles.css, रिश्ते जो करने के लिए कि यह मेरे स्टाइलशीट है होने जा रहा है।
तो इस में एस में से एक है CSS-- व्यापक स्टाइल शीट।
शैली sheet-- सीएसएस में एस के दो।
शैली पत्रक व्यापक।
यह बस का अर्थ है, हे, ब्राउज़र, जाना स्थानीय सर्वर पर styles.css खोजना
और अपनी शैली पत्रक के रूप में उपयोग करते हैं, जो कि फ़ाइल के अंदर का मतलब
सभी को होने जा रहा है stylizations है कि हम सिर्फ किया है।
और तो क्या है कि फाइल इसका कारण यह है की तरह लग सकता है।
और मैं सिर्फ इस एक त्वरित है करूँगा उदाहरण के लिए, क्योंकि हम की जरूरत नहीं
मातम यहाँ में बहुत अधिक पाने के लिए।
लेकिन अगर मैं इस कॉपी, क्या मैं प्रस्ताव कर रहा हूँ एक प्रोग्रामर एक नई फ़ाइल बनाने कि है,
उन lines-- में पेस्ट whoops-- उन पंक्तियों में पेस्ट,
styles.css के रूप में इसे बचाने के लिए, और फिर, में अन्य फ़ाइल, कि सभी को हटा दें
और यह बजाय की जगह इस लिंक टैग के साथ।
इसलिए कि अगर मैं लिंक href = "styles.css" रिश्ते "स्टाइलशीट" हो जाएगा
बंद टैग।
बचाओ।
मेरे HelloWorld के लिए वापस जाओ।
लोड करें।
>> सचमुच कुछ नहीं हुआ है।
यह एक अच्छी बात है, क्योंकि यह यह वास्तव में सभी काम कर रहा है इसका मतलब है।
के रूप में ज्यादा साबित करने के लिए, मान लीजिए मैं एक बना टाइपो, और मैं इस "styles.css" कॉल
एक राजधानी एस, जो है साथ गलत है, और फिर पुनः लोड।
अब आप इसे सिर्फ काम नहीं करता देख सकते हैं।
अभी क्यों?
ठीक है, चलो एक का उपयोग करें पहले से तकनीक।
मुझे आगे चलते हैं और में, अपने ब्राउज़र, क्रोम में, मैं हूँ
कि विशेष को खोलने के लिए जा रहा नेटवर्क टैब के रूप में पहले,
और मेरे पेज को फिर से लोड करते हैं।
क्या आप अब देख कर हैरान नहीं हैं?
या हो सकता है आप इसे देख कर हैरान हो रहे हैं।
किसी भी तरह से, क्या तुम अब देखते हैं?
दर्शकों: [सुनाई]
डेविड जे मालन: यह नहीं पाया है।
क्यों यह नहीं पाया जाता है?
खैर, Styles.css-- राजधानी S-- मौजूद नहीं है।
मैं इसे misnamed।
सरल टाइपो।
लेकिन मैं समझ नहीं पा रहा अब एक हो रही है 404, क्योंकि सर्वर कह रहा है, हे,
यह नहीं मिला है।
सचमुच, मैं नहीं जानता जहां कि फाइल है।
तो एक परिणाम के रूप में, ब्राउज़र आप क्या कर सकते हैं यह पता चलता है,
पेज की सामग्री कच्चे, जो एक 200, एचटीएमएल था,
लेकिन stylization नहीं कर सकते उसके बाद से जोड़ा जा।
और यह है कि व्यापक से मतलब है।
आप की तरह यह भी जोड़ सकते हैं के बाद, और यह एक तरह से
वेब पेज के सौंदर्यशास्त्र को परिष्कृत।
और अगर आप भी उन ओवरराइड कर सकते हैं अभी तक अन्य स्टाइलशीट फाइलों के साथ शैलियों
अगर तुम चाहो।
यह इस मामले में नहीं मिला है, हालांकि, क्योंकि निश्चित रूप से, मैं इसे misnamed।
तो मैं पहली बार है कि ठीक करने के लिए होगा।
>> तो चलो आगे चलते हैं और निम्नलिखित प्रस्ताव।
आगे बढ़ते हैं और यह करते हैं।
शायद के साथ शुरू अपने HelloWorld फ़ाइल,
मुझे सिर्फ एक जोड़े को आमंत्रित करते हैं के सुझाव शामिल हैं।
तो, विक्टोरिया, तुम चाहते थे कुछ पाठ बड़ा, सही?
ठीक है, तो हम कर सकते हैं पाठ बड़ा बना है।
और हम एक बंद बांधना करेंगे सिर्फ एक ही समस्या को हल करने के लिए।
पाठ बड़ा बना।
मैं परेशान करने के लिए नहीं जा रहा हूँ जब हम यह लिख
सही यहाँ पर गोली प्रौद्योगिकी है।
तो कुछ समस्याएं हैं।
इसलिए हम कोशिश करने के लिए जा रहे हैं पाठ बड़ा बनाने के लिए।
ठीक है।
किसी और क्या प्रस्ताव होगा?
और क्या हम चाहते हो सकता है एक वेब पेज में क्या करना है?
चलो एक साथ आते हैं चीजों की संक्षिप्त सूची
और फिर प्रतिनिधि समूह यह पता लगाने के लिए।
>> दर्शकों: [सुनाई]
>> डेविड जे मालन: ठीक है, स्थिति पाठ पेज के विभिन्न पक्षों पर?
ठीक है।
कुछ और।
>> दर्शकों: [सुनाई]
डेविड जे मालन: यह है।
तो एक GIF सिर्फ एक है अलग फ़ाइल स्वरूप।
हम सिर्फ इस्तेमाल किया है, क्या है, एक PNG या एक जेपीजी शायद?
हम एक जेपीजी इस्तेमाल किया।
आप जिज्ञासु, एक अत्यधिक रहे हैं आपके सवाल का जवाब
एक jpg आम तौर पर के लिए प्रयोग किया जाता है तस्वीरें, क्योंकि यह समर्थन करता है
रंग या 24-बिट रंग के लाखों लोगों की।
एक GIF आम तौर पर, जैसे के लिए प्रयोग किया जाता है इंटरनेट memes इन days-- एनिमेशन,
की तरह एनिमेटेड GIFs।
लेकिन यह एक छोटे रंग का उपयोग करने के लिए होता है पैलेट, केवल 256 संभव रंग,
लेकिन यह समर्थन करता है पारदर्शिता और एनीमेशन।
और फिर वहाँ है पीएनजी, जो समर्थन करता है पारदर्शिता और अधिक रंग
लेकिन नहीं एनीमेशन।
तो यह एक व्यापार बंद है।
तो, एक GIF जोड़ने हालांकि, कार्यात्मक होगा
एक PNG या एक jpg जोड़ने के बराबर है।
हाँ।
छवि स्रोत के बराबर होती है।
तो कुछ और ही है।
चलो कुछ के साथ आते हैं कि हम विक्टोरिया को भेजी यहाँ करने के लिए।
>> दर्शकों: एक फार्म के लिए बटन जोड़ें।
डेविड जे मालन: ठीक है।
तो एक फार्म के लिए बटन जोड़ने।
और हम हैं कि एक साथ मिलकर कर देंगे।
तो यह है कि एक आदर्श segue हो जाएगा सही इस चुनौती के बाद।
और कुछ?
क्या आप करना चाहते हो सकता है?
वेब बहुत underwhelming लगता है अगर यह सब है कि हम क्या कर सकते हैं।
दर्शकों: पाठ का रंग बदलना।
डेविड जे मालन: क्या परिवर्तन?
दर्शकों: पाठ का रंग।
डेविड जे मालन: पाठ का रंग बदलना।
ठीक है।
तो, चलो यह करते हैं।
बस फिर इतनी है कि आप नहीं कर रहे हैं, बस रटने से, वास्तव में कर रही है कि मैं क्या कर रहा हूँ,
मैं संगीत को चालू करने के लिए जा रहा हूँ शायद पाँच मिनट के लिये यहां के लिए।
आप गूगल का उपयोग करने के लिए स्वागत कर रहे हैं।
तुम मुझे पूछने के लिए स्वागत कर रहे हैं, और मैं अपने कान में एक संकेत कानाफूसी करेंगे।
आप देखने के लिए स्वागत कर रहे हैं ओवर की दूसरी कंधों पर।
लेकिन इन समस्याओं का सिर्फ एक ही हल।
लेकिन हम पिछले एक, करूँगा एक साथ एक रूपों, अगर हम कर सकते थे।
तो पांच मिनट के हल करने के लिए इन समस्याओं में से किसी एक को
गूगल, अंतर्ज्ञान का उपयोग कर, या किसी अन्य आप के लिए उपलब्ध साधन।
>> [संगीत बजाना]
ठीक है।
कोई चिंता नहीं है अगर आप चाहते हैं छेड़छाड़ रखने के लिए,
लेकिन मैं कुछ खराब कर देंगे इन सवालों के जवाब।
से पहला सुझाव तो विक्टोरिया पाठ बड़ा बनाने के लिए किया गया था।
तो वहाँ यह करने के लिए कुछ तरीके हैं।
मैं वर्तमान में बहाल कर दिया है इस आकार के लिए मेरी स्क्रीन,
हालांकि मैं में तेजी से बढ़ी गए कृत्रिम रूप से सिर्फ बातें देखने के लिए।
और चलो यह करते हैं।
मुझे आगे और हड़पने चलते हैं कुछ सामान्य लैटिन पाठ
अभी तो हम साथ काम करने के लिए कुछ है।
तो मुझे बस एक पल दे।
मैं तीन पैराग्राफ कर दूँगा।
ठीक।
यह एक बेहतर उदाहरण होगा।
इतना उत्सुक के लिए, में मेरे hello.html, मैं तो बस
चिपकाया तीन अतर्कसंगत लैटिन पैराग्राफ
अभी तो हम साथ काम करने के लिए कुछ पाठ है।
और विक्टोरिया के लक्ष्य के लिए था पाठ के कुछ बड़ा करना।
इसलिए मुझे लगता है, के रूप में पहले, में यहां जा सकते हैं।
और मुझे इसे सही तरीके से करते हैं।
मैं एक कड़ी के लिए जा रहा हूँ टैग है कि एक फाइल करने के लिए अंक
कहा जाता है "styles.css," संबंध जिनमें से फिर से "स्टाइलशीट है।"
और फिर मैं उस को बचाने के लिए जा रहा हूँ और इस "styles.css।" खोल
>> तो, इससे पहले के रूप में, मैं इस सीएसएस फ़ाइल में क्षमता
वास्तव में डिफ़ॉल्ट ओवरराइड करने के लिए एक वेब पेज के सौंदर्यशास्त्र,
और डिफ़ॉल्ट सौंदर्यशास्त्र, जाहिर है, बहुत सुस्त हैं।
यह सामान्य फ़ॉन्ट आकार की तरह, काला है पाठ, सफेद पृष्ठभूमि, और बहुत आगे है।
ऐसा लगता है मैं करना चाहता हूँ इस पाठ के सभी बड़ा है।
मैं कुछ चीजें कर सकता है।
मेरे styles.css फाइल में, मैं आप जानते हैं कि क्या कह सकते हैं,
के लिए निम्न लागू मेरे पृष्ठ के शरीर।
आगे बढ़ो और कर फ़ॉन्ट आकार 24 अंक,
जो एक संख्या मैं हो सकता है माइक्रोसॉफ्ट वर्ड में उपयोग करें।
मुझे मेरे वेब के लिए वापस जाओ यहाँ पेज और फिर से लोड,
और आप देख सकते हैं कि यह पहले से ही बहुत बड़ा है।
और हम एक छोटे से पागल हो सकता है, जैसे हम एक desktop-- पर कर सकते हैं
यह 96 अंक हैं।
लोड करें।
और यह एक छोटे से हो रही है इस बिंदु पर बोझल।
>> लेकिन मैं एक छोटे से अधिक सटीक हो सकता है।
इसके बजाय इस लागू करने की मेरे पृष्ठ के शरीर के लिए स्टाइलशीट,
और क्या मैं बजाय के लिए इसे लागू कर सकते हैं, क्या अन्य टैग है कि अभी भी हो सकता है
एक ही रास्ते में समारोह?
>> दर्शकों: p टैग?
डेविड जे मालन: पी टैग।
तो सिर नहीं होगा सही है, क्योंकि सिर,
आप वास्तव में नहीं कर सकते के सौंदर्यशास्त्र नियंत्रित करते हैं।
वहाँ या तो सामग्री नहीं है या नहीं।
लेकिन पी tag-- मैं एक छोटी सी में गोता लगा सकता हूँ गहरी, तो बात है, पैरा करने के लिए
टैग।
और फिर भी वहाँ तीन हैं, कि क्योंकि सीएसएस में पूरी तरह से ठीक है,
जब मैं सिर्फ कहते हैं कि "पी," इस निम्नलिखित लागू करने का मतलब
कि इस मैच किसी भी टैग के लिए चयनकर्ता, चयनकर्ता सिर्फ
टैग के नाम पर किया जा रहा है।
तो भी आप एक देखना "पी" फ़ॉन्ट आकार लागू होते हैं,
और हम यह अधिक बनाते हैं उचित again-- 24 बिंदु।
और क्या आपको पता है, सिर्फ अच्छे उपाय के लिए,
रंग बनाते हैं पल के लिए लाल बस।
और अब अगर मैं फिर से लोड, अब हम तीन बदसूरत पैराग्राफ देखें।
>> लेकिन अब लगता है कि मैं तरह कर रहा हूँ of-- मैं पहले पैराग्राफ चाहते हैं
उपयोगकर्ता पर बाहर कूद करने के लिए।
मैं सिर्फ बढ़ाने के लिए नहीं करना चाहती सब कुछ के फ़ॉन्ट आकार।
और इसलिए मैं वास्तव में पहचान करना चाहते हैं या इन अनुच्छेदों के बीच भेद।
तो चलो लाल से छुटकारा, क्योंकि है कि बस की तरह कठिन है,
और आगे बढ़ते हैं और बनाते हैं फ़ॉन्ट आकार 12 सूत्री डिफ़ॉल्ट रूप से,
इतना है कि हम वापस करने के लिए कुछ कर रहे हैं एक छोटे से अधिक उचित।
और अब मैं सिर्फ बढ़ाना चाहते हैं पहले पैराग्राफ का फ़ॉन्ट आकार।
मैं कुछ ऐसा कर सकते हैं तरीके हैं, लेकिन एक ही रास्ता है कि
शायद ज्यादा से ज्यादा अनुदेशात्मक पल निम्नलिखित करना है।
मुझे आगे चलते हैं और कहते हैं, इस पैरा "पहले।" की एक अद्वितीय पहचान है
मैं यह कुछ भी मैं चाहता हूँ कह सकते हैं।
मैं इस "foo" कह सकते हैं या किसी अन्य शब्द,
लेकिन मैं इसे कुछ देने के लिए जा रहा हूँ शब्दार्थ सार्थक नाम
जैसे "पहले।"
इस अनूठी पहचानकर्ता है, आईडी, मेरे पहले पैराग्राफ के लिए।
>> क्या अब मैं अपनी शैली में क्या कर सकते हैं एक छोटे से अधिक सटीक होना है।
कह के बजाय, लागू पी टैग करने के बाद,
मैं कह सकता हूँ following-- निम्नलिखित लागू होते हैं,
या चयन, HTML तत्व कि "पहले।" की एक अद्वितीय पहचान है
क्या मैं इसे करने के लिए आवेदन करना चाहते हैं?
24-बिंदु के एक फ़ॉन्ट आकार।
तो अब मैं दो चयनकर्ताओं की है।
एक के सभी बनाता है 12 सूत्री पैराग्राफ।
लेकिन यह एक है, खासकर के बाद से यह आता है second-- यह file-- में पिछले आता है
यह एक व्यापक प्रभाव पड़ता है।
मैं बस के सभी कर दिया है मेरी पैरा टैग 12 सूत्री,
लेकिन यह अब और झरने ओवरराइड करें कि किसी भी तत्व के लिए
पृष्ठ में, पेज जिसका में किसी भी टैग अद्वितीय पहचान बोली गंदें शब्द बोलना है "पहले।"
और इस संदर्भ में हैशटैग बस "अद्वितीय पहचानकर्ता मतलब है।"
मैं यह HTML फ़ाइल में मत डालो।
मैं, यहाँ पर, बस का कहना है बोली गंदें शब्द बोलना "पहले।"
>> तो मुझे फिर से लोड करते हैं।
और अब मैं देख रहा हूँ, आह, ठीक है।
मेरा मतलब है, यह नहीं है कि सुंदर, लेकिन यह एक तरह है
एक की प्रस्तावना की तरह किताब या ऐसा कुछ,
जहां पहले पैराग्राफ बड़ा है।
साथ और भी अधिक सटीक हो सकता है सिर्फ पहला पत्र है, लेकिन कम से कम
मैं और अधिक नियंत्रण प्रयोग किया है।
अब maybe-- शायद मैं ऐसा करना चाहते हैं कभी कभी जो भी कारण के लिए,
और इसलिए मैं यह नहीं करना चाहते हैं सिर्फ एक एचटीएमएल टैग करने के लिए लागू होते हैं।
बल्कि, चलो चलो चलो say-- यह भी निम्नलिखित है।
वर्ग = "आयात करते हैं।"
एक आईडी अनोखे करने के लिए इस्तेमाल किया जाता है जबकि एक बात है, एक टैग की पहचान है,
अपने वेब पेज में, एक वर्ग के लिए होती है तत्वों या टैग के किसी भी नंबर पर इस्तेमाल किया
अपने वेब पेज पर।
तो यह पुन: प्रयोज्य है।
एक आईडी पुन: प्रयोज्य नहीं है।
एक वर्ग पुन: प्रयोज्य है।
>> और आप जानते हैं कि क्या है, जो कुछ के लिए दार्शनिक reasons--
मैं खत्म नहीं किया है मेरी thought-- मैं कहने जा रहा हूँ
कि पहले पैराग्राफ और दूसरे पैराग्राफ महत्वपूर्ण हैं।
तो मैं कक्षा बुलाया लागू करने के लिए जा रहा हूँ "महत्वपूर्ण" है कि, अगर मैं अपनी फाइल को बचाने के
और फिर से लोड, कोई है अभी तक कार्यात्मक प्रभाव।
लेकिन मैं कुछ जोड़ दिया है फाइल करने के लिए मेटाडाटा,
कुछ अलग की तरह फ़ाइल का मूल डेटा से,
तो यह है कि अब मेरे स्टाइलशीट में, अगर मैं बजाय कहते हैं कि ".important" - तुम्हें पता है,
कुछ भी है कि महत्वपूर्ण है, मैं हूँ font-रंग बनाने के लिए जा रहे हैं, red--
या यों कहें font-रंग, सिर्फ रंग नहीं।
वहाँ विसंगतियों है सीएसएस में दुर्भाग्य से।
और पुनः लोड।
अब पहले नोटिस दो पैराग्राफ लाल कर रहे हैं
लेकिन तीसरे नहीं, क्योंकि मैं केवल के वर्ग के लिए आवेदन किया "महत्वपूर्ण"
उन चीजों में से पहले दो के लिए।
>> आईडी में तो, आप की क्षमता है बहुत ठीक निर्दिष्ट करने के लिए।
वर्गों के साथ, आप reusability है।
लेकिन दोनों ही मामलों में, नोटिस अच्छे डिजाइन सिद्धांत की तरह
जहां मैं बाहर के सभी सकारात्मक असर मेरे styles.css फाइल करने के लिए सौंदर्यशास्त्र।
तो यहाँ कोई messiness है।
वहाँ लाल का कोई जिक्र नहीं है या बोल्ड का सामना करना पड़ या इस फाइल में फ़ॉन्ट आकार।
बल्कि मैं शब्दार्थ है, सार्थक अपने डेटा के रूप में होती,
यहाँ कुछ महत्वपूर्ण डेटा है।
यहाँ कुछ और महत्वपूर्ण डेटा है।
इसके अलावा, यहाँ है मेरे महत्वपूर्ण डेटा की "पहले"।
तो HTML के बारे में सब प्रकार है टैगिंग, सचमुच, शब्दों का
और पैराग्राफ और निर्माणों अपने इन छोटे संकेत के साथ पेज, आप अगर
होगा, कि आप कर सकते हैं किसी भी तरह का उपयोग कर लाभ उठाने
इस तरह से सीएसएस जैसे अन्य तकनीकों।
>> तो विक्टोरिया के प्रश्न के जवाब में, हम पाठ कि रास्ते में बड़ा बना सकते हैं।
वहाँ तो कई अन्य तरीके हैं, लेकिन फ़ॉन्ट tag-- खुला ब्रैकेट "फ़ॉन्ट" -
वास्तव में कई साल पुराना है।
और इस समस्या है, भी, केवल निर्भर के साथ
ऑनलाइन resources-- पर वे पुराना हो जाते हैं।
और वास्तव में, कि बहिष्कार किया गया है, क्योंकि दुनिया का एहसास है,
"Font-size = 7" क्या मतलब है?
यह नहीं है।
और इतने सालों के लिए और करने के लिए इस तरफ से एक day--
यहाँ लिखते हैं कि यह वास्तव में है अविश्वसनीय रूप से दर्दनाक अब भी कभी कभी
के लिए स्थलों को विकसित करने के लिए वेब, क्योंकि माइक्रोसॉफ्ट
और गूगल और मोज़िला और दूसरों को अक्सर कैसे रूप में असहमत
HTML की तरह एक विनिर्देश व्याख्या करने के लिए।
>> वहाँ HTML के लिए एक नियम पुस्तिका है कि आम तौर पर क्या हर टैग का मतलब है कहते हैं।
लेकिन कभी कभी यह करने के लिए छोड़ दिया है कार्यान्वयन के विवेक,
माइक्रोसॉफ्ट के विवेक और गूगल।
और तो आप बहुत बार करेंगे एक वेबसाइट पर देख कुछ
एक पीसी पर अलग दिखता है की तुलना में यह एक मैक पर करता है,
और कहा कि वास्तव में है, क्योंकि, दिन के अंत में,
वे यह परीक्षण नहीं किया अच्छी तरह से दोनों प्लेटफार्मों पर।
लेकिन यह भी है क्योंकि उचित है, चालाक लोग असहमत नहीं होगा
और कंपनियों असहमत नहीं होगा, और इसलिए प्रोग्रामिंग की चुनौतियों में से एक
वेब डिजाइनिंग के लिए या वेब के लिए चीजों को
एक तरह से अपनी वेबसाइट लिख रही है कि हर वेब ब्राउज़र पर काम करता है।
लेकिन यह भी है कि अनुचित है, है ना?
इतने सारे के इतने संस्करणों रहे हैं वहाँ से बाहर है कि ब्राउज़रों, कुछ बिंदु पर,
आप भी एक निर्णय फोन बनाने के लिए है और आप एक कंपनी के रूप में फैसला करना है,
विशेष रूप से ई-वाणिज्य-शैली के लिए साइटों जहाँ आप कर रहे हैं
नवीनतम और सबसे बड़ी उपयोग करने की कोशिश प्रौद्योगिकियों में एक बहुत अच्छा उपयोगकर्ता देने के लिए
अनुभव।
लेकिन अपने उपयोगकर्ताओं का कुछ प्रतिशत हो सकता है अभी भी इंटरनेट एक्सप्लोरर 6 या 7 का उपयोग हो
या 8, खासकर पर निर्भर करता है देश है कि वे से आ रहे हैं।
>> और तो बहुत सामान्य परामर्श में कुछ है
"की तरह वेब ब्राउज़र आँकड़े।"
और अगर हम ऐसा है-- जाना विकिपीडिया देख और देखते हैं कि अप-टू-डेट इस चार्ट है
यदि वहाँ एक है।
यहाँ तो आप देख सकते हैं जहां ब्राउज़र वास्तव में
दिसंबर 2015 के अनुसार, कर रहे हैं, अमेरिकी सरकार के अनुसार।
क्रोम, 42% शेयर बाजार पर है पीछा किया मोटे तौर पर कॉर्पोरेट सेटिंग में आईई द्वारा
या पीसी सेटिंग्स, ज़ाहिर है, फ़ायरफ़ॉक्स द्वारा पीछा किया,
तब सफारी, ओपेरा तो नहीं किया है यहां किसी कारण के लिए नक्शा बनाने,
और फिर दूसरों को।
हो सकता है कि यह दूसरों के तहत है।
लेकिन उस से अधिक समस्याग्रस्त है- चलो देखते हैं अगर विकिपीडिया भी है
ब्राउज़रों के संस्करणों version--
>> के ब्राउज़र आंकड़ों के चलते हैं।
अर्थात।
यहाँ तक कि वह पर्याप्त नहीं है।
ब्राउज़र आँकड़े।
मेरा संस्करण।
यह सही होने के लिए नहीं जा रहा है।
चलो संस्करणों में देखते हैं।
ब्राउज़र बाजार में हिस्सेदारी।
चलो देखते हैं अगर यह ऊपर आता है।
ठीक।
अब यह हो रही है एक छोटे से अधिक उपयोगी है।
तो यहाँ, नोटिस हम सब की है कि ब्राउज़रों के विभिन्न संस्करणों।
और, मेरे भगवान, तुम क्रोम look-- यदि 48, क्रोम 47, क्रोम 31, क्रोम 45।
मेरा मतलब है, तेजी से अद्यतन ब्राउज़रों, और कभी-कभी उन परिवर्तनों में से कुछ
में महत्वपूर्ण हैं कार्यक्षमता की दृष्टि से।
और तो कुछ बिंदु पर, उत्पाद प्रबंधकों या इंजीनियर
एक decision-- बनाने की जरूरत है आप पता है क्या, दुनिया का केवल 1%
अभी भी IE 7 उपयोग कर रहा है।
उन लोगों के साथ भाड़ में जाए।
हम सिर्फ करने के लिए नहीं जा रहे हैं कि ब्राउज़र समर्थन करते हैं।
और क्या इसे समर्थन नहीं करने के लिए क्या मतलब है?
इसका मतलब यह हो सकता है कि बटन अपने वेब पेज पर काम नहीं करते,
या यह मतलब हो सकता है स्वरूपण पूरी तरह से बंद है।
या आप बनाने के लिए हो सकता है कि एक ही निर्णय फोन
मोबाइल इन दिनों, कहाँ, हम कर रहे हैं में अब और आईओएस 5 समर्थन करने के लिए नहीं जा रहा।
तो लोगों को बस का उन्नयन किया है।
या फिर हम कप केक का समर्थन करने के लिए नहीं जा रहे हैं एंड्रॉयड उपकरणों के लिए एंड्रॉयड ओएस पर,
क्योंकि जैसा कि world-- के रूप में तकनीक की दुनिया आगे बढ़ना चाहता है,
यह एक तरह से खींचें करने के लिए चाहता है इसके साथ दुनिया इतनी है कि वे नहीं है
होना करने के लिए जारी रखने के लिए पीछे संगत वे ऐसा
नई और अच्छी सुविधाओं की पेशकश कर सकते हैं।
यह वास्तव में कारणों में से एक है यही कारण है कि इतनी सारी कंपनियों को बाहर चल रहे हैं
स्वत: अद्यतन और मजबूर कर के प्रकार हम पर सॉफ्टवेयर के नवीनतम संस्करण।
और भी कंपनियों एप्पल की तरह की तरह का होगा
आप लगभग बल या मजबूर आप बाजार की शक्तियों के संदर्भ में
एक नया फोन खरीदने के लिए है क्योंकि वे बस अब अपने पुराने फोन अद्यतन नहीं होगा।
तो तुम पर बाहर याद आती है नवीनतम और सबसे बड़ी सुविधाओं,
यह एक के रूप में उन्हें महंगा है, क्योंकि कंपनी पुराने बनाए रखने के लिए, यकीनन
सॉफ्टवेयर के अवर संस्करणों।
लेकिन शुद्ध प्रभाव यह है कि हम भी इस रूप में अच्छी तरह से पीड़ित हैं।
>> तो चलो बस पर एक नजर डालते हैं अंतिम चीजों की एक जोड़ी यहाँ।
के असली तेजी से दस्तक जाऊं उन अन्य गोलियां, उत्सुक हैं।
तो आप करने की कोशिश कर रहे थे, उदाहरण के लिए, स्थिति के लिए
के विभिन्न पक्षों पर पाठ पेज, मैं एक त्वरित तरीका क्या करने जा रहा हूँ,
लेकिन वहाँ अलग है इस काम को करने के तरीके।
मुझे आगे जाना है और eliminate-- चलो इस सरल प्रकार है।
मुझे बस को वापस जाओ मेरी सरल, साधारण पैराग्राफ।
मुझे मेरे styles.css करने के लिए वापस जाओ।
और मैं सिर्फ simple-- का उपयोग करने के लिए जा रहा हूँ आप गूगल पर देखा है हो सकता है
या earlier-- से याद सही पाठ संरेखित।
और इस पृष्ठ पुनः लोड।
अब सब कुछ लगती है सही गठबंधन हो सकता है,
जैसा कि आप यहाँ ओवरहेड पर देख सकते हैं।
>> हम इसे देखो कर सकते हैं एक छोटे से अधिक किताब की तरह है, और हम कह सकते हैं "का औचित्य साबित"
और पुनः लोड।
अब यह अच्छा है और दोनों पर वर्ग है पक्ष है, जो एक तरह से अच्छा है।
एक और लक्ष्य है कि हम यहाँ था पाठ का रंग बदल गया था।
इसलिए हम देखा कि मेरे लाल पाठ के साथ।
और अब एक फार्म के लिए बटन जोड़ने।
तो क्यों न हम वास्तव में ऐसा करने की कोशिश क्यों नहीं करते?
लेकिन पहले मुझे एक साइट पर जाना है कि चलो हम में से ज्यादातर गूगल day-- हर का उपयोग करें।
और चलो पर एक नज़र रखना कैसे गूगल वास्तव में काम करता है।
लेकिन मैं यह करने के लिए जा रहा हूँ।
पहले मुझे यह in-- करना हां करते हैं, मेरे गूगल के पहले चलते हैं।
मैं जाने के लिए जा रहा हूँ Google सेटिंग में,
क्योंकि मैं निष्क्रिय करना चाहते हैं कुछ तुरंत परिणाम बुलाया।
>> तो अगर आप में देखा हो सकता है गूगल इन मुझे वापस जाने दिया days--
और इस मोड़ पर।
तो अगर मैं खोज शुरू इस तरह "बिल्ली" के लिए,
सूचना है कि केवल ऐसा नहीं मैं ऑटो-पूरा मिल
शीर्ष पर, अचानक, पृष्ठ ही बहुत जल्दी के रूप में अच्छी तरह से बदल रहा है,
और कहा कि गूगल के लिए एक भाषा का प्रयोग है मददगार बनने की कोशिश कर जावास्क्रिप्ट बुलाया।
लेकिन दुर्भाग्य से, यह एक तरह के बारे में हमारी चर्चा को खराब करता है
क्या वास्तव में क्या हो रहा है की हुड यहाँ के नीचे।
तो मैं बस की तरह जल्दी से कर रहा हूँ तुरंत परिणाम बंद कर देते हैं।
और मुझे बचाने के क्लिक करने के लिए जा रहा हूँ।
और अब मैं खोलने के लिए जा रहा हूँ कि नैदानिक ​​उपकरण पट्टी है कि मैं
नेटवर्क टैब के तहत उद्घाटन रहते हैं।
तो चलो यह करते हैं।
चलो me-- whoops-- इस थोड़ा नीचे स्क्रॉल करें।
और मेरे लिए खोज करते हैं "बिल्लियों।"
>> और अब notice-- वास्तव में, यह एक अच्छा अवसर है
एक पल के लिए चर्चा की।
पल मैं type-- इसे रोकने पर ध्यान दें।
इसे रोक।
ठीक।
पल सूचना मैंने अक्षर टाइप सी, स्क्रीन के नीचे देखो।
ए टी एस क्या नीचे करता है इस स्क्रीन की, मेरे नेटवर्क टैब,
सुझाव है कि प्रत्येक हो रहा है बार मैं एक अक्षर टाइप?
दुर्भाग्य से, मेंढक बहुत है ध्यान भंग आज या तिपतिया
या वह जो कुछ भी है।
क्या हर बार मैं टाइप हो रहा था?
और मुझे स्पष्ट करते हैं बफर और इसे फिर से लिखें।
So-- वूप्स।
हर बार जब मैं एक पत्र लिखें, सी ए T-- इसलिए एक नई पंक्ति जाहिर दिखने रहता है।
उन पंक्तियों में से प्रत्येक क्या प्रतिनिधित्व करता है, हम क्या देखा और चर्चा की है पर आधारित
अब तक?
दर्शकों: एक खोज?
डेविड जे मालन: एक खोज, या अधिक सामान्य रूप से, एक HTTP अनुरोध
सर्वर के लिए अपने ब्राउज़र से।
ठीक है, क्यों अपने ब्राउज़र एक HTTP कर रही है हर बार मैं एक अक्षर टाइप अनुरोध?
>> दर्शकों: [सुनाई]
डेविड जे मालन: हाँ, यह दे रही है मुझे इन स्वत: पूर्ण परिणाम है।
की तरह, जहां इन करना खोज परिणामों से आते हैं?
खैर, हर बार जब मैं एक टाइप पत्र, गूगल और अधिक भेजता
और अधिक से अधिक की शब्द मैं टाइप कर रहा हूँ।
क्यूं कर?
वे मुझे एक देना चाहता हूँ क्योंकि बेहतर और बेहतर, बेहतर सुझाव है,
सुझावों की एक सूची, क्या शब्द के लिए मैं वास्तव में पूरा करने की कोशिश कर रहा हूँ।
तो यह सचमुच हर कहने के लिए है चरित्र आप गूगल में टाइप
भेजा जा रहा है, अंततः में थोक, लेकिन यह भी कभी कभी एक
आदेश को लागू करने में एक समय में इन स्वत: पूर्ण सुविधाओं जब
डेटा, ज़ाहिर है, वेब पर।
>> अब, क्या वास्तव में एक नज़र रखना जब मैं गूगल खोज क्लिक होता है।
और फिर हम यह अपने आप का लाभ उठाने देंगे।
तो अगर मैं बहुत करने के लिए अब नीचे स्क्रॉल पहली अनुरोध है कि बस हो गया।
निम्नलिखित नोटिस।
यह एक काफी लंबे समय के लिए भेजा गया था URL-- https://www.google.com/search?
और फिर सामान की एक पूरी गुच्छा।
चलो यह वास्तव में अब देखना ब्राउज़र टैब अपने आप में।
यहाँ उपकरण पट्टी से छुटकारा मिलता है।
यहाँ खोज परिणामों के पृष्ठ है।
और नोटिस यहाँ यूआरएल है।
अब, आप शायद अनुमान लगा सकते हैं किस हिस्से में हो रहा है यहाँ।
तो सब से पहले, एक परिभाषा।
यह जाहिरा तौर पर गंतव्य है जहां फार्म प्रस्तुत है।
तो जब मैं में टाइप शब्द "बिल्ली" और हिट दर्ज करें,
जाहिरा तौर पर गूगल भेजा इस यूआरएल के लिए मेरे पाठ इनपुट
कि मैं प्रकाश डाला है वहाँ, खोज स्लेश।
पता चला है, एक यूआरएल, कुछ भी है कि में के बाद एक प्रश्न चिह्न है होता है,
जैसा कि हम कह रखने के लिए, एक महत्वपूर्ण मूल्य जोड़ी उस रूप में या किसी भी तरह टाइप किया गया था
से प्रेषित सर्वर से ब्राउज़र।
>> इसलिए किसी भी समय आप इनपुट टाइप वेब पर एक फार्म में
और यह रूप में हम है भेजा है , पर चर्चा की गई एक मिल के माध्यम से,
इन में से एक आभासी लिफाफे, सामग्री
की है कि हाँ envelope--, रख शारीरिक रूप से भरवां हो रही है
कक्षा में लिफाफे में आज, लेकिन तकनीकी रूप से
यह वास्तव में URL में डाल रहा है।
वास्तव में तो, मुझे इस के माध्यम से झारना करते हैं।
आप उपयोगकर्ता इनपुट कहाँ देखते हैं?
जहाँ आप कुछ देख पा रहे हैं कि मैं अपने आप को यहाँ टाइप?
हाँ, तो "बिल्लियों।"
सही?
तो मुझे यह गढ़ने चलो सरल कुछ में।
मैं के बारे में सब कुछ नष्ट करने के लिए जा रहा हूँ इस यूआरएल है कि मुझे समझ नहीं आता,
और मैं बस छोड़ने के लिए जा रहा हूँ यह this-- के रूप में / खोज? q = बिल्लियों।
हम जहां क्यू देखेंगे एक पल में से आता है,
लेकिन लगता है कि कम से कम की तरह लगता है जानकारी की मात्रा है कि मैं प्रदान की है।
और अब मैं हिट दर्ज करने के लिए जा रहा हूँ।
और यह अभी भी काम करता है नोटिस।
हम अभी भी बिल्लियों की एक पूरी गुच्छा वापस जाओ।
तो गूगल शौक़ीन है इस से इन दिनों।
यह 2016, 1999 नहीं है।
तो वहाँ अन्य सामान है कि मेरे ब्राउज़र सर्वर को भेज रहा है।
लेकिन यह न्यूनतम है कि सभी आवश्यक है।
>> तो क्या चल रहा है?
खैर, सबसे पहले मुझे आगे जाना है और चलते हैं वापस Cloud9 करने के लिए और मुझे आगे चलते हैं
और पहले मेरी टैब बंद करें।
और मैं इस पर पूरी कोशिश करूँगा बस एक पल के लिए ही है।
मैं आगे जाने के लिए जा रहा हूँ और नई फ़ाइल बनाएँ।
और मैं google.html के रूप में इसे बचाने के लिए जा रहा हूँ।
और मैं जा रहा हूँ बहुत quickly-- मैं चोरी करने के लिए जा रहा हूँ, वास्तव में,
इस पाठ के कुछ ही समय बचाने के लिए।
मैं यहाँ में इस पेस्ट करने जा रहा हूँ।
मैं के साथ परेशान करने के लिए नहीं जा रहा हूँ किसी भी stylization इस बार।
हम इस फोन करने के लिए जा रहे हैं "मेरा गूगल।"
और मैं छुटकारा पाने के लिए जा रहा हूँ शरीर में सब कुछ की।
और मैं निम्नलिखित क्या करने जा रहा हूँ।
मुझ में ज़ूम करते हैं।
action-- फार्म और मैं संक्षेप में उल्लेख किया है whoops-- मैं संक्षेप के रूप में earlier--
पहले उल्लेख किया, एक की कार्रवाई फार्म जहाँ आप करने के लिए डेटा भेज रहा है।
तो google.com/search।
और विधि मैं उपयोग करना चाहते हैं दो चीजों में से एक हो सकता है।
यह या तो "मिलता है," हो सकता है के रूप में हम रख पर चर्चा है, या यह हो सकता है 'के बाद। "
अभी के लिए, मौलिक फर्क है, अगर आप का उपयोग करें "मिलता है,"
जानकारी है कि सभी को उपयोगकर्ता URL में भेजा जाता है प्रदान करता है।
>> यही कारण है कि खोज की तरह चीजों के लिए अच्छा है इंजन और कुछ अन्य अनुप्रयोगों
लेकिन क्या इन परिस्थितियों होगा आप बाहर एक फार्म भरने के लिए नहीं चाहता
और जानकारी को खत्म कर दिया है यूआरएल, अपने ब्राउजर के एड्रेस बार में पसंद है?
रूपों में से किस तरह you-- करना
दर्शकों: [सुनाई]
डेविड जे मालन: हाँ, क्या पसंद है?
दर्शकों: पासवर्डों।
डेविड जे मालन: हाँ, तो आप लॉग इन करें फेसबुक या कुछ वेबसाइट में।
यही से उपयोगकर्ता इनपुट है एक रूप है, एक पाठ बॉक्स,
लेकिन आप शायद यह नहीं चाहते ब्राउज़र का यूआरएल में दिखा।
क्यूं कर?
मेरा मतलब है, शायद वहाँ कुछ कर रहे हैं नेटवर्क पर सुरक्षा निहितार्थ
लेकिन चाहते more--, अधिक बस, फिर क्या हुआ अगर अपने रूममेट, अपने महत्वपूर्ण दूसरे,
अपने बच्चों, अपने पति लग रहा है अपने ब्राउज़र इतिहास के माध्यम से?
वहाँ अपना पासवर्ड सही है आपके ब्राउज़र के इतिहास में वहाँ।
यह अच्छा डिजाइन की तरह महसूस नहीं करता है।
या और भी अधिक तकनीकी रूप से, लगता है तुम कोशिश कर रहे हैं
फ़्लिकर के लिए एक तस्वीर अपलोड करने के लिए या फेसबुक या wherever--
कि, उपयोगकर्ता इनपुट है, भले ही यह interesting-- कैसे एक छोटे से अधिक है
मैं यूआरएल बार में एक छवि रटना है?
आप की तरह की तरह नहीं कर सकते।
आप की तरह कर सकते हैं।
लेकिन, वास्तव में, मैं कठिन दौर से गुजर रहा हूँ कर रही है कि कल्पना करना।
इसलिए मुझे लगता है के लिए एक और विधि की जरूरत एक वेबसाइट पर फोटो अपलोड करने,
और कहा कि अन्य विधि "के बाद।" कहा जाता है
लेकिन अब के लिए, हम बस के बारे में बात करेंगे "मिलता है," जो दो की मदद की है।
यह सिर्फ कहते हैं सब URL में उपयोगकर्ता इनपुट।
>> तो यहाँ प्रपत्र मैं पैदा कर रहा हूँ।
मैं एक इनपुट चाहते हैं।
और क्या आपको पता है?
मैं यहाँ एक अनुमान लेने के लिए जा रहा हूँ।
मुझे याद है करने जा रहा हूँ मेरे इनपुट के लिए 'क्यू' 'क्वेरी। "
और मुझे लगता है कि इस में से एक है मूल डिजाइन, शायद, 1999 से।
और फिर इस इनपुट के प्रकार सिर्फ होने जा रहा है "पाठ।"
और फिर मैं एक और इनपुट के लिए जा रहा हूँ कि एक नाम की जरूरत नहीं है, जैसा कि हम जल्द ही करेंगे
देखते हैं, जिनमें से प्रकार है "भेजें।"
और यह करने के लिए जा रहा है मुझे एक विशेष बटन दे।
और बस।
>> तो मुझे आगे जाना है और इस फाइल को बचाने के लिए करते हैं।
मैं करने के लिए वापस जाने के लिए जा रहा हूँ मेरे ब्राउज़र और google.html के पास जाओ।
दर्ज।
और यह विरल की तरह है कम से कम कहने के लिए।
लेकिन मुझे आगे चलते हैं और के लिए खोज "बिल्लियों।"
और नोटिस मैं वर्तमान में हूँ इस Cloud9 URL पर।
लेकिन इस समय मैं इस पर क्लिक करें, जहां आप आशा है कि मैं अंत होगा?
>> दर्शकों: गूगल।
>> डेविड जे मालन: गूगल।
तो चलो सबमिट क्लिक करें।
और मैं वास्तव में गूगल को फिर से क्रियान्वित किया है।
सही?
यह आसान है।
यह हल्का है।
मेरा मतलब है, मेरे कोड को स्पष्ट रूप से बेहतर है उनकी, गंदगी से हम पहले देखा था।
और क्या आपको पता है?
मैं यह एक छोटा सा मसाला करने के लिए जा रहा हूँ।
मैं यह पहले उल्लेख नहीं किया।
वहाँ एच 1 की तरह टैग, 1 शीर्षक के लिए कर रहे हैं, एक पेज में सबसे महत्वपूर्ण शीर्षक।
"मेरे गूगल," मैं इस फोन करता हूँ।
मेरे फिर से लोड करते हैं।
यह पहले से ही एक छोटे से बेहतर लग रही है।
और, वास्तव में, तुम जानते हो क्या?
मैं already-- मैं झूठ बोला है।
मैंने कहा कि मैं इस शैली के लिए नहीं जा रहा था, लेकिन मैं पहले की तरह इस शैली के लिए जा रहा हूँ।
और मेरा शरीर है, होने जा रहा है हम कहते हैं कि पाठ के अनुरूप केंद्र करते हैं।
यह और अधिक गूगल की तरह पहले से ही लग रही है।
>> मैं एक लाइन को तोड़ने की जरूरत है, हालांकि, इसके लिए बटन सबमिट करें।
और यह पता चला है, तो आप पैराग्राफ उपयोग कर सकते हैं,
या आप अधिक सचमुच सिर्फ कह सकते हैं, मुझे एक पंक्ति विराम बीआर टैग here-- दे।
और अगर मैं इस पुनः लोड है, अब यह वहाँ चला जाता है।
यह एक छोटे से बदसूरत है, तो मैं कई लाइन टूट कर सकता है,
लेकिन यहाँ भी लालची नहीं मिलता है।
तो अब देखते हैं अगर इसके लिए काम करता है "कुत्तों।"
यह रूप में अच्छी तरह "कुत्तों," के लिए काम करने लगता है।
तो क्या सम्मोहक takeaway यहाँ है?
One-- करने के लिए एक बड़ी छलांग नहीं था , कुछ और टैग परिचय
इनपुट टैग में प्रपत्र टैग की तरह।
लेकिन अधिक मौलिक है, हम सभी कर रहे हैं
हमारी समझ को विस्तार दे रहा है HTTP और तथ्य की
कि रूपों अंततः बदल ब्राउज़र की URL में क्या है,
और हां, तो इसलिए, हम कर सकते हैं यंत्रवत् एक सर्वर के लिए इनपुट प्रदान
एक HTML फार्म बनाने और जानने के द्वारा उस सर्वर HTTP समझता है,
सिर्फ हमारे शरीर है, समझता है की तरह की तरह है, मेरे हाथ मिलाते हुए, कि एक ही प्रोटोकॉल,
और इसलिए हम प्रतिक्रिया वापस पाने के हम उम्मीद करते हैं कि अंततः।
>> तो चलो एक करने की कोशिश करते हैं आखिरी बात अब मोबाइल के साथ,
और मैं make-- हूँ मैं जोड़ देंगे स्लाइड्स के लिए इस कोड।
आप टिंकर करने के लिए, आप चाहें तो अगर निश्चित रूप से वहाँ से ले सकते हैं।
लेकिन मैं जाने के लिए जा रहा हूँ आगे और एक काम करो।
मैं आगे जाने के लिए जा रहा हूँ और मेरे सूचकांक page-- ऊपर खुला
मेरे हैलो पेज के रूप में पहले, जो यह अशुद्ध लैटिन पाठ का एक बहुत है
या व्यर्थ लैटिन पाठ, और has-- यह इस फ़ॉन्ट आकार में इस तरह दिखता है।
लेकिन मुझे आगे जाना है और यह करते हैं।
मैं Cloud9 में जाने के लिए जा रहा हूँ।
और अगर आप इस कदम करने के लिए नहीं है।
मैं सिर्फ यह खुद कर लेंगे।
मैं साझा क्लिक करने के लिए जा रहा हूँ।
और यह एक विशेषता है सिर्फ Cloud9, जिससे की
मैं अपने पर्यावरण सार्वजनिक बना सकते हैं।
>> और बस की खातिर प्रदर्शन, मुझे यह करते हैं।
मैं अपने आवेदन को सार्वजनिक करने के लिए जा रहा हूँ।
सूचना है कि यह मुझे चेतावनी है, कर रहा हूँ मुझे यकीन है कि मैं ऐसा करना चाहते हैं,
क्योंकि यह हर किसी के बनाने जा रही है दुनिया में, चाहे वे अब यहाँ कर रहे हैं
या पर बाद में वीडियो देख रहा इंटरनेट सक्षम देखने के लिए मैं क्या देखते हैं।
लेकिन यह ठीक है।
मैं कहने जा रहा हूँ "हो गया।"
और, मेरे लिए प्रोत्साहित करते हैं, तो मैंने किया यह मेरे लिए यह पहला परीक्षण करते हैं correctly--।
आगे बढ़ो, अगर आप mind-- नहीं है अपने कंप्यूटर पर एक ब्राउज़र में,
इस यूआरएल के लिए जाना है, और उम्मीद है कि तुम मेरे लैटिन पाठ देखेंगे।
और स्पष्ट हो, यह अपने लैपटॉप पर नहीं चल रहा है।
यह बादल में है।
यह सचमुच, Cloud9 पर है, लेकिन मैं अपने कार्यक्षेत्र सार्वजनिक कर दिया है
तो यह है कि इंटरनेट पर किसी को भी मेरे लैटिन घर पृष्ठ का उपयोग कर सकते हैं।
>> पर उसी यूआरएल पर जाएं अपने फोन को, अगर तुम सकता है।
यदि यह आप, हालांकि, आप खर्च होगा सिर्फ एक कंधे पर देख सकते हैं।
दर्शकों: [सुनाई]
डेविड जे मालन: मैं माफी चाहता हूँ?
दर्शकों: [सुनाई]
डेविड जे मालन: बस लैटिन शब्द।
बस इतना ही।
लेकिन यह है कि आप क्या देखना चाहिए है।
>> दर्शकों: हाँ।
डेविड जे मालन: हाँ।
हाँ।
ठीक।
इसलिए मुझे पकड़ कर सकते हैं अपने बस एक पल के लिए फोन?
इसलिए, उम्मीद है, आप तक पहुँच रहे हैं यह है, यह लगभग अपठनीय दिखना चाहिए।
यह still-- मेरा मतलब है, यह है लैटिन की वजह से अपठनीय।
लेकिन यह भी अस्पष्ट है क्या अन्य कारण के लिए?
की तरह, क्या आप इस बारे में displeases?
दर्शकों: यह छोटा है।
डेविड जे मालन: यह सुपर सुपर छोटा है।
इसलिए हम यह कैसे तय कर सकता है?
यह सुपर सुपर छोटा है विक्टोरिया के फोन पर
और, आप खींच लिया है, तो इसे अपने आप को, शायद
अपने फोन पर छोटे रूप में अच्छी तरह से, आप जब तक पहुंच सेटिंग्स सक्षम है।
वह क्या है?
तुम बस चुटकी सकता है और जूम, जो व्यावहारिक है,
लेकिन तब आप केवल देखना एक समय में कुछ शब्द।
तो एक मिनट रुको।
मैं यह कैसे तय करने के लिए जानते हैं।
सही?
मैं सीएसएस इस्तेमाल कर सकते हैं, और मैं बदल सकता है 12-बिंदु से 24 सूत्री के लिए फ़ॉन्ट आकार।
लेकिन उस के पक्ष प्रभाव, जाहिर है, अब होने जा रहा है,
एक डेस्कटॉप या लैपटॉप पर, अब पाठ में बड़े रूप में दो बार है।
और तो यह एक तरह से अच्छा होगा उपकरणों के बीच भेद करने के लिए,
और यह वहाँ पता चला है कर रही है कि के तरीके हैं।
बहुत सारे है अलग अलग तरीकों से, वास्तव में,
जिससे सीएसएस और शौक़ीन सुविधाओं का उपयोग कि हम महान विस्तार में नहीं जाऊँगा,
आप अनिवार्य रूप से क्वेरी कर सकते हैं ब्राउज़र और कहते हैं,
अगर आपके स्क्रीन इस से छोटा होता है कई पिक्सल, इस फ़ॉन्ट आकार का उपयोग करें।
यदि आपकी स्क्रीन इस से भी बड़ा है कई पिक्सल, यह अन्य फ़ॉन्ट आकार का उपयोग करें।
>> आप अभी भी शौक़ीन हो सकता है।
आप कभी भी दौरा किया गया है एक वेब पेज है कि, एक डेस्कटॉप पर,
शायद के लिए रवाना एक बड़ी सूची है पक्ष, और फिर सामग्री के सभी
कि के पक्ष में है menu-- कि एक आम प्रतिमान की तरह है।
छोड़ दिया, सामग्री पर मेनू ठीक है, या ठीक इसके विपरीत है।
वास्तव में मोबाइल पर काम नहीं करता है जब आपके स्क्रीन केवल यह कई पिक्सल चौड़ा है।
इसलिए अधिक आम मोबाइल है पर, अपने मेनू अचानक मिल जाएगा
ध्वस्त हो गई, और आप के लिए है एक बटन को क्लिक करें यह देखने के लिए,
या वेबसाइट मेनू डाल देंगे यह ऊपर और नीचे सामग्री डाल दिया।
और अगर आप इन लागू कर सकते हैं कई मायनों में बातें भी।
आप अपने प्रोग्रामर पूछ सकते हैं, अरे, टीम, किसी भी समय
आप एक Android से एक HTTP अनुरोध देखना डिवाइस, एक माइक्रोसॉफ्ट डिवाइस, एक गूगल
डिवाइस, एक एप्पल डिवाइस, इस का उपयोग फ़ॉन्ट आकार और यह मेनू लेआउट का उपयोग,
वरना यह डिफ़ॉल्ट बड़ा लेआउट का उपयोग करें।
>> अब, उपयोग क्या मौलिक तकनीक आज
इंजीनियरों इस्तेमाल कर सकते हैं पता है कि यह है कि क्या
एक iPhone, एक Android फोन, एक लैपटॉप, एक डेस्कटॉप कंपनी के सर्वर का दौरा?
जिसमें वे कहते हैं कि जानकारी प्राप्त करते हैं?
>> दर्शकों: हैडर?
>> डेविड जे मालन: हाँ, HTTP हेडर।
तो हर HTTP अनुरोध से आ रही अपने ग्राहकों को अपने सर्वर को
कि आभासी अंदर शामिल लिफाफा, एक पूरी गुच्छा
HTTP हेडर की है, जिनमें से एक है ब्राउज़र और ऑपरेटिंग सिस्टम
यहां तक ​​कि, आप के लिए परवाह है विस्तार के उस स्तर।
अब, यह एक गुप्त दिखने स्ट्रिंग है, लेकिन सॉफ्टवेयर है कि वहां मौजूद सिर्फ होगा
को आसान बनाने कि, और तुम सिर्फ पूछ सकते हैं प्रोग्रामिंग code-- पीएचपी, जावा, सी ++ में,
whatever-- क्या फोन this-- है क्या डिवाइस का उपयोग कर इस उपयोगकर्ता है?
और फिर आप कह सकते हैं, उन्हें इस शो वेबसाइट के संस्करण में अगर यह एक फोन है।
उनमें से इस संस्करण दिखाएँ वेबसाइट अगर यह एक लैपटॉप या डेस्कटॉप है।
लेकिन तुम भी जरूरत नहीं है सर्वर साइड जटिलता।
आप चीजों की भी सरल कर सकते हैं।
>> मैं यह करने के लिए जा रहा हूँ।
मैं में आगे जाने के लिए जा रहा हूँ मेरे Cloud9 पर्यावरण,
और मैं एक और टैग को जोड़ने के लिए जा रहा हूँ है कि आप पहले गूगल में देखा था।
यह मेटाटैग कहा जाता है।
और मैं इस एक याद कभी नहीं, इसलिए मैं इसे यहाँ टाइप करने के लिए जा रहा हूँ।
मेटा नाम = "व्यूपोर्ट" और फिर सामग्री = "चौड़ाई = डिवाइस चौड़ाई, intital
पैमाने = 1 "और यह बात है।
>> तो यह भी हो सकता है एक जादुई जादू की तरह।
यह सब है कि स्पष्ट नहीं है, लेकिन यह है व्यूपोर्ट के साथ क्या कुछ,
और व्यूपोर्ट सिर्फ एक के शरीर है वेब पेज, आयताकार क्षेत्र है कि
पेज के सबसे परिभाषित करता है।
और यह सिर्फ कह रही है ब्राउज़र, तुम जानते हो क्या?
इस पृष्ठ की चौड़ाई बनाओ प्रभावी ढंग से युक्ति चौड़ाई के बराबर है।
दूसरे शब्दों में, यह है कि मान नहीं है आप असीमित अंतरिक्ष की तरह है।
मान लें कि आप केवल के रूप में ज्यादा है युक्ति स्वयं के रूप में अंतरिक्ष बड़ा है।
और इसलिए अब, अगर मैं यह फिर से लोड अपने ब्राउज़र में, मैं कोई परिवर्तन नहीं देखते हैं।
लेकिन अगर मैं इस correctly-- किया था और मुझे मेरे fingers-- को पार करते हैं, तो आप सभी
अपने फोन को फिर से लोड, तुम क्या एक सम्मोहक परिवर्तन देखते हैं?
हाँ, that-- है
>> दर्शकों: [सुनाई]
डेविड जे मालन: हां।
ठीक।
तो यकीनन अधिक पठनीय अब?
अभी भी छोटे, निष्पक्ष हो, लेकिन नहीं इतनी के रूप में छोटे असहनीय होने के लिए।
और मैं निश्चित रूप से इस पर हावी हो सकता है आगे सीएसएस के साथ या सर्वर साइड पर,
लेकिन तेजी से आप क्या कर रहे हैं देखकर अधिक से अधिक सुविधाओं है
में जोड़ा जा रहा क्लाइंट साइड environments--
जावास्क्रिप्ट, के रूप में हम चर्चा करेंगे कल, सीएसएस, और इसलिए HTML--
इन प्रश्नों के सभी कि ग्राहक पर किया जा सकता है
इतनी के रूप में परेशान करने के लिए सर्वर एक बहुत कम है और नहीं
के लिए साथ रखने के लिए, के लिए है उदाहरण के लिए, लगातार हमले
नए ऑपरेटिंग सिस्टम की संस्करण, नई ब्राउज़र संस्करणों।
तुम बस ब्राउज़र में दे सकते हैं डिवाइस से पूछते हैं, कितना बड़ा है, आप कर रहे हैं
और फिर कुछ हद तक तार्किक बनाना उस पर आधारित निर्णय।
लेकिन हम और अधिक अवसर देखेंगे तार्किक निर्णय के लिए
इस संदर्भ में कल एक प्रोग्रामिंग भाषा का।
>> तो, किसी भी सवाल है, तो, वेब विकास पर?
आज वेब प्रोग्रामिंग, प्रति नहीं है एसई, के बाद से सबसे सब कुछ हमने किया
अगर तुम जाएगा, बहुत सौंदर्य था।
वहाँ में कोई निर्णय लेने की है कोड है कि हमने लिखा है,
और इतना है कि क्यों एचटीएमएल मार्कअप है भाषा नहीं, एक प्रोग्रामिंग भाषा।
लेकिन कल हम ले लेंगे एक त्वरित देखो, अंत में,
जावास्क्रिप्ट पर है, जो है एक वास्तविक प्रोग्रामिंग
हमें थोड़ा और अधिक करने की सुविधा देता है कि भाषा।
>> कोई सवाल?
खैर, मुझे दो का प्रस्ताव होमवर्क के लिए वैकल्पिक अवसरों।
इनमें से एक Cloud9 है- खातों समाप्त नहीं होगा।
आप का उपयोग करने के लिए स्वागत कर रहे हैं उनके साथ टिंकर करने के लिए।
यह सेवा से मुक्त स्तर है।
एहसास है कि, अगर जब बनाने अपने कार्यक्षेत्र, आप इसे सार्वजनिक किया
उस पर है कि किसी को क्या मतलब है इंटरनेट क्या आप टाइप कर रहे हैं देख सकते हैं।
तो शायद अभी विचार अपने आप को शर्मिंदा नहीं
आप अपनी पहली वेब डाल रहे हैं वहाँ से बाहर पेज सार्वजनिक रूप से गलती से,
लेकिन कोई नहीं जा रहा है वहाँ वैसे भी देखने के लिए पता।
>> और मुझे टॉस जाने two-- इस यूआरएल के रूप में अच्छी तरह से,
आप आज एक में आया है, खासकर अगर थोड़ा दूसरों की तुलना में कम आराम से,
अनिश्चित क्या यह सब सामान का मतलब है।
लगता है कि ज्यादा इस वीडियो से अधिक महसूस, जो दोनों एक अच्छा तरीका सो जाते है
और यह भी, जबकि हंसी के लिए ऐसा करने से, यह भी है
societally दिलचस्प का एक बहुत और सुरक्षा प्रासंगिक विचार विमर्श
उसमें जॉन ओलिवर से, एक हास्य अभिनेता यद्यपि।
>> लेकिन अगर आगे कोई सवाल नहीं कर रहे हैं, कि स्वागत के लिए लाता है।
तो क्यों मैं संगीत पर बारी नहीं है।
यहां पेय होना चाहिए और बाहर नाश्ता।
मैं के रूप में करने के लिए आपस में मिलना खुश हूँ लंबे समय तक लोगों की तरह होता है,
सवाल अधिक पर एक-एक जवाब।
लेकिन, अन्यथा, तुम्हारा स्वागत है किसी भी बिंदु पर बंद लेने के लिए,
और हम तुम्हें फिर से देख लेंगे थोड़ा और अधिक के लिए कल सुबह।
ठीक है धन्यवाद।