[Powered by Google Translate] [Seminar] [Pregătirea site-ul dvs. de Web]
[Yuechen Zhao] [Universitatea Harvard]
[Aceasta este CS50.] [CS50.TV]
>> Bine. Iată încă o oră de dezvoltare web în cazul în care voi sunteți pentru el.
Azi am de gând să fie vorba despre pregătirea site-ul dvs. de Web.
Toată ziua - și, probabil, în ultimele două săptămâni -
am vorbit despre cum de a crea un site web,
Cum să utilizați HTML, cum să folosească PHP, cum să folosească cadre,
cum să vă asigurați că puteți interacționa cu baza de date - lucruri de genul asta.
Dar astăzi, vom vorbi despre cazul în care site-ul dvs. va trăi după CS50.
Pentru că la urma urmei, CS50 nu se întâmplă trecut decembrie.
Vom vorbi despre nume de domenii, gazduire.
Vom vorbi despre ceea ce compatibilitate cross-browser
și compatibilitate cross-platform sunt, și cum puteți să vă asigurați că site-ul dvs.
va funcționa în toate condițiile.
Vom vorbi despre eroare de manipulare și alt server magie.
Vorbim despre optimizarea performantei, optimizarea motorului de căutare,
și cum să obțineți de oameni pentru a vizita de fapt, site-uri web.
Și, în sfârșit, la doar câteva resurse bune pentru a vă asigura că voi avea suficient de cei
să plece cu proiectul final, și, sperăm, după.
>> Primul lucru pe care am de gând să vorbesc despre este numele de domeniu.
Acum sunteți de programare în aparat, aveți de gând să o gazdă locală
care nu este de fapt un nume de domeniu.
Asta e un fel de doar o porecla sau un alias pentru instalare Linux real
interiorul, fie VMware pe un jucător Mac sau VMware pe un PC.
Numele de domeniu vă permit să pună un site pe Web și apoi du-te la ceva de genul
www.google.com și pentru a obține site-ul web.
Cum funcționează?
Să spunem că ești doar un server web medie -
medie Web surfer și aveți un laptop, și tu du-te la www.howstuffworks.com.
Puteți vedea, probabil, în cazul în care am furat de la.
Cum facem - computerul dvs. va cere apoi un server DNS local,
"Știi unde acest site?"
"Nu știți adresa IP a www.howstuffworks.com?"
Serverul DNS s-ar putea spune, "Da, îmi place."
În acest caz, veți obține adresa IP, și computerul accesează că adresa IP.
Dacă nu, se cere un alt server DNS, "Hei! Știi ce e www.howstuffworks.com?"
Acel server ar putea spune, "Da, îmi place."
Deci, se spune celălalt ceea ce este, și în cele din urmă, aceste informații să fie transmisă la computer,
și puteți accesa howstuffworks.com.
>> Cum puteți obține unul dintre aceste lucruri magice?
Cum puteți obține poate www.yourname.com sau www.ilovecats.com?
Poti sa te inregistrezi pentru unul,
și există o mulțime de site-uri acolo care vă permit să facă acest lucru.
Trebuie - în cele mai multe cazuri, trebuie să plătească pentru ele.
Există anumite nume de domenii, care sunt gratuite.
Dacă te duci la tkdomainnames www.co.cc sau., Acestea sunt gratuite.
Dar, ei nu vin cu anumite restricții, și, de fapt, unele dintre ele nu ar putea fi chiar
nume de domenii reale, de nivel superior, cum ar fi. com sau. net.
În mod normal, aș sugera merge pentru unul dintre ei
deoarece utilizatorii sunt doar mult mai confortabil cu cele.
Ai văzut o mulțime de. Com. Ai văzut o mulțime de. Plase.
Probabil că nu au văzut o mulțime de. Co.cc "s, astfel încât acestea sunt mai greu să-și amintească.
Site-uri diferite, cum ar fi GoDaddy sau NameCheap sau - am folosit unul care este
fel de vag - numit activedomain.com.
Se pare foarte vag, dar e lucrat foarte bine pentru mine.
>> Și, în sfârșit, ai altora care fac poate mai mult publicitate cum ar fi Network Solutions.
Dar dacă te duci pe NetworkSolutions.com si uita-te la prețurile lor
este foarte scump. M-am uitat la ei noaptea trecută.
Timp de un an a unui nume de domeniu, nu este, probabil, în valoare de atât de mult de bani.
De fapt, dacă vei primi o com. Sau. Org sau. Net
prețul obișnuit este de aproximativ 10 dolari pe an.
Deci, dacă sunteți de plată mult mai mult decât atât, nu este probabil ca merita
pentru că, la urma urmei, aceste site-uri nu fac nimic cu acest nume de domeniu.
Ele dau doar pentru tine, și deci, dacă puteți să-l de ieftin, de ce nu?
>> Un alt lucru este o dată ce aveți un nume de domeniu, atunci probabil că doriți să
du-te pe la oricare Godaddy.com sau ori de câte ori ați cumpărat numele de domeniu
și a stabilit serverelor de nume pentru numele de domeniu.
Ceea ce înseamnă că odată ce un utilizator se duce la www.howstuffworks.com,
aceste nume de adrese IP a serverului sunt adresele IP pe care le-ar putea să se uite în sus.
Ei vor putea accesa site-ul dvs. prin intermediul acestor servere de nume.
Dacă se aplică pentru găzduirea undeva
apoi gazda va oferi cel mai probabil serverelor de nume a utiliza.
>> Și, în sfârșit, există o chestie numită o WHOIS.
O bază de date WHOIS este o bază de date cu care ai putea introduce un nume de domeniu
și-l va scuipa câteva informații despre proprietarul site-ului si alte informatii de contact.
Acum, ați putea spune, "Eu nu vreau adresa mea de acasa sau eu nu vreau adresa mea de e-mail
pe site-ul pentru oricine pentru a vedea sau de pe Internet pentru toată lumea să vadă. "
Atunci este posibil să doriți să utilizați ceva care o mulțime de servicii de hosting oferă -
ca un manager de WHOIS.
Un manager WHOIS este pur și simplu un alt serviciu care o mulțime dintre ei prevăd că
ascunde aceste informații și doar pune în care este managerul de nume -
pentru adresa de e, de obicei, doar că numele companiei pe care ți-a dat acest nume de domeniu -
și așa mai apoi informațiile dumneavoastră personale este să nu fie scurgeri de pe Internet,
care este, de obicei, destul de bine.
Eu mă folosesc unul dintre aceste servicii.
Dacă nu vă pasă de intimitatea ta, atunci nu contează cu adevărat.
>> Un server DNS standuri pentru Domain Name System, și ceea ce este -
E ca un fel de tabel pe undeva hash care spune,
"Aceasta adresa de site-ul se va mapa la această adresă IP." Și asta e tot ce este.
Deci, odată ce interogați acest server DNS, atunci puteți obține adresele IP
pentru că numele de domeniu corespondent și apoi vizitați acel site.
(Membru al audienței a pune o întrebare - inaudibil)
Primul? Primul nivel de fapt este, de obicei doar cache-ul computerului în sine.
Un fel de computer din amintește de ultima dată când te-ai dus la www.google.com
a fost la această adresă IP, și apoi după o vreme, că cache-ul va expira,
și se va cere ca Comcast DNS,
"Hei, ce-i www.google.com?"
În mod normal, atunci când cumperi un nume de domeniu și vă înregistrați, și ați creat un site web,
nu puteți merge la care site-ul imediat cu acest nume de domeniu, deoarece serverele de nume
de pe tot globul nu știu despre numele de domeniu încă. Ea are pentru a popula.
De obicei durează aproximativ 24-48 de ore.
Bine. Deci, care e un pic despre numele de domeniu. Sunt foarte misto.
Cred că ar trebui să obțineți unul daca esti serios despre proiect
și, dacă doriți cu adevărat să facă proiectul cunoscut în întreaga campus,
având un nume de domeniu face arata foarte profesional.
>> Apoi, urmatorul pas, desigur, este de a avea un fel de hosting.
Dacă aveți doar o gazdă pe computerul dumneavoastră, nimeni nu va fi vreodată capabil să meargă la ea.
Ai putea stabili eventual un server de pe computerul dumneavoastră și a vă menține computerul pe vecie,
Dar asta nu e recomandat.
Există diferite tipuri de gazduire disponibile online.
Nu a shared hosting. Există VPN (neinteligibil) care sunt gazde virtuale.
Nu e semi-dedicat și dedicat.
Din ultimul 3, VPN, semi-dedicate, și dedicat sunt de obicei mai scumpe.
Ele sunt de obicei utilizate pentru site-urile care au nevoie de mai multe resurse.
Dacă sunteți doar la început cu un site web,
ar putea fi doar mai economic pentru a merge cu shared hosting.
Și ce înseamnă partajate este doar o grămadă de site-uri sunt toate împreună
un fel de pe un server pe acest site de pe acest server gazdă, și puteți accesa site-ul dvs.
prin numele de domeniu.
>> Există o mulțime de gazde populare acolo.
HostGator și DreamHost - acestea sunt foarte, foarte mari și foarte, foarte popular
și foarte, foarte de succes.
Eu personal folosesc unul numit MDDHosting.
Dacă te duci la www.mddhosting.com, care este gazda mea de alegere.
Cred că sunt foarte bune.
Ei au fost întotdeauna foarte de încredere, și nu am avut probleme cu ei.
Ei au, de asemenea, prețuri foarte competitive.
Doi că nu-mi place foarte mult sunt GoDaddy - care este, de asemenea, o serie foarte popular,
dar am avut experiențe teribile cu ei,
și o mulțime de oameni care stiu ca au avut experiente groaznic cu ei.
Ei au un fel de du-te după oameni care nu știu ce fac -
Poate faci un site web pentru prima dată,
și astfel au un fel de ele con de cumpărare în pachetul lor de găzduire.
Nu o face. Nu se încadrează pentru ea. Du-te uita-te pentru alte pachete de gazduire care se potrivesc cu adevarat nevoilor tale.
Iar celălalt este - sunt gazde gratuit acolo.
Există site-uri care va găzdui site-ul dvs. pentru gratuit -
uneori, de a pune un anunț pe site-ul dvs.,
uneori prin făcându-te să participe la forumuri lor,
dar, uneori, pur și simplu, de asemenea, gratuit.
Dar, fii atent cu gazdele gratuit, deoarece multe dintre ele într-adevăr merge doar afară din afaceri
după câteva luni. Pur si simplu nu pot ține pasul cu costurile.
Altele sunt pur și simplu foarte fiabile, iar site-ul dvs. va fi întotdeauna în jos,
și nu vrei să se întâmple asta.
>> Fiecare gazdă va oferi propria lor panoul de control.
Observați că pentru aparatul dumneavoastră, există într-adevăr nu este un panou de control în sine.
Trebuie să utilizați terminalul pentru a merge și de a edita fișiere.
Trebuie să chmod lucruri de unul singur.
Dacă ați vrut să meargă la PHPMyAdmin,
trebuie să te duci la localhost @ / phpMyAdmin și lucruri de genul asta.
Dar, cu un panou de control puteți merge în și edita fișiere pe serverul dvs.
cu Windows Explorer sau o aplicație Finder-tip.
Sau poti sa te duci prin si uita-te la bazele de date cu propriul lor instrument
în loc de phpMyAdmin.
Deci, există o mulțime de alegere aici, și unele dintre cele mai populare panouri de control sunt acolo sus.
Dar dacă sunteți în căutarea pentru o gazdă,
atunci ați putea dori să se uite la ce fel de particularizări și opțiuni
pe care le oferă-mi personaliza serverul meu și de a face site-ul meu a alerga mai bine.
Deci, atunci s-ar putea întreba, "Ei bine, cum pot alege de hosting?"
Dacă te duci la orice site-ul gazdă, există o mulțime de jargon, și există o mulțime de opțiuni.
Există o mulțime de prețuri diferite, de asemenea.
În mod normal, mă duc pentru cele mai ieftine doar pentru site-uri care poate că și eu fac -
și mai ales acum, mai ales ca început - ar putea să nu nevoie de cât mai multe resurse
ca s-ar putea un site ca Microsoft.com.
>> În primul rând vrei să te uiți la sistemul de operare, dacă sunteți cu adevărat curios dacă
site-ul dvs. va fi găzduit pe Linux, pe Windows, sau pe Mac.
În mod normal, vom merge doar cu Linux, pentru că de obicei mai ieftine,
și, de asemenea, cel care poate voi sunt mult mai familiarizați cu cauza aparatului.
Și apoi, poate vor pune unele restricții cu privire la cantitatea de lățime de bandă pe care le obține -
cum ar fi modul de multe megabytes sau gigabytes de date pot descărca utilizatori
de pe site-ul dvs. pe lună? Sau spațiu pe disc.
Cat spatiu ai? Este de 500 MB? Este de 2 GB? Este nelimitat?
În prezent, o mulțime de servere de web vă oferă spațiu nelimitat pe disc ca o modalitate pentru ei
pentru a vă atrage pentru a obține pachetul lor de găzduire.
Dar dacă într-adevăr crezi despre asta, când ai mai avea nevoie de spatiu pe disc nelimitat?
Dacă aveți o pereche de fișiere HTML, un cuplu de PHP, o pereche de imagini -
că e doar o pereche de megaocteți, și așa
Eu merg de obicei doar pentru valoare, poate câteva gigabytes "de spațiu,
și care ar putea fi de ajuns pentru a-mi începe până când am nevoie de mai mult.
>> În cele din urmă, ele pot pune restricții asupra a ceea ce fel de - cât de multe baze de date poate avea.
Poate că poți avea doar 1 bază de date. Poate că puteți avea 2. Poate că puteți avea 10.
Este foarte important să vă cât de multe ai?
Lucrurile să te întrebi.
Și în final, doar lucruri, cum ar fi limbi.
În sprijinul PHP? În sprijinul MySQL?
Cele mai multe site-uri web hosting sunt compatibile cu acestea, deoarece acestea sunt gratuite. Sunt open source.
Ea nu-i costa nimic pentru a furniza aceste pentru tine.
Dar, dacă doriți să utilizați, să zicem, Ruby sau Python sau unele din alte limbi -
ei nu-l susține pe serverul lor, deci este important să se uite pentru aceste tipuri de lucruri.
>> Și, în sfârșit, te lasă să faci unele lucruri mai avansate, cum ar fi locuri de muncă SSL sau cron?
SSL este o opțiune în cazul în care vă puteți face site-ul mai sigur de ceea ce face HTTPS
și cripta conexiunile.
Și locuri de muncă cron sunt doar poate scripturi pe care doriți să o executați
la fiecare 5 minute, la fiecare 10 minute, la fiecare 15.
O mulțime de site-uri web de shared hosting nu pune restricții
cu privire la numărul de locuri de muncă cron care se pot executa pentru că are mai multe resurse.
>> Și, în sfârșit, doar tot ceea ce vrei să te uiți la - asigurați-vă că exact ceea ce se întâmplă
înainte de a cumpăra pachetul dvs. de găzduire.
Și, în sfârșit, de performanță. De performanță este foarte mare.
Cât de rapid este site-ul meu va rula?
Cei mai mulți utilizatori nu sunt de gând să aștepte chiar secunde pentru site-ul dvs. pentru a rula
înainte de a lua doar plictisit, și ei merg pe la MeanBase și începi să cauți la poze
de pisici - știți că se întâmplă, și doriți să vă asigurați că veți obține acel utilizator la bord
și că aveți uptime bun, ceea ce înseamnă doar că
site-ul dvs. va fi accesibil în orice moment.
O mulțime de gazde au uptime foarte rău și că doar înseamnă că site-ul dvs. nu va fi
accesibil, și nu vrei să se întâmple asta pentru că s-ar putea fi trist.
Și puteți urmări, de asemenea, performanța gazda cu site-uri web, cum ar fi
Pingdom.com sau Host-tracker.com, și ei să vă spun cât de des este site-ul dvs. în jos.
>> Și, în sfârșit, vrei să vezi despre sprijinul lor.
Dacă aveți o problemă au de gând să vă răspundă în termen de 24 de ore?
Au de gând să răspundă la tine în 48 de ore?
Serviciul de găzduire pe care le folosesc în mod normal, răspunde-mi în câteva minute
care este foarte frumos.
Uau! În regulă! Este timpul pentru o pauză. Dar eu nu am de gând să-l dea la tine.
Ne vom uita doar la poze cu pisici drăguț fiecare acum și apoi.
>> Un alt lucru foarte, foarte important este compatibilitatea cross-browser.
Ce vreau să spun de compatibilitate cross-browser-ul?
Știi, în zilele noastre nu este doar Microsoft Internet Explorer.
Nu e doar Mozilla Firefox sau Safari.
Acum avem Chrome. Avem Opera. Avem Dolphin. Avem Camino.
Avem Cuceritorul. Avem toate aceste browsere diferite.
Lucruri care ies acum - RockMelt - desi acestea sunt toate bazate pe crom.
Dar faptul de a problemei este, nu este doar un browser mai.
Nu ești doar vizualizarea acestor pagini web cu o singură cerere.
Și astfel, diferite browsere va raspunde la diferite HTML, CSS diferite, și
diferite JavaScript diferit, si cum te descurci cu asta?
Ei bine, în anumite cazuri, tu chiar nu se poate.
Site-ul dvs. - în cazul în care funcționează într-un browser, cod care ați scris nu va funcționa
într-un alt browser, și este treaba ta pentru a vă asigura că codul pe care îl scrie
este universal, care funcționează peste tot.
Deci, acest lucru este foarte periculos.
Dacă spui, "Ei bine, e de lucru pe computerul meu. Mare! Să trecem mai departe."
Ei bine, nu va probabil pentru a lucra pe a mea, și când mă duc la site-ul dvs.
Am de gând să fie foarte trist, și am de gând să plece imediat.
Deci, haideți să vedem cum puteți preveni acest lucru.
>> Primul lucru pe care, desigur, este de a folosi doar standard de HTML, CSS, JavaScript.
Ce vreau să spun cu asta?
Ei bine, există o mulțime de lucruri pe care nu standard de acolo.
De exemplu, în CSS sunt multe variante.
Dacă vedeți orice reguli CSS-moz-sau-WebKit, aceste norme sunt specifice
atât de browserele Mozilla și browsere Webkit,
și astfel încât să doriți să vă asigurați că poate doriți, pentru a evita aceste lucruri
pentru că dacă utilizați-moz-care regula este doar de gând să lucreze pe Firefox.
Și dacă chiar vrei să arate bine pe Internet Explorer, de asemenea,
ai de gând să fie în afara de noroc.
Pentru HTML, de asemenea, ai putea face lucruri în HTML care lucrează într-un browser
dar care rupe într-un alt, și doriți, pentru a evita ca cât mai mult posibil.
Și, în cele din urmă de activarea JavaScript chiar - există mai multe versiuni de JavaScript,
Și în această vară am fugit într-o problemă în cazul în Document.getElementsByClassName--
care este, de obicei, o funcție care este definit ca o parte din standard JavaScript -
nu a fost de a găsi în Internet Explorer 8.
Deci, în timpul verii am lucrat într-un laborator și am fost construirea experimente on-line.
Și am crezut că a fost de lucru foarte bine până când am realizat utilizatori care foloseau
Internet Explorer 8 nu a putut prezenta rezultatele lor.
Am fost lipsesc pe o mulțime de date. Asta ne-a făcut într-adevăr trist.
Deci, vrei mereu să vă asigurați că scripturile sunt de gând să lucreze peste tot.
>> Și, în sfârșit, utilizați validator.w3.org
care este ceea ce am să vă spun să faceți în PSET 7.
Asigurați-vă că paginile dvs. sunt validate.
Asta e important pentru că cel puțin este o primă verificare bun-simț pas.
Este codul meu de fapt conforme cu standardele?
Un alt mod de a sorta de a vă ajuta să vă asigurați că site-ul dvs. este de gând să lucreze
în cele mai multe cazuri este de a utiliza, poate unele biblioteci și cadre
deoarece aceste dezvoltatorii foarte inteligente au gândit la aceste probleme pentru tine.
Au trecut printr-și le-am scris funcții diferite, care lucrează pe diferite browsere.
De exemplu, vom folosi jQuery în PSET 7.
Chiar dacă nu l-au văzut, jQuery oferă o mulțime de funcții
care altfel ar trebui să vă scrie.
Dar aceste dezvoltatorii scris, și au făcut-vă că acesta funcționează în toate browserele.
Și Bootstrap - care este un alt cadru CSS pe care le-am arătat în PSET 7 -
într-adevăr nevoie de departe o mulțime de dureri de cap cu proiectarea site-uri care arata bine.
în toate browserele.
>> Și, în sfârșit, dacă puteți evita, de obicei evita codificare de la zero.
Dacă sunteți doar crearea unui site pentru clubul dvs. școală, de exemplu,
și tot ce trebuie să faceți este de a afișa câteva pagini și poate avea președinte tău merge în
și de a schimba câteva lucruri aici și acolo - nu e într-adevăr nevoie să cod care chiar tu.
Care are o mulțime de timp.
Este nevoie de o mulțime de energie, și va trebui să treacă printr-și va trebui să afle,
Ei bine, se întâmplă acest lucru pentru a arata bine în acest browser, este de gând să arate bine în acest browser.
Poate utiliza unele dintre aceste patch-uri care altii au scris deja pentru tine, cum ar fi
WordPress sau Joomla sau Drupal.
Acestea sunt numite de conținut - acestea sunt numite CMS care, practic, sunt doar pachete care
vin deja făcut pentru tine, și le puteți descărca, le-a pus pe server-ul dvs.,
și le personaliza cum vrei tu, și aveți deja un site web care rulează.
Aceste pachete de cod sunt ceva să se uite în la.
Aceste lucruri sunt open source dacă te duci pentru ceva de genul -
dacă sunteți în căutarea pentru un pachet de formă, sunt lucruri care nu sunt liber ca
VBulletin sau IP.Board.
Dacă nu aveți nevoie de unele dintre aceste caracteristici avansate,
puteți opta mereu pentru opțiunea liberă.
>> Și, în sfârșit, nu există nici o evita.
Trebuie să testeze, de testare, de testare.
Trebuie să testați codul dumneavoastră în toate aceste browsere și pe toate aceste platforme.
Și știi, IE6 - oameni slavă Domnului au început să se îndepărteze de IE6
deoarece din nou în a doua zi, poate că acum câțiva ani, dezvoltatorii web a trebuit să mereu, mereu,
întotdeauna menajeze la punctele slabe IE6 în urma standardelor.
Site-uri doar sa uitat un fel de 1990, pentru lipsa de o modalitate mai bună de a face cu ea.
Puteți folosi, de asemenea, capturi de ecran browser pentru a verifica CSS-ul.
Un site foarte misto este browserlab.adobe.com.
Acesta este un serviciu gratuit pus de Adobe.
Și ceea ce fac ei este că ei pot lua capturi de ecran din site-ul dvs.
care rulează în condiții diferite - cum ar fi alergatul sub diferite browsere,
care rulează sub diferite platforme - și vă arată cum arată.
Doar pentru a vă arăta ce vreau să spun aici, am creat un site web de anul trecut numita Viata la Harvard,
și ceea ce am încercat să fac - Am încercat să fac my.harvard mai bine.
Pentru că dacă ați fost aici anul trecut, my.harvard nu arata asa cum arata acum.
Se pare un fel de dezgustător.
Dar acum se pare mult mai bine.
Implementarea meu nu era ca mai utile, dar toate la fel,
Știi, am încercat să adăugați - (neinteligibil) mai multe orice -
și se pare - se arata foarte bine pe computerul meu.
Și apoi, poate că dacă aș fi avut mai mult timp mi-ar fi dus la laborator browser-ul,
și aș fi uitat la, ei bine, cum se arata in Chrome 18 pe Windows.
Mi-ar derula în jos și mi-ar vedea - Oh, nu! Uită-te la caseta de anunțuri.
Textul meu a fost debordant. Deci, ce e rău, nu?
Dacă un utilizator este folosind Chrome pe Windows și vine la site-ul meu,
care arata imediat foarte neprofesional.
Deci, eu ar trebui să meargă în CSS mea și de a afla ce parte din CSS mi se rupe aici.
De ce nu se afișează corect și fixați-l, astfel încât toți utilizatorii pot vedea același site-ul web
și să fie la fel de fericit.
>> Și, în sfârșit, ei bine, capturi de ecran browser sunt frumos pentru testarea CSS-ul,
dar ceea ce despre JavaScript?
Ce zici dacă aveți un scenariu complicat care se execută?
Ei bine, puteți face întotdeauna virtualizare.
Dacă aveți un Mac puteți folosi Bootcamp sau VMWare pentru virtualizare poate o copie a
Windows și utilizarea Internet Explorer acolo.
Sau, poti sa te duci pe la ceva de genul Spoon.net, care, din păcate, funcționează doar pe PC-uri.
Dar ceea ce fac ei este foarte rece.
Ei virtualizeze software-ul pentru tine, astfel încât să puteți rula versiuni diferite ale IE, de exemplu.
Puteți rula versiuni diferite ale Firefox.
Puteți rula versiuni diferite ale Safari și testa toate site-urile de acolo.
Din păcate, ele nu sunt gratuite.
Acesta este un serviciu plătit, astfel încât există întotdeauna un fel de acest lucru -
există întotdeauna un fel de acest compromis între, ei bine, am de gând să fac site-ul meu arata bine.
Dacă da, s-ar putea trebui să plătească pentru unele servicii să mă ajute să fac asta.
Orice întrebare în acest moment despre ceva despre care am vorbit?
Minunat. Bine.
>> Acum avem mai multe lucruri de discutat.
Cum despre erori?
Cum vă asigurați-vă că site-ul dvs. este de gând să funcționeze chiar și atunci când
se întâmplă ceva rău?
Poate că nu aveți o pagină denumită food.php.
Dar mă, mă duc la site-ul dvs. și am încerca să acceseze food.php.
Sunt doar de gând să-mi arate ca pagină albă pe care scrie 404 - File not found?
Sau ai de gând să spui, "Ei bine, îmi pare rău că nu am putut găsi acest lucru pentru tine,
dar poate că aici sunt câteva alte resurse pentru a vă ajuta să căutați pentru ceea ce ai nevoie. "
Alte erori - astfel, aceasta se numește erori HTTP, care sunt doar câteva coduri de eroare
că server-ul dvs. ar putea fi trimis înapoi la browser-ul în cazul în care se întâmplă ceva rău.
400 - Bad Cerere. 401 - neautorizat.
403 este un fel de comun atunci când aveți un director care nu ar trebui să fie accesate
de către utilizator, dar utilizatorul încearcă să oricum.
Și 500 - Internal Server Error - care se întâmplă de obicei atunci când ai ceva
foarte rău se întâmplă cu codul PHP.
Dar, în orice caz, aceste tipuri de browsere - aceste tipuri de erori se întâmplă.
>> Deci, cum vă asigurați-vă că te descurci cu grație aceste erori
și asigurați-vă că utilizatorul nu este doar un fel de agățat acolo?
Aici vine. Htaccess.
Acum,. Htaccess este ceva care funcționează pe servere Apache,
ceva care funcționează și funcționează pe câteva servere, de asemenea.
Aceasta este doar o modalitate de a configura serverul, astfel încât
puteți face face orice vrei tu să faci.
Unele lucruri pe care le-ar putea face. Ai putea controla setările de cache.
Poate că există o anumită pagină pe site-ul dvs. să vă asigurați că utilizatorul
re-descărcare de fiecare dată când utilizatorul vine și vizitează site-ul dumneavoastră.
Sau poate aveti unele URL-ul asta e ca yoursite.com / testare / HTML / pagini / hello.html
și vrei doar ca să fie yourname.com / salut -. bine, puteți folosi htaccess
pentru a redirecționa o pagină web la alta.
De asemenea, puteți folosi pentru a face autentificarea.
Poate că există unele porțiuni ale site-ul dvs. de care aveți nevoie să utilizați o altă parolă.
Puteți bloca anumite adrese IP, bloca anumite domenii.
Poate că pur și simplu într-adevăr nu le place studenții de la Harvard folosind site-ul dumneavoastră.
Ei bine, aveți opțiunea de a bloca toate adresele IP Harvard.
>> În cele din urmă, se pot trata lucrurile - puteți scrie anumit cod pentru a face server-ul dvs.
trata ca. zhao sau. numele sau. pagini salut ca cod PHP.
Poate că va fi util. Poate că nu va fi.
Și, în sfârșit, îl puteți utiliza pentru a gestiona răspunsuri eroare.
Ce vreau să spun cu asta?
Dacă pur și simplu adăugați ca acest cod - 404 ErrorDocument și apoi le direct la unele
pagină de eroare, puteți să vă asigurați că utilizatorul nu vedea doar foarte, foarte urât
404 și arată-le ceva frumos.
>> Să aruncăm de fapt, o privire la modul în care putem face acest lucru cu PSET dvs. 7.
Aici, eu sunt în aparat mea.
Am de gând să deschidă Chrome, și apoi voi încerca să acceseze o pagină
că nu exista pe CS50 Finanțelor.
Deci, host-ul local - cats.php--atât, observăm că am creat un document de eroare
care spune, "pagina Z nu Canz găsi!"
Ea are o pisica foarte trist pe ea.
Dacă te duci pe Twitter, dacă te duci la oricare din aceste alte site-uri,
nu se poate găsi o pagină, care, de obicei, încearcă să-ți arăt o imagine drăguț
astfel că nu ești prea dezamăgit.
Ai putea avea, de asemenea, ceva care este mult mai profesionist, care spune,
bine, îmi pare rău că nu am putut găsi pagina, dar poate că aici este o casetă de căutare.
Sau poate că aici sunt cateva link-uri care vă va ajuta să găsiți link-ul pe care doriți.
Deci, cum am făcut asta? Cum este acest lucru posibil?
Dacă vom merge în terminalul nostru aici -
Mă duc pentru a mări un pic -
observa că am o nouă pagină.
În interiorul directorul meu HTML se numește - nu se poate vedea -
se numește error.php.
Și error.php este doar un fișier pe care am făcut
care arată că pagina în sine.
Pot să vă arăt ceea ce error.php este.
Este exact această pagină.
Se spune, "Oh, nu! Canz nu pagina z găsi!"
Și, dacă doriți să vedeți - astfel, observăm că htaccess fel este un nume ciudat..
Acesta începe cu un punct, ceea ce înseamnă că este un sistem de fișiere.
Este un fișier ascuns, care nu este afișat în mod normal.
Dacă veți face LS-o, poți vedea toate fișierele ascunse într-un anumit director,
și într-adevăr, veți vedea. htaccess este unul dintre ele.
Să mergem mai departe și deschide htaccess. -
cu gedit -
Boom! Tot ce trebuie este o linie acolo - documentul de eroare de 404 erori
care sunt, de asemenea, cunoscut sub numele de erori de file-nu-găsit.
Să le redirecționa către ceva numit error.php.
Puteți avea lucruri distractive cum ar fi pagina z nu canz găsi!
Și acolo sunt, de asemenea, lucruri foarte interesante pe care le puteți face cu. Htaccess.
Dacă doriți să vedeți mai mult. Htaccess magie,
Acesta este un site foarte cool pentru a merge la - se numește javascriptkit.com/howto/htaccess.shtml--
dacă doriți să efectuați mai multe server de magie. Și ar putea fi foarte distractiv.
>> Uau! În regulă! Mai multe imagini drăguț.
Acesta este un tip de a face push-up-uri, și pisica lui încearcă să ajute. Cred că e foarte drăguț.
Din păcate, nu am o pisica de genul asta.
Bine. Deci, am vorbit despre. Htaccess.
Am vorbit despre eroare de manipulare.
Am vorbit despre hosting, nume de domenii.
Am vorbit despre compatibilitatea cross-browser.
Acum, cum ne asigurăm că site-ul dvs. funcționează de fapt?
Cum ne asigurăm că dacă mă duc la site-ul dvs.
Eu pot vedea pagina dvs. în câteva secunde?
Unul dintre lucrurile pe care cred că oamenii pur și simplu un fel de uitat
este optimizarea imaginii.
Să spunem că ai vrut să pun o poza de pe site-ul dvs.
și este de 2 mg de mare.
Asta ar putea fi bine pentru noi, pentru că suntem la Harvard,
și avem o conexiune foarte rapidă la internet.
Dar imaginați-vă pe cineva din China. Imaginați-vă pe cineva în India.
imagina cineva poate în mediul rural Kansas, care poate nu are același tip de
Internet în bandă largă pe care le avem.
Dacă aveți o imagine 2 MB pe site-ul dvs. și utilizatorul încearcă să-l acceseze,
o să le ia foarte mult timp pentru a descărca.
Deci, dacă nu aveți nevoie de acest fel de rezoluție,
atunci puteți redimensiona imaginea cu ceva de genul Adobe Photo Shop.
Există, de obicei, o opțiune numită în condiții de siguranță pentru web si dispozitive,
și ceea ce face este benzi din toate informațiile inutile
și un fel de compacte de fișiere într-un format de mici dimensiuni, astfel încât să puteți
pune-l pe site-ul dvs., și orice utilizator care încearcă să descarce că pagina
se va descărca o versiune mai mică a imaginii.
Dacă nu aveți Adobe Photo Shop
webresizer.com este, de asemenea, o altă resursă unde puteți introduce imaginea
și-l va scuipa aceeași imagine exactă,
dar va fi ceva de genul de 3 ori mai mici.
Așa că e foarte utile pentru utilizatori.
>> Un alt lucru pe care il poti face este maxify cod.
Dacă ne uităm la Google.com,
veți vedea că nu e un fel de acelasi HTML si CSS cu care suntem obișnuiți să.
Doar de gând să se uite la codul sursă aici.
Dacă am defilați în jos - Wow, care pare destul de dezgustător.
Acest lucru s-ar obține un zero, pe stil.
Dacă ați codificat pentru PSET dvs., veți primi un zero pe stilul tau.
Aceasta nu are nici o spațiere. Denumirile arata foarte criptic.
Totul e adevărat dezgustătoare.
Și script-ul pentru a închide în organism - HTML închidere -
sunt toate împreună - toate smushed împreună.
De ce fac ei asta?
Ei minified codul lor.
Observați că acest document va fi mult mai mic
pentru mine pentru a descărca decât ceva cu spațiu alb,
decât ceva cu nume foarte lungi de variabile.
Dacă vă maxify codul tau te benzi tot spațiul alb.
Desigur, browser-ul nu-i pasă dacă aveți orice spațiu alb în codul dumneavoastră.
Ai benzi afară, acum eu pot descărca un fișier mai mic -
acum dosar - documentul care vom descărca are o dimensiune de fișier mai mică,
acesta va fi mai rapid pentru mine pentru a descărca, și care este util.
Dacă lucrați cu site-uri web și sunteți lansarea unui site web,
este aproape întotdeauna bun pentru a maxify codul.
Un alt motiv pentru care ar fi bine este poate că nu doriți ca alte persoane să utilizeze codul.
Poate că nu doriți ca alții să utilizeze CSS-ul.
Știi dacă într-adevăr a vrut să fie zgârcit cu care,
atunci puteți maxify, de asemenea, codul dvs., și ar fi mai greu pentru mine să-l fure
pentru că nu am nici o idee ce se întâmplă.
Puteți merge, de asemenea, la site-uri precum minify.avivo.si.
Servicii on-line, cum ar fi acest lucru va ajuta sa maxify cod, astfel încât să nu trebuie să-l faci cu mâna.
Categoric nu-l fac cu mâna.
>> Bine. Acum, vorbind despre scripturi.
Poate că în codul PHP este ceva care nu aveți nevoie să faceți.
Poate e bucle suplimentare acolo.
Am vorbit despre design cod în CS50.
Chiar dacă sunteți de codificare în C, dacă aveți - dacă faci o muncă suplimentară
care nu trebuie să fac, bine, care va încetini script-urile de pe site-ul dvs.,
iar acest lucru este deosebit de important pentru site-uri, deoarece utilizatorii în zilele noastre sunt foarte nerăbdător.
Dacă faci de lucru inutil, o să-i ia mai mult
pentru a ajunge la informațiile pe care le doresc, și ei vor fi foarte nefericit.
În cele din urmă, poate doriți pentru a optimiza tabelele bazei de date.
Amintiți-vă, am vorbit despre indicii.
Ele nu sunt numai bune pentru a vă asigura că aveți un rând care este unic.
Sunt, de asemenea, bun pentru a vă asigura că baza de date funcționează rapid.
Dacă doriți să citiți pe care merg la documentația MySQL,
sau poti sa te uiti la - ei bine, cum pot optimiza masa baza mea de date?
Cum mă asigur că am indicii care ajuta-ma sa la informația mai repede?
>> Există, de asemenea, mici trucuri pe care le puteți folosi ca cache.
Dacă aveți PHP - dacă aveți un blog, de exemplu,
și aveți - și este alimentat de PHP sau prin orice altă limbă -
puteți cache blog-ul dvs. la, să zicem intervale de 50 de minute, astfel încât să puteți servi pagini statice
sau HTML static pentru vizitatorii site-ului.
În acest fel utilizatorii nu trebuie să ruleze script PHP de fiecare dată,
și poate că va fi mai rapid pentru ei de a accesa aceste informații.
>> Și, în sfârșit, puteți folosi ceva de genul CDN.
Observați că ori de câte ori vă descărcați un PSET,
te duci mereu la CDN.CS50.net. De ce este asta?
CS50 foloseste, de asemenea, ca un fel de CDN - o rețea de distribuție de conținut -
ceea ce înseamnă doar că este o grămadă de servere poate undeva pe glob
care ajuta la servi paginile dvs. pentru vizitatori.
În cazul în care vizitatorul este obtinerea o pagină de pe un server care este mai aproape de ei punct de vedere geografic,
atunci cel mai probabil, vizitatorul este de gând pentru a obține acel fișier mult mai repede.
Există, de asemenea, surse online, care vă ajută să faci asta.
Una dintre ele este CloudFlare. Ele oferă un serviciu CDN gratuit.
Dacă aveți fișiere de mari dimensiuni care dvs. de servire a utilizatorilor,
atunci poate că e mai bine să le-a pus pe un CDN, astfel încât acestea să poată ajunge la ele mai repede.
>> Subiect de zi este optimizarea motorului de căutare.
Ce este optimizarea motorului de căutare?
Care este asigurându-vă că motoarele de căutare, precum Google sau Bing sau Yahoo
poate merge pe site-ul dvs. și să intrați site-ul dvs. și site-ul dvs. index și atunci când
Eu, de exemplu, du-te la Google.com și încerc să caute ceva,
atunci site-ul dvs. va apărea.
Cum vă asigurați-vă că site-ul dvs. este una din top 10?
Pentru că așa cum știm cu toții, dacă veți căuta ceva pe Google
și nu este pe partea de sus de 10 esti cel mai probabil nu voi uita în următorii 10.
Aceasta este un fel de un subiect care este învăluită în mister.
Există o mulțime de hype acolo pe Internet.
Există o mulțime de superstiții legate dacă nu x, atunci Google va place mai bine.
Dacă nu, atunci y Google va place mai bine.
Este, probabil, mai bine să se uite în documentele gigantul de căutare în sine.
>> Acesta este unul dintre documentele de pe Google pe care le spun exact cum de a optimiza site-ul dvs.
astfel încât Google poate accesa și indicele foarte frumos.
Nu trebuie să copiați acest URL deoarece aceasta prezentare se va
fie online, oricum.
Dacă te uiți la asta și ai citit acest lucru, există câteva sfaturi foarte utile acolo.
Google vă spune - dacă chiar vrei site-ul dvs. să fie indexate bine
atunci ar trebui să faci toate aceste lucruri.
>> Un alt lucru pe care motoarele de căutare cum ar fi într-adevăr este conținut în stare proaspătă.
Dacă aveți conținut care este actualizat foarte regulat
apoi motoarele de căutare spune, ooh, îmi place site-ul tău.
Am de gând să merg la site-ul dvs. foarte des.
Am de gând să indice o mulțime de pagini.
Dacă aveți conținut în stare proaspătă, atunci esti mult mai probabil să apară -
ai mai multe sanse de a fi mai relevantă.
Esti mult mai probabil să fie mai actualizat,
și motoarele de căutare sunt mai susceptibile de a pune site-ul dvs. mai sus altele.
>> Profunde legături sunt de asemenea importante.
Dacă ați vrut site-ul dvs. să arate bine în ochii unui motor de căutare
au o mulțime de alte site-uri legate de acesta și legată adânc în site-ul dumneavoastră.
Nu doar link la pagina de pornire.
Link-ul de la Poate yourname.com / ceva / ceva / something.php.
Care - la un motor de căutare - mijloace, wow, ei au un conținut foarte interesant
că altcineva se leagă atât de adânc în site-ul lor că eu ar trebui într-adevăr, într-adevăr
pune mai important pe paginile site-ul lui.
>> Dacă aveți titluri exacte pagină, dacă nu aveți erori asta e bine pentru că
în cazul în care un motor de căutare este încercarea de a vizita site-ul dvs., și se face o eroare,
este, probabil, de gând să renunțe foarte, foarte repede.
Și, în sfârșit, doriți să aveți un timp de încărcare rapid, deoarece motoarele de cautare -
la fel ca oamenii - no avea o mulțime de răbdare pentru site-urile lente.
Aceasta este o modalitate de a vă asigura că vă apar mai mare în
interogări de căutare motor și sperăm să astfel mai mult trafic.
Pentru că la urma urmei, ce-ai petrecut tot acest timp în curs de dezvoltare site-ul tau.
Ai petrecut tot acest timp, lansarea acestui site-ul online.
Vă doriți să vă asigurați că aveți o mulțime de utilizatori care văd de fapt de conținut.
>> Alte resurse bune de a utiliza.
Google Webmaster Tools este ceva să se uite la la.
Acest lucru doar vă ajută să vedeți - Google nu este indexarea site-ul meu.
Ce tipuri de erori se confruntă cu ea?
Cât de multe pagini le-a indexat?
Ce nu-l crede este cel mai important conținut de pe pagina mea?
Poate că nu e ceea ce vreau eu să fie.
Poate am nevoie pentru a schimba site-ul meu un pic, astfel încât este reflectat mai bine
ceea ce site-ul meu este cu adevarat despre.
Google Analytics este un alt instrument foarte cool.
Puteți adăuga un pic de JavaScript pentru paginile dvs..
Și apoi după aceea poti sa te duci la Google Analytics, și se va urmări
demografice de vizitator și creșterea site-ul dvs..
Acesta vă va spune exact cât de multi vizitatori viziteaza site-ul dvs.
într-o anumită zi, într-o anumită oră, într-o anumită săptămână.
Cât de mulți vizitatori din China? Cât de mulți vizitatori din Antarctica -
vei primi site-ul tau.
care ar putea fi ceva cool pentru a vedea sau ar putea fi chiar utile
pentru că sunteți încercarea de a viza un anumit grup.
Poate că sunteți încercarea de a-tinta adolescenti cu site-ul dvs., și veți vedea că
cele mai multe dintre vizitatorii site-ul dvs. sunt, poate 30 - pentru a tinerilor in varsta de 40 de ani,
atunci poate că, fie aveți o problemă sau vă pot spune doar,
Ei bine, atunci poate ar trebui să se schimbe doar se concentreze site-ul meu, astfel încât
I se concentreze mai mult pe acest grup de vârstă.
>> Google Apps - dacă ai vrut să aibă un fel de e-mailuri cu numele dvs. de domeniu -
Poate ceva de genul yourname@yourname.com--
puteți folosi adrese gmail - puteți utiliza serviciul Gmail
și Google Apps este o modalitate de a face acest lucru.
Aveți posibilitatea să configurați adrese de e-mail specifice, care sunt specifice pentru numele de domeniu
în schimb of@gmail.com.
>> Și, în sfârșit, există extensii web developer și add-on-uri - pentru Chrome,
pentru Firefox, pentru alte browsere - care vă permit să intrați și să inspecteze
CSS, JavaScript inspecta, vezi exact ce e în neregulă cu script-ul JavaScript,
și poate că va fi util pentru scopuri de debugging, pentru ai afla -
Ei bine, de ce nu este site-ul meu afișează corect în acest browser?
>> Și, în sfârșit, dacă ai vrut să afle mai multe despre toate aceste subiecte -
Dacă ați vrut să aflați mai multe despre HTML și CSS și JavaScript -
pentru că, după toate, am învățat numai tu un pic -
poti sa te duci site-uri web, cum ar fi W3Schools.com să caute mai multe resurse.
Ei au tutoriale foarte frumos despre cum fac x, sau ce înseamnă Y?
Dacă ați fi dorit să afle mai multe despre aceste limbi puteti merge pur și simplu aici.
>> Bine. Cred că am vrut să plec în ultimele câteva minute de acest lucru pentru întrebări,
astfel încât există întrebări cu privire la tot ceea ce am vorbit?
[Membru al audienței] Ce fel de lucruri sunt pe W3Schools și modul în care este acoperit?
[Yuechen Zhao] Ce fel de lucruri?
Deci, una dintre cele mai mari lucruri care le folosesc foarte mult este referințele lor.
Lor detaliu referințe, de exemplu, pentru CSS -
ce înseamnă acest lucru sau dacă ai vrut pentru a schimba fundalul unei pagini -
cum o faci?
Ce browsere susține că comanda? Lucruri de genul asta.
Și apoi au, de asemenea, au doar tutoriale foarte frumos pe HTML, pe PHP, pe JavaScript,
pe MySQL, pe tot felul de subiecte diferite.
Ei au tutoriale frumoase. Ei te învață cum să faci lucruri.
E frumos să fie în măsură de a merge si de a invata mai multe despre aceste subiecte.
>> [Membru al audienței] HTML 5 nu este încă compatibil cu toate browserele acolo.
Ar recomanda doar stau departe de ea din cauza unor probleme de compatibilitate?
Cum te descurci cu asta?
[Yuechen Zhao] Da, deci, întrebarea este HTML5 este încă un standard de copil.
Nu este într-adevăr susținută de o mulțime de browsere, deci ar trebui să-l evite?
Cred că anul trecut, aș fi fost un susținător foarte mare de, să evite HTML5
deoarece este încă - este încă foarte mult nou și, de fapt, standardul HTML5
nu a fost finalizat încă.
Și astfel, există într-adevăr există nici un standard HTML5.
Dar cred că mai ales dacă sunteți proiectarea unui site web acum,
ar fi mai bine dacă te duci doar cu HTML5 pentru că e un fel de gând să fie în viitor,
și, dacă doriți site-ul dvs. sa fie de viitor și doriți site-ul dvs. la locul de muncă
în browsere în viitor, ar putea fi mai bine pentru a incepe ceva de constructie pentru viitor
decât pentru trecut, și, de asemenea, doar din cauza faptului că HTML5 într-adevăr nu este faptul că diferite
de la HTML4 sau XHTML.
Dacă utilizați HTML5, în mod normal, se va lucra în cele mai multe browsere.
Trebuie doar pentru a sorta de merge în și asigurați-vă cu aceste capturi de ecran
și asigurându-vă cu a merge la aceste site-uri te.
Dar cel mai probabil acesta va funcționa dacă nu sunteți folosind caracteristici foarte specifice pentru HTML5.
Observați de asemenea că pentru CS50 - de exemplu, pentru player video pe care le folosim -
folosește HTML5 și HTML5 video pentru a afișa prelegeri.
Dar, dacă aveți un browser foarte vechi, atunci acesta va cădea înapoi pe Flash.
Deci, care e, de asemenea, altceva -
au un sistem de rezervă pentru atunci când doar știi că browser-ul nu este de gând să se ocupe de
ceea ce vrei să se ocupe.
>> Alte intrebari?
Ceva despre care am vorbit.
Bine. Atunci cred că e vorba de asta pentru mine.
Eu cred că este.
(Aplauze)
Rece.
[CS50.TV]