[સંગીત વગાડવાનો] 

DAVID જોહાન MALAN: આ CS50 છે અને આ અઠવાડિયે 7 શરૂઆત છે. તેથી પાછા સ્વાગત છે. અને તમે યાદ કરી શકે છે સમસ્યા, ચાર સેટની એક સફાઈ કામદાર શિકાર એક બીટ હતી કેટલાક કલ્પિત ઇનામ જેમાં માટે તમે ફોટા પુનઃપ્રાપ્ત પછી બંને અહીં અને ન્યૂ હેવન માં સ્ટાફ, તમે ઘણા શોધવા માટે પડકારવામાં આવી હતી તમે કરી શકે છે તે કમ્પ્યુટર વૈજ્ઞાનિકોનું. અને અમે સમગ્ર મળી છે સબમિશન્સ ટોળું. હું થોડા શેર કરશો વિચાર્યું આજે તમારી સાથે અહીં. 

અને અમે ઑનલાઇન આ બધા પોસ્ટ કરીશું. પરંતુ ખાસ કરીને, હું કરવા માગતા હતા તેમજ એક રહ્યો તમારું ધ્યાન દોરવા, સેમ તેમને ખૂબ થોડા હતી સામાન્ય રીતે આ જેવા દર્શાવતા. પરંતુ તે છે કે દેખાય છે આ સવારે, વિજેતા ચોક્કસ કોઈની સાથે કેન નામ આપવામાં આવ્યું હતું સ્ટાફ 24 કેમેરા પર કબજો તમે લેવા ત્યારે વધુ અથવા થોડા ચિત્રો માં ઘણાબધા સ્ટાફ હિસ્સો ધરાવે છે. અહીં ચિત્રમાં આગામી કેન છે ન્યૂ હેવન માં મેરી. 

હવે, કેન, જોકે, કરે છે બહાર એક ખૂણામાં કેસ બીટ છે કે હજુ સુધી પહેલાં થયું નથી. તે થઇ ન હતી કે બહાર વળે મને સમસ્યા ફાઈન પ્રિન્ટમાં મૂકી સ્ટાફ છે કે કહે છે કે ચાર સેટની કલ્પિત ઇનામ માટે અપાત્ર કેન, અલબત્ત, એક છે કારણ કે અમારા સ્ટાફ પર ફોટોગ્રાફરો. હવે જણાવ્યું હતું કે, સાથે, તેમણે મૂળ કહીશ મને લખ્યું ઓનલાઇન આ ફોટા પોસ્ટ ન કરો. હું મોટો ભાગ લાગે છે ફોટા મોટા ભાગના કારણ કે આ ફોટોગ્રાફર નજર નાખી છે કે આ જેવી થોડી કંઈક. અને જેમ. 

પરંતુ કેન મને તમે શંકા દૂર કરવા માંગો છો તેમણે ખૂબ જ સારી ફોટોગ્રાફર છે કે, તેમણે એક વ્યાવસાયિક લે છે ઝાંખી પડી ગઇ નથી કે ફોટા, ધ્યાન માં વધુ સારી હોય છે, અને તે તેમણે આપણા પોતાના સ્ટાફ ખૂબ થોડા લીધો હતો. પરંતુ માત્ર કરતાં સ્વીકારો અમે શું કરશો શું વિચાર્યું કેન, યાદી મારફતે જાઓ સબમિટ જે વાસ્તવિક વિદ્યાર્થીઓ. અને તેની સાથે કે લાન્સ બહાર વળે આ સવારે 15 ફોટા અમારા વિજેતા હતી. 

અને, લાન્સ કોલ્ટન સાથે છે અહીં ચિત્રમાં મારી સાથે Skaz, અને સેમ સાથે. પરંતુ પછી તે તારણ આપે છે કે તરીકે 11:46 AM, માત્ર થોડી અગાઉ, જેથી હું મારા ઇમેઇલ પર પાછા ગયા અને મળી અમે હજુ સુધી વધુ એક રજૂઆત હતી કે બોની નામના વિદ્યાર્થી દ્વારા જેની ઇમેઇલ માત્ર આ જ હતું. આવેલા નથી જવું, હું છું વર્ગ દરમિયાન આ કરી. અને પછી માત્ર જોડે આગળ 14 ફોટા, લાન્સ 15 શરમાળ છે. 

પરંતુ બોની ફોટા, તે કરે છે બહાર બહુવિધ સ્ટાફ સભ્યો, સેમ હતા તેમની વચ્ચે, તેથી અમે શું વિચાર્યું કરી શકે છે આ બંને સ્વીકારો છે. તેથી ડ્રૉપબૉક્સ મેળવવામાં ઉપરાંત જગ્યા કે ભાગ લેનારા દરેકને મેળવે છે, આ બંને વિભાગો પણ ચાલશે તેમને માટે એક સરસ ભોજનની વ્યવસ્થા બપોરના પ્રાપ્ત અને તેમના વિભાગ આ આગામી સપ્તાહ સંવનન. અને તેથી તમે અમારી પાસેથી સાંભળવા કરશે, તે વિશે લાન્સ અને બોની. તેમને જેથી મોટી અભિનંદન. હવે, તમે તે જે કરશે બપોરના જેવા વધુ સામાન્ય કેમ્બ્રિજ કે CS50 બપોરના ખબર અને ન્યૂ હેવન આ શુક્રવાર છે. CS50 વેબસાઇટ સ્લેશ આરએસવીપી પર જાઓ. અને હવે પરિસંવાદો એક શબ્દ. વધુ curricularly. તેથી અમે આરે રહ્યાં છો આ સત્ર બિંદુ તમે શરૂ કરીશું જ્યાં અંતિમ પ્રોજેક્ટ વિશે વિચારવાનો. અને હકીકતમાં, માત્ર એક બીટ માં, ચાલશે પૂર્વ દરખાસ્તો કારણે હોઈ જેથી-કહેવાય છે. તેથી પૂર્વ દરખાસ્તો થાય છે હોઈ ખૂબ ઓછી અસર અને ખરેખર માત્ર એક તક તમે ટૂંકા નોંધ કંપોઝ તમારા શિક્ષણ સાથી જાણ માટે તેને અથવા તેણીને તમે વિચારી રહ્યાં છો તે તમારી અંતિમ પ્રોજેક્ટ માટે કરવા માંગો છો શકે છે. 

હવે, ઘણા વિદ્યાર્થીઓ અંત કરી વેબ અંતિમ પ્રોજેક્ટ આધારિત છે. અને અલબત્ત, અમે ફક્ત છો આ હવે છેલ્લા અઠવાડિયે અને વેબ પ્રોગ્રામિંગ માં ડાઇવિંગ બહાર. તેથી જો તમે ચિંતા ન સંપૂર્ણપણે કોઈ વિચાર કેવી રીતે હોય છે તમે વિચારો બિલ્ડ કરશે કે તમે તમારા મન માં હોય શકે છે. આ ખરેખર માત્ર એક મજબૂર કાર્ય છે તમે વિચારી અને વાત કરવા માટે તે વિશે તમારા ટીએફ છે. પરંતુ તે સાથે તમને મદદ કરવા માટે, અને આખરે અંતિમ પ્રોજેક્ટ સાથે, CS50 એક પરંપરા છે ખબર છે કે ના પરિસંવાદો આપે છે. 

અને આ હાથ પર, વૈકલ્પિક છે અથવા તકો પર આધારિત લેક્ચર છે કે વિષયો વિશે વધુ જાણવા માટે આ કોર્સ માટે થોડી આનુષંગિક અભ્યાસક્રમ, પરંતુ તેમ છતાં અદ્ભુત સામગ્રી અંતિમ પ્રોજેક્ટ ઝુંબેશ ચલાવી છે. અને તેથી આ છે કે યાદી છે અહીં ન્યૂ હેવન માં CS50 સ્ટાફ માટે સાથે આવે છે iOS વિશે આ વર્ષે પ્રોગ્રામિંગ, Android પ્રોગ્રામિંગ, ગેમ ડેવલપમેન્ટ, વધુ સાધનો અને જુમખું અને ભાષાઓ અને તકનીકો. 

તેથી CS50 વેબસાઈટ પર નજર રાખે છે. અને સમય દરમિયાન, તમે કરવા માંગો છો, તો આ કોઇ રુચિ રજીસ્ટર, CS50 માતાનો સ્લેશ રજિસ્ટર પર જાઓ. અને અમે તે પછી તરીકે અનુવર્તી કરશે દિવસો અને ફ્લાઇટ વખત અને સ્થળો અને બધું મોટા ભાગનું બધું કરશે હોઈ સ્ટ્રીમ અને માંગ પર પણ ઉપલબ્ધ તમે ખરેખર તે ન કરી શકે તો પછી. જેથી વધુ મુસીબત વગર, અમે વિચાર સાથે છેલ્લા સમય બોલ છોડી દીધી. 

અને આ હતી કે સંદેશ જેવી હતી વર્ચ્યુઅલ પરબિડીયું ની અંદર, સ્મૃતિ, અમે રાઉટર રાઉટર થી પસાર વેબ બ્રાઉઝર અને વેબ વચ્ચે રાઉટર સર્વર. અને સંદેશ જોવામાં આ જેવી થોડી કંઈક. આ વધુ arcane સંદેશો હતો કે એક પરબિડીયું ની અંદર વાસ્તવમાં હતી જેની કાગળ એક ભાગ પર હોય તેવા પરચૂરણ પ્રથમ વાક્ય શાબ્દિક સ્લેશ વિચાર કહે છે. 

અને માત્ર એક સેનીટી ચેક તરીકે, સ્લેશ શું સૂચવે હતી? સ્લેશ ત્યારે શું અર્થ છે એક વેબસાઇટ વિનંતી? તમે તે બધા સમય વિનંતી છે. મોટા ભાગના કોઈપણ સમયે તમે વેબસાઇટની મુલાકાત લો, તમે ખરેખર ફાઇલ નામ લખો નથી. તમે કદાચ માત્ર Facebook.com પર જાઓ , gmail.com, અથવા જેમ દાખલ કરો. અને સ્લેશ શું પ્રતિનિધિત્વ કરે છે? શું ફાઈલ? ખાસ અથવા શું પાનું? 

ઇન્ડેક્સ, હા. મૂળભૂત પાનું તેથી. તમે ફાઈલ સ્પષ્ટ નથી તેથી જો અમે જોવા માટે શરૂ કરી શકશો તરીકે નામ, તમે ખરેખર માત્ર રહ્યાં છો વિનંતી મને ફેસબુક મૂળભૂત પાનું આપો અથવા મને મારા ઇનબૉક્સ આપવા અથવા આપી મને સમાચાર મૂળભૂત પાનું સીએનએન વેબસાઇટ અથવા જેમ છે. અને સર્વર પછી જવાબ કંઈક સાથે કે સંદેશ આ જેમ, હું હા કહીને HTTP સંસ્કરણને 1.1 બોલે છે. 

એક સ્થિતિ છે, જે 200 અમે ભાગ્યે જ મનુષ્યો કે કોડ તે સારી છે કારણ કે ક્યારેય જુઓ. તે ઠીક છે, વિનંતી કારણ કે તેનો અર્થ પ્રાપ્ત થઈ છે અને યોગ્ય રીતે નિયંત્રિત કરવામાં આવી હતી. અને સામગ્રી પ્રકાર દેખીતી રીતે જવાબમાં ઘણી વાર, પરંતુ હંમેશા નહીં, લખાણ છે. અને ખાસ કરીને, એચટીએમએલ. અને તે ખરેખર છે જ્યાં અમે આજે જુઓ. 

તેથી હકીકતમાં, હું જવા માટે જઇ રહ્યો છું આગળ અને એક બ્રાઉઝર ખોલો. હું Chrome નો ઉપયોગ કરવા જઇ રહ્યો છું, તમે ઉપયોગ કરી શકો છો અઠવાડિયામાં કોઈ પણ બ્રાઉઝર સૌથી આવે છે. અમે સામાન્ય રીતે ક્રોમ ભલામણ તે ખાસ કરીને કારણ કે સોફ્ટવેર વિકાસકર્તાઓ માટે સારી. માં બાંધવામાં તે ઘણું મળ્યું છે તેને સરળ બનાવે છે સાધનો HTML અને CSS માત્ર વિકાસ, આજે આપણે વિશે વાત શરૂ કરી શકશો વસ્તુઓ પણ અન્ય ભાષાઓ સાથે. 

અને હું આગળ જાઓ અને રહ્યો જાઓ જાઉં છું હું ક્લિક કરો અથવા જમણી નિયંત્રણ કરવા જઇ રહ્યો છું વેબ પેજ પર ગમે ત્યાં ક્લિક કરો. અને હું તત્વ તપાસ પર જવા માટે જઇ રહ્યો છું. અને હું ઝટકો કરવા જઇ રહ્યો છું મારા અહીં સ્ક્રીન માત્ર થોડી. મને નીચે ખસેડવા દો. તેથી આ કહેવાય છે તે છે ક્રોમના ઇન્સ્પેક્ટર. તેથી આ એક ડિબગીંગ જેવી છે સાધન Chrome માં નિર્મિત. 

તમે બધા પહેલેથી જ આ છે તમે Chrome ઉપયોગ કરી રહ્યો છું તો. અને તે તમને શું થઈ રહ્યું છે તે જોવા માટે પરવાનગી આપે છે અમુક વેબ પાનાંની હૂડ નીચે. તેથી આપણે ખરેખર એક લેવા દો નીચે પ્રમાણે આ જુઓ. તે રીતે વધુ લક્ષણો છે અને આજે આપણે વિશે કાળજી. પરંતુ અહીં પર આ ટેબો છે. તત્વો, નેટવર્ક, સ્રોતો સમયરેખા, અને કેટલાક અન્ય સામગ્રી. હું પર ક્લિક કરો જાઉં છું એક ક્ષણ માટે નેટવર્ક. 

અને તે થોડી જબરજસ્ત અહીં પ્રથમ નજરમાં. પરંતુ હું શું કરવા જઇ રહ્યો છું દો છે મને તે થોડુંક સરળ બનાવે છે. હું ચાલુ કરવા જઈ રહ્યો છું તે લાલ છે કે જેથી પ્રકાશ રેકોર્ડ. અને હું લોગ જાળવી કહેવું જાઉં છું. અને આ માત્ર થોડી છે વસ્તુ હું બહાર figured સમય જતાં કે સેવ કરવા જઈ રહ્યું છે બ્રાઉઝર માં થાય છે કે બધું. અને હવે હું જાઉં છું http://facebook.com છે. 

ખરેખર, www દો સારા પગલા માટે, સ્લેશ. દાખલ કરો. તેથી એક URL કે ઘણા તમે મુલાકાત છે શકે છે. અને હવે ફેસબુક વેબ પાનું ટોચ પર આવે છે. અને પછી સમગ્ર ટોળું સામગ્રી તળિયે દ્વારા ઉડાન ભરી હતી. અને હકીકતમાં, તે તારણ છે કે જે તમે Facebook.com મુલાકાત લો ત્યારે, તમે માત્ર એક HTTP વિનંતિ કર્યા નથી તે Facebook.com પર જઈને કે બહાર વળે તે પરબિડીયાઓમાં બીડી 41 મોકલે તેના પોતાના વિચાર વિનંતી સાથે દરેક, સ્ક્રીન પાછળ, જોકે તરીકે સૂચવવામાં અહીં, સ્ક્રીન તળિયે, તે ખરેખર, કે જે સૂચવે છે મારા બ્રાઉઝર 41 અરજીઓ કરી હતી. 

અને કુલ માં, તે 861 ટ્રાન્સફર કિલોબાઈટોમાં અને તે કેટલાક કારણોસર લીધો ઘણા આઠ સેકન્ડ કે બધા ડાઉનલોડ કરવા માટે. તેથી તે ખરેખર થોડી વિચિત્ર છે ફેસબુક સાઇટ કે લેશે કે લાંબા, પરંતુ તેથી આ કિસ્સામાં તે છે. હવે, આ તમામ હું ખરેખર પડી નથી સર્વોચ્ચ વિનંતી સિવાય વિશે. તેથી આપણે અહીં આ એક પર જાઓ દો અને મને માત્ર એક ક્ષણ માટે બહાર ઝૂમ કરીએ. 

અને મને આ પર ઝૂમ દો. છતાં પણ હું ડાબે કર્યું તેથી શું અહીં પર જવા ઘણો છે હું પ્રકાશિત કરી છે Facebook.com અને પછી , હું નીચે સરકાવનાર કરું છું કે નોટિસ નીચે સરકાવનાર નીચે સરકાવનાર, હેડરો વિનંતી છે. અને તમે Chrome દર્શાવે છે કે નહીં તે જોવા મળશે મને અનિવાર્યપણે આંતરિક સમાવિષ્ટો વિનંતી હું કરી હતી. તે ખૂબ જ ફોર્મેટિંગ નથી માર્ગ છે, પરંતુ વિચાર ઉલ્લેખ છે નોટિસ, યજમાન ઉલ્લેખ ત્યાં નોટિસ Facebook.com, પાથ, અથવા સ્લેશ, જે હું વિનંતી ફાઇલ છે. 

અને પછી હું સ્ક્રોલ જો બેકઅપ, અમે ખરેખર પડશે જોવા ફેસબુક પરત કે શું મને આ હેડરો તમામ છે. કે વર્ચ્યુઅલ પરબિડીયું ની અંદર તેથી ખરેખર કી કિંમત જોડીઓને ઘણો છે. એક શબ્દ છે, કોલોન, અને પછી એક મૂલ્ય. શબ્દ, કોલોન, અને કિંમત. આ કહેવામાં હેડરો છે. અને માર્ગ વધુ વિગતવાર કરતાં અહીં છે અમે ખરેખર હમણાં વિશે કાળજી. 

પરંતુ આ બીજા છે ત્યાં નીચે છેલ્લા એક, નોટિસ, Facebook.com સર્વર કે, ખરેખર અહીં જણાવ્યું હતું કેટલાક લખાણ HTML આવે છે. તેથી આ બધા કહે છે તમે વેબ વિનંતી છે કે જ્યારે એ બ્રાઉઝર માંથી પાનું સર્વર, સર્વર જવાબ તેની પોતાની એક પરબિડીયું સાથે જે અંદર લખાણ છે. બીજા શબ્દોમાં કહીએ તો, HTML. હાઇપરટેક્સ્ટ માર્કઅપ લેંગ્વેજ. જે અન્ય ભાષા છે આજે આપણે પરિચય કે મનુષ્યો અથવા કમ્પ્યુટર્સ પેદા ક્રમમાં વેબ પાનાંઓ અમલ. 

ખાસ કરીને, આ જુઓ. હવે હું પાછા જાઓ જાઉં છું ફેસબુક વેબસાઇટ પર. અને હું જાઉં છું માત્ર નિયંત્રણ ક્લિક કરો અથવા અધિકાર ક્લિક કરો અને જુઓ પૃષ્ઠ સ્રોત પર ક્લિક કરો. અને તમે Chrome નો ઉપયોગ ન હોય તો પણ, એટલે કે આ, ફાયરફોક્સ આ કરી શકો છો કરી શકો છો, સફારી પણ મેનુ છતાં, આ કરી શકો છો વિકલ્પો થોડું અલગ લાગે શકે છે. અને આ એચટીએમએલ છે કે માર્ક અને ફેસબુક પર કંપની લખ્યું છે. 

અને સામૂહિક, ને આ ભાષામાં અહીં વાદળી અને સફેદ પાનું અમલીકરણ કે અમે એક ક્ષણ પહેલા જોયું. હવે, આ એક બીટ જબરજસ્ત છે. અમે ટોચ ડાબી પર જોવા હોય તો પણ, અમે છો કેટલાક નમૂનાઓ જોવા માટે શરૂ કરવા માટે જઈ રહી છે. ઘણો છે એવું લાગે છે આ ઓપન કોણ કૌંસ અને પછી આ શબ્દ HTML છે. અહીં અન્ય ખુલ્લા કોણ કૌંસ અને વડા. 

જો અમે સરકાવો અહીં છે, અને નીચે અને નીચે, હું છું આગળ વધો અને પ્રયાસ ચાલુ કંઈક શોધવા માટે. ત્યાં રસ્તો પર જમણી બાજુ પર અહીં ઓપન કૌંસ શરીર છે. અને છેલ્લા યાદ અમે રજૂઆત કરી કે, સમય સરળ વેબ પાનું છે કે જે માનવ લખી શકે છે આ જેવી થોડી કંઈક જોવા શકે છે. ઓપન HTML ટૅગ, ઓપન વડા ટેગ, ઓપન ટાઇટલ ટેગ, પછી બંધ શીર્ષક, બંધ વડા, ઓપન શરીર ટેગ, કેટલાક લખાણ, શરીર બંધ બંધ એચટીએમએલ. 

પરંતુ માત્ર એક ક્ષણ માટે અહીં વિરામ. આ કોડ છે, તમે કર્યું હોય તો પણ તે પહેલાં ક્યારેય તેવા પરચૂરણ ખર્ચ પરંતુ હજુ પણ ખૂબ સમજી નથી શું થઈ રહ્યું છે, ખૂબ સારી લાગે છે. અધિકાર, તે ખૂબ જ સ્વચ્છ છે. તે ખૂબ જ stylistically સરસ છે. ખાડો અને સફેદ જગ્યા ઘણો. ફેસબુક નથી. તેથી શા માટે ફેસબુક ખૂબ જ છે HTML લખી હું કરતાં વધુ ખરાબ? દેખીતી રીતે. 

અધિકાર, આ એક જેવી છે શૈલી માટે ટપાલ બહાર. કોઈ યોગ્ય કારણ છે તેમને માટે આ ખૂણા કાપી. બધા હક છે, તેથી તેઓ કરવા માંગો છો નથી તેને સરળ તમે તેને વાંચવા માટે બનાવે છે. તેથી અમુક અર્થમાં, તેઓ છો તે obfuscating સૉર્ટ કરો મૂંઝાયેલું ઓછામાં ઓછા સૌંદર્યલક્ષી જેથી તે માયસ્પેસ માટે મુશ્કેલ છે કે જાઓ અને ફાડી તેમના હોમપેજ અને તે માટે એચટીએમએલ. તે કાર્યક્રમો સાથે કે બહાર વળે Chrome સહિત જોકે, અમે સુપર સરળતાથી આ સાફ કરી શકો છો. તેથી તે કારણ તદ્દન તે છે. બીજું કારણ શું હોઈ શકે છે. યાહ. અરે વાહ, સફેદ જગ્યા ખર્ચ માહિતી. તમે શું કહેવા માગો છો? અરે વાહ, બરાબર. તમે Tab કી ઘણો અથવા દબાવો, તો જગ્યા પટ્ટી અસરો ધ્યાનમાં. તેથી તમારા કીબોર્ડ પર દરેક કી એક છે [અશ્રાવ્ય] એક બાઈટ તરીકે રજૂ કરે છે. 

તેથી ધારવું કે માર્ક અથવા devs કોઈપણ આ દિવસોમાં માત્ર એક વાર આ spacebar બનાવ્યા આ HTML પાનામાં કે ફેસબુક હોમપેજ રજૂ કરે છે. અને ફેસબુક ઘણો છે વપરાશકર્તાઓ આ દિવસોમાં. તેથી ધારવું કે ફેસબુક હોમપેજ આજે એક અબજ લોકો દ્વારા મુલાકાત લીધી છે. અને ફેસબુક પર કોઈને છે માત્ર એક જ વાર આ જગ્યા પટ્ટી દબાવો. 

તેથી એક વધારાના બાઇટ, એક અબજ વિનંતીઓ, કેટલી વધુ માહિતી ફેસબુક છે ઇન્ટરનેટ પર પરિવહન કોઈને હિટ છે કારણ કે તેના અથવા તેણીના કીબોર્ડ પર spacebar? એક અબજ બાઇટ્સ, અથવા એક gigabyte માહિતી ફેસબુક સર્વરો મોકલવામાં આવી રહી છે આસપાસ લોકો માટે કોઈ વાજબી કારણ માટે વિશ્વ. હવે, કે જે માત્ર એક જગ્યા છે. 

અમે ખરેખર આ સ્વચ્છ જો કલ્પના વસ્તુ અને તે ઇન્ડેન્ટેડ અને ઉમેર્યું સફેદ જગ્યા ઘણો અને ટૅબ અક્ષરો અને જગ્યાઓ, તમે ખર્ચ ગીગાબાઇટ્સ અંત, જો નહિં, તો ટેરા બાઇટ્સ જગ્યા વધુ. અને તેથી સુપર સામાન્ય વેબ વિકાસ વાસ્તવિક વિશ્વમાં તમારા કોડ minify છે. અને અમે આખરે જોશો તમે આવું કરી શકે છે કેવી રીતે. 

પરંતુ આજે, અમે કોડ લખી શરૂ કરી શકશો કે અમને છે મનુષ્ય દ્વારા ખરેખર વાંચી શકાય છે. તમે પાછા જાઓ તો તે છે, જોકે, બહાર વળે Chrome માં આ સાધન માટે એલિમેન્ટ નિરીક્શણ પહેલાં, અમે નેટવર્ક ટેબ પર હતા. તે તમને પર જાઓ, તો કે બહાર વળે તમે ખરેખર જોવા શું તત્વો ટેબ, ક્રોમના ખૂબ છપાયેલી હોય છે તે જ એચટીએમએલ આવૃત્તિ. તેથી અમે તેને deobfuscated છે. તેથી તે એક કોમ્પ્યુટર માટે કોઈ મેચ છે. અને હવે તમે ખરેખર કરી શકો છો આસપાસ ક્લિક કરો અને શરૂ વેબ પેજ છે કે વંશવેલો જોવા માટે. તેથી આપણે ખરેખર આ કરવા દો. હું આગળ જાઓ અને ખોલવા માટે જઇ રહ્યો છું મારા મેક લખાણ સંપાદન કહેવાય કાર્યક્રમ. અને આ માત્ર યાદ છે કે એક સુપર સરળ લખાણ કાર્યક્રમ. વિન્ડોઝ notepad.exe છે. અને હું અક્ષરશઃ જાઉં છું નીચેના લખો. ડૉક પ્રકાર એચટીએમએલ, ઓપન કૌંસ HTML, કૌંસ HTML બંધ અમે અહીં પાનું વડા છે અહીં પાનું વડા અંત એક શીર્ષક હેલો, વિશ્વ જેવા હશે. 

અને પછી અહીં નીચે, અમે જરૂર વેબ પાનું શરીર. બંધ શરીર. અને પછી અહીં હેલો, વિશ્વ. બધા અધિકાર. તેથી અમે એક સુપર ફાસ્ટ વેબ પાનું લખેલા કર્યું છે. હું તેને સેવ કરવા જઇ રહ્યો છું મારા ડેસ્કટોપ પર hello.html. મારા મેક માતાનો, ફરિયાદ કરવા જઈ વિચારીને કે, એક મિનિટ રાહ જુઓ, આ લખાણ ફાઈલ છે, કરવું તમે તેને .txt કૉલ કરવા માંગો છો? પરંતુ કોઇ, હું ડોટ HTML નો ઉપયોગ કરવા માંગો છો. 

હું તો સરસ શું છે ફક્ત આ ફાઇલ ક્લિક કરો ડબલ hello.html, અહીં મારી વેબ પાનું છે. કમનસીબે, હું છું વિશ્વમાં માત્ર વ્યક્તિ જે હમણાં આ પાનું મુલાકાત લઈ શકો છો. જ્યાં તે દેખીતી રીતે રહેતા નથી કારણ કે? તે મારા મેક પર છે, અધિકાર? જે નકામું છે. આ રૂમ માં કોઈ એક જેવી ઇન્ટરનેટ પર એકલા દો ખરેખર છે કે જે પાનું મુલાકાત લઈ શકો છો. તેથી આજે, અમે કરવાની જરૂર છે અન્ય તત્વ રજૂ કરે છે. 

અને આ કરવા માટે, હું જાઉં છું આગળ વધો અને મેઘ 9 ખોલો. તેથી મેઘ 9 કોર્સ છે વાદળ આધારિત service-- CS50 IDE-- તે અમારી કામ કરવાની જગ્યાઓના બધા છે ક્યાંક ઇન્ટરનેટ પર ચાલી રહેલ. અને તે અમારા ફાઈલો છે કે જે બધા અર્થ એ થાય પહેલેથી જ જાહેરમાં સુલભ છે. તેથી આપણે આગળ વધીશું અને આ કરવા દો. હું આગળ જવા માટે જઇ રહ્યો છું અને નવી ફાઈલ NCS50IDE બનાવો. હું પહેલાં તરીકે સેવ જાઉં છું અને hello.html તરીકે સાચવો ક્લિક કરો. અને હવે માત્ર સમય બચાવવા માટે, હું જાઉં છું આ કોડ પેસ્ટ કરો આગળ વધો અને નકલ કરવા બદલે તેને ફરીથી લખો. અને તેને સંગ્રહો. અને તેથી હવે હું એક છે ફાઇલ hello.html કહેવાય છે. પરંતુ કેવી રીતે ખરેખર હું શું વેબ પૃષ્ઠ તરીકે તેને ખોલવા? વેલ, તે CS50 માં બાંધવામાં બહાર વળે IDE રણકાર જેમ માત્ર એક કમ્પાઇલર નથી અને GDB જેવી ડીબગર અને અન્ય કાર્યક્રમો જુમખું, એક સંપૂર્ણ સુવિધાયુક્ત ખરેખર છે CS50 IDE અંદર ચાલી વેબ સર્વર. 

તમે બધા કે જે કહે છે, તમારા પોતાના વેબ સર્વર છે. અને વેબ સર્વર માત્ર એક ભાગ છે જેની હેતુ જીવનમાં સોફ્ટવેર વેબ પાનાંઓ સેવા આપવા માટે છે. બ્રાઉઝર્સ થી અરજીઓ માટે સાંભળવા માટે અને થોડી વર્ચ્યુઅલ પરબિડીયાઓમાં બીડી સાથે જવાબ અંદર જે છે હું તેવા પરચૂરણ ખર્ચ કર્યો છે કે સામગ્રી. તેથી આ વેબ સર્વર છે ખરેખર મુક્ત અને ઓપન સોર્સ. જ્યાં ઓપન સોર્સ માત્ર અર્થ એ થાય બીજા કોઈને છે કે સોફ્ટવેર લખેલા અમને તમામ કરી શકો છો કે ખરેખર જોવા અને ડાઉનલોડ પણ અને સ્ત્રોત કોડ બદલો. અને તે અપાચે કહેવાય છે. 

અને અમે તેને થોડી સરળ કર્યા અપાચે 50 ફોન દ્વારા CS50IDE ઉપયોગ કરે છે. તે ખરેખર શકો છો કે જેથી નીચેના સમજે છે. હું અપાચે 50 શરૂ કહે છે જઇ રહ્યો છું. અને પછી હું ફક્ત કોઈ કહે જાઉં છું. અને અમે કેટલાક અંશે જોવા કહીને Arcane સંદેશ અપાચે દસ્તાવેજ [સુયોજિત? જૂથ?] હોમ, ઉબુન્ટુ, કે જે ગમે, વર્કસ્પેસ સ્લેશ. શરૂ કરી રહ્યા છીએ વેબ સર્વર સફળતાપૂર્વક 2 અપાચે. 

તેથી લાંબા વાર્તા ટૂંકી, હું માત્ર એક બટન દબાણ છે અને હવે છે જે વેબ સર્વર પર ચાલુ TCP પોર્ટ પર ઇન્ટરનેટ પર સાંભળી ચોક્કસ સરનામે 80. અને તે અહીં કહે છે, અને આ આધારિત બદલાશે તમારા વપરાશકર્તા નામ અને અન્ય કેટલાક પરિબળો પર, હું આ બટન પર ક્લિક તો પણ, હવે નોટિસ IDE50 ટપકું jharvard અને તેથી અને તેથી નોટિસ આ બધા સમય કે છેલ્લા કેટલાક માટે અઠવાડિયા તમે હોઈ શકે છે તમારા પોતાના વપરાશકર્તા નામ નોંધ્યું છે કે ટોચ જમણા હાથમાં વણાયેલી છે CS50IDE ખૂણે. 

અને તે ખરેખર રહી છે આ બધા સરનામું સમય જે તમે કરી શકો છો પર વેબ મારફતે તમારી બધી ફાઇલો ની મુલાકાત લો. હવે ત્યાં સુધી, તે mattered નથી, સી, કારણ કે તમે સામાન્ય રીતે એ ચાલી વસ્તુઓ માંગો છો ટર્મિનલ નથી, વેબ પર. પરંતુ આજે, અમે શરૂ વેબ આધારિત કોડ લખી અમે માંગો છો કે જાહેર URL ને સુલભ. તેથી શું હું જાઉં છું શું આ URL પર ક્લિક કરો. 

અને હું એકદમ જુઓ કે નોટિસ નીચ ઇન્ડેક્સ ડિરેક્ટરી યાદી, પરંતુ શું ફાઈલ કદાચ તમે બહાર કૂદકા? Hello.html. હું સાચવી કારણ કે મારા વર્કસ્પેસ માં ફાઇલ. અને હું અપાચે વેબ સર્વર કહ્યું છે શું ડેવિડ વર્કસ્પેસ ડિરેક્ટરીમાં દેખાવ છે. અને કોઈને દો વિશ્વમાં તે ફાઈલો જુઓ. 

અને ખરેખર, હું હવે જો hello.html પર ક્લિક કરો, હું બરાબર આ ટેબ તે ફાઈલ અંદર જુઓ. હવે મેઘ 9 કરી રહ્યો નોટિસ અમારા માટે થોડી મદદરૂપ કંઈક. CS50 IDE અંદર, ત્યાં નોટિસ અચાનક એક સરનામું બાર. અમે છો તેમ છતાં, કારણ કે તે છે CS50IDE મુલાકાત માટે Chrome નો ઉપયોગ, CS50IDE અંદર તેની પોતાની છે હમણાં એક વેબ બ્રાઉઝર ની આવૃત્તિ. અને તેથી બદલે જેમ કે વસ્તુઓ જટિલ, હું આગળ જાઓ જાઉં છું અને માત્ર આ URL નકલ કરો. હું આગળ અને માત્ર જાઓ જાઉં છું મારી પોતાની ક્રોમ વિન્ડો ખોલો. તેથી અહીં કોઈ જાદુ કોઈ CS50IDE છે. હું માત્ર શાબ્દિક પેસ્ટ કરવા માટે જઇ રહ્યો છું મારા J હાર્વર્ડ URL અને Enter દબાવો. અને વોઇલા Query, હવે હું, અને સિદ્ધાંત માં, દરેકને ઇન્ટરનેટ પર, હું રૂપરેખાંકિત કર્યું હોય તો યોગ્ય પરવાનગીઓ, આ ફાઇલ મુલાકાત લઈ શકો છો. અને તેથી હવે મેં કહ્યું, જો hello.html, વોઇલા Query, ત્યાં મારા અતિ underwhelming વેબ પાનું છે. તેથી આપણે એક ઝડપી સેનીટી ચેક કરવા દો. કે બધા છે કારણ કે વૈચારિક સમૂહ છે. અને અમે ખરેખર ખરેખર નથી કર્યું કેવી રીતે HTML સે દીઠ લખવા માટે તમે શીખવવામાં આવે છે. કોઈપણ પ્રશ્નો આમ અત્યાર સુધી માત્ર થયું છે તે પર? હા. CS50 આ વેબ પાનાંઓ માલિક છે? કયા અર્થમાં? સારા પ્રશ્ન. તેથી CS50 CS50.io. ધરાવે અમે ખરેખર છે કે જે ડોમેઇન નામ ખરીદી કરી છે. અને તમે ગાય્સ પ્રકૃતિ દ્વારા CS50IDE પ્રવેશ, તમે બધા એક સબડોમેઇન કહેવાય છે તે મળે છે. 

તેથી MALAN IDE50-, અથવા IDE50-Rob.CS50.io, કે અંદર તમારા અનન્ય સરનામું અમારા ડોમેન નામ. કોર્સ હેતુ માટે તેથી, તમે તમારા પોતાના અનન્ય સરનામું છે. પરંતુ અમે વસ્તુઓ સરળ કર્યું છે ટોચ સ્તર ડોમેન ખરીદી, CS50 ટપકું I / O અને પછી બીજું દરેકને છે કે અંદર, તેથી વાત કરવા માટે. અને અમે તે માટે પાછા આવો પડશે કદાચ થોડા અઠવાડિયા માં, ખાસ કરીને અંતિમ પ્રોજેક્ટ પર તમે સમય, જ્યારે કેટલાક તમારા પોતાના ડોમેન નામો વિચાર કરવા માંગો છો શકે છે. તે પ્રમાણમાં ખરેખર છે સરળ. બધા અધિકાર. તેથી હવે આ કરવા દો. હું પાછા જાઓ જાઉં છું CS50IDE, જ્યાં મારા ફાઈલ હવે અધિકાર, hello.html, બધા કે જે રસપ્રદ નથી. હું કંઈક કરવા માંગો છો કરતાં થોડી NICER. તેથી હું આ કંઈક કરવા જઇ રહ્યો છું. ઓપન paragraphs.html મને દો. તેથી આ હું અગાઉથી લખ્યું ફાઇલ છે. તે ટોચ પર છે, જેમ કે હંમેશા અમે ટિપ્પણીઓ છે. પરંતુ, HTML માં ટિપ્પણીઓ થોડી અલગ લાગે છે. લીટી ત્રણ અને 14 વાક્ય પર, તમે એક ટિપ્પણી શરૂઆત માટે વાક્યરચના જોવા અને એક ટિપ્પણી અંત. 

પરંતુ સામગ્રી કંઈ વિધેયાત્મક રીતે બાબતો વચ્ચે. તે માત્ર એક નોંધ અહીં શું થઈ રહ્યું છે માનવ. અને માત્ર એક ઝડપી સેનીટી તરીકે જો હું સરકાવો, ચેક, સ્પષ્ટ નવું શું છે અમે રજૂ કર્યું છે કે ટેગ? અત્યાર સુધી અમે જોયેલા આમ ટૅગ્સ ખુલ્લી છે કૌંસ એચટીએમએલ, વડા, શીર્ષક, અને શરીર. પરંતુ હવે દેખીતી રીતે નવું શું છે? 

અરે વાહ, જેથી પી. પૃષ્ઠ ટૅગ અથવા ફકરાની ટેગ. અને પછી હું માત્ર કેટલાક મૂળભૂત ઉધાર લેટિન લખાણ મારા ફકરા રચના. હું શું કરવા માગે છે, કારણ કે નિદર્શન કેવી રીતે તમે શકે છે HTML માં લખાણ ફકરા પ્રતિનિધિત્વ કરે છે. અને તેથી શું થાય શરૂ કરવામાં આવ્યું છે અહીં પહેલેથી જ છે તે છે એક પેટર્ન વિકાસશીલ. અને મને આગળ વધો અને આ કરવા દો. મને પ્રથમ અપાચે બંધ કરીએ. અને હું પોતે શરૂ કરવા માટે તે કહેવું જાઉં છું આજે ફરી સ્રોત સાત અંદર એમ ડિરેક્ટરી. કે જેથી હું બધું કરવા માટે વપરાશ હોય છે. 

અને હવે, હું પાછા જાઓ તો આ ડિરેક્ટરી લિસ્ટિંગ, હું આજે દરેક ફાઈલ જુઓ નોટિસ. અને તમે જોશો આગામી સમસ્યા સેટ, અમે પડશે તમે સૂચનો આપી બરાબર આ કરવાથી માટે. હું paragraphs.html ખોલવા, આ કદાચ તેમજ એક પ્રોગ્રામિંગ ભાષા જેમ દેખાય છે તમને વાત માત્ર લેટિન વાંચી ન હોય તો. પરંતુ આ માત્ર ત્રણ ફકરા છે લખાણ કે HTML માં ચિહ્નિત થયેલ છે. 

અને ફકરો નોટિસ તેમની વચ્ચે આરામ. તે તારણ, કારણ કે પણ તમે છતાં આ કરવા માટે વળેલું કરી શકે, વાસ્તવિક દુનિયામાં, જ્યારે તમે વાક્ય મૂકવા માંગો, તો વસ્તુઓ વચ્ચે આરામ, તમે કદાચ તદ્દન સરળ આ કરવા અને સેવ નહીં. અને હવે, હું અહીં ફરીથી લોડ, તો નોટિસ બધું છે કે જે ફક્ત એક સાથે blurs લખાણ માત્ર એક બ્લોબ છે. HTML મૂક ભાષા પ્રકારની છે કારણ કે. 

તે જેમ ઉપયોગ કરી ગયું છે એક માર્ગ બ્રાઉઝર, ફક્ત કે જે બાહ્ય તમે શું કરવાની તે કહેવું શું. તમે તેને કહી નથી તેથી જો મને એક નવો ફકરો આપે છે, જો તમે નવી ફકરો જોવા માટે જઈ રહ્યાં છો. અને હકીકતમાં, શું બ્રાઉઝર કરવા જઇ રહ્યું છે તમે Enter દબાવો તો પણ છે, ફરીથી અને ફરીથી કહે છે કે દો અને ફરી, આ લખાણ રીતે ખસેડવાની પછી સ્ક્રીન પર અને નીચે સેવ અને પછી બ્રાઉઝર ચાલે છે, ફરીથી લોડ કરો સફેદ જગ્યા તૂટી માત્ર એક જ દૃશ્યમાન સફેદજગ્યાના માં. બધા અધિકાર. જેથી ફકરો ટેગ છે. અને તેથી પેટર્ન શું છે કે અહીં વિકાસ છે? વેલ, તે કેસ હોય તેમ લાગે છે HTML બધા ટેગ શરૂ કરવા વિશે છે અને ટેગ અંત આવ્યો. અને ટેગ શું છે? વેલ, તે વાક્યરચના માત્ર ટુકડો છે. ઓપન કૌંસ, કીવર્ડ, બંધ કૌંસ, ટેગ છે. અથવા ટેગ શરૂ કરો. અને પછી તમે છો ત્યારે જાતે વ્યક્ત કરવામાં આવે છે, તરીકે તમે આ ફકરો સાથે પૂર્ણ કરી લો, તમે સામે વાત કરવા માટે આવું. પરંતુ વિપરીત તદ્દન પાછળની નથી. 

તમે સરળતાથી તે જ ટેગ પૂર્વગ આ જેમ એક ફોરવર્ડ સ્લેશ સાથે નામ. બધા અધિકાર. તેથી કે જે બધી ઉત્તેજક નથી. અને હકીકતમાં, અમે નથી કરી રહ્યા છીએ વેબ છે કે જે બધી વધુ રસપ્રદ. શું હું બનાવવા માંગો છો તો મોટી અને બોલ્ડ વસ્તુઓ? તેથી તે અહીં એક ઉદાહરણ છે કે બહાર વળે headings.html માં, જ્યાં મારા શરીરમાં, હું એક H1 ટેગ, H2, H3 મળી છે ચાર, પાંચ, છ, જે તમામ ખૂબ Arcane લાગે છે. પરંતુ હું આ ખોલો જાઓ તો ઉદાહરણ તરીકે, ચાલો એક નજર કરીએ. Headings.html. 

મૂળભૂત રીતે બ્રાઉઝર્સ આપી શકે છે, જેથી તમે લખાણ કે જે મોટા અને વિવિધ માપો બોલ્ડ છે. H1 મોટી છે. H6 પછી નાના અને વચ્ચે બાકીનું બધું. તેથી તે હજુ પણ રસપ્રદ છે પરંતુ છે ખરેખર મને ખબર વેબ. અમે શું કરવા માંગો છો, તો મારી પાસે યાદી કંઈક. . તેથી અહીં એક બુલેટ સૂચિ છે હાર્વર્ડના ઘરો ત્રણ. 

તમે આ કરી વિશે કેવી રીતે ક્યાં ગયા હતા? વેલ, list.html પર એક નજર. અને અહીં, અમે જુઓ funkiness ઓફ લિટલ બીટ પરંતુ શું ચાલી રહ્યું છે વિચાર કરીએ. તેથી જો તમે માત્ર જોઈ કર્યું છે તે પર આધારિત છે, ઉપલી unordered યાદી માટે વપરાય છે. Unordered યાદી માત્ર બુલેટ થાય છે. કોઈ નંબરો છે. ત્યાં પણ કંઈક કહેવાય ટેગ એક OL છે, જે યાદી, આદેશ આપ્યો હતો. પછી લી, યાદી આઇટમ બધા તો એનો અર્થ છે. 

અને તેથી તે આપોઆપ તમે નંબરો બધું. પરંતુ મારા ખાડો ફરીથી, બધા અને સફેદ જગ્યા માત્ર મારા ભલા માટે છે. આ બ્રાઉઝર નથી ખરેખર કાળજી જઈ રહી છે. તેથી ભલે તમે ન કરી શકે આ માત્ર સ્પષ્ટ કરવા કરવું, તમે છતાં પણ ન જોઈએ બ્રાઉઝર હજુ કરશે માત્ર દંડ તે સમજવા માટે સક્ષમ હોય છે. હું ફરીથી લોડ કરો મથાળે સ્પર્શી છું મારા બ્રાઉઝર, હું ફરીથી લોડ કરો પર ક્લિક કરું છું અને કોઈ ફેરફાર થઈ રહ્યું છે હજુ પણ બ્રાઉઝર કારણ કે હું શું કહી ચોકકસ શું કરી. 

બધા અધિકાર. તેથી આ બધા માત્ર લખાણ છે. હવે વધુ રસપ્રદ કંઈક દો. હું આગળ જવા માટે જઇ રહ્યો છું અને આ HTML કેટલાક ઉધાર. હું આગળ જવા માટે જઇ રહ્યો છું અને અહીં એક નવી ફાઈલ બનાવો. અને અમે આ rick.html કહી શકશો. અમે અપ્રમાણસર છે વપરાયેલ કંઈક આ એક રિક રોલ કહેવાય વર્ગ આ વર્ષે, મને ખબર નથી, તે માત્ર વ્યવસ્થિત થયું છે. 

અને હવે તે નિયંત્રણ બહાર મળી છે. તેથી હું માત્ર તેની સાથે જવા માટે જઇ રહ્યો છું. અને હું Google પર જાઓ, તો છબીઓ અને રિક Astley. અમે શા માટે તમે ખબર ન હોય તો આ માત્ર વિકિપીડિયા પર વાંચો. તમે લિંક પર ક્લિક કર્યું દર વખતે, કોઈને ક્યાંક હસતી કરવામાં આવી છે. અને મને ahead-- ત્યાં જવા દો આપણે આ છબી જોવા દો, જાઓ. 

તેથી અહીં અમે એક છે Google છબીઓ છબી. અને ચાલો આ છે કે ધારે દો વ્યાજબી બધે ઇન્ટરનેટ પર. તેથી હું તે મારા માટે બરાબર છે ધારે જાઉં છું ખરેખર મારી વેબ પાનું માં આ મૂકવા માટે. હું આગળ જાઓ જાઉં છું અને છબી URL ની કૉપિ કરો. અને હવે હું મેઘ પર પાછા જાઓ તો 9, હું અહીં કરી શકો છો તે જોવા દો. તેથી અહીં માત્ર એક વેબ પૃષ્ઠ છે. આ, haha ​​રિક Astley છે, હવે હું પાછા જાઓ જાઉં છું મારું બ્રાઉઝર માટે, ફરીથી લોડ કરો, અને રસપ્રદ. 

રિક ક્યાં છે? તેથી મને થયું છે તે જોવા દો. ખરેખર, હું જાઉં છું મને લાગે છે કે ન હતી જેવી ડોળ કરવો. [અશ્રાવ્ય] અહીં તેમને મૂકો. અમે એક ક્ષણ પાછા કે આવવું પડશે. તેથી અહીં rick.html છે. જેથી રિક Astley નથી. તે બહાર વળે તેથી અમે કરી શકો છો ખરેખર અહીં તેને ઉમેરો. આ રિક Astley છે. મને જેની છબી આપો કહેવા જાઉં છું સ્ત્રોત હું માત્ર નકલ URL છે, જે દેખીતી રીતે જ ખુશ છે જન્મદિવસ કંઈક અથવા અન્ય. 

અને હવે હું જાઉં છું આ જેમ ટેગ બંધ કરો. તેથી આ સુપર લાંબા રેપિંગ છે. પરંતુ હું બધા કર્યું કે નોટિસ ઓપન કૌંસ છબી કરવામાં આવે છે, આ એક લક્ષણ સાથે સ્ત્રોત છે. અને તે ખરેખર લાંબા URL છે. અને ખૂબ જ ઓવરને અંતે, આ નોટિસ. હું શા માટે થાય છે સ્લેશ કોણ કૌંસ તેના બદલે, દરેક અન્ય ટેગ જેવું છે, એક ઓપન કૌંસ કર્યા, આઇએમજી, કૌંસ બંધ? માત્ર પણ જો તમે એક અનુમાન લેવા કોઈ પારિવારિકતા બિલકુલ છે HTML સાથે તે પહેલાં. 

તેથી તે બંધ કેવી રીતે છે આદેશ, પરંતુ શા માટે તે ખરેખર સાહજિક બનાવવા નથી અર્થમાં થોડી વધુ કંઈક કરવા માટે બંધ ઇમેજ જેવી વર્બોઝ? યાહ. યાહ. હમણાં જ તે અર્થનિર્ધારણ, કોઈ અર્થમાં છે એક છબી શરૂ અને એક છબી અંત તે ક્યાં તો ત્યાં છે કે તે નથી. તેથી તે તફાવત છોડી અર્થમાં બનાવવા નથી એક છબી અંદર કંઈપણ માટે. તમે માત્ર તે કરવા કરી શકો છો. અને તેથી વાક્યરચના સામાન્ય રીતે ફક્ત હશે અંદર ફોરવર્ડ સ્લેશ કરવા માટે ઓપન ટૅગ અથવા શરૂઆત ટેગ અને પછી સેવ નહીં. 

તેથી જો હું હવે આ ફાઈલ ફરીથી લોડ હું અહીં એક સારો વેબ પાનું પાકકળા મળી છે. અને અમે ચોક્કસપણે કરી શકે ખરેખર લોકો હેરાન તેના બદલે એમ્બેડિંગ દ્વારા YouTube લિંક જેવી. અને હકીકતમાં, કોઈ પણ સમયે તમે ક્યારેય YouTube પર ચાલ્યા કર્યું અને આકસ્મિક ખરેખર મને દો રિક અહીં મારી જાતને પત્રક. તેથી રિક રોલ. તેથી રિક હું અહીં જાઓ જાઉં છું roll--. 

[સંગીત વગાડવાનો] 

ઠીક છે, એક વ્યક્તિ છે કે જે ગમ્યું. તેથી, આ બધા સમય નોટિસ જો તમે અલબત્ત, તો તમે શેર કડી પર ક્લિક કરો URL ને વિચાર કે તમે ખરેખર કરી શકો છો ઇમેઇલ અથવા એક ફોરેન્સિક છબી એમ્બેડ અથવા સમસ્યા સેટ અથવા સ્લાઇડ. અને હવે, હું તેના બદલે એમ્બેડ કરો પર ક્લિક કરો, તો નોંધ્યું છે કે આ બધા સમય, આ સામગ્રી થયો છે. હું આગળ વધો અને આ નકલ કરવા જઇ રહ્યો છું. 

અને માત્ર જેથી અમે હું છું, તે વધુ સારું જોઈ શકે છે મારા લખાણ સંપાદક માં પેસ્ટ કરવા માટે જઈ રહી છે. આ નોંધ કરો કે શું YouTube તમને કહી દેવામાં આવી છે. તમે મુલાકાત દર વખતે YouTube વિડિઓ, જો તમે પર વિડિઓ એમ્બેડ કરવા માંગો છો તમારા વેબ પૃષ્ઠ, ફક્ત આ પડાવી લેવું. તેથી આ હજુ સુધી અન્ય છે HTML ટૅગ એક iframe કહેવાય છે. અથવા વાક્ય ફ્રેમ એક. તેથી તે ખૂબ થોડી વધુ દેખાય છે બધા અન્ય કરતાં જટિલ. તેથી તે છબી કે બહાર વળે ટેગ અને દેખીતી રીતે iframe ટેગ કહેવાય લક્ષણો છે શું લો. 

અને આ બીજો છે HTML માં વાક્યરચના ભાગ. આ ટેગ ઉપરાંત નામ, ઓપન કૌંસ ટેગ નામ, તમે ટૅગ વર્તણૂક નિયંત્રિત કરી શકો છો લક્ષણ એક સમગ્ર ટોળું હોવાના કિંમત સમકક્ષ હોય છે. લક્ષણ કિંમત સમકક્ષ હોય છે. અને તેથી દાખલા તરીકે, YouTube અમને જણાવ્યાં છે તમે આ વિડિઓ પહોળાઇ માંગો છો 420 પિક્સેલ્સ અને ઊંચાઇ હોઈ 315 પિક્સેલ્સ હોઇ શકે છે, તે છે તમે કેવી રીતે HTML માં તેને વ્યક્ત. 

વિડિઓ સ્ત્રોત રહ્યું છે કે લાંબા YouTube URL હોઈ અને પછી કેટલાક અન્ય સામગ્રી ફ્રેમ સરહદ શૂન્ય છે જેમ જેથી ત્યાં કદાચ અર્થ એ થાય આ વસ્તુ આસપાસ કોઈ સરહદ. કદાચ સંપૂર્ણ સ્ક્રીન પરવાનગી આપે છે વપરાશકર્તા અર્થ એ થાય કે એક બટન પર ક્લિક કરી શકો છો અને ખરેખર પૂર્ણ સ્ક્રીન વિડિઓ. હું ખરેખર પ્રયત્ન કરવા માંગો છો, તેથી જો રિક ટપકું HTML માં અહીં પ્રભાવશાળી, છબી ટેગ ઉપયોગ કરતાં દો મને કાઢી શકો છો, તેના બદલે આ પેસ્ટ કરો. અને હવે ફરીથી લોડ કરો. અને હવે અહીં અમે ફરીથી જાઓ. બધા હક છે, તે પર્યાપ્ત છે. બધા હક હું પ્રયત્ન કરશે જેથી હાર્ડ ફરીથી તે કરવા માટે નથી. તેથી અહીં ટેકઅવે કેટલાક શું છે? આ વેબ પૃષ્ઠો તેથી HTML તરીકે નીચ છે, ખરેખર ખૂબ જ સરળ છે. તે એક પ્રોગ્રામિંગ ભાષા નથી. તે કાર્યો નથી. તે આંટીઓ નથી. તે શરતો નથી. તે બધા ડઝનેક છે વિવિધ ટૅગ્સ, જેમાં દરેક શૂન્ય અથવા વધુ ગુણો ધરાવે છે. અને હકીકતમાં, મજા વિશે શું છે HTML તમે ડાઇવ શરૂ તે ખૂબ જ આત્મ ભણવામાં હોશિયાર છે કે છે. 

તે લે બધા એક સમજ છે HTML સામાન્ય માળખું. ટેગ શું છે, એક લક્ષણ શું છે, તમે ખરેખર વેબ પાનું રૂપરેખાંકિત કરવા માટે કેવી રીતે તરીકે અનુસરે છે. અને બીજું બધું ખરેખર પરિણામ છે એક ઑનલાઇન સંદર્ભ માં શોધી અથવા અમુક કેવી રીતે કરવું googling ટેકનિક કે અમે જોઇ છે, ફેસબુક સ્ત્રોત પર શોધી કોડ છે, એક વેબસાઇટ પર જોઈ તમે તેને ગમે છે કે સ્રોત કોડ અને સમજ કેવી રીતે ત્યાં વિકાસકર્તાઓ ખરેખર વસ્તુઓ બહાર નાખ્યો. 

તેથી અમે તેમજ છબીઓ કરી શકો છો. અને હકીકતમાં, અમે એક ક્ષણ પહેલા હતી. મને આગળ વધો અને તમે માત્ર બતાવવા દો. અહીં કેટલાક નમૂના કોડ છે. તમે ક્યારેય ખરાબ સ્વભાવનું કેટ જોવા માંગો છો. તેથી હું આ કરી શકો છો કે નોટિસ અહીં એક છબી ટેગ છે. અને હું તે ઉપર એક ટિપ્પણી મળી છે. હું એક વૈકલ્પિક મળી છે સુલભતા માટે લખાણ. સ્ક્રીન મદદથી છે જેથી કોઇને જે દૃષ્ટિ કારણોસર રીડર ખરેખર તો પછી હોઈ શકે છે તેમના સ્ક્રીન રીડર ખરાબ સ્વભાવનું કેટ કહે છે. જો તેઓ કરી શકતા નથી કારણ છબી જુઓ, તેઓ ઓછામાં ઓછા તેમના કમ્પ્યુટર હોઈ શકે છે તે મૌખિક તેમને કહેવું શું. અને તે ફાઈલ સ્ત્રોત cat.jpeg છે. તેથી હકીકતમાં, હું ખરેખર ઇચ્છતા હોય તો હું કરી શકે છે શું, હોંશિયાર વિચાર done-- હું તેથી, રિક Astley પર જવા માટે નથી વચન હું તેના બદલે એક બિલાડી માટે Google પર જાઉં છું. અને હું Google છબીઓ પર જાઓ, તો અહીં, અને અમે ધારે પડશે આ મારી બિલાડી એક ચિત્ર છે. 

હું નિયંત્રણ ક્લિક ધારો કે અથવા જમણે આકસ્મિક, આ પર ક્લિક અરોચક. અને cat.jpeg હું જાઉં છું મારા ડેસ્કટોપ પર સેવ. મને હવે મેઘ 9 પર પાછા જઈએ. , કે હું અહીં કરી શકો છો નોટિસ સ્થાનિક ફાઇલો અપલોડ કરવા માટે જાય છે. અને હું આ ગ્રેબ જો ફાઇલ, cat.jpeg, નોટિસ હું તેને ખેંચી શકો છો કે અને મેઘ 9 તેને મૂકવા અને તે અહીં મને અંતે કિકિયારી રહ્યું છે. 

અમે પહેલાથી જ કર્યું છે કારણ કે તમે cat.jpeg ફાઇલ આપવામાં આવે છે, પરંતુ તે માટે સુપર સરળ છે તમે કરેલા ફોટો પડાવી લેવું ફેસબુક પરથી લેવામાં Flickr અથવા જેમ કે અને ખરેખર ખેંચો અને છોડો પછી મેઘ 9 માં અને તેને બનાવવા તમારા પોતાના વ્યક્તિગત ભાગ વેબસાઇટ અથવા સમસ્યા અમે ટૂંક સમયમાં જોશો સાત કે આઠ સુયોજિત કરો. અને પછી જ્યારે તમે છેલ્લે તે બિલાડી મુલાકાત લો હું તે જ બિલાડી ડાઉનલોડ એમ ધારી રહ્યા છીએ, કે that-- નોટિસ માનનીય હતી. 

શું તમે જુઓ છો છે અહીં આ ચહેરો કંઈક. ફાઈલો કે જેથી તમે વેબ પાનું અંદર સંદર્ભ ક્યાં તમારા પોતાના સ્થાનિક હોઈ શકે છે કેટલાક અન્ય સર્વર પર એકાઉન્ટ અથવા દૂરસ્થ આ રિક કિસ્સામાં તરીકે થોડુંક પહેલા Astley ફોટો. તેથી જ્યાં શું બીજું બીજું અમે અહીં કરી શકો છો? તેથી માતાનો નીચેની પર એક નજર કરીએ. તમે પ્રકારની ઠંડી શું છે ખબર છે? 

અમે આમ અત્યાર સુધી બનાવે કરવામાં આવી છે ખૂબ જ સ્થિર વેબ પાનાંઓ. હું નીચે પ્રમાણે વસ્તુઓ મસાલા કરવા માંગો છો. હું મારા પોતાના શોધ એન્જિન બનાવવા માંગો છો. તેથી ચાલો, એક શોધ એન્જિન બનાવવા માટે આગળ વધો અને આ કરવાનું શરૂ કરો. હું આગળ જાઓ અને બનાવવા માટે જઇ રહ્યો છું નવી ફાઈલ search.html કહેવાય છે. અને અમે ઑનલાઇન આવૃત્તિઓ prefabed છે. ઓહ. તમારા ટર્મિનલ વિન્ડોમાં પેસ્ટ નથી કરો. ઓનલાઇન prefab આવૃત્તિઓ. અને હું નીચે પ્રમાણે શરૂ કરવા જઇ રહ્યો છું. તેથી અહીં શરૂઆત છે ફાઇલ search.html કહેવાય છે. હું તેને સેવ કરવા જઇ રહ્યો છું આજે સ્ત્રોત ડિરેક્ટરી. હું આ શોધ કૉલ કરવા માટે જઇ રહ્યો છું. ખરેખર, અમે તે વધુ સારું બનાવવા પડશે. CS50 શોધ અને ખરેખર બ્રાન્ડ તે. અને હવે, હું કહેવા જાઉં છું H1 CS50 શોધ કંઈક. અને પછી અહીં નીચે, H2 ટૂંક સમયમાં આવી. અને માત્ર, H1 રીકેપ માટે અને H2 શું અનુક્રમે અર્થ? 

અરે વાહ, જેથી મોટા અને બોલ્ડ છે, અને જેવા મોટા, પરંતુ હજુ પણ બોલ્ડ નથી. તેથી હું આ સેવ અને અહીં જાઓ, માતાનો ફાઇલ search.html જોવા દો. બધા હક છે, અને આ એક [અશ્રાવ્ય] ડાબેથી છે. દ્વારા ઊભા. ડેવિડ ગેરસમજ છે. ઓહ, તે યોગ્ય છે. ડેવિડ એક મૂર્ખ માણસ છે. ઠીક છે. તેથી ત્યાં તે છે. તેથી CS50 શોધ ટૂંક સમયમાં આવી. તેથી હવે, સંશ્લેષણ દો અમે ગયા સપ્તાહે કર્યું છે. 

અમે વિશે વાત કરી છે HTTP નીચલા સ્તર મિકેનિક્સ. અને આ નવા વિચારો એચટીએમએલ, જે માત્ર છે આ માર્કઅપ ભાષા જ્યાં તમે બરાબર શું એક બ્રાઉઝર કહેવું અને અમારી પોતાની શોધ એન્જિન અમલ. તેથી તેના બદલે માત્ર ટૂંક સમયમાં આવી, કહે છે હું છું શરૂ કરવા જઈ કંઈક ફોર્મ ટેગ કહેવાય છે. અને આ ફોર્મ માં, હું જાઉં છું ઇનપુટ ક્ષેત્ર કંઈક છે. 

અને આ ઇનપુટ નામ ક્ષેત્ર, હું તેને કૉલ કરવા જઇ રહ્યો છું પ્ર અને આ ઇનપુટ ક્ષેત્ર પ્રકાર હું કહેવા જાઉં છું માત્ર "લખાણ" છે. લખાણ ક્ષેત્ર અને, અમે પડશે જુઓ, માત્ર લખાણ બોક્સ છે. અને તેથી તે છે અહીં અનુભવતો નથી આ બિંદુએ તે અંદર કંઈપણ. અને તેથી હું ફક્ત જાઉં છું તે સાથે ટૅગ બંધ આગળ ટેગ પોતે અધિકાર સ્લેશ. અને પછી હું જાઉં છું એક અન્ય ઈનપુટ છે. ઇનપુટ પ્રકાર સબમિટ બરાબર. અને પછી હું જાઉં છું પણ આ એક બંધ. 

અને હવે હું અહીં પાછા જાઓ જાઉં છું. અને પહેલેથી જ અમે જુઓ, ખૂબ નીચ છે, તેમ છતાં, હું કર્યું શરૂઆત મળી અહીં મારા પોતાના શોધ પાનું. હકીકતમાં, મને પ્રયાસ કરો થોડો આ સાફ. તે પર કે બહાર વળે અહીં ઇનપુટ, હું કરી શકે છે પ્લેસહોલ્ડર કહેવાય અન્ય લક્ષણ. અને હું કીવર્ડ્સ કંઈક જોવા શકે છે, અથવા વધુ ખાસ કરીને, ક્યૂ માટે શોધો. 

અને હવે, હું, નોટિસ ગ્રે લખાણના આ પ્રકારની કે અદૃશ્ય થઈ જાય છે જલદી હું ટાઈપ શરૂ કરવા માટે, પરંતુ તે કદાચ કંઈક છે તમે અન્ય વેબ પાનાંઓ જોવા મળે છે. હું ખરેખર સબમિટ બટન ગમતું નથી. તેથી હું ખરેખર આપવા જઈ રહ્યો છું બટન શોધ ની કિંમત સબમિટ કરો. હું ફરીથી લોડ અને જો હવે, નોંધ્યું છે કે મારા બટન શોધ નામ આપવામાં આવ્યું બને છે. તમે મને ખરેખર નથી ખબર, અહીં લોગો જેવા હોય છે. તેથી Google ફોન્ટ જનરેટર. 

હું વધુ આ મસાલા કરવા માંગો છો. તેથી CS50 શોધ. મને મારા પોતાના લોગો બનાવવા દો. તે સરસ લાગે છે. તેથી હવે મને આ પર આવે છે as-- સાચવવા દો. તે ક્યાં જઈ રહી છે? ત્યાં. ઠીક છે. તે ચૂકી. તરીકે જમા કરવુ. મૂર્ખ બ્રાઉઝર્સ. દ્વારા ઊભા, અમે જઈ રહ્યાં છો આ એક વાર અને બધા માટે નક્કી કરે છે. ત્યાં અમે જાઓ. બધા અધિકાર. માફ કરશો. બંધ દિવસ. હવે આ ફંકી છે. પૂર્ણ સ્ક્રીનથી બહાર નીકળો. બધા અધિકાર. 

હવે, સામાન્ય જેમ વ્યક્તિ તરીકે છબી સાચવો. Logo.gif. હવે હું CS50IDE અને જાય જાઉં છું હું ફક્ત લોગો ગ્રેબ જાઉં છું, હું ખેંચો જાઉં છું મારા સ્રોત સાત ડિરેક્ટરી ફાઇલ પહેલેથી હું સાથે ઠીક છું, અસ્તિત્વ ધરાવે છે. તેથી હું તેને ફરીથી લખી જાઉં છું હું પહેલેથી જ તે હતી કારણ કે. અને હવે હું આ કેવી રીતે છુટકારો મેળવી શકું? 

અહીં આગળ વધો અને કરવા દો છબી સ્ત્રોત logo.gif સમકક્ષ હોય છે. આ બંધ કરો. સાચવો. અને હવે હું મારા શોધ પર પાછા જાઓ તો પાનું, હવે તે ખૂબ સારી શોધી રહ્યું છે. બધા હક છે, તે નથી જેથી ખૂબ જ ઉપયોગી કંઈપણ કર્યું. હકીકતમાં, મને શોધવાનો પ્રયાસ કરીએ અને એક બિલાડી માટે જુઓ શું થાય છે. બિલાડીઓ. તે ખરેખર ખૂબ જ. તે માત્ર દેખીતી રીતે, કામ કરતું નથી. તેથી કી ટુકડો શું છે કે અહીં ખૂટે છે? 

અધિકાર, તમે કોઈપણ HTML ખબર ન હોય તો પણ, હું ફોન ફોર્મ ચિહ્નિત શરૂ કર્યું અને હું ઇનપુટ્સ વિચાર કેવી રીતે તે કહ્યું છે મને લખાણ બોક્સમાં આપે છે અને submit બટન દેખીતી રીતે શું ભાગ ખૂટે છે? અમે ખરેખર વિચાર કરવા માંગો છો ધારો યોગ્ય રીતે કામ આ વસ્તુ. અમે શું કરવાની જરૂર છે? અમે પાછળ ઓવરને અમલ કરવા માટે જરૂર છે ડેટાબેઝ અથવા શોધ એન્જિન પોતે, અને તે એક લઇ રહ્યું છે પ્રમાણિકપણે સમય સંપૂર્ણ ઘણો. 

તેથી અમે છેલ્લા સમય શું યાદ કરે છે. તેથી તમે Google પર કંઈક માટે શોધો છો, તો અને તમે અગાઉથી બંધ છે રિકોલ, ત્વરિત શોધ. તેથી મને કે બંધ દો કે જેથી આ ખરેખર જૂની શાળા બ્રાઉઝર જેવા વર્તે છે, હવે હું બિલાડીઓ કંઈક માટે શોધો છો, તો URL ને જેમ દેખાય છે તે યાદ અપાવે છે. તે સારુ છુપાયેલું છે. પરંતુ ત્યાં જડિત, રિકોલ, સ્લેશ શોધ છે. પ્રશ્ન માર્ક સ બિલાડીઓ સમકક્ષ હોય છે. 

અને તે મને આપી લાગશે શોધ પરિણામો સમગ્ર ટોળું. તેથી તમે મને કરવા જઇ રહ્યો છું શું ખબર? હું ઉધાર કરવા જઇ રહ્યો છું માત્ર એક મિનિટ માટે Google. હું પર જાઓ જાઉં છું અહીં અને હું કહેવા જાઉં છું આ ક્રિયા રચે છે અથવા સ્થળ, તેથી વાત કરવા માટે શાબ્દિક Google પ્રયત્ન કરીશું. અને પદ્ધતિ હું ઈચ્છતો વાપરવા માટે વિચાર હોઈ ચાલે છે. 

જેથી ક્રિયા શું છે? ક્રિયા weirdly, નામ આપવામાં આવ્યું છે પરંતુ તે માત્ર અર્થ એ થાય જે હેન્ડલ રહ્યું છે આ ફોર્મ ક્રિયા? હું શોધ, જ્યાં ક્લિક કરો ત્યારે પરિણામ જવા જોઈએ? અને હવે હું મારા ફોર્મ પર પાછા જાઓ તો અહીં અને મારી વેબ પૃષ્ઠને ફરીથી લોડ અને હવે કંઈક શોધવા કૂતરો જેમ, હવે નોટિસ હું Google અમલ ફરી છે. અધિકાર? 

હું કંઈક માટે શોધ કરવા માંગો છો, તો બીજું, તે માત્ર કૂતરા માટે કામ કરે છે, તે પણ બિલાડીઓ માટે કામ કરે છે. તે પણ CS50 માટે કામ કરે છે. અને બરાબર, આ ખાલી છે whelming હેઠળ, તે નથી? બધા હક છે, પરંતુ તે ખરેખર કામ કરે છે. તેથી ખરેખર શું થઈ રહ્યું કરવામાં આવી છે? તેથી હું ઉપયોગ કરીને, મારું બ્રાઉઝર શીખવવામાં કર્યું એચટીએમએલ, વપરાશકર્તા ઇનપુટ લેવા માટે અને ખરેખર ઇનપુટ મોકલી દૂરસ્થ સર્વર પર HTTP ની મદદથી. 

અને મારું બ્રાઉઝર કારણ કે HTTP, તે ખરેખર સમજે છે શું છે કે જેથી URL રચવા હું મારું બ્રાઉઝર પર અંત શું થાય છે નોટિસ જ્યારે હું કૂતરો માટે શોધ. હું શોધવા ક્લિક કરો, તો કે નોટિસ હું ઈરાદો પ્રમાણે URL ફેરફારો ક્વેરી કૂતરો બરાબર google.com/search છે. અને તે ફોર્મ કારણ આ પદ્ધતિ વિચાર છે, કારણ કે, જાણે છે, ખાલી URL કે જે તે કંઈક ઉમેરવા માટે. 

હવે, આ વેબ પાનાંઓ હજુ નીચ છે. તેથી આપણે એક અન્ય પરિચય દો વાક્યરચના ભાગ આજે આપણે કરી શકો છો. અને આ ઓળખાય છે કંઈક છે કેસ્કેડીંગ સ્ટાઇલ શીટ્સ છે. તેથી મને પર એક નજર કરીએ અહીં આ ઉદાહરણમાં અને જુઓ અમે શું થઈ રહ્યું છે અટકળ બાંધવી કરી શકો છો. આ CSS0.html છે. અને આ છે જ્યાં વસ્તુઓ છે થોડી નીચ વિચાર. કમનસીબે, કારણ કે વેબ દુનિયા માં, HTML એકલા બધું કરી શકે છે. અને તેથી તમે કરવા માંગો છો, તો તમારા વેબ પાનું stylize તમે ખરેખર પર ધ્યાન કેન્દ્રિત કરવાની જરૂર છે અલગ રીતે સૌંદર્ય શાસ્ત્ર. તેથી અહીં, હું મારી વેબ શરીર છે જે અંદર પાનું એક મોટી div છે. અને એક DIV માત્ર ડિવિઝન થાય છે. તેથી તે ફકરો પરંતુ તે જેવું છે એ જ સીમેન્ટિક્સ નથી લખાણ એક ફકરો. 

આ માત્ર અર્થ એ થાય બ્રાઉઝર, અહીં આવે છે મારી વેબ એક મોટી લંબચોરસ પ્રદેશ પાનું, હું ખાસ તે નિયંત્રિત કરવા માંગો છો. કે DIV શરૂ થાય છે જ્યાં હવે, રેખા 21 છે. અને માત્ર એક અનુમાન લે છે. પર લીટી 21 અસર શું છે આ પાનું સમાવિષ્ટો બાકીના? તે કેન્દ્રમાં. કે બધા છે. તેથી અમે એક રીતે જોઇ ન હોય ખરેખર લખાણ કેન્દ્રમાં. 

હકીકતમાં, મારા શોધ એન્જિન, વાસ્તવિક Google જેમ નહિં પણ, બધા ડાબી પર વાજબી હતો. અને તેથી હવે રેખા 21 માં, હું અરે, કહી રહ્યો છું બ્રાઉઝર, પાનું એક વિભાગ બનાવો. જસ્ટ મને એક મોટી, અદ્રશ્ય લંબચોરસ આપે છે. કે હું માંગો છો કેવી રીતે વેબ પૃષ્ઠ વિશે વિચારો. નીચે પ્રમાણે અને પછી તે stylize. તે અવતરણચિહ્નો ની અંદર, હવે, બીજી ભાષા છે આજે આપણે રજૂ કહેવાય કેસ્કેડીંગ સ્ટાઇલ શીટ્સ. Thankfully, તે ખૂબ નથી એક પ્રોગ્રામિંગ ભાષા છે, તેથી તે ખૂબ જ તેના વાક્યરચના મર્યાદિત છે, પરંતુ પણ ખૂબ જ તેના વિધેય માં મર્યાદિત HTML જ્યારે બધા વિશે વેબ પાનાંની માહિતી ચિહ્નિત અને વેબ પાનાંની માળખું. સીએસએસ વિશે સામાન્ય રીતે છે છેલ્લા માઇલ સૌંદર્ય શાસ્ત્ર, કદ અને રંગ અને મેળવવામાં વેબ પેજ બરાબર અધિકાર પ્લેસમેન્ટ. અને ખરેખર, તે રચના કરવામાં આવે છે કી કિંમત જોડીઓને છે. 

આ લખાણ જેવા મિલકત કોલોન દ્વારા અનુસરવામાં align, કે ની કિંમત દ્વારા અનુસરવામાં આ કિસ્સામાં કેન્દ્ર છે, જે મિલકત. અને હવે તમે નોટિસ માળામાં આ વસ્તુઓ કરી શકો છો. મને લાગે છે કે બધું ઈચ્છતો હોય તો હું કેન્દ્રિત કરવા માટે પ્રકાશિત કર્યું કે શા માટે હું રેખા 21 હોય છે અને અનુરૂપ રેખા 31. પરંતુ હવે ધારો કે જ્હોન કહે છે કરવા માંગો છો હાર્વર્ડ, મારું હોમ પેજ પર સ્વાગત છે. 

કૉપીરાઇટ પ્રતીક જોન હાવર્ડ. અને હું પ્રથમ માંગો છો ધારવું તે રેખાઓ ખૂબ મોટી હોય છે. 36 પીક્સલ. તેથી કે જે યોગ્ય માપ છે. અને હું બોલ્ડ હોઈ તેનું વજન માગે છે. પરંતુ તે પછી તે નીચે, હું નાની લખાણ માંગો છો. અને તે નીચે, હું માંગો છો પણ નાના લખાણ. માફ કરશો. આજે એક બોલ દિવસ જેવી લાગે છે. 

તેથી હવે, હું આ વ્યક્ત કરવા માટે શું કરી રહ્યો છું? અહીં લીટી 22 પર વણાયેલી છે DIV અથવા પુનરાવર્તિત DIV, જો તમે કરશે. તે પણ તેના પોતાના શૈલી ટેગ છે. હું 36 એક ફોન્ટ માપ સ્પષ્ટ કરો. હું બોલ્ડ ફોન્ટ વજન સ્પષ્ટ કરો. અહીં નીચે, હું માત્ર 24 પિક્સેલ્સ સ્પષ્ટ કરો. અને છેલ્લે, લાઇન 28, હું 12 સ્પષ્ટ કરો. તેથી માત્ર એક ઝડપી સેનીટી ચેક તરીકે અને માનવ વાંચન આ, સ્ક્રીન પર જે શબ્દો છે ખરેખર બોલ્ડ હોઈ ચાલે? જે લાઇન્સ ખરેખર બોલ્ડ છે? 

જસ્ટ જોન હાવર્ડ. અધિકાર? રેખા 22 અરે કહે છે કે કારણ બ્રાઉઝર, અહીં પાનું એક વિભાગ છે. તે ફોન્ટ માપ 36 બિંદુ બનાવો. ફોન્ટ વજન બોલ્ડ બનાવો. જલદી તમે પહોંચે અનુરૂપ અંત ટેગ અથવા વાક્ય 24 પર બંધ ટેગ, કે અર્થ, અરે બ્રાઉઝર, તે તમે શું કરી રહ્યા છે ગમે કરવાનું બંધ. અને સૂચના, તેમ છતાં, સ્પષ્ટ કરવા રેખા 22 આ લક્ષણો બધા છે શૈલી, જેમ કે જ્યારે તમે લીટી 24 ટેગ બંધ, તમે માત્ર ટેગ નામ ઉલ્લેખ. 

તમે આ શબ્દ શૈલી પુનરાવર્તન નથી અથવા તે અવતરણચિહ્નો ની અંદર છે કે જે કંઈપણ. અને હવે હું આ જોવા તેથી જો મારું બ્રાઉઝર માં, માતાનો લેવા દો એક અંતિમ પરિણામ જુઓ. મને જવા દો આગળ સીએસએસ 0 છે કે જે આ ફાઇલ નોંધાયો નહીં. અને તે ખૂબ સાદા હજુ પણ છે પરંતુ ખૂબ રસપ્રદ રહ્યો. પરંતુ તે ત્યાં બહાર વળે હું અહીં શું કરી શકો છો અન્ય વસ્તુઓ, અને બનાવવા જોખમ સંપૂર્ણપણે કદરૂપું આ અહીં નોટિસ મારા મારી વેબ પાનું શરીર, હું રમુજી કંઈક કરી શકો છો બી.જી. અથવા પૃષ્ઠભૂમિ રંગ જેવા હોય છે. 

અને ઝડપી, તમારા મનપસંદ રંગ શું છે? ગ્રીન મેં સાંભળ્યું. બધા અધિકાર. તેથી હવે, હું હવે ફરીથી લોડ હિટ જો, અમે લીલા વેબ પાનું છે. બધા હક છે, કે જેથી ખરાબ નથી. અને હવે, હું આ કરવા માંગો છો, તો ખરેખર ઠંડી, હું મારા લખાણ રંગ કરી શકો છો પણ લાલ. તેથી આપણે આ જેમ દેખાય છે તે જોવા દો. હવે તે ખૂબ સારી શોધી રહ્યું છે. અને નીચે અહીં, જો તમે ખરેખર કોઈની સાથે વાસણ કરવા માંગો છો અથવા તમે કરવા માંગો છો, તો તે લોકો જે એક વેબ મુલાકાત માં યુક્તિના પ્રયાસ કરે છે પાનું તેઓ Google બનાવટ છે કારણ કે વિચાર એક સમગ્ર ટોળું હોય છે કી શબ્દો માતાનો જોવા દો ગમે છે, ફરીથી લોડ કરો. તે ક્યાં ગયા હતા? અને ત્યાં તે. બધા અધિકાર. હું એક અલગ તરીકે આ કહેવું તેથી, અમે પડશે થોડા અઠવાડિયા આ સામગ્રી વિશે વાત અમે વિશે વાત ત્યારે સુરક્ષા, જો તમે ખરેખર એમ્બેડ કરો સમગ્ર જુમખું વેબ પેજ કીવર્ડ, તેઓ દૃશ્યમાન નથી તો પણ Google જેવા માનવ, કોઈને, અલબત્ત, હજુ પણ ખરેખર આ શોધી શકો છો. બધા હક છે, તેથી તે ખૂબ છે ખૂબ ઝડપથી કદરૂપું. 

અને હકીકતમાં, તે બધા નથી મારી પોતાની વેબ વિપરીત કે ખૂબ અન્ડરગ્રેજ્યુએટ, તરીકે પાનું કે જે હું શોધવા માટે આસપાસ Googling શરૂ મારા જૂના વેબસાઇટ્સ છેલ્લા આવૃત્તિઓ. તે ખૂબ ખરાબ હતી. હકીકતમાં, હું શોધી હતી માત્ર વર્ગ પહેલાં એક. પરંતુ ત્યાં બહાર ખરાબ છે. આ દેખીતી રીતે મારા પાછા 1996 માં મુખ્ય પૃષ્ઠ પાનું. દેખીતી રીતે હું વિચાર્યું હતું લોકો તેમના નામ પૂછો યોગ્ય તેઓ કરી શકે તે પહેલાં ખરેખર મારી વેબ પાનું જુઓ. 

અને પછી હું તેમને દર્શાવે છે કદાચ મૂર્ખ કંઈક. હું આગામી સમય માટે વધુ ડિગ પડશે. પરંતુ હવે માટે, ચાલો ડિઝાઇન એક બીટ માને છે. અમે શૈલી વિશે વાત કરી છે. અને આ પાનું આમ અત્યાર સુધી અને હું તેવા પરચૂરણ ખર્ચ કર્યો મોટા ભાગનું બધું stylistically ખૂબ સ્વચ્છ છે. પરંતુ ડિઝાઇન વિશે શું? વેલ, નિરર્થકતા ઘણો છે હું અહીં કરી રહ્યો છું શું છે. 

હું શબ્દ ઉલ્લેખ કર્યો છે સ્થળોએ એક દંપતિ માં રંગ. હું એક દંપતિ માં ફોન્ટ માપ ઉલ્લેખ કર્યો છે સ્થળોએ એક દંપતિ સ્થળો અને બોલ્ડ. અને મૂળભૂત, હું સહ છું બે ભાષાઓ સસ્કૃતિએ. હું મારા ટૅગ્સ અને સાથે એચટીએમએલ મળી છે મારા લક્ષણો અને પછી અચાનક તમામ, અવતરણ વચ્ચે, હું બીજી ભાષા આજે ફરીથી, માત્ર આ છે કે જે કહેવાય સીએસએસ, કી કિંમત જોડીઓને અથવા આ ગુણધર્મો કોલોન ':' દ્વારા અલગ થયેલ છે. 

તે ખૂબ બહાર વળે જેવા સી જ્યાં અમે બહાર અવયવો શરૂ કરી શકો છો હેડર ફાઈલો માં કેટલાક કોડ છે, તેથી અમે HTML માં જ કરી શકે છે. નીચે પ્રમાણે અને તે તરફ એક પગલું છે. આ આવૃત્તિ, CSS1.html છે કે નોટિસ ચોક્કસ જ વેબ પાનું માળખાકીય. તેથી હું સમગ્ર સમૂહ મળી છે divs, પરંતુ આ સમય, હું કર્યું આ wrapper છુટકારો મેળવેલ તમે જોશો DIV. 

અને હું તે ત્રણ divs આપી છે ટોચ, મધ્યમ, અને નીચે, અનન્ય ID ને. આ કારણ છે, સરસ છે તે વિભાગો આપ્યા આ પાનું યુનિક આઇડેન્ટીફાયર, હું તેમને અન્યત્ર સંદર્ભ કરી શકે છે. ક્યાં છે? ઠીક છે, મને ઉપર સ્ક્રોલ દો. અને આમ અત્યાર સુધી, ગમે ત્યારે અમે જોવામાં કર્યું વેબ પેજ વડા, શું છે અમે પડ્યું માત્ર ટેગ વેબ પાનું વડા? તે થોડું વધુ જોશથી. જસ્ટ શીર્ષક અત્યાર સુધી. પરંતુ તે ત્યાં બહાર વળે થોડા અન્ય વસ્તુઓ તમે ત્યાં એક મૂકી શકો છો જે તે એક શૈલી ટેગ કહેવાય છે. તેથી એક ક્ષણ પહેલા, અમે જોવામાં એક શૈલી લક્ષણ છે. એક શૈલી ટેગ છે બહાર ફેંકે છે. તે અંદર આવતી વેબ પેજ વડા. અને હવે હું શું કરી રહ્યો છું નોટિસ. હું આ અંદર હોય શૈલી ટેગ નીચેના. હું શાબ્દિક વાક્ય 20 પર ઉલ્લેખ છું હું stylize કરવા માંગો છો કે જે ટેગ શાળાના નામ. 

પછી હું ઓપન સર્પાકાર તાણવું છે અને સર્પાકાર તાણવું બંધ રહ્યો હતો. , સી ભાવના તેથી સમાન છે, પરંતુ ફરીથી, આ એક કાર્ય નથી, આ અહીં માત્ર એક વાકયરચનામાં વિગતવાર છે. અને પછી અલબત્ત, હું કહી રહ્યો છું બ્રાઉઝર, હેય બ્રાઉઝર, આ પાનું સમગ્ર શરીર બનાવવા કેન્દ્ર લખાણ ગોઠવણી છે. અને તે પછી આ નીચેના કહેતા હોય છે. અરે બ્રાઉઝર, તમે એક HTML જુઓ તો આ પાનું તત્વ અથવા ટેગ કે ટોચ એક અનન્ય ઓળખકર્તા છે જેથી હેશ પ્રતીક અહીં માત્ર અર્થ એ થાય ટોચ અનન્ય વિચાર, આગળ જાઓ અને તેના ફોન્ટ માપ બનાવવા 36 અને તેના ફોન્ટ વજન બોલ્ડ. 

અરે બ્રાઉઝર, જેની એક તત્વ તેને ID ને 24 પિક્સેલ્સ કરો, મધ્ય છે. અને હે બ્રાઉઝર, જો તમે જુઓ એક નીચે વિચાર, તે 12 પિક્સેલ્સ કરો. અંતે અસર બરાબર સેમ છે. હું સીએસએસ 1 જાય, તો પાનું એ જ દેખાય છે. પરંતુ અમે તરફ એક પગલું છો થોડી વધુ સારી રીતે ડિઝાઇન. મને હવે CSS2 માટે અહીં પાછા જાઓ અને હું કર્યું બીજું શું જુઓ. 

હવે પાનું ખરેખર, ખરેખર સ્વચ્છ છે. હકીકતમાં, હું તમામ ફિટ થઈ શકે છે અહીં એક પૃષ્ઠ પર સમાવિષ્ટો. પરંતુ શું નવું ટેગ મારી પાસે દેખીતી રીતે, રજૂ? લિંક. અને તે, ટેગ માટે શ્રેષ્ઠ નામ નથી તે અર્થમાં એક લિંક નથી કારણ કે આપણે જાણીએ છીએ, પરંતુ આ અર્થ એ થાય કે કેટલાક અન્ય ફાઈલમાં એક લિંક છે. આ તીવ્ર સી સમાવેશ થાય છે જેમ પ્રકારની છે 

આ HTML માં માર્ગ છે બ્રાઉઝર અરે કહે છે, સમાવિષ્ટો વિચાર જાઓ ફાઇલ css2.css કહેવાય છે. સંબંધ, મને, તે શૈલી પત્રક છે કે છે. અને ખરેખર, કે શું ના એક કેસ્કેડીંગ સ્ટાઇલ શીટ્સ અર્થ એસ. આ એક શૈલી શીટ છે. તેને સમાવતી માત્ર લખાણ ફાઈલ છે મિલકત એક સંપૂર્ણ જથ્થો. તે શૈલીઓ સમગ્ર ટોળું છે તમે એક પૃષ્ઠ પર લાગુ કરવા માંગો છો છે. 

અને તેથી આ દેખીતી રીતે છે બીજી ફાઇલ ઉલ્લેખ. અને મને લાગે છે કે, CSS2.css ખોલો, બધા હું કર્યું છે કે નોટિસ નકલ અને બધા પેસ્ટ છે આ ફાઈલમાં આ. અને હવે, તમે ક્યારેય કર્યું હોય તો પણ પહેલાં આ સામગ્રી કોડેડ માત્ર ધ્યાનમાં જાણીતું અને સર્વસંમત એન્જિનિયરિંગ Hat પર શા માટે આ એક છે કદાચ વધુ સારી રીતે ડિઝાઇન? તે સીએસએસ ગુણધર્મો બહાર ફેકટરિંગ, તેમના પોતાના ફાઇલમાં મૂકી. તેમ છતાં અમે આ હલ સમસ્યા જેવી પાંચ મિનિટ પહેલા ખૂબ પ્રથમ આવૃત્તિ છે. 

અમે સુધારેલ નથી કર્યું પાનું Stylistically, આ માત્ર સારી છે અમુક અર્થમાં ડિઝાઇન. શા માટે તમે વિચારો છો? યાહ. વધુ લવચીક કેવી રીતે? યાહ. તમે જવા માંગો છો તેથી જો પાછા અને વસ્તુઓ બદલવા માટે, હવે, તમે એક સ્થળ છે જ્યાં તમે વસ્તુઓ બદલી શકો છો. અને હકીકતમાં, કંઈક માટે જેવા સમસ્યા, સાત સેટ અમે અમલ કરીશું જ્યાં સ્ટોક ટ્રેડિંગ વેબસાઇટ, કે હોય ચાલી રહ્યું છે પાનાંઓ સંપૂર્ણ જથ્થો. અને તે ખરેખર હશે હેરાન તમે નક્કી જો, એચએમ, હું ખરેખર હું માંગો છો, 24 પિક્સેલ્સ ન ગમે તે 28 પિક્સેલ્સ અથવા સહેજ મોટા હોય છે. અને પછી એક કરવું પડશે શોધી અને બદલો વૈશ્વિક અથવા તમારી વેબસાઇટ માતાનો ફાઇલો બધા ખોલવા ખાલી ખરેખર એક કિંમત ને બદલવા માટે. આ શૈલીઓ બહાર ફેક્ટરિંગના દ્વારા એક કેન્દ્રીય સ્થળ માં, હવે તમે એક લખાણ ફાઈલ ખોલી શકે છે કોઈ પણ કાર્યક્રમ માં CS50IDE માં, તો, તેને બદલવા તેને સંગ્રહો, અને થાય છે. તમે તે પ્રચાર કર્યું બધે ફેરફારો. અને તે જ હશે કોઈ ક ફાઈલ તેમજ. તેથી કોઇ પ્રશ્નો આમ અત્યાર સુધી આ વાક્યરચના પર? બધા હક છે, તેથી અમે કર્યું બધું તેને લાગે કરવામાં ખરેખર સિવાય હાયપરલિંક્સ અમલ. અને તેથી આપણે આગળ વધીશું અને આ કરવા દો. મને આગળ જવા દો અને અહીં એક નવી ફાઈલ બનાવો. હું તેને કૉલ જાઉં છું link.html, આજે કોડ મૂકો. 

અને હું ખુલ્લી કરવા જઇ રહ્યો છું કૌંસ ડૉક પ્રકાર એચટીએમએલ. આ એક સિવાય, આ વસ્તુ તરીકે ટોચ, આ દસ્તાવેજ પ્રકાર ઘોષણા, તે વિચિત્ર છે કે માત્ર એક જ છે ઉદ્ગારવાચક બિંદુ સાથે. તમે માત્ર તે કરવા માટે હોય છે અને તે અમે HTML આવૃત્તિ 5 વાપરી રહ્યા છે. જૂના આવૃત્તિઓ ભાષા ખૂબ લાંબા સમય સુધી હતી તમે જરૂરી છે કે શબ્દમાળાઓ મૂકો. તેથી અહીં લિંક કહેવાય એક ઉદાહરણ છે. 

હું અહીં મારી વેબ પાનું શરીર જરૂર છે. અને અહીં, એક href સમકક્ષ માતાનો HTTP://www.disney.com કહે દો અને મારી પ્રિય વેબસાઇટ, અમે કહી શકશો. બધા હક છે, તેથી ખૂબ જ નિરુપદ્રવી, વપરાશકર્તા મૈત્રીપૂર્ણ પાનું. હવે હું મારા ડિરેક્ટરીમાં જાઓ અહીં યાદી અને link.html ખોલો, અમે હાયપર ટેક્સ્ટ છે. 

અને ખરેખર, આ છે જ્યાં HTTP માં એચ માંથી આવે છે. હાઇપરટેક્સ્ટ ટ્રાંસફર પ્રોટોકૉલ લખાણ પરિવહન વિશે છે કે અન્ય સંસાધનોની હાઇપરલિંક છે. અને ખરેખર, અહીં, પરિચિત છે રેટ્રો તો, વાદળી લિંક ક્લિક તો, ખરેખર Disney.com મને દોરી જશે. હવે, ઓહ, તે ટૂંક સમયમાં જ બહાર આવે છે. બધા હક છે, તેથી હવે, શું છે કેટલાક આ અસરો? 

અને પ્રમાણિકપણે, વિશ્વમાં શરૂ થાય છે થોડી વધુ પરિચિત વિચાર અને પણ થોડી scarier પણ થોડી વધુ તમે શરૂ એકવાર રક્ષણ સ્વ આ વસ્તુઓ સમજવા માટે. મતભેદ, તમે કેટલાક, તમે જાઓ તો છે, કારણ કે તમારા Gmail સ્પામ ફોલ્ડરમાં મારફતે અથવા તો તમારા ઇનબૉક્સમાં, તો તમે કદાચ કર્યું ઇમેઇલ અમુક પ્રકારની મેળવેલ કે બદલવા માટે તમને પૂછવા તમારી પાસવર્ડ કદાચ અથવા કદાચ ચકાસો તમારા પેપાલ પ્રમાણપત્રો અથવા whatnot. 

અને હકીકતમાં, તમે પ્રાપ્ત થઇ શકે છે અહીં ક્લિક કરો જેવી કહે છે કે કંઈક તમારા પેપાલ પાસવર્ડ રીસેટ કરવા. અને હવે, જો, નોટિસ આ Disney.com નથી પરંતુ જેમ badplace.com અને ફરીથી લોડ નોંધ કરો કે અહીં લખાણ બિલકુલ કંઈપણ કહી શકે છે. અને હકીકતમાં, આ માત્ર શબ્દો છે. શા માટે હું ખરેખર સુપર દૂષિત ન હોઈ નથી અને http://www.paypal.com કહે છે. 

તમારા પેપાલ રીસેટ અહીં ક્લિક કરો પાસવર્ડ અને હવે ફરીથી લોડ કરો. આ અધિકાર ખૂબ કાયદેસર લાગે છે? હું પર ક્લિક કરો ન હોત, અર્થ ફક્ત આ કહે છે કે એક ઇમેઇલ. પરંતુ અહીં બંને જૂથના નોટિસ. તે www.paypal.com કહે છે, અને હકીકતમાં, એક મિનિટ રાહ જુઓ, અમે તમને માંગો છો સુરક્ષા માટે ઓ. તેથી હવે, www.paypal.com HTTPS પર જાઓ, પરંતુ તમે પહેલાં આ ક્યારેય નહોતું કર્યું છે, તો ની આદત માં મળી નથી અહીં થોડી કડીઓ પર હોવર. અને તેને જોવા માટે મુશ્કેલ છે ત્યાં સ્ક્રીન પર, અને તે અહીં નથી કે બધા સરળ છે. પરંતુ માર્ગ નીચે અહીં નાના થોડી ખૂણે ખરેખર બ્રાઉઝર કરે અમે જઈ રહ્યાં છો કે તમે કહો તેના બદલે Paypal.com ના badplace.com છે. હવે, જ્યાં અમે આ સાથે જવું છે? આજે આપણે કર્યું બધા ઉદાહરણો અમે હાર્ડ કોડેડ અને હાથથી જ ટાઇપ કર્યું છે. વેબ ઉત્સાહી છે uninteresting જ્યારે તમે હાર્ડ કે જેથી સામગ્રી તમારા વેબ પૃષ્ઠોને કોડ સ્થિર અને ક્યારેય બદલાતી હોય છે. કોર્સ, અમારા બધા મનપસંદ વેબસાઇટ્સ આજે, તે Gmail અથવા Twitter અથવા શું ફેસબુક અથવા અન્ય કોઇ નંબર ગતિશીલ છે. તેઓ બદલી રહ્યાં છીએ વપરાશકર્તા ઈનપુટ માટે પ્રતિભાવ માત્ર Google શોધ પરિણામો જેવા હોય છે. 

અને તેથી બુધવારે, અમે શું છે અમે HTML અને CSS પરિચય છોડી અમે લાગે છે અને અમને પાછળ હવે અમે તે માની તે જાણે છે અને અમે દાખલ નવી પ્રોગ્રામિંગ ભાષા ગમે જે કહેવાય PHP, સી, અમને આપી રહ્યું છે ખરેખર કાર્યક્રમો બનાવવા માટે શક્તિ પોતાને કે આઉટપુટ પેદા કરે છે. આ કિસ્સામાં, અમે ઉપયોગ કરી શકશો PHP, ગતિશીલ વેબ પેદા કરવા માટે આ નવી ભાષાનો ઉપયોગ પાના. બુધવારે પર તેથી વધુ. જોઇયે પછી. 

[સંગીત વગાડવાનો]