[Powered by Google Translate] [Seminari] [Com preparar el seu lloc per a la Web] [Yuechen Zhao] [Universitat de Harvard] [Aquest és CS50.] [CS50.TV] Okay. Aquí hi ha una altra hora del desenvolupament web, si vostès són ho va compensar. Avui parlaré de la preparació del seu lloc per a la Web. Tots els dies - i probablement per les últimes 2 setmanes - hem estat parlant sobre com crear un lloc web, com utilitzar HTML, com utilitzar PHP, com utilitzar marcs, com assegurar-se que es pot interactuar amb la base de dades - coses com aquestes. Però avui en dia, estarem parlant que el seu lloc va a viure després CS50. Perquè després de tot, CS50 no passa al desembre passat. Estarem parlant de noms de domini, hosting. Estarem parlant del que la compatibilitat entre navegadors i la compatibilitat entre plataformes són, i com assegurar que el seu lloc web s'ha d'actuar en totes les condicions. Parlarem de maneig d'errors i altres màgies servidor. Estem parlant de la optimització del rendiment, optimització de motors de recerca, i com aconseguir que la gent visiti els seus llocs web en realitat. I, finalment, només alguns bons recursos per assegurar-se que vostès tenen prou dels per anar-se'n amb el seu projecte final, i és d'esperar després. El primer que anem a parlar és dels noms de domini. En aquest moment s'està programant en el seu aparell, vas a un host local que no és en realitat un nom de domini. En certa manera és només un sobrenom o un àlies per instal · lar Linux dins de qualsevol de VMware en un reproductor Mac o VMware en un PC. Els noms de domini permeten posar un lloc a la Web, i després anar a una cosa així com www.google.com i obtenir el lloc web. Com funcionen? Diguem que vostè és només un servidor web normal - mitjana web surfista i que tenen un ordinador portàtil, i vostè va a www.howstuffworks.com. Vostè probablement pot veure on vaig robar això des. Com la matèria treballa - l'equip li demanarà un servidor DNS local, "Saps on aquesta pàgina web és?" "Coneixes l'adreça IP del www.howstuffworks.com?" El servidor DNS podria dir: "Sí, ho crec." En aquest cas, s'obté l'adreça IP, i l'ordinador accedeix a aquesta adreça IP. Si no ho fa, se li demana a un altre servidor DNS, "Hey! Saps el que www.howstuffworks.com és?" Aquest servidor pot dir, "Sí, ho crec." Per tant, li diu a l'altre el que és, i finalment, que la informació es passa a l'ordinador, i podràs accedir howstuffworks.com. Com es pot aconseguir una d'aquestes coses màgiques? Com pot obtenir el millor www.yourname.com o www.ilovecats.com? Vostè pot inscriure en un, i hi ha un munt de llocs web per aquí que li permeten fer-ho. Vostè ha - en la majoria de circumstàncies, vostè ha de pagar per ells. Hi ha certs noms de domini que són gratis. Si vostè va a tkdomainnames www.co.cc o., Son gratis. Però, ells venen amb certes restriccions, i de fet alguns d'ells no poden ser fins i tot noms reals, de nivell superior de domini com. com o. net. Normalment jo suggeriria anar a un d'ells ja que els usuaris són més còmodes amb ells. Vostè ha vist un munt de. Coms. Vostè ha vist un munt de. Xarxes. Vostè probablement no ha vist molt. Co.cc 's, pel que són més difícils de recordar. Diferents llocs web com GoDaddy o namecheap o - Vaig fer servir un que és mena de vaga - anomenat activedomain.com. Es veu molt rara, però ha funcionat molt bé per a mi. I, finalment, ha d'altres que potser fan més publicitat, com Network Solutions. Però si vostè va a NetworkSolutions.com i mirar els seus preus és molt car. Jo els mirava ahir a la nit. Durant un any d'un nom de domini, no és probablement val la pena tants diners. De fet, si vostè està rebent un. Com o. Org o. Net el preu normal és de voltant de $ 10 a l'any. Així que si vostè està pagant molt més que això, no és probable que la pena perquè, al capdavall, aquests llocs no fan res amb aquest nom de domini. Ells només donen a vostè, així que si vostè pot aconseguir més barat, per què no? L'altra cosa és que una vegada que tingui el seu nom de domini, llavors és probable que vulgui passar a qualsevol Godaddy.com o on hagi adquirit el nom de domini i configurar els servidors de noms per a aquest nom de domini. El que això significa és que una vegada que un usuari va a www.howstuffworks.com, les adreces IP de servidors són les adreces IP que serien capaços de mirar cap amunt. Ells podran accedir al seu lloc web a través d'aquests servidors de noms. Si vostè sol · licita allotjament en algun lloc llavors el seu amfitrió el més probable és que li donarà els servidors de noms per al seu ús. I, finalment, hi ha una cosa que es diu un WHOIS. Una base de dades WHOIS és una base de dades amb la qual es pot introduir un nom de domini i li va escopir una mica d'informació sobre el propietari d'aquest lloc i altra informació de contacte. Ara, vostè pot dir: "Jo no vull que la meva adreça de casa o que realment no vull que la meva adreça de correu electrònic en el lloc web perquè qualsevol pugui veure oa Internet perquè tots la vegin ". Llavors és possible que vulgueu utilitzar una cosa que una gran quantitat de serveis de hosting ofereixen - com un gestor de base de dades WHOIS. Un gestor de base de dades WHOIS és simplement un altre servei que molts d'ells disposen que amaga aquesta informació i només posa en qui és director per al nom - per a la direcció en general és només que nom de l'empresa que t'ha donat el nom de domini - i així, la seva informació personal no és que es va filtrar a Internet, que sol ser bastant bo. Jo ús un d'aquests serveis. Si no es preocupen per la seva privacitat, llavors no importa. Un servidor DNS significa Domain Name System, i el que és - és com una espècie de lloc de taula hash que diu:  "Aquesta adreça de lloc web va a assignar a aquesta adreça IP." I això és el que és. Així que una vegada que es consulta el servidor DNS, llavors vostè pot obtenir les adreces IP perquè el nom de domini corresponent i després visitar aquest lloc web. (Membre de l'audiència amb una pregunta - inaudible) El primer? El primer nivell és en realitat en general només la seva pròpia memòria cau d'ordinador. L'equip tipus de recorda l'última vegada que vas anar a www.google.com va ser en aquesta adreça IP, i després d'un temps, aquesta memòria cau expira, i se li demanarà igual que el Comcast DNS, "Hey, què és www.google.com?" Normalment, quan vostè compra un nom de domini i es registra un, i configurar un lloc web, no es pot anar a aquest lloc web immediatament amb aquest nom de domini, perquè els servidors de noms a tot el món no saben sobre el seu nom de domini encara. S'ha d'omplir. En general, pren al voltant de 24 a 48 hores. Està bé. Llavors, això és una mica sobre els noms de domini. Són molt cool. Crec que vostè ha d'aconseguir un si vostè és seriós sobre el projecte i si realment vol que el seu projecte sigui conegut a tot el campus, tenir un nom de domini fa que es vegi molt professional. A continuació, el següent pas, és clar, és tenir algun tipus d'allotjament. Si vostè acaba de allotjar en el seu ordinador, ningú mai serà capaç d'anar-hi. Vostè podria configurar un servidor en l'equip i mantenir el seu equip per sempre, però això no és recomanable. Hi ha diferents tipus d'allotjament disponibles en línia. Ha compartit de hosting. Hi ha VPN (inintel · ligible) que són hosts virtuals. Hi semi-dedicat i dedicat. Dels últims 3, VPN, semi-dedicat, dedicat i solen ser més cars. En general s'utilitzen per als llocs web que requereixen més recursos. Si només està començant amb una pàgina web, que podria ser més econòmic que anar amb l'allotjament compartit. I el que significa és compartida només un munt de llocs web estan tots junts espècie de en un servidor en aquest lloc web en aquest servidor, i es pot accedir al seu lloc web a través de nom de domini. Hi ha un munt dels exèrcits populars que hi ha. HostGator i Dreamhost - els que són molt, molt gran i molt, molt popular i molt, molt èxit. Jo personalment ús una trucada MDDHosting. Si vostè va a www.mddhosting.com, aquest és el meu hoste d'elecció. Crec que són molt bons. Sempre han estat molt fiable, i mai he tingut cap problema amb ells. Ells també tenen preus molt competitius. Dos que no m'agrada són GoDaddy - que és també un amfitrió molt popular, però he tingut terribles experiències amb ells, i un munt de gent que conec han tingut experiències molt terribles amb ells. S'encarreguen d'anar després de les persones que no saben el que estan fent - potser vostè està fent un lloc web per primera vegada, i pel que tipus d'ells en contra que en la compra del seu paquet d'allotjament. No ho facis. No caigui en el parany. Anar a buscar a altres paquets de hosting que realment s'adaptin a les seves necessitats. I l'altre és - hi ha servidors gratuïts que hi ha. Hi ha llocs web que serà la seu del seu lloc web gratis - A vegades en posar un anunci al seu lloc, de vegades, fent que participi en els seus fòrums, però de vegades simplement també de forma gratuïta. No obstant això, aneu en compte amb els servidors gratuïts perquè molts d'ells realment només ha d'anar a la fallida després d'uns mesos. Vostè simplement no pot mantenir-se al dia amb els costos. Altres són molt poc fiables, i el seu lloc serà sempre cap avall, i no vol que això passi. Cada amfitrió oferirà el seu propi panell de control. Tingueu en compte que per al seu aparell, en realitat no hi ha un panell de control en si. Vostè ha de fer servir terminals per anar i editar els fitxers. Has de chmod coses per tu mateix. Si vols anar a PHPMyAdmin, has d'anar a @ localhost / phpmyadmin i coses per l'estil. No obstant això, amb un panell de control es pot entrar i editar els arxius al servidor amb l'Explorador de Windows o una aplicació de tipus cercador. O vostè pot anar a través i mirar a les seves bases de dades amb la seva pròpia eina en lloc de phpMyAdmin. Per tant, hi ha un munt d'opcions aquí, i alguns dels panells de control més populars són allà. Però si vostè està buscant un amfitrió, llavors és possible que vulgueu veure en quin tipus de personalitzacions i opcions que m'ofereixen per personalitzar el meu servidor i fer que el meu lloc web funcioni millor. Així, llavors vostè podria preguntar: "Bé, Com puc escollir hosting?" Si vostè va a qualsevol lloc web d'acollida que hi ha un munt de argot, i hi ha un munt d'opcions. Hi ha un munt de diferents preus també. Normalment vaig pels més barats perquè els llocs web que potser vostè i jo fem - i sobretot en aquest moment, sobretot com a titulars - que no necessiten tants recursos com ho faria un lloc web com Microsoft.com. En primer lloc que voleu cercar en el sistema operatiu, si vostè és realment curiós si seu lloc va a estar allotjat en Linux, en Windows o en Mac OS. Normalment ens anem amb Linux perquè és generalment el més barat, i també el que potser vostès estan més familiaritzats amb la causa de la unitat. I llavors, potser posaran algunes restriccions en la quantitat d'ample de banda que vostè aconsegueix - com la quantitat de megabytes o gigabytes de dades poden descarregar els usuaris des del seu lloc web al mes? O espai en disc. Quant espai tens? És 500 MB? És 2 GB? És il limitada? Avui en dia, una gran quantitat de servidors web que et donen espai il · limitat com una manera per a ells per atreure a vostè per obtenir el seu paquet d'allotjament. Però si vostè realment pensa d'ell, quan has entrat alguna vegada va a tenir espai il limitat? Si vostè té un parell de fitxers HTML, un parell de PHP, un parell d'imatges - això és només un parell de megabytes, i així normalment em vaig per valor d'espai potser uns pocs gigabytes ', i això podria ser suficient per començar fins que necessito més. Finalment, poden tenir restriccions sobre quin tipus de - la quantitat de bases de dades que pot tenir. Potser vostè només pot tenir 1 base de dades. Potser vostè pot tenir 2. Potser vostè pot tenir 10. És realment important per a vostè quants s'obté? Coses que cal fer. I, finalment, a coses com els idiomes. Són compatibles amb PHP? Són compatibles amb MySQL? La majoria dels llocs web d'allotjament són compatibles amb aquests, ja que són gratuïts. Ells són de codi obert. No els costa res per proporcionar això per a vostè. Però si vol utilitzar, per exemple, Ruby o Python o alguns d'aquests altres idiomes - no poden donar-li suport en el seu servidor, pel que és important buscar aquest tipus de coses. I finalment, se li permet fer algunes coses més avançades com treballs SSL o cron? SSL és una opció on vostè pot fer el seu lloc més segur pel que és HTTPS i xifrar les connexions. I cron llocs de treball són només potser scripts que desitgi executar cada 5 minuts, cada 10 minuts, cada 15. Una gran quantitat de llocs web d'allotjament compartit no va posar restriccions en el nombre de treballs de cron es pot executar a causa que té més recursos. I, finalment, igual que tota la resta que vostè vol veure - assegura't exactament el que està passant abans de comprar el seu paquet d'allotjament. I, finalment, el rendiment. El rendiment és enorme. Què tan ràpid és la meva pàgina web va a córrer? La majoria dels usuaris no van a esperar que fins i tot segons per al seu lloc web per executar abans només s'avorreixen i es van a MeanBase i començar a buscar les imatges dels gats - saps el que passa, i vol assegurar-se que vostè obtingui aquest usuari a bord i que té bon temps d'activitat, que només vol dir que seu lloc web serà accessible en tot moment. Una gran quantitat de hosts tenen molt malament el temps d'activitat i que només significa que el seu lloc web no serà accessible, i no vol que això passi, ja que podria estar trist. I també es pot seguir el rendiment de l'ordinador amb llocs web com Pingdom.com o Host-tracker.com, i que només li dirà la freqüència és el seu lloc sota. I, finalment, vol veure pel seu suport. Si vostè té un problema van a respondre en el termini de 24 hores? ¿Van a respondre dins de 48 hores? El servei de hosting que ús normalment em respon en qüestió de minuts la qual cosa és molt agradable. Sort! Molt bé! És hora d'un descans. Però jo no vaig a donar a vostè. Només ens ocuparem de fotos de gats bonics de tant en tant. Una altra cosa molt, molt gran és la compatibilitat entre navegadors. Què vull dir amb la compatibilitat entre navegadors? Vostè sap, avui en dia no és només Microsoft Internet Explorer. No és només Mozilla Firefox o Safari. Ara tenim Chrome. Tenim Opera. Tenim Dolphin. Tenim Camí. Tenim Conqueridor. Tenim tots aquests diferents navegadors. Les coses que estan sortint ara - RockMelt - encara que aquells es basen en crom. Però el fet de l'assumpte és que no hi ha només un navegador més. No només estàs veient aquestes pàgines amb una sola aplicació. I així, els diferents navegadors responen a diferents HTML, CSS diferent i diferent JavaScript manera diferent, i com bregar amb això? Doncs bé, en alguns casos, realment no puc. El seu lloc web - si funciona en un navegador, el codi que has escrit no funcionarà en un altre navegador, i és el seu treball per assegurar-se que el codi que s'escriu és universal, que funciona a tot arreu. Per tant, això és molt perillós. Si vostè diu: "Bé, està funcionant en el meu ordinador. Great! Anem a passar." Bé, no és probable que va a treballar a la mina, i quan vagi al seu lloc web Vaig a ser molt trist, i jo sortiré immediatament. Per tant, anem a veure com es pot evitar això. El primer, per descomptat, és l'ús únic estàndard HTML, CSS i JavaScript. Què vull dir amb això? Bé, hi ha un munt de coses no estàndard que hi ha. Per exemple, en el CSS ha moltes versions. Si hi ha regles CSS amb-moz-o-webkit-, aquestes regles són específiques tant per als navegadors Mozilla i navegadors Webkit, i pel que desitja assegurar-se que potser vostè vol evitar aquestes coses perquè si s'utilitza-moz-aquesta regla només es va a treballar al Firefox. I si realment vols que es vegi bé a Internet Explorer també, vostè va a estar fora de sort. Per HTML també, pot fer les coses d'HTML que funcionen en un navegador però la interrupció de l'altra, i es vol evitar que tant com sigui possible. I, finalment JavaScript tot - que hi ha moltes versions de JavaScript, i aquest estiu ens trobem amb un problema en el qual document.getElementsByClassName-- que és en general una funció que es defineix com una part de la norma Javascript - va ser no trobar a Internet Explorer 8. Així, durant l'estiu, jo estava treballant en un laboratori i que estàvem construint experiments en línia. I pensem que estava treballant molt bé fins que ens vam adonar dels usuaris que utilitzaven Internet Explorer 8 no va poder presentar els seus resultats. Nosaltres estàvem perdent una gran quantitat de dades. Això ens va fer molt trist. Per tant, un sempre vol assegurar-se que els seus scripts van a treballar a tot arreu. I, finalment, l'ús validator.w3.org que és el que et diuen que facis a PSET juliol. Assegureu-vos que les seves pàgines són validades. Això és important perquè almenys és un primer pas de comprovació de validesa. És el meu codi realment compatible amb les normes? Una altra forma de tipus d'ajuda a assegurar-se que el seu lloc va a treballar en la majoria de les circumstàncies és utilitzar potser algunes biblioteques i marcs causa que aquests desenvolupadors molt intel · ligents han pensat en aquestes qüestions per a vostè. S'han anat a través i que han escrit les diferents funcions que funcionen en tots els navegadors. Per exemple, fem servir jQuery en PSET juliol. Encara que vostè no ho ha vist, jQuery proveeix una gran quantitat de funcions que d'altra manera hauria d'escriure vostè mateix. Però aquests desenvolupadors van escriure, i es van assegurar que funciona en tots els navegadors. I Bootstrap - que és un altre framework CSS que us mostrem en PSET 7 - el que realment li treu molt dels mals de cap amb el disseny de llocs web que es veuen bé. en tots els navegadors. I finalment, si es pot evitar, en general evito codificació a partir de zero. Si acaba de crear un lloc web per al seu club de l'escola, per exemple, i tot el que ha de fer és mostrar unes poques pàgines i potser tenir el seu president van en i canviar algunes coses aquí i allà - no hi ha realment cap necessitat de codi que tu mateix. Per això es necessita una gran quantitat del seu temps. Es necessita una gran quantitat de la seva energia, i vostè ha d'anar a través i vostè ha de saber, bé, és això quedarà bé en aquest navegador, és que quedarà bé en aquest navegador. Podeu utilitzar alguns d'aquests pegats que altres ja han escrit per a vostè, igual que WordPress o Joomla o Drupal. Aquests es diuen contingut - aquests són anomenats CMS, que bàsicament són només els paquets que ja ve fet per vostè, i vostè pot descarregar, els va posar en el seu servidor, i personalitzar com vulguis, i ja té un lloc web en funcionament. Els paquets de codi són una cosa que esperem per. Aquestes coses són de codi obert, excepte si van a fer alguna cosa així - si vostè està buscant un paquet, hi ha coses que no són lliures com VBulletin o IP.Board. Si no té algunes de les característiques avançades, sempre es pot optar per l'opció lliure. I, finalment, no es pot evitar que. Ha de provar, provar, provar. Has de provar el codi en tots aquests navegadors i en totes aquestes plataformes. I ja saps, IE6 - la gent gràcies a Déu han començat a moure lluny de IE6 ja de tornada al dia, potser fa uns anys, els desenvolupadors web van haver sempre, sempre, sempre complaure les debilitats de IE6 en el seguiment de les normes. Llocs web només veien tipus de 1990 per falta d'una millor manera de tractar amb ell. També podeu utilitzar les captures del navegador per comprovar la seva CSS. Un lloc web molt interessant és browserlab.adobe.com. Aquest és un servei gratuït difosa per Adobe. I el que fan és que pot realitzar captures de pantalla del seu lloc web funcionant en condicions diferents - com córrer en diferents navegadors, s'executa en diferents plataformes - i mostrar el que semblen. Només per mostrar el que vull dir aquí, he creat una pàgina web l'any passat anomenat Vida A Harvard, i que va tractar de fer - Vaig tractar de fer my.harvard millor. Com si estiguessis aquí l'any passat, my.harvard no semblava que es veu ara. S'assembla una mica desagradable. Però ara es veu molt millor. La meva aplicació no era tan útil ja, però de totes maneres, ja saps, vaig tractar d'afegir - (inintel · ligible), molts el que sigui - i sembla - es veu molt bé en el meu equip. I llavors, potser si hagués tingut més temps m'hagués anat al laboratori navegador, i m'he mirat, bé, com es veu a Chrome 18 a Windows. Em desplaceu-vos cap avall i m'agradaria veure - oh no! Mira el quadre d'anuncis. El meu text es desborda. Per tant, això és dolent, oi? Si un usuari està utilitzant Chrome a Windows i em ve al lloc web, que immediatament es veu molt poc professional. Per tant, he d'anar al meu CSS i esbrinar quina part del meu CSS està trencant aquí. Per què no es mostra correctament i corregir de manera que tots els usuaris puguin veure la mateixa pàgina web i ser tan feliç. I finalment, també, imatges del navegador són agradables per provar el CSS, però què passa amb JavaScript? Què passa si vostè té un script complicada que s'està executant? Bé, sempre es pot fer la virtualització. Si tens un Mac pots utilitzar Bootcamp o VMWare per virtualitzar potser una còpia de Windows i l'ús d'Internet Explorer allà. O bé, pot passar a alguna cosa com Spoon.net, que per desgràcia només funciona en els PC. Però el que fan és molt cool. Ells virtualitzar programari per a vostè pel que pot executar diferents versions de l'IE, per exemple. Podeu executar diferents versions del Firefox. Podeu executar diferents versions de Safari i provar tots els seus llocs web allà. Per desgràcia, no són lliures. Això és un servei de pagament, així que sempre hi ha una mena d'això - sempre hi ha una espècie d'aquest compromís entre, bé, faré el meu lloc web es vegi bé. Si és així, vaig a haver de pagar per alguns serveis per ajudar a fer això. Les preguntes en aquest moment sobre tot el que hem parlat? Impressionant. Okay. Ara tenim més coses que parlar. Quins errors? Com assegurar-se que el seu lloc web funcionarà fins i tot quan passa alguna cosa dolenta? Potser vostè no té una pàgina cridada food.php. Però jo vaig al teu lloc web i que intento accedir food.php. ¿Va a mostrar que la pàgina en blanc que diu 404 - Arxiu no trobat? O vas a dir: "Bé, jo sento que no vaig poder trobar per a vostè, però potser aquí hi ha alguns altres recursos que l'ajudaran a buscar el que necessites. " Altres errors - així, serà considerat com a errors HTTP, que són només alguns dels codis d'error que el servidor podria haver enviat de tornada al navegador, en cas que passi alguna cosa dolenta. 400 - Sol · licitud incorrecta. 401 - no autoritzat. 403 és una espècie de comuna quan es té un directori que no se suposa que pot accedir per l'usuari, però l'usuari tracta de totes maneres. I 500 - Error intern del servidor - que en general passa quan vostè té alguna cosa molt dolenta amb el codi PHP. Però en qualsevol cas, aquest tipus de navegadors - ocorren aquest tipus d'errors. Així que, com assegurar-se que vostè maneja amb gràcia aquests errors i assegureu-vos que l'usuari no és només una espècie de penjar-hi? Aquí ve. Htaccess. Ara,. Htaccess és una cosa que funciona en servidors Apache, una cosa que funciona i funciona en alguns altres servidors també. Aquesta és només una manera de configurar el servidor de manera que pots fer que faci el que vulguis que faci. Algunes coses que vostè pot fer. Vostè pot controlar la configuració de la memòria cau. Potser hi hagi una determinada pàgina a la seva pàgina web que t'asseguris que l'usuari tornar a descarregar cada vegada que l'usuari entra i visita el seu lloc web. O potser tingui una mica d'URL que és com yoursite.com / prova / html / pages / hello.html i el que desitja que sigui yourname.com / hola -. bé, pot utilitzar htaccess per redirigir una pàgina web a una altra. També pot utilitzar-lo per l'autenticació. Potser hi ha algunes parts del seu lloc web que vostè necessita per utilitzar una altra contrasenya. Pot bloquejar certes adreces IP, bloquejar certs dominis. Potser el que realment no els agrada als estudiants de Harvard que utilitzen el seu lloc web. Bé, vostè té l'opció de bloquejar totes les adreces IP de Harvard. Finalment, es pot tractar les coses - vostè pot escriure codi segur perquè el seu servidor tracten com. zhao o. seu nom o. pàgines hola com codi PHP. Potser això sigui útil. Potser això no serà. I, finalment, es pot usar per gestionar les respostes d'error. Què vull dir amb això? Si vostè només ha d'afegir un codi com aquest - 404 ErrorDocument i després dirigir-los a alguna pàgina d'error, vostè pot assegurar-se que l'usuari no es limita a veure la realitat, molt lleig 404 i mostrar alguna cosa agradable. Anem realment fer una ullada a com podem fer això amb el teu PSET juliol. Mira, estic en el meu aparell. Vaig a obrir Chrome, i després vaig a tractar d'accedir a una pàgina que no existeix en el CS50 Finances. Així, host local - cats.php-més o menys, adonar-se que he creat un document d'error que diu: "Canz no troba la pàgina z!" Té un gat molt trist en ell. Si vas a Twitter, si vas a qualsevol d'aquests altres llocs, vostè no pot trobar una pàgina, en general tracten de mostrar una imatge bonica pel que no estàs molt decebut. Vostè també podria tenir alguna cosa que és més professional que diu: així, ho sento, no vaig poder trobar la pàgina, però potser aquí està un quadre de cerca. O potser aquí hi ha alguns enllaços que l'ajudaran a trobar el vincle que desitgi. Així que, què faig això? Com és això possible? Si entrem a la nostra terminal aquí - Jo només vaig a apropar una mica - adonar que tinc una nova pàgina. Dins meu directori d'HTML que es diu - no es pot veure - es diu error.php. I error.php és simplement un arxiu que vaig fer que mostra que la pròpia pàgina. Et puc mostrar el que és error.php. És exactament aquesta pàgina. Diu: "Oh, no! Canz no troba la pàgina z!" I, si vols veure - així, notarà que htaccess tipus de és un nom estrany .. S'inicia amb un punt el que significa que és un arxiu de sistema. És un arxiu ocult que normalment no es mostra. Si ho fas ls-a, es pot veure tots els fitxers ocults en un directori determinat, i, de fet, ja veus. htaccess és un d'ells. Seguirem endavant i obrir htaccess. - amb gedit - Boom! Tot el que tinc és una línia en allà - el document d'error per als errors 404 que també es coneixen com errors d'arxiu no trobat. Anem a redirigir a alguna cosa anomenat error.php. Vostè pot tenir coses divertides com CANZ no troba la pàgina z! I també hi ha coses molt interessants que es poden fer amb. Htaccess. Si vols veure més. Htaccess màgia, aquest és un lloc molt atractiu per anar a - es diu javascriptkit.com/howto/htaccess.shtml-- Si desitja realitzar més màgia servidor. I podria ser molt divertit. Sort! Molt bé! Més imatges valent. Aquest és un home fent flexions, i el seu gat està tractant d'ajudar. Crec que és molt bonic. Per desgràcia, no tinc un gat així. Està bé. Per tant, el que hem parlat. Htaccess. Hem parlat de tractament d'errors. Hem parlat de hosting, noms de domini. Hem parlat sobre la compatibilitat entre navegadors. Ara, com ens assegurem que el seu lloc web funciona en realitat? Com ens assegurem que si vaig al seu lloc web Puc veure la seva pàgina en pocs segons? Una de les coses que crec que la gent només una mena de oblidar-se de és l'optimització de la imatge. Diguem que vostè vol posar una foto al seu lloc que posa el 2 MG gran. Això podria estar bé per a nosaltres perquè estem a Harvard, i tenim una connexió a Internet molt ràpida. Però imaginar que algú a la Xina. Imagini a algú a l'Índia. Imagini a algú potser a la zona rural de Kansas, que potser no té el mateix tipus de Internet de banda ampla que tenim. Si vostè té una imatge de 2 MB al seu lloc i l'usuari està intentant accedir-hi, que va a portar-los a un temps molt llarg per descarregar. Per tant, si vostè no necessita aquest tipus de resolució, llavors vostè pot canviar la mida de la imatge amb alguna cosa com Adobe Photo Shop. En general hi ha una opció anomenada segura per a la web i dispositius, i el que fa és que elimina tota la informació necessària i una mena de pactes del seu arxiu en un petit mida de la imatge, perquè pugui el va posar al seu lloc web, i qualsevol usuari que intenta descarregar la pàgina va a descarregar una versió més petita de la imatge. Si no té Adobe Photo Shop webresizer.com també és un altre recurs on la seva imatge pot introduir i serà escopir la mateixa imatge, però serà una cosa així com 3 vegades més petit. Així que és molt útil per als usuaris. Una altra cosa que pots fer és minify codi. Si fem una ullada a Google.com, veuràs que no és una espècie de la mateixa HTML i CSS que estem acostumats. Només vaig a mirar el codi font aquí. Si em desplaço cap avall - wow, això sembla bastant repugnant. Això tindria un zero en l'estil. Si vostè va xifrar això per al seu PSET, rebrà un zero en el seu estil. Això no té cap separació. Els noms es veuen molt críptica. Tot és realment repugnant. I el guió es tanqui en el cos - el codi HTML de tancament - estan tots junts - tots smushed junts. Per què fan això? Ells minified seu codi. Tingueu en compte que aquest document serà molt més petit per a mi descàrrec que alguna cosa amb un espai en blanc, d'alguna cosa amb els noms de variables molt llargues. Si Minimitzar el codi es llença tot l'espai en blanc. Per descomptat, el seu navegador no importa si tens qualsevol espai en blanc en el codi. Vostè tira d'ella cap a fora, ara puc descarregar un arxiu més petit - Ara l'arxiu - el document que anem a descarregar té una mida de fitxer més petit, que serà més ràpid per a mi per descarregar, i això és útil. Si està treballant amb els llocs web i vostè està llançant un lloc web, és gairebé sempre bo per retallar el seu codi. Una altra raó per la qual podria ser bo és potser vostè no vol que altres utilitzin el seu codi. Potser vostè no vol que altres utilitzin el seu CSS. Ja saps, si realment volia ser mesquí amb això, aleshores també podeu retallar el seu codi, i seria més difícil perquè el robi perquè no tinc ni idea del que està passant. També pot anar a llocs web com minify.avivo.si. Serveis en línia com aquesta ajuden a retallar el seu codi perquè vostè no ha de fer-ho a mà. Ni se t'acudeixi fer-ho a mà. Okay. Ara parlar d'scripts. Potser en el seu codi PHP que hi ha alguna cosa que vostè no ha de fer. Potser hi bucles addicionals en aquest país. Parlem de disseny de codi al CS50. Fins i tot si vostè està de codificació en C si té - si vostè està fent un treball extra que vostè no ha de fer, bé, això frenarà les seqüències d'ordres al seu lloc web, i això és especialment important per als llocs web, i als usuaris d'avui en dia són molt impacient. Si vostè està fent un treball innecessari, que prendrà més temps per arribar a la informació que desitgen, i que van a ser molt infeliç. Finalment, és possible que vulgueu optimitzar les seves taules de la base. Recordeu que parlem d'índexs. No són només bons per assegurar-se que vostè té una fila que és únic. També són bons per assegurar-se que la seva base de dades és ràpida. Si voleu llegir sobre que van a la documentació de MySQL, o es pot veure en - bo, com puc optimitzar la meva taula de base de dades? Com puc assegurar-me que tinc índexs que ajuden a arribar a la informació més ràpid? També hi ha petits trucs que es poden utilitzar com a memòria cau. Si vostè té PHP - si vostè té un bloc, per exemple, i que té - i és alimentat per PHP o qualsevol altre idioma - pot emmagatzemar en memòria cau al bloc Diguem intervals de 50 minuts perquè pugui servir a les pàgines estàtiques o HTML estàtic per als visitants al seu lloc. D'aquesta manera els usuaris no han de executar l'script PHP cada vegada, i potser això serà més ràpid perquè puguin accedir a aquesta informació. I, finalment, es pot fer servir alguna cosa com CDN. Tingueu en compte que cada vegada que es descarrega un PSET, sempre vas a CDN.CS50.net. Per què és això? CS50 s'utilitza també com una mena de CDN - una xarxa de distribució de continguts - que simplement vol dir que es tracta d'un grup de servidors pot ser que en algun lloc del món que ajuden a servir a les seves pàgines per als seus visitants. Si el visitant és cada vegada una pàgina d'un servidor que està més a prop geogràficament, el més probable és que el visitant es posarà aquest arxiu molt més ràpid. També hi ha fonts en línia que l'ajuden a fer això. Un d'ells és CloudFlare. Ofereixen un servei de CDN gratis. Si té arxius de grans dimensions que el que serveixen als seus usuaris, llavors potser és millor posar-los en un CDN perquè puguin accedir-hi més ràpidament. L'últim tema del dia és l'optimització de motor de cerca. Què és l'optimització de motors de cerca? Això és assegurar-se que els motors de cerca com Google o Bing o Yahoo pot anar al seu lloc i rastrejar el seu lloc i l'índex del seu lloc i quan Jo, per exemple, anar a Google.com i tracte de buscar alguna cosa, llavors el seu lloc apareixerà. Com assegurar-se que el seu lloc és un dels 10? Perquè com tots sabem, si busca alguna cosa a Google i no és a la part superior 10 que està molt probablement no va a veure en els propers 10. Aquesta és una espècie d'un tema que està embolicat en el misteri. Hi ha una gran quantitat de publicitat que hi ha al Internet. Hi ha un munt de supersticions sobre si x llavors Google t'agradi millor. Si vostè i llavors Google t'agradi millor. Probablement és millor mirar cap a si els documents la recerca del gegant. Aquest és un dels documents a Google que et diuen exactament com optimitzar el seu lloc pel que Google pot accedir i l'índex molt bé. Vostè no ha de copiar l'URL, perquè aquesta presentació va a estar en línia de totes maneres. Si ens fixem en això i vostè llegeix això, hi ha alguns consells molt útils en aquest país. El Google et diu - si vostè realment vol que el seu lloc sigui indexat i llavors vostè ha de fer totes aquestes coses. Una altra cosa que els motors de cerca realment els agrada és el contingut fresc. Si té contingut que s'actualitza amb regularitat llavors els motors de cerca diuen, ooh, m'agrada el seu lloc. Vaig a anar al seu lloc amb molta freqüència. Vaig a indexar una gran quantitat de les seves pàgines. Si vostè té un nou contingut, llavors és més probable que aparegui - vostè és més probable que sigui més rellevant. És més probable que sigui més actualitzada, i els motors de cerca són més propensos a posar el seu lloc per sobre dels altres. Els enllaços profunds són també importants. Si realment volia el seu lloc per quedar bé davant els ulls d'un motor de cerca tenim un munt d'altres llocs web vinculats i vinculats profundament al seu lloc web. No es limiti a enllaçar a la pàgina principal. Enllaç a aquest yourname.com / alguna cosa / cosa / something.php. Que - a un motor de cerca - significa, wow, que tenen un contingut molt interessant que algú més és la vinculació tan profundament en el seu lloc estigui de mi molt, molt posar més importància en les pàgines d'aquest lloc. Si vostè té els títols de pàgina precisos, si no té errors, això és bo, perquè si un motor de cerca és tractar de visitar el seu lloc web, i és cada vegada un error, que probablement renunciarà a molt, molt aviat. I, finalment, vostè vol tenir un temps de càrrega ràpida perquè els motors de cerca - igual que els éssers humans - NO tenir molta paciència per als llocs web lents. Aquesta és una manera per tu per assegurar-se que vostè es presenta més en les consultes de cerca del motor i amb això esperem aconseguir més trànsit. Perquè després de tot, vostè ha passat tot aquest temps el desenvolupament del seu lloc web. T'has passat tot aquest temps el llançament d'aquest lloc web en línia. Vostè vol assegurar-se que vostè té un munt d'usuaris que realment veu el teu lloc. Altres bons recursos a utilitzar. Google Webmaster Tools és una cosa que esperem per. Això només ajuda a veure - Google no indexa meu lloc. Quin tipus d'errors que s'enfronten? Quantes pàgines que ha indexat? Què creus que és el contingut més important en la meva pàgina? Potser això no és el que jo vull que sigui. Potser he de canviar el meu lloc web una mica de tal manera que reflecteix millor el que el meu lloc web és realment. Google Analytics és una eina genial. Vostè pot afegir una mica de JavaScript a les seves pàgines. I després després es pot anar a Google Analytics, i es farà un seguiment seva demografia dels visitants i el creixement del seu lloc. Se li dirà exactament quants visitants visiten el seu lloc dins d'un cert dia, dins d'una certa hora, dins d'un cert setmanes. Quants visitants de la Xina? Quants visitants de l'Antàrtida - que està rebent del seu lloc web. això podria ser bo per veure o fins i tot podria ser útil perquè vostè està tractant de dirigir-se a un determinat grup. Potser vostè està tractant d'apuntar als adolescents amb el seu lloc web, i veure que la majoria dels visitants del seu lloc web són potser 30 - d'edat de 40 anys, llavors potser sigui vostè té un problema o pot simplement dir: així, llavors potser hauria de canviar l'enfocament del meu lloc web perquè Em centre més en aquest grup d'edat. Google Apps - si volia tenir una mena de missatges de correu electrònic amb el seu nom de domini - potser una mica com yourname@yourname.com-- pot utilitzar les adreces de gmail - es pot utilitzar el servei de Gmail i Google Apps és una manera de fer això. Podeu configurar adreces de correu electrònic específiques que són específics del seu nom de domini lloc of@gmail.com. I, finalment, hi ha extensions per a desenvolupadors web i complements - per Chrome, Firefox, per a altres navegadors - que li permeten entrar i inspeccionar CSS, JavaScript inspeccionar, veure exactament el que està malament amb la seqüència de comandaments JavaScript i potser això serà útil per als seus fins la depuració, per a vostè saber - així, per què no és el meu lloc web mostra correctament en aquest navegador? I, finalment, per obtenir més informació sobre tots aquests temes - per obtenir més informació sobre HTML i CSS i JavaScript - perquè després de tot, només t'ensenya una mica - vostè pot anar a llocs web com W3Schools.com per buscar més recursos. Tenen molt bons tutorials sobre com ho faig x, o el que vol dir i? Si vols saber més sobre aquests idiomes, pot simplement anar aquí. Està bé. Crec que volia deixar els últims minuts d'aquest per a les preguntes, així que hi ha alguna pregunta sobre qualsevol cosa que hem parlat? [Membre de l'audiència] Quin tipus de coses estan en W3Schools i com es cobreixen? [Yuechen Zhao] Quin tipus de coses? Així, una de les coses més grans que jo ús molt és les referències. Les seves referències detall, per exemple, per CSS - el que això significa, o si voleu canviar el fons d'una pàgina - Com ho fas? Quins navegadors suporten aquesta comanda? Coses així. I llavors també només tenen molt bons tutorials en HTML, PHP, en JavaScript, en MySQL, sobre tot tipus de temes diferents. Tenen bons tutorials. Et ensenyen com fer les coses. És agradable ser capaç d'anar i conèixer més sobre aquests temes aprendre. [Membre de l'audiència] HTML 5 encara no és compatible amb tots els navegadors que hi ha. Li recomanaria a mantenir-se allunyat d'ell a causa de problemes de compatibilitat? Com tractar amb això? [Yuechen Zhao] Sí, és així, la pregunta és HTML5 és encara un estàndard de nadó. En realitat no és suportat per molts navegadors, pel que hem d'evitar? Crec que l'any passat hauria estat un gran defensor de l', Evitem HTML5 perquè encara és - és encara molt nou i, de fet, l'estàndard HTML 5 encara no ha estat finalitzat. I així, realment no hi ha un estàndard HTML5. Però crec que sobretot si vostè està dissenyant un lloc web ara, potser seria millor si només vas amb HTML5, ja que és una espècie de la qual serà el futur, i si vostè vol que el seu lloc web per estar preparada per al futur i vol que el seu lloc web per treballar en els futurs exploradors, potser seria millor per començar a construir alguna cosa per al futur que en el passat, i només pel fet que HTML5 realment no és tan diferent d 'HTML 4 o XHTML. Si utilitzeu HTML5, que normalment funciona en la majoria dels navegadors. Només has d'ordenar d'entrar i assegurar-se amb aquestes captures de pantalla i assegurar-se que va a aquests llocs vostè mateix. Però el més probable és que funcionarà a menys que estiguis usant característiques molt específiques per HTML5. Observi també que per CS50 - per exemple, per al reproductor de vídeo que s'utilitza - que utilitza HTML5 HTML5 i vídeo per mostrar les conferències. Però si vostè té un navegador molt vell, llavors caurà de nou en flash. Llavors, això és també una mica més - tenir un sistema de resguard per quan vostè acaba de saber que el navegador no va a utilitzar el que vostè vol manejar. Altres preguntes? Tot el que hem parlat. Està bé. Llavors crec que això és tot per a mi. Crec que això és tot. (Aplaudiments) Genial. [CS50.TV]