[Powered by Google Translate] [Seminário] [Preparando seu site para a Web] [Yuechen Zhao] [Harvard University] [Isto é CS50.] [CS50.TV] Okay. Aqui está mais uma hora de desenvolvimento web se vocês estão fazendo por ele. Hoje eu vou estar falando sobre a preparação de seu site para a web. Todo o dia - e, provavelmente, para as últimas 2 semanas - nós temos falado sobre como criar um site, como usar HTML, como usar o PHP, como usar frameworks, como ter certeza de que você pode interagir com o banco de dados - coisas assim. Mas hoje, vamos falar sobre onde o seu site vai viver após CS50. Porque afinal, CS50 não acontece passado dezembro. Nós vamos estar falando sobre nomes de domínio, hospedagem. Nós vamos estar falando sobre o que a compatibilidade cross-browser e compatibilidade multi-plataforma, e como você pode ter certeza que o seu site vai operar sob todas as condições. Vamos falar sobre o tratamento de erros e outro mágico servidor. Estamos falando de otimização de desempenho, search engine optimization, e como levar as pessoas a realmente visitar seus sites. E, finalmente, apenas alguns bons recursos para se certificar de que vocês têm o suficiente daqueles para sair com o seu projeto final, e espero que depois. A primeira coisa que vamos falar é sobre nomes de domínio. Agora você está programando em seu aparelho, você está indo para um host local o que não é realmente um nome de domínio. É uma espécie de apenas um apelido ou um alias para a sua instalação real Linux dentro de qualquer VMware em um jogador Mac ou VMware em um PC. Os nomes de domínio permitem que você colocar um site na Web e, em seguida, ir para algo como www.google.com e obter o website. Como eles funcionam? Vamos dizer que você é apenas um servidor web médio - média internauta e você tem um laptop, e você vai para www.howstuffworks.com. Provavelmente, você pode ver onde eu roubei isso. How Stuff Works - o computador irá então pedir um servidor DNS local, "Você sabe onde o site é?" "Você sabe o endereço de IP de www.howstuffworks.com?" O servidor de DNS pode dizer: "Sim, eu faço." Nesse caso, você obter o endereço IP, e seu computador acessa esse endereço IP. Se isso não acontecer, ele pede outro servidor DNS, "Hey! Você sabe o que www.howstuffworks.com é?" Esse servidor poderia dizer: "Sim, eu faço." Assim, diz o outro o que é, e, por fim, que a informação é passada para o computador, e você pode acessar howstuffworks.com. Como você pode obter uma dessas coisas mágicas? Como você pode obter talvez www.yourname.com ou www.ilovecats.com? Você pode se inscrever para um, e há um monte de sites por aí que lhe permitem fazê-lo. Você deve - na maioria dos casos você tem que pagar por eles. Há certos nomes de domínio que são gratuitas. Se você vai para tkdomainnames www.co.cc ou., Aqueles são gratuitos. Mas, eles vêm com certas restrições, e de fato alguns deles podem até não ser , verdadeiros nomes de domínio de primeiro nível, como. com ou. net. Normalmente eu sugeriria ir para um deles porque os usuários são apenas mais confortável com isso. Você já viu um monte de. Coms. Você já viu um monte de. Redes. Você provavelmente não viu um monte de. Co.cc 's, por isso eles são mais difíceis de lembrar. Diferentes sites como o GoDaddy ou NameCheap ou - Eu usei um que é tipo de esboçado - chamado activedomain.com. Parece muito superficial, mas tem funcionado muito bem para mim. E, finalmente, você tem outros que talvez fazer mais publicidade como a Network Solutions. Mas se você vai para NetworkSolutions.com e olhar para os seus preços é muito caro. Eu estava olhando para eles na noite passada. Durante um ano, de um nome de domínio, não é provavelmente vale muito dinheiro. Na verdade, se você está recebendo um. Com ou. Org ou. Net o preço normal é de cerca de US $ 10 por ano. Então, se você está pagando muito mais do que isso, não é provável que vale a pena porque, afinal, esses sites não fazem nada com esse nome de domínio. Eles só dar a você, e por isso, se você pode obtê-lo barato, por que não? A outra coisa é quando você tem o seu nome de domínio, então você provavelmente vai querer ir a qualquer Godaddy.com ou onde você comprou o seu nome de domínio e definir o nome dos servidores para que o nome de domínio. O que isto significa é assim que um usuário vai para www.howstuffworks.com, os endereços IP do servidor de nome são os endereços IP que eles seriam capazes de olhar para cima. Eles seriam capazes de acessar seu site através desses servidores de nome. Se você aplicar para hospedar em algum lugar em seguida, o anfitrião provavelmente irá dar-lhe o nome dos servidores a serem usados. E, finalmente, há essa coisa chamada WHOIS. Um banco de dados WHOIS é um banco de dados com o qual você pode inserir um nome de domínio e ele vai cuspir algumas informações sobre o proprietário do local e outras informações de contato. Agora, você pode dizer: "Eu realmente não quero o meu endereço de casa ou eu realmente não quero o meu endereço de e-mail no site para qualquer um ver ou na Internet para todo mundo ver ". Então você pode querer usar algo que um monte de serviços de hospedagem oferecem - como um gerente de WHOIS. Um gerente de WHOIS é simplesmente outro serviço que muitos deles prevêem que esconde essa informação e apenas põe em que é gerente para o nome - para o endereço normalmente é apenas que o nome da empresa que lhe deu este nome de domínio - e assim, em seguida, suas informações pessoais não está sendo divulgada na Internet, que normalmente é muito bom. Eu mesmo uso um desses serviços. Se você não se preocupam com sua própria privacidade, então ele realmente não importa. Um servidor DNS significa Domain Name System, e que ele é - É como uma espécie de tabela hash em algum lugar que diz:  "Este endereço de site vai mapear para esse endereço IP." E isso é tudo que é. Então, depois de consultar este servidor DNS, então você pode obter os endereços IP para que o nome de domínio correspondente e, em seguida, visite o site. (Membro da platéia fazer uma pergunta - inaudível) O primeiro? O primeiro nível, na verdade, é geralmente apenas o seu próprio cache do computador. Seu computador tipo de lembra a última vez que você foi para www.google.com foi neste endereço IP, e depois de algum tempo, que o cache expira, e ele vai perguntar como a Comcast DNS, "Ei, o que é www.google.com?" Normalmente, quando você compra um nome de domínio e você se registrar, e você criar um site, você não pode ir para o site imediatamente com esse nome de domínio, pois os servidores de nome em todo o mundo não sabe sobre o seu nome de domínio ainda. Tem que preencher. Ele normalmente leva cerca de 24-48 horas. Tudo bem. Então, isso é um pouco sobre nomes de domínio. Eles são muito legal. Eu acho que você deve obter um se você é sério sobre o projeto e se você realmente quer fazer seu projeto conhecido em todo campus, ter um nome de domínio faz com que pareça muito profissional. Então, o próximo passo, claro, é ter algum tipo de hosting. Se você acabou de hospedá-lo em seu computador, ninguém nunca vai ser capaz de ir para ele. Você poderia configurar um servidor no seu computador e manter seu computador para sempre, mas isso não é recomendado. Existem diferentes tipos de hospedagem disponíveis online. Tem de hospedagem compartilhada. Há VPN (ininteligível), que são máquinas virtuais. Há semi-dedicado e dedicado. Dos últimos 3, VPN, semi-dedicado, e dedicado são geralmente mais caros. Eles são geralmente usados ​​para sites que exigem mais recursos. Se você está apenas começando com um site, ele só poderia ser mais econômico para ir com a hospedagem compartilhada. E o meio compartilhado é apenas um monte de sites estão todos juntos classificar de em um servidor no site neste servidor host, e você pode acessar o seu site através do nome de domínio. Há um grande número de hosts populares lá fora. HostGator e DreamHost - aqueles que são muito, muito grande e muito, muito popular e muito, muito bem sucedida. Eu pessoalmente uso um chamado MDDHosting. Se você vai para www.mddhosting.com, essa é a minha série de escolha. Eu acho que eles são muito bons. Eles foram sempre muito confiável, e eu nunca tive qualquer problema com eles. Eles também têm preços muito competitivos. Dois que eu realmente não gosto são GoDaddy - que também é uma série muito popular, mas eu tive experiências terríveis com eles, e um monte de pessoas que eu conheço tiveram experiências realmente terríveis com eles. Eles meio que ir atrás de pessoas que não sabem o que estão fazendo - talvez você esteja fazendo um site pela primeira vez, e assim que tipo de enganá-los na compra de seu pacote de hospedagem. Não faça isso. Não caia nessa. Vá procurar outros pacotes de hospedagem que realmente se encaixam às suas necessidades. E o outro é - há anfitriões livres lá fora. Existem sites que irá hospedar o seu site de graça - às vezes, colocando um anúncio em seu site, às vezes, fazendo-lhe participar de seus fóruns, mas também, por vezes, apenas de forma gratuita. Mas, cuidado com os anfitriões livres, porque muitos deles realmente apenas sair do negócio depois de alguns meses. Você simplesmente não pode manter-se com os custos. Outros são apenas muito pouco confiáveis, e seu site será sempre para baixo, e você não quer que isso aconteça. Cada host vai oferecer seu próprio painel de controle. Observe que para o seu aparelho, não há realmente um painel de controle em si. Você tem que utilizar o terminal para ir e editar os arquivos. Você tem que chmod coisas por si mesmo. Se você queria ir para o PHPMyAdmin, você tem que ir para @ localhost / phpmyadmin e coisas desse tipo. Mas, com um painel de controle que você pode entrar e editar os arquivos em seu servidor com o Windows Explorer ou um aplicativo do tipo localizador. Ou você pode passar e olhar para seus bancos de dados com a sua própria ferramenta em vez de phpMyAdmin. Assim, não há muita escolha aqui, e alguns dos painéis de controle mais populares estão lá em cima. Mas se você está procurando um host, então você pode querer olhar para o que os tipos de personalizações e opções eles oferecem-me a personalizar o meu servidor e fazer meu site funcionar melhor. Assim, você pode perguntar: "Bem, como faço para escolher hospedagem?" Se você entrar em qualquer site hospedeiro há um monte de jargões, e há um monte de opções. Há uma série de diferentes preços também. Normalmente eu ir para os mais baratos só porque sites que talvez você e eu fazemos - e, especialmente agora, especialmente como entradas - eles podem não precisar de muitos recursos como pode um site como o Microsoft.com. Primeiro, você quer olhar para o sistema operacional se você estiver realmente curioso se seu site vai ser hospedado em Linux, no Windows ou no Mac. Normalmente temos apenas ir com Linux porque é geralmente o mais barato, e também o que talvez vocês estão mais familiarizados com por causa do aparelho. E então, talvez eles vão colocar algumas restrições sobre a quantidade de largura de banda que você tem - como quantos megabytes ou gigabytes de dados de usuários podem baixar partir do seu site por mês? Ou espaço em disco. Quanto espaço você tem? É de 500 MB? É 2 GB? É ilimitado? Hoje em dia, um grande número de servidores web dar-lhe espaço em disco ilimitado como uma maneira para que eles seduzi-lo para obter o seu pacote de hospedagem. Mas se você realmente pensar nisso, quando é que você nunca vai precisar de espaço em disco ilimitado? Se você tem um par de arquivos HTML, um par de PHP, um par de imagens - isso é só um par de megabytes, e assim geralmente eu só ir para a pena de espaço talvez alguns 'gigabytes, e que pode ser o suficiente para começar a me até que eu preciso de mais. Finalmente, eles podem colocar restrições sobre o tipo de - quantos bancos de dados você pode ter. Talvez você só pode ter um banco de dados. Talvez você pode ter duas. Talvez você pode ter 10. Será que é realmente importante para você quanto você ganha? Coisas para fazer a si mesmo. E então, finalmente, apenas coisas como línguas. Apoia o PHP? Apoia o MySQL? A maioria dos sites de hospedagem oferecem suporte a estes porque eles são livres. Eles são open source. Não custa nada a eles para fornecer estes para você. Mas se você quiser usar, por exemplo, Ruby ou Python ou alguma dessas outras línguas - eles podem não apoiá-lo em seu servidor, por isso é importante olhar para esses tipos de coisas. E, finalmente, eles permitem que você faça algumas coisas mais avançadas, como os trabalhos de SSL ou cron? SSL é uma opção onde você pode tornar seu site mais seguro, tornando-HTTPS e criptografar suas conexões. E cron são apenas talvez scripts que você deseja executar cada 5 minutos, a cada 10 minutos, a cada 15. Um monte de sites de hospedagem compartilhada não colocar restrições sobre o número de postos de trabalho cron que você pode executar porque isso leva-se mais recursos. E finalmente, tudo o que você quer olhar - certifique-se exatamente o que está acontecendo antes de você comprar o seu pacote de hospedagem. E, finalmente, o desempenho. O desempenho é enorme. Quão rápido é o meu site vai correr? A maioria dos usuários não vão esperar até mesmo segundos para o seu site para ser executado antes que eles apenas se cansar, e eles passam a MeanBase e começar a olhar para as imagens de gatos - você sabe o que acontece, e você quer certificar-se de que você obtenha o usuário a bordo e que você tem bom uptime que apenas significa que seu site vai ser acessível em todos os momentos. Um grande número de hosts têm muito ruim o tempo de atividade e que apenas significa que seu site não vai ser acessível, e você não quer que isso aconteça, porque você pode ficar triste. E você também pode acompanhar o desempenho do seu anfitrião com sites como Pingdom.com ou Host-tracker.com, e eles apenas lhe dizer quantas vezes é o seu site do ar. E, finalmente, você quer ver sobre o seu apoio. Se você tem um problema que eles vão responder a você dentro de 24 horas? Eles vão responder a você dentro de 48 horas? O serviço de hospedagem que eu uso normalmente responde a mim em poucos minutos que é muito bom. Ufa! Tudo bem! É hora de uma pausa. Mas eu não vou dar a você. Nós vamos apenas olhar fotos de gatos bonitos de vez em quando. Outra coisa muito, muito grande é a compatibilidade cross-browser. O que quero dizer com compatibilidade cross-browser? Você sabe que, hoje em dia não é apenas o Microsoft Internet Explorer. Não é apenas o Mozilla Firefox ou Safari. Agora temos Chrome. Temos Opera. Temos Dolphin. Temos Camino. Temos Conquistador. Temos todos esses diferentes browsers. Coisas que estão saindo agora - RockMelt - embora aqueles são todos baseados no Chromium. Mas a verdade da questão é, não é apenas um navegador mais. Você não está apenas vendo estas páginas com um único aplicativo. E assim, diferentes navegadores irá responder a diferentes HTML, CSS diferente, e JavaScript diferente de forma diferente, e como você lida com isso? Bem, em certos casos, você realmente não pode. Seu site - se ele funciona em um navegador, o código que você escreveu não vai funcionar em outro navegador, e é o seu trabalho para se certificar de que o código que você escreve é universal, que funciona em todos os lugares. Então, isso é muito perigoso. Se você disser: "Bem, ele está trabalhando no meu computador. Great! Vamos seguir em frente." Bem, provavelmente não vai funcionar no meu, e quando eu ir para o site Eu vou ficar muito triste, e eu vou deixar imediatamente. Então, vamos ver como você pode evitar isso. A primeira coisa, é claro, é só usar padrão HTML, CSS e JavaScript. O que quero dizer com isso? Bem, há um monte de coisas que não padrão lá fora. Por exemplo, em CSS existem muitas versões. Se você ver todas as regras CSS com-moz-ou-webkit-, essas regras são específicas tanto para os navegadores Mozilla e os navegadores Webkit, e assim que você quer ter certeza de que talvez você queira evitar essas coisas porque se você usar-moz-essa regra só vai funcionar no Firefox. E se você realmente quer ter uma boa aparência no Internet Explorer também, você vai estar fora de sorte. Para HTML também, você pode fazer coisas em HTML que funcionam em um navegador mas que quebra em outro, e você quer evitar que, tanto quanto possível. E, finalmente, para JavaScript, mesmo - há muitas versões do JavaScript, e neste verão nós funcionamos em um problema onde document.getElementsByClassName-- que é geralmente uma função que é definido como uma parte do padrão JavaScript - não era encontrar no Internet Explorer 8. Assim, durante o verão, eu estava trabalhando em um laboratório e estávamos construindo experiências on-line. E nós pensamos que ele estava funcionando muito bem até que percebemos que os usuários estavam usando Internet Explorer 8 não poderia apresentar os seus resultados. Estávamos perdendo uma grande quantidade de dados. Isso nos deixou muito triste. Assim, você sempre quer ter certeza de que seus scripts estão indo para o trabalho em todos os lugares. E, finalmente, utilizar validator.w3.org que é o que lhe dizem para fazer em pset 7. Certifique-se de que suas páginas são validadas. Isso é importante porque pelo menos é um primeiro teste de sanidade passo. É o meu código realmente compatível com as normas? Outra maneira de classificar de ajudá-lo a certificar-se de que seu site está indo para o trabalho na maioria das circunstâncias é talvez usar algumas bibliotecas e frameworks porque esses desenvolvedores realmente inteligentes ter pensado sobre essas questões para você. Eles passaram e eles escreveram funções diferentes que funcionam em todos os navegadores. Por exemplo, podemos usar jQuery em Pset 7. Mesmo que você não pode tê-lo visto, jQuery fornece uma série de funções que de outra forma você teria que escrever-se. Mas estes desenvolvedores escreveu, e que fizeram certo de que ele funciona em todos os browsers. E Bootstrap - que é outro quadro CSS que nós lhe mostramos em Pset 7 - ele realmente tira um monte de dores de cabeça com a concepção de websites que parecem boas. em todos os navegadores. E, finalmente, se você pode evitá-lo, eu costumo evitar codificação a partir do zero. Se você está apenas criando um site para seu clube da escola, por exemplo, e tudo que você precisa fazer é exibir algumas páginas e, talvez, ter o seu presidente ir e mudar algumas coisas aqui e ali - não há realmente nenhuma necessidade de código que você mesmo. Que tem um monte de seu tempo. É preciso muito de sua energia, e você tem que passar e você tem que descobrir, bem, isso vai ficar bem neste browser, é que vai ficar bem neste browser. Talvez usar alguns desses patches que outros já escrito para você, como WordPress ou Joomla ou Drupal. Estes são chamados de conteúdo - estes são chamados CMSs que basicamente são apenas os pacotes que já veio feito para você, e você pode baixá-los, colocá-los em seu servidor, e personalizá-los como quiser, e você já tem um site funcionando. Esses pacotes de código são algo para olhar para. Essas coisas são de código aberto, a menos que você vá para algo como - se você estiver procurando por um pacote forma, há coisas que não são livres como VBulletin ou IP.Board. Se você não precisa de alguns desses recursos avançados, você pode sempre optar pela opção livre. E, finalmente, não há como evitar isso. Você deve testar, testar e testar. Você deve testar o seu código em todos os navegadores e em todas essas plataformas. E você sabe, IE6 - bondade pessoas agradecem começaram a afastar-se IE6 porque para trás no dia, talvez há alguns anos atrás, os desenvolvedores web tiveram que sempre, sempre, sempre agradar às fraquezas do IE6 em seguir as normas. Sites apenas parecia um pouco da década de 1990 por falta de uma melhor maneira de lidar com isso. Você também pode usar imagens do navegador para verificar o seu CSS. Um site muito legal é browserlab.adobe.com. Este é um serviço gratuito de colocar para fora pela Adobe. E o que eles fazem é que eles podem tirar screenshots do seu site executar em condições diferentes - como correr em diferentes navegadores, sendo executado em diferentes plataformas - e mostrar o que eles se parecem. Só para mostrar o que eu quero dizer aqui, eu criei um site no ano passado chamado vida em Harvard, eo que eu tentei fazer - Eu tentei fazer my.harvard melhor. Porque se você estivesse aqui no ano passado, my.harvard não parecia como parece agora. Parece meio nojento. Mas agora parece muito melhor. Minha implementação não era mais útil, mas ao mesmo tempo, você sabe, eu tentei adicionar - (ininteligível) o que muitos - e parece - parece muito bom no meu computador. E então, talvez se eu tivesse mais tempo eu teria ido para o laboratório browser, e eu teria olhado, bem, como se olhar no Chrome 18 no Windows. Eu iria rolar e eu gostaria de ver - oh não! Olhe para a caixa de anúncios. Meu texto estava transbordando. Então, isso é ruim, certo? Se um usuário está usando o Chrome no Windows e vem para o meu site, que imediatamente parece muito pouco profissional. Então, eu deveria ir para o meu CSS e descobrir que parte do meu CSS está quebrando aqui. Por que não está exibindo corretamente e corrigi-lo para que todos os usuários podem ver o mesmo site e ser tão feliz. E, finalmente, também, imagens do navegador são bons para testar seu CSS, mas o que sobre o seu JavaScript? E se você tem algum script complicado que está sendo executado? Bem, você sempre pode fazer a virtualização. Se você tem um Mac, você pode usar Bootcamp ou VMWare para virtualizar talvez uma cópia do Windows e uso do Internet Explorer lá. Ou, você pode ir para algo como Spoon.net, que infelizmente só funciona em PCs. Mas o que eles fazem é muito legal. Eles virtualizar software para que você possa executar diferentes versões do IE, por exemplo. Você pode executar diferentes versões do Firefox. Você pode executar diferentes versões do Safari e testar todos os seus sites por aí. Infelizmente, eles não são livres. Esse é um serviço pago, por isso há sempre uma espécie de presente - há sempre este tipo de trade off entre, bem, eu vou fazer meu site com bom aspecto. Se sim, eu poderia ter de pagar por alguns serviços para me ajudar a fazer isso. Qualquer dúvida neste momento sobre qualquer coisa que falamos? Incrível. Okay. Agora, temos mais coisas para falar. Como sobre os erros? Como você se certificar de que o seu site vai funcionar mesmo quando algo de ruim acontece? Talvez você não tem uma página chamada food.php. Mas eu, eu vou para o seu site e tento acessar food.php. Você está indo só para me mostrar que a página em branco que diz: 404 - File not found? Ou você vai dizer: "Bem, eu sinto muito que eu não poderia encontrar isso por você, mas talvez aqui estão alguns outros recursos para ajudá-lo a procurar o que você precisa ". Outros erros - assim, isso é chamado de erros de HTTP que são apenas alguns códigos de erro que o servidor poderia ter enviado de volta para o navegador, no caso de algo ruim acontecer. 400 - Bad Request. 401 - não autorizado. 403 é uma espécie de comum quando você tem um diretório que não é suposto ser acessado pelo usuário, mas o usuário tenta de qualquer maneira. E 500 - Internal Server Error - que geralmente acontece quando você tem algo muito ruim acontecendo com o seu código PHP. Mas em qualquer caso, esses tipos de navegadores - esses tipos de erros acontecem. Então, como você se certificar de que você graciosamente lidar com esses erros e certifique-se que o usuário não é apenas uma espécie de pendurar lá? Aí vem. Htaccess. Agora,. Htaccess é algo que funciona em servidores Apache, algo que funciona e funciona em alguns outros servidores também. Esta é apenas uma maneira de você para configurar o servidor de tal forma que você pode fazê-lo fazer o que você quer que ele faça. Algumas coisas que você poderia fazer. Você pode controlar as configurações de cache. Talvez haja uma determinada página em seu site que você tenha certeza de que o usuário baixar novamente toda vez que o usuário vem e visita o seu site. Ou talvez você tenha algum URL que é como yoursite.com / teste / html / pages / hello.html e você só quer que seja yourname.com / Olá -. bem, você pode usar htaccess para redirecionar uma página para outra. Você também pode usá-lo para fazer a autenticação. Talvez existam algumas partes do seu site que você precisa para usar outra senha. Você pode bloquear determinados endereços IP, bloquear certos domínios. Talvez você só realmente não gosto de estudantes de Harvard que usam seu site. Bem, você tem a opção de bloquear todos os endereços IP de Harvard. Finalmente, você pode tratar as coisas - você pode escrever certo código para fazer o seu servidor tratar como. zhao ou. seu nome ou. páginas olá como código PHP. Talvez isso seja útil. Talvez isso não vai ser. E, finalmente, você pode usá-lo para lidar com respostas de erro. O que quero dizer com isso? Se você simplesmente adicionar um código como este - 404 ErrorDocument e, em seguida, encaminhá-los para alguns página de erro, você pode ter certeza de que o usuário não apenas vê a muito, muito feio 404 e mostrar-lhes algo de bom. Vamos realmente dar uma olhada em como podemos fazer isso com o seu Pset 7. Aqui, eu estou no meu aparelho. Eu vou abrir o Chrome, e então eu vou tentar acessar uma página que não existe no CS50 Finance. Então, host local - cats.php--lo, perceber que eu criei um documento de erro que diz: "CANZ não encontrar a página z!" Tem um gato muito triste com isso. Se você entrar no Twitter, se você for em qualquer um desses outros sites, você não consegue encontrar uma página, eles normalmente tentam mostrar uma imagem bonito de modo que você não está muito desapontado. Você também pode ter algo que é mais profissional que diz: bem, me desculpe eu não consegui encontrar a página, mas talvez aqui é uma caixa de pesquisa. Ou talvez aqui estão alguns links que irão ajudá-lo a encontrar o link que você quer. Então, como eu faço isso? Como isso é possível? Se formos para o nosso terminal aqui - Eu só vou para aproximar um pouco - notar que eu tenho uma nova página. Dentro do meu diretório HTML é chamado - você não pode vê-lo - ele é chamado error.php. E error.php é apenas um arquivo que eu fiz que mostra que a própria página. Eu posso te mostrar o que é error.php. É exatamente nesta página. Ela diz: "Oh, não! CANZ não encontrar a página z!" E, se você quiser ver - assim, perceber que tipo de htaccess é um nome estranho.. Ela começa com um ponto, o que significa que é um arquivo de sistema. É um arquivo oculto que normalmente não é mostrado. Se você fizer ls-a, você pode ver todos os arquivos escondidos em um determinado diretório, e, na verdade, você vê. htaccess é um deles. Vamos em frente e abrir htaccess. - com gedit - Boom! Tudo que eu tenho é uma linha lá - documento de erro para erros 404 que também são conhecidos como erros de arquivo não encontrado. Vamos redirecioná-los para algo chamado error.php. Você pode ter coisas divertidas como CANZ não encontrar a página z! E também há coisas muito legais que você pode fazer com ele. Htaccess. Se você quiser ver mais. Htaccess magia, este é um site muito legal para ir para - ele é chamado javascriptkit.com/howto/htaccess.shtml-- se você deseja executar mais magia do servidor. E isso pode ser muito divertido. Ufa! Tudo bem! Fotos mais bonitos. Esse é um cara que faz push-ups, e seu gato está tentando ajudar. Eu acho que é muito bonito. Infelizmente, eu não tenho um gato assim. Tudo bem. Então, nós já conversamos sobre. Htaccess. Nós conversamos sobre a manipulação de erros. Nós conversamos sobre hospedagem, nomes de domínio. Nós conversamos sobre a compatibilidade cross-browser. Agora, como podemos ter certeza de que seu site realmente executa? Como podemos ter certeza de que se eu for para o seu site Eu posso ver sua página dentro de poucos segundos? Uma das coisas que eu acho que as pessoas só tipo de esquecer é a otimização de imagem. Digamos que você queria colocar uma imagem em seu site e é 2 MG grande. Isso pode ser bom para nós, porque estamos em Harvard, e nós temos uma conexão muito rápida com a Internet. Mas imagine alguém na China. Imagine alguém na Índia. Imagine alguém talvez na zona rural de Kansas, que talvez não tenha o mesmo tipo de Internet banda larga que temos. Se você tiver uma imagem de 2 MB em seu site e que o usuário está tentando acessá-lo, que vai levá-los muito tempo para download. Então, se você não precisa de que tipo de resolução, então você pode redimensionar a sua imagem com algo como Adobe Photo Shop. Normalmente há uma opção chamada segura para web e dispositivos, eo que ele faz é ele remove todas as informações desnecessárias e tipo de compactos seu arquivo em um tamanho pequeno de imagem para que você possa colocá-lo em seu site, e qualquer usuário que tenta baixar essa página vai baixar uma versão menor de sua imagem. Se você não tiver o Adobe Photo Shop webresizer.com também é outro recurso onde você pode inserir sua imagem e ele vai cuspir a mesma imagem, mas será algo como três vezes menores. Então, isso é muito útil para os usuários. Outra coisa que você pode fazer é apoucar código. Se dermos uma olhada no Google.com, você vai ver que não é o mesmo tipo de HTML e CSS que estamos acostumados. Basta ir a olhar para o código fonte aqui. Se eu apenas rolar para baixo - uau, isso parece muito nojento. Isto iria ficar um zero em estilo. Se você codificou isso para o seu Pset, você receberá um zero no seu estilo. Isto não tem qualquer espaçamento. Os nomes parecem muito enigmática. É tudo muito nojento. E o script para fechar no corpo - o HTML fechar - eles estão todos juntos - tudo esmagado juntos. Por que eles fazem isso? Eles minificado seu código. Note-se que este documento vai ser muito menor para mim fazer o download de algo com espaço em branco, do que algo com nomes de variáveis ​​realmente longos. Se você apoucar o seu código você tira todo o espaço em branco. Claro, o seu browser não me importo se você tem qualquer espaço em branco em seu código. Você tira-lo para fora, agora eu posso fazer download de um arquivo menor - agora o arquivo - o documento que nós vamos fazer o download tem um tamanho de arquivo menor, vai ser mais rápido para me baixar, e isso é útil. Se você está trabalhando com sites e você está lançando um site, é quase sempre bom para apoucar o seu código. Outra razão pela qual pode ser bom é, talvez, você não quer que outras pessoas usem o seu código. Talvez você não quiser que outras pessoas usem o seu CSS. Você sabe que se você realmente queria ser mesquinho com isso, então você também pode apoucar o seu código, e seria mais difícil para mim para roubá-lo porque eu não tenho idéia do que está acontecendo. Você também pode ir para sites como minify.avivo.si. Serviços como este em linha ajudá-lo a apoucar o seu código para que você não tem que fazê-lo com a mão. Definitivamente não fazê-lo com a mão. Okay. Agora falando de scripts. Talvez no seu código PHP não é algo que você não precisa fazer. Talvez haja laços extras lá. Nós conversamos sobre o projeto do código CS50. Mesmo se você está programando em C, se você tem - se você estiver fazendo um trabalho extra que você não precisa fazer, bem, isso vai diminuir os seus scripts em seu site, e isso é especialmente importante para os sites, pois os usuários hoje em dia são muito impacientes. Se você estiver fazendo um trabalho desnecessário, que vai levá-los mais para obter a informação que eles querem, e eles vão ser muito infeliz. Finalmente, você pode querer otimizar suas tabelas de banco de dados. Lembre-se de que falamos índices. Eles não são bons apenas para se certificar de que você tem uma linha que é único. Eles também são bons para se certificar de que seu banco de dados funciona rapidamente. Se você quiser ler sobre que ir para a documentação MySQL, ou você pode olhar - bem, como faço para otimizar minha mesa banco de dados? Como posso ter certeza de que eu tenho os índices que me ajudam a obter as informações mais rápido? Há também pequenos truques que você pode usar como cache. Se você tiver PHP - se você tiver um blog, por exemplo, e que você tem - e ele é alimentado por PHP ou qualquer outra linguagem - você pode armazenar em cache em seu blog digamos intervalos de 50 minutos para que você possa servir páginas estáticas ou HTML estático para os visitantes do seu site. Dessa forma, os usuários não têm de executar o script PHP de cada vez, e talvez isso vai ser mais rápido para eles para acessar essa informação. E, finalmente, você pode usar algo como CDN. Observe que sempre que você baixar um Pset, você sempre vai para CDN.CS50.net. Por que isso? CS50 utiliza também como uma espécie de CDN - uma rede de distribuição de conteúdo - o que só significa que é um grupo de servidores, talvez em algum lugar ao redor do globo que ajudam a servir suas páginas para os visitantes. Se o visitante está recebendo uma página a partir de um servidor que está mais perto deles geograficamente, então provavelmente o visitante está indo para obter o arquivo muito mais rápido. Há também fontes on-line que ajudam você a fazer isso. Um deles é o CloudFlare. Eles oferecem um serviço CDN grátis. Se você tem arquivos grandes que seu servindo aos seus usuários, então talvez seja melhor colocá-los em um CDN, para que possam chegar a eles rapidamente. O tópico final para o dia é search engine optimization. O que é Search Engine Optimization? Isso é certificando-se de que os motores de busca como o Google ou Bing ou Yahoo pode ir para o seu site e indexar o seu site e indexar seu site e quando Eu, por exemplo, ir ao Google.com e tento procurar alguma coisa, em seguida, o seu site irá aparecer. Como você se certificar de que o site é um dos top 10? Porque, como todos sabemos, se você procura por algo no Google e não é no top 10 você provavelmente não vai se olhar no próximo dia 10. Este é um tipo de assunto que está envolta em mistério. Há um monte de hype lá fora, na Internet. Há uma série de superstições sobre se você x então o Google vai gostar mais de você. Se y então o Google vai gostar mais de você. Provavelmente é melhor olhar para os documentos da gigante das buscas em si. Este é um dos documentos no Google que dizer-lhe exatamente como otimizar seu site para que o Google pode acessar e indexá-lo muito bem. Você não tem que copiar para baixo esta URL porque esta apresentação vai estar on-line de qualquer maneira. Se você olhar para isso e você ler isto, existem algumas dicas muito úteis lá. O Google diz que você - se você realmente quer que seu site seja indexado bem então você deve fazer todas essas coisas. Outra coisa que os motores de busca realmente gosto é o conteúdo fresco. Se você tiver conteúdo que é actualizado com muita regularidade em seguida, os motores de busca dizer, ooh, eu gosto do seu site. Eu estou indo para ir para o seu site com muita freqüência. Vou índice muito de suas páginas. Se você tem conteúdo novo, então você tem mais chances de aparecer - você é mais provável que seja mais relevante. Você é mais provável que seja mais atualizado, e os motores de busca são mais propensos a colocar seu site acima dos outros. Profundos laços também são importantes. Se você realmente queria o seu site para olhar bem nos olhos de um motor de busca Tem um monte de outros sites ligados a ele e ligado profundamente em seu site. Não basta ligar para o seu homepage. Link para talvez yourname.com / algo / alguma coisa / something.php. Que - para um motor de busca - meio, uau, eles têm conteúdo muito interessante que alguém está ligando tão profundamente em seu site que eu deveria realmente colocar mais importância nas páginas desse site. Se você tiver títulos de página precisos, se você não tem erros que é bom, porque se um motor de busca está tentando visitar o seu site, e está recebendo um erro, provavelmente vai desistir, muito em breve. E, finalmente, você quer ter um tempo de carregamento rápido, porque os motores de busca - assim como os humanos - não têm muita paciência para sites lentos. Esta é uma maneira de você ter certeza de que você mostrar-se superior em consultas de pesquisa do motor e espero que, assim, obter mais tráfego. Porque afinal de contas, você passou todo esse tempo desenvolvendo seu website. Você passou todo esse tempo de lançar o site online. Você quer ter certeza de que você tem a abundância de usuários que realmente ver seu conteúdo. Outros bons recursos para usar. Google Webmaster Tools é algo para olhar para. Isso só ajuda a ver - Google não está indexando meu site. Que tipo de erros é que encontrar? Quantas páginas tem é indexado? O que ele acha que é o conteúdo mais importante na minha página? Talvez não seja o que eu quero que ele seja. Talvez eu precise mudar o meu site um pouco de tal forma que se reflete melhor o meu site é realmente sobre. Google Analytics é uma ferramenta muito legal. Você pode adicionar um pouco de JavaScript para suas páginas. E depois você pode ir ao Google Analytics, e ele vai rastrear sua demografia de visitantes e seu crescimento local. Ele vai lhe dizer exatamente quantas pessoas visitam seu site dentro de um determinado dia, dentro de uma determinada hora, dentro de uma determinada semana. Quantos visitantes da China? Quantos visitantes da Antártica - você está recebendo para o seu site. que poderia ser uma coisa legal para ver, ou pode até ser útil porque você está tentando atingir um determinado grupo. Talvez você esteja tentando atingir adolescentes com o seu site, e você vê que a maioria dos visitantes do seu website são talvez 30 - a idade de 40 anos, então talvez seja você tem um problema ou você pode simplesmente dizer: bem, então talvez eu deva mudar o foco do meu site para que Eu me concentro mais em que faixa etária. Google Apps - se você queria ter uma espécie de e-mails com seu nome de domínio - Talvez algo como yourname@yourname.com-- você pode usar endereços do Gmail - você pode usar o serviço gmail e Google Apps é uma maneira de fazer isso. Você pode configurar endereços de e-mail específicas que são específicos para o seu nome de domínio em vez of@gmail.com. E, finalmente, há extensões desenvolvedor web e add-ons para o Chrome -, para o Firefox, para outros navegadores - que lhe permitem entrar e inspecionar CSS, JavaScript inspecionar, ver exatamente o que há de errado com o seu script JavaScript, e talvez isso vai ser útil para os seus propósitos de-escutas, para você descobrir - bem, porque não é o meu site exibindo corretamente neste browser? E, finalmente, se você quiser saber mais sobre todos estes temas - se você quiser saber mais sobre HTML e CSS e JavaScript - porque afinal de contas, só lhe ensinou um pouco - você pode ir em sites como W3Schools.com para procurar mais recursos. Eles têm muito bons tutoriais sobre como eu faço x, y ou o que quer dizer? Se você quiser aprender mais sobre línguas, você pode simplesmente ir aqui. Tudo bem. Eu acho que eu queria deixar os últimos minutos deste para perguntas, também há dúvidas sobre tudo o que falamos? [Membro da audiência] Que tipo de coisas estão no W3Schools e como ele é coberto? [Yuechen Zhao] Que tipo de coisas? Então, um dos muito maiores coisas que eu uso muito é as suas referências. Seus detalhes de referências, por exemplo, para CSS - o que isso significa ou se você queria mudar o fundo de uma página - como você faz isso? Que navegadores suportam esse comando? Coisas assim. E então eles também só tem muito agradáveis ​​tutoriais sobre HTML, em PHP, em JavaScript, em MySQL, em todos os tipos de diferentes temas. Eles têm bons tutoriais. Eles ensinam como fazer as coisas. É bom ser capaz de ir e aprender mais sobre estes temas. [Membro da audiência] HTML 5 ainda não é compatível com todos os navegadores lá fora. Você recomendaria apenas ficar longe dela por causa de problemas de compatibilidade? Como você lida com isso? [Yuechen Zhao] Sim, por isso, a questão é HTML5 ainda é um padrão de bebê. Não é realmente apoiado por um grande número de navegadores, por isso devemos evitá-lo? Eu acho que no ano passado eu teria sido um grande defensor da, vamos evitar HTML5 porque ainda é - ainda é muito novo e, de fato, o padrão HTML5 ainda não foi finalizado. E assim, não há realmente nenhum padrão HTML5. Mas eu acho que, especialmente se você está projetando um site agora, talvez seja melhor se você ir apenas com HTML5, porque isso é uma espécie de vai ser o futuro, e se você quiser que seu site seja à prova de futuro e você quer que seu site para trabalhar em browsers futuros, pode ser melhor para começar a construir algo para o futuro do que para o passado, e também apenas devido ao fato de que o HTML5 realmente não é muito diferente de HTML4 ou XHTML. Se você estiver usando HTML5, que normalmente funciona na maioria dos navegadores. Você só tem a sorte de ir e certifique-se com estas imagens e certificando-se de ir para esses sites mesmo. Mas, muito provavelmente ele vai funcionar a menos que você estiver usando características muito específicas para HTML5. Repare também que para CS50 - por exemplo, para o reprodutor de vídeo que usamos - ele usa HTML5 e HTML5 vídeo para exibir as palestras. Mas se você tem um navegador muito antigo, então ele vai cair para trás em Flash. Então, isso também é outra coisa - ter um sistema de fall-back para quando você só sabe que o navegador não está indo para lidar com o que você quer para segurar. Outras perguntas? Tudo o que falamos. Tudo bem. Então eu acho que isso é tudo para mim. Eu acho que é isso. (Aplausos) Legal. [CS50.TV]