[Powered by Google Translate] [Séminaire] [Préparation de votre site pour le Web] [Yuechen Zhao] [Université de Harvard] [C'est CS50.] [CS50.TV] 

Okay. Voici une autre heure du développement web si vous les gars sont prêts pour cela. Aujourd'hui, je vais parler de la préparation de votre site pour le Web. Toute la journée - et probablement pour les 2 dernières semaines - nous avons parlé de la façon de créer un site web, Comment utiliser le HTML, comment utiliser PHP, comment utiliser les cadres, Comment assurez-vous que vous pouvez interagir avec la base de données - des choses comme ça. Mais aujourd'hui, nous allons parler de là où votre site va vivre après CS50. Parce qu'après tout, CS50 n'arrive pas passé Décembre. Nous allons parler de noms de domaine, hébergement. Nous allons parler de ce que la compatibilité cross-browser et la compatibilité multi-plateforme, et comment vous pouvez vous assurer que votre site va fonctionner dans toutes les conditions. Nous parlerons de la gestion des erreurs et d'autres magie du serveur. Nous parlons d'optimisation des performances, l'optimisation des moteurs de recherche, et comment amener les gens à réellement visiter vos sites Web. Et enfin, juste quelques bonnes ressources pour vous assurer que vous les gars ont assez de ceux de partir avec votre projet final, et j'espère après. 

La première chose que nous allons parler est des noms de domaine. En ce moment vous programmez dans votre appareil, vous allez à un hôte local ce qui n'est pas réellement un nom de domaine. C'est en quelque sorte juste un surnom ou un pseudonyme pour votre installation réelle Linux à l'intérieur de chaque VMware sur un lecteur Mac ou VMware sur un PC. Les noms de domaine vous permettent de mettre un site sur le Web, puis allez à quelque chose comme www.google.com et obtenir le site. Comment fonctionnent-ils? Disons que vous êtes juste un serveur Web moyenne - moyenne internaute et vous avez un ordinateur portable, et vous allez à www.howstuffworks.com. Vous pouvez probablement voir où j'ai volé ce à partir. Comment la substance fonctionne - votre ordinateur va alors demander à un serveur DNS local, "Savez-vous où ce site est?" «Connaissez-vous l'adresse IP de www.howstuffworks.com?" Votre serveur DNS pourrait dire: «Oui, je le fais." Dans ce cas, vous obtenez l'adresse IP et votre ordinateur accède à cette adresse IP. Si ce n'est pas, il demande à un autre serveur DNS, "Hey! Savez-vous ce www.howstuffworks.com est?" Ce serveur peut dire: «Oui, je le fais." Alors, il dit l'autre ce qu'il est, et enfin, que l'information est transmis à votre ordinateur, et vous pouvez accéder howstuffworks.com. 

Comment pouvez-vous obtenir un de ces choses magiques? Comment pouvez-vous peut-être www.yourname.com ou www.ilovecats.com? Vous pouvez vous inscrire pour l'un, et il ya beaucoup de sites là-bas qui vous permettent de le faire. Vous devez - dans la plupart des cas, vous devez payer pour eux. Il ya certains noms de domaine qui sont libres. Si vous allez à tkdomainnames www.co.cc ou., Ceux qui sont libres. Mais, ils viennent avec certaines restrictions, et en fait, certains d'entre eux pourraient même ne pas être , les noms de domaine de premier niveau réel comme. com ou. net. Normalement, je suggère d'aller à l'un d'eux parce que les utilisateurs sont tout simplement plus à l'aise avec celles-ci. Vous avez vu beaucoup de. Coms. Vous avez vu beaucoup de filets.. Vous n'avez probablement pas vu beaucoup de s '. Co.cc, ils sont donc plus difficiles à retenir. Différents sites comme Godaddy ou NameCheap ou - j'ai utilisé celui qui est assez rudimentaires - disant activedomain.com. On dirait vraiment rudimentaire, mais ça a très bien fonctionné pour moi. 

Et enfin, vous avez d'autres qui n'ont peut-être plus de publicité comme Network Solutions. Mais si vous allez sur NetworkSolutions.com et regardez leur prix il est vraiment trop cher. Je les regardais hier soir. Pendant un an, d'un nom de domaine, c'est probablement pas la peine que beaucoup d'argent. En fait, si vous obtenez un. Com ou un. Org ou. Net le prix habituel est d'environ 10 $ par année. Donc, si vous payez beaucoup plus que cela, il n'est probablement pas ce que ça vaut le coup car, après tout, ces sites ne font rien à ce nom de domaine. Elles me donnent à vous, et si vous pouvez l'obtenir pour pas cher, pourquoi pas? 

L'autre chose est que une fois que vous avez votre nom de domaine, alors vous voudrez probablement aller à soit Godaddy.com ou partout où vous avez acheté votre nom de domaine et définir les serveurs de noms pour ce nom de domaine. Qu'est-ce que cela signifie est une fois qu'un utilisateur se rend à www.howstuffworks.com, les adresses IP des serveurs de noms sont les adresses IP qu'ils seraient en mesure de regarder vers le haut. Ils seraient en mesure d'accéder à votre site web à travers les serveurs de noms. Si vous postulez pour accueillir quelque part alors votre hôte sera très probablement vous donner les serveurs de noms à utiliser. 

Et enfin, il ya ce qu'on appelle un WHOIS. Une base de données WHOIS est une base de données avec laquelle vous pouvez saisir un nom de domaine et il va cracher quelques informations sur le propriétaire de ce site et d'autres informations de contact. Maintenant, vous pouvez dire: «Je ne veux pas vraiment mon domicile ou je ne veux pas vraiment mon adresse email sur le site web pour quiconque de voir ou sur Internet pour tout le monde à voir ". Ensuite, vous pouvez utiliser quelque chose que beaucoup de services d'hébergement de fournir - comme un gestionnaire WHOIS. Un gestionnaire WHOIS est tout simplement un autre service que beaucoup d'entre eux prévoient que se cache cette information et met juste à qui est responsable pour le nom - pour l'adresse, il est généralement juste que nom de la société qui vous a donné ce nom de domaine - et ainsi, vos informations personnelles ne sont pas l'objet de fuites sur Internet, qui est généralement assez bon. J'utilise moi-même un de ces services. Si vous ne vous souciez pas de votre propre vie privée alors il n'a pas vraiment d'importance. 

Un serveur DNS est synonyme de système de noms de domaine, et ce qu'elle est - c'est un peu comme un endroit de table de hachage qui dit:  "Cette adresse de site va correspondre à cette adresse IP." Et c'est tout ce qu'il est. Donc une fois que vous interrogez ce serveur DNS, alors vous pouvez obtenir les adresses IP pour ce nom de domaine correspondant, puis visiter ce site. (Membre de l'auditoire de poser une question - inaudible) La première? Le premier niveau est en fait généralement juste le cache de votre ordinateur lui-même. Votre ordinateur sorte de se souvient de la dernière fois que vous êtes allé à www.google.com c'est à cette adresse IP, puis après un certain temps, que cache expire, et il vous sera demandé comme le DNS Comcast, "Hey, qu'est-ce www.google.com?" Normalement, lorsque vous achetez un nom de domaine et vous vous inscrivez, et vous configurez un site Web, vous ne pouvez pas aller à ce site immédiatement avec ce nom de domaine, car les serveurs de noms à travers le monde ne connaissent pas votre nom de domaine pour le moment. Il doit remplir. Cela prend habituellement environ 24-48 heures. Très bien. Donc, c'est un peu de noms de domaine. Ils sont très cool. Je pense que vous devriez obtenir un si vous êtes sérieux au sujet du projet et si vous voulez vraiment faire de votre projet connu à travers le campus, avoir un nom de domaine lui donne une apparence très professionnelle. 

Alors la prochaine étape, bien sûr, est d'avoir une sorte d'hébergement. Si vous venez de l'héberger sur votre ordinateur, personne ne va jamais pouvoir y aller. Vous pourriez éventuellement configurer un serveur sur votre ordinateur et de garder votre ordinateur à l'infini, Mais ce n'est pas recommandé. Il existe différents types d'hébergement disponibles en ligne. Il ya l'hébergement mutualisé. Il ya VPN (inintelligible), qui sont des hôtes virtuels. Il ya semi-dédié et dévoué. Sur les 3 derniers, VPN, semi-dédié et dévoué sont généralement plus chers. Ils sont généralement utilisés pour les sites qui nécessitent plus de ressources. Si vous êtes débutant avec un site web, c'est peut-être plus économique de passer à l'hébergement mutualisé. Et quels moyens partagé est juste un tas de sites sont tous ensemble trier sur un seul serveur sur ce site sur ce serveur hôte, et vous pouvez accéder à votre site Web par l'intermédiaire de nom de domaine. 

Il ya beaucoup de sites très connus là-bas. HostGator et DreamHost - ceux-ci sont très, très grand et très, très populaire et très, très réussie. Personnellement, j'utilise un appelé MDDHosting. Si vous allez à www.mddhosting.com, c'est mon hôte de choix. Je pense qu'ils sont très bons. Ils ont toujours été très fiable, et je n'ai jamais eu de problèmes avec eux. Ils ont aussi des prix très compétitifs. Deux que je n'aime pas vraiment sont GoDaddy - c'est aussi une foule très populaire, mais j'ai eu des expériences terribles avec eux, et beaucoup de gens que je connais ont eu des expériences terribles vraiment avec eux. Ils sorte de poursuivre les gens qui ne savent pas ce qu'ils font - peut-être vous faire un site web pour la première fois, et ils sorte de Con eux dans l'achat de leur pack d'hébergement. Ne pas le faire. Ne tombez pas pour elle. Aller chercher d'autres formules d'hébergement qui correspondent vraiment à vos besoins. Et l'autre est - il existe des hébergeurs gratuits là-bas. Il ya des sites qui accueilleront votre site web gratuitement - parfois en mettant une annonce sur votre site, parfois en vous faisant participer à leurs forums, mais parfois juste aussi gratuitement. Mais, soyez prudent avec les hébergeurs gratuits parce que beaucoup d'entre eux vraiment juste de sortir de l'entreprise après quelques mois. Vous ne pouvez pas suivre les coûts. D'autres sont tout simplement très peu fiable, et votre site sera toujours en baisse, et vous ne voulez pas que cela se produise. 

Chaque hôte offrir leur propre panneau de contrôle. Notez que pour votre appareil, il n'est vraiment pas un panneau de contrôle en soi. Vous devez utiliser la borne d'aller et de modifier les fichiers. Vous devez chmod choses par vous-même. Si vous vouliez aller à PHPMyAdmin, vous devez aller à localhost @ / phpmyadmin et des choses comme ça. Mais avec un panneau de contrôle, vous pouvez entrer et modifier les fichiers sur votre serveur avec l'Explorateur de Windows ou une application finder type. Ou vous pouvez passer et regarder vos bases de données avec leur propre outil au lieu de phpMyAdmin. Donc, il ya beaucoup de choix ici, et quelques-uns des panneaux de contrôle plus populaires sont là-haut. Mais si vous cherchez un hôte, alors vous voudrez peut-être regarder quelles sortes de personnalisations et des options ils offrent j'adapte mon serveur et de faire mon site web fonctionnera mieux. Ainsi, alors vous pourriez demander: «Eh bien, comment puis-je choisir l'hébergement?" Si vous allez sur n'importe quel site Web hôte, il ya beaucoup de jargon, et il ya beaucoup d'options. Il ya beaucoup de différents prix aussi. Normalement, je vais les moins chers simplement parce que les sites Web qui peut-être vous et moi font - et surtout en ce moment, d'autant que commencer - ils ne peuvent pas besoin d'autant de ressources Comme on pouvait un site comme Microsoft.com. 

D'abord, vous voulez regarder le système d'exploitation si vous êtes vraiment curieux de savoir si votre site va être hébergé sur Linux, sur Windows ou sur Mac. Normalement, nous allons juste avec Linux parce que c'est généralement le moins cher, et aussi celui qui peut-être vous les gars connaissent mieux parce que de l'appareil. Et puis, peut-être qu'ils vont mettre certaines restrictions sur la quantité de bande passante que vous obtenez - comme le nombre de méga-octets ou giga-octets de données utilisateurs peuvent télécharger à partir de votre site Web par mois? Ou l'espace disque. Combien d'espace que vous obtenez? Est-il 500 Mo? Est-ce 2 Go? Est-il illimité? Aujourd'hui, beaucoup de serveurs Web vous donne un espace disque illimité comme un moyen pour eux pour vous inciter à obtenir leur pack d'hébergement. Mais si vous pensez vraiment cela, quand vas-tu avoir besoin d'un espace disque illimité? Si vous avez un couple de fichiers HTML, un couple de PHP, un couple d'images - ce n'est que quelques mégaoctets, etc d'habitude je vais juste pour la valeur de l'espace peut-être quelques gigaoctets d', et cela pourrait être suffisant pour moi de commencer jusqu'à ce que j'ai besoin de plus. 

Enfin, elles peuvent imposer des restrictions sur le type de - combien de bases de données que vous pouvez avoir. Peut-être que vous ne pouvez avoir 1 base de données. Peut-être que vous pouvez avoir 2. Peut-être que vous pouvez avoir 10. Est-il vraiment important pour vous combien vous aller? Choses à vous poser. Et puis finalement, juste des choses comme les langues. Ils soutenir PHP? Ils soutenir MySQL? La plupart des sites d'hébergement ne supportent eux, car ils sont libres. Ils sont open source. Il ne leur coûte rien de les fournir pour vous. Mais si vous voulez utiliser, par exemple, Ruby ou Python ou partie de ces autres langues - ils ne peuvent pas appuyer sur leur serveur, il est donc important de rechercher ce genre de choses. 

Et enfin, ils vous permettent de faire des choses plus avancées comme les emplois SSL ou cron? SSL est une option où vous pouvez rendre votre site plus sûr en le faisant HTTPS et crypter vos connexions. Et les tâches cron sont juste peut-être scripts que vous souhaitez exécuter toutes les 5 minutes, toutes les 10 minutes, toutes les 15. Beaucoup de sites d'hébergement mutualisé ne pose aucune restriction sur le nombre de tâches cron que vous pouvez exécuter parce que cela prend plus de ressources. 

Et enfin, juste tout ce que vous voulez regarder - assurez-vous exactement ce qui se passe avant d'acheter votre pack d'hébergement. Et enfin, la performance. La performance est énorme. Combien de temps mon site va fonctionner? La plupart des utilisateurs ne vont pas attendre voire quelques secondes pour votre site web pour exécuter avant qu'ils ne s'ennuient pas juste, et ils vont à MeanBase et commencent à regarder des photos des chats - vous savez ce qui se passe, et vous voulez vous assurer que vous obtenez ce que l'utilisateur à bord et que vous avez une bonne disponibilité qui signifie simplement que votre site va être accessible en tout temps. Beaucoup d'hôtes ont vraiment mauvaise disponibilité et cela signifie simplement que votre site ne va pas être accessible, et vous ne voulez pas que cela se produise, car vous pourriez être triste. Et vous pouvez également suivre les performances de votre machine avec des sites comme Pingdom.com ou Host-tracker.com, et ils ont juste vous dire combien de fois votre site est en panne. 

Et enfin, vous voulez voir sur leur support. Si vous avez un problème vont-ils vous répondre dans les 24 heures? Vont-ils pour vous répondre dans les 48 heures? Le service d'hébergement que j'utilise normalement me répond en quelques minutes ce qui est vraiment agréable. Whew! Très bien! Il est temps pour une pause. Mais je ne vais pas vous le donner. Nous allons simplement regarder des photos de chats mignons de temps en temps. 

Un autre vraiment, vraiment important, c'est la compatibilité cross-browser. Qu'est-ce que je veux dire par la compatibilité cross-browser? Vous savez, aujourd'hui, ce n'est pas seulement Microsoft Internet Explorer. Ce n'est pas seulement Mozilla Firefox ou Safari. Maintenant, nous avons Chrome. Nous avons Opéra. Nous avons Dolphin. Nous avons Camino. Nous avons Conquérant. Nous avons tous de ces différents navigateurs. Les choses qui sortent aujourd'hui - RockMelt - même si ceux-ci sont tous à base de chrome. Mais le fait de la question est, il n'est pas seulement un navigateur plus. Vous n'êtes pas la seule visualisation de ces pages avec une seule application. Et donc, les différents navigateurs vont répondre à différents HTML, CSS différente, et JavaScript différent différemment, et comment réagissez-vous à cela? Eh bien, dans certains cas, vous ne pouvez pas vraiment. Votre site - s'il fonctionne dans un navigateur, le code que vous avez écrit ne fonctionnera pas dans un autre navigateur, et il est de votre devoir de faire en sorte que le code que vous écrivez est universel, qu'il fonctionne partout. Donc, c'est vraiment dangereux. Si vous dites: «Eh bien, ça marche sur mon ordinateur. Great! Passons." Eh bien, il ne va probablement pas à travailler sur moi, et quand je vais à votre site Web Je vais être très triste, et je vais partir tout de suite. Donc, nous allons voir comment vous pouvez éviter cela. 

La première chose, bien sûr, est de n'utiliser que des standards HTML, CSS et JavaScript. Qu'est-ce que je veux dire par là? Eh bien, il ya beaucoup de choses non-standard là-bas. Par exemple, dans CSS il ya beaucoup de versions. Si vous constatez des règles CSS avec-moz-ou-webkit-, ces règles sont spécifiques à la fois les navigateurs Mozilla et les navigateurs Webkit, et si vous voulez vous assurer que peut-être vous voulez éviter ces choses parce que si vous utilisez-moz-ce que la règle va seulement travailler sur Firefox. Et si vous voulez vraiment faire bonne impression sur Internet Explorer aussi, vous allez être hors de la chance. Pour le HTML aussi, vous pouvez faire des choses en HTML qui fonctionnent dans un navigateur mais que les pauses dans un autre, et que vous voulez éviter cela autant que possible. Et enfin pour JavaScript même - il existe de nombreuses versions de JavaScript, et cet été, nous avons rencontré un problème où document.getElementsByClassName-- qui est généralement une fonction qui est définie comme une partie de la norme JavaScript - n'était pas à trouver dans Internet Explorer 8. Ainsi, au cours de l'été, je travaillais dans un laboratoire et que nous construisions des expériences en ligne. Et nous avons pensé qu'il travaillait très bien jusqu'à ce que nous avons réalisé les utilisateurs qui utilisaient Internet Explorer 8 ne pouvait pas soumettre leurs résultats. Nous étions à côté d'une grande quantité de données. Cela nous a vraiment triste. Alors, vous voulez toujours vous assurer que vos scripts vont travailler partout. 

Et enfin, utiliser validator.w3.org qui est ce que nous vous disons de faire en pset 7. Assurez-vous que vos pages sont validées. C'est important parce que c'est au moins un premier test de cohérence de l'étape. Est-ce réellement mon code conforme aux standards? Une autre façon de trier de vous aider à vous assurer que votre site va travailler dans la plupart des cas est de voir de quelques frameworks et des bibliothèques parce que ces développeurs vraiment intelligents ont réfléchi à ces questions pour vous. Ils ont vécu et ils ont écrit des fonctions différentes qui fonctionnent sur les navigateurs. Par exemple, nous utilisons jQuery dans Pset 7. Même si vous n'avez pas vu, jQuery fournit un grand nombre de fonctions qui, autrement, vous auriez à vous écrire. Mais ces développeurs ont écrit, et ils ont fait en sorte que cela fonctionne sur tous les navigateurs. Et Bootstrap - ce qui est un autre framework CSS que nous vous avons montré dans Pset 7 - il faut vraiment loin beaucoup des maux de tête avec conception de sites Web qui semblent bonnes. dans tous les navigateurs. 

Et enfin, si vous pouvez l'éviter, j'évite généralement de codage à partir de zéro. Si vous êtes juste de créer un site Internet pour votre club de l'école, par exemple, et tout ce que vous devez faire est d'afficher quelques pages et peut-être avoir votre président va en et changer quelques petites choses ici et là - il n'y a vraiment aucun besoin de coder que vous-même. Cela prend beaucoup de votre temps. Il prend beaucoup de votre énergie, et vous devez passer et vous devez le savoir, Eh bien, ça va bien paraître dans votre navigateur, cela va bien paraître dans votre navigateur. Peut-être utiliser certaines de ces taches que d'autres ont déjà écrit pour vous, comme WordPress ou Joomla ou Drupal. Elles sont appelées contenu - ceux-ci sont appelés CMS qui, fondamentalement, ne sont que les paquets qui venez déjà fait pour vous, et vous pouvez les télécharger, les mettre sur votre serveur, et les personnaliser comme vous le voulez, et vous avez déjà un site en cours d'exécution. Ces paquets de code sont quelque chose à regarder dans. Ces choses sont open source, sauf si vous optez pour quelque chose comme - Si vous êtes à la recherche d'un paquet de forme, il ya des choses qui ne sont pas libres comme VBulletin ou IP.Board. Si vous n'avez pas besoin de certaines de ces fonctionnalités avancées, vous pouvez toujours opter pour l'option gratuite. 

Et enfin, il peut pas être évité. Vous devez tester, tester, tester. Vous devez tester votre code sur tous ces navigateurs et sur toutes ces plates-formes. Et vous savez, IE6 - les gens de Dieu merci ont commencé à s'éloigner de IE6 car à l'époque, peut-être il ya quelques années, les développeurs web devaient toujours, toujours, toujours flatter les faiblesses de IE6 à suivre les normes. Sites Web juste regardé genre de 1990, faute d'un meilleur moyen de traiter avec elle. Vous pouvez également utiliser captures d'écran du navigateur pour vérifier votre CSS. Un site vraiment cool, c'est browserlab.adobe.com. C'est un service gratuit lancé par Adobe. Et ce qu'ils font, c'est qu'ils peuvent prendre captures d'écran de votre site web fonctionnement dans des conditions différentes - comme fonctionnant sous différents navigateurs, fonctionnant sous différentes plates-formes - et vous montrer à quoi ils ressemblent. Juste pour vous montrer ce que je veux dire ici, j'ai créé un site Web appelé l'an dernier la vie à Harvard, et ce que j'ai essayé de faire - j'ai essayé de faire my.harvard mieux. Parce que si vous étiez ici l'année dernière, my.harvard n'avait pas l'air comme il ressemble maintenant. Il ressemble un peu dégoûtant. Mais maintenant, il ressemble beaucoup mieux. Ma mise en œuvre n'était pas plus utile, mais tout de même, vous le savez, j'ai essayé d'ajouter - (inintelligible) de tout - et il semble - il semble très bon sur mon ordinateur. Et puis, peut-être que si j'avais eu plus de temps, j'aurais continué à laboratoire de navigateur, et j'aurais regardé, eh bien, comment ça ressemble à Chrome 18 sur Windows. Je voudrais faire défiler vers le bas et je voudrais voir - oh non! Regardez la boîte annonces. Mon texte a été débordante. Donc, c'est mal, non? Si un utilisateur utilise Chrome sur Windows et vient sur mon site, qui ressemble immédiatement très professionnel. Donc, je devrais aller dans mon CSS et savoir quelle partie de mon CSS se lève ici. Pourquoi n'est-ce pas s'affiche pas correctement et le fixer de sorte que tous les utilisateurs peuvent voir le même site et tout aussi heureux. 

Et enfin, bien, captures d'écran du navigateur sont agréables pour tester votre CSS, mais qu'en est-il votre JavaScript? Qu'en est-il si vous avez un script complexe qui est en cours d'exécution? Eh bien, vous pouvez toujours faire la virtualisation. Si vous avez un Mac, vous pouvez utiliser Bootcamp ou VMWare pour virtualiser peut-être une copie de Windows et l'utilisation d'Internet Explorer il. Ou, vous pouvez passer à quelque chose comme Spoon.net, qui, malheureusement, ne fonctionne que sur PC. Mais qu'est-ce qu'ils font est très cool. Ils virtualiser logiciel pour vous afin que vous pouvez exécuter différentes versions de IE, par exemple. Vous pouvez exécuter différentes versions de Firefox. Vous pouvez exécuter différentes versions de Safari et de tester l'ensemble de vos sites là. Malheureusement, ils ne sont pas libres. C'est un service payant, alors il ya toujours cette sorte de - il ya toujours cette sorte de compromis entre, eh bien, je vais faire mon site web bien paraître. Si c'est le cas, je pourrais avoir à payer pour certains services pour m'aider à faire cela. Vous avez des questions sur ce point à propos de quelque chose dont nous avons parlé? Impressionnant. Okay. 

Maintenant, nous avons plus de choses à raconter. Que diriez-vous des erreurs? Comment vous assurez-vous que votre site va fonctionner même lorsque quelque chose se passe mal? Peut-être que vous n'avez pas une page nommée food.php. Mais moi, je vais vers votre site et j'essaie d'accéder food.php. Allez-vous juste pour me montrer que la page blanche qui dit: 404 - Fichier introuvable? Ou allez-vous dire: «Eh bien, je suis désolé que je ne pouvais pas trouver cela pour vous, mais peut-être, voici quelques autres ressources pour vous aider à rechercher ce dont vous avez besoin ". D'autres erreurs - oui, c'est ce qu'on appelle des erreurs HTTP qui sont quelques-unes des codes d'erreur que votre serveur peut-être envoyé au navigateur en cas de quelque chose de mauvais se produise. 400 - Bad Request. 401 - Non autorisé. 403 est une sorte de courant quand vous avez un répertoire qui n'est pas censé être consultée par l'utilisateur, mais l'utilisateur tente de toute façon. Et 500 - Internal Server Error - qui se produit généralement lorsque vous avez quelque chose très mauvaise passe avec votre code PHP. Mais en tout cas, ces sortes de navigateurs - ces sortes d'erreurs ne se produisent. 

Alors, comment vous assurez-vous que vous gérez gracieusement ces erreurs et assurez-vous que l'utilisateur n'est pas juste une sorte de là pendaison? Here comes. Htaccess. Maintenant,. Htaccess est quelque chose qui fonctionne sur des serveurs Apache, quelque chose qui fonctionne et travaille sur quelques autres serveurs aussi. C'est juste une façon pour vous de configurer votre serveur de telle sorte que vous pouvez lui faire faire ce que vous voulez qu'il fasse. Certaines choses que vous pourriez faire. Vous pouvez contrôler vos paramètres de cache. Peut-être il ya une certaine page sur votre site que vous vous assurez que l'utilisateur re-télécharger à chaque fois que l'utilisateur vient visiter votre site web. Ou peut-être vous avez une URL qui est comme yoursite.com / test / html / pages / hello.html et vous voulez juste que pour être yourname.com / bonjour -. bien, vous pouvez utiliser htaccess pour rediriger une page à l'autre. Vous pouvez également l'utiliser pour effectuer une authentification. Peut-être qu'il ya certaines parties de votre site Web que vous avez besoin d'utiliser un autre mot de passe. Vous pouvez bloquer certaines adresses IP, de bloquer certains domaines. Peut-être vous vraiment n'aimez pas les étudiants de Harvard à l'aide de votre site web. Eh bien, vous avez la possibilité de bloquer toutes les adresses IP de Harvard. 

Enfin, vous pouvez traiter les choses - vous pouvez écrire certain code pour faire de votre serveur traiter comme. zhao ou. votre nom ou. pages hello que le code PHP. Peut-être que ce sera utile. Peut-être que ce ne sera pas. Et enfin, vous pouvez l'utiliser pour gérer les réponses d'erreur. Qu'est-ce que je veux dire par là? Si vous ajoutez simplement le code comme ceci - ErrorDocument 404, puis de les diriger dans une certaine page d'erreur, vous pouvez faire en sorte que l'utilisateur n'a pas seulement voir le vraiment, vraiment laid 404 et leur montrer quelque chose de gentil. 

Nous allons effectivement jeter un oeil à la façon dont nous pouvons faire cela avec votre Pset 7. Ici, je suis dans mon appareil. Je vais ouvrir Chrome, et puis je vais essayer d'accéder à une page qui n'existe pas sur CS50 Finances. Ainsi, l'hôte local - cats.php--so, notez que j'ai créé un document d'erreur qui dit: «Canz pas trouvé la page z!" Il a une très triste chat sur elle. Si vous allez sur Twitter, si vous allez sur un de ces autres sites, vous ne pouvez pas trouver une page, ils essaient généralement de vous montrer une image mignonne de sorte que vous n'êtes pas trop déçu. Vous pourriez aussi avoir quelque chose de plus professionnel qui dit, Eh bien, je suis désolé, je ne pouvais pas trouver la page, mais peut-être que c'est ici une zone de recherche. Ou peut-être, voici quelques liens qui vous aideront à trouver le lien que vous voulez. Alors, comment ai-je fait cela? Comment est-ce possible? Si nous allons dans notre terminal ici - Je vais juste pour zoomer un peu - remarquerez que j'ai une nouvelle page. Intérieur de mon répertoire HTML ça s'appelle - vous ne pouvez pas voir - ça s'appelle error.php. Et error.php est juste un fichier que j'ai fait qui vous montre que la page elle-même. Je peux vous montrer ce que error.php est. C'est exactement sur cette page. Il dit: «Oh non! Canz pas trouvé la page z!" Et, si vous voulez voir - si, notez que htaccess sorte de est un nom bizarre.. Il commence par un point ce qui signifie que c'est un fichier système. Il s'agit d'un fichier caché qui n'est normalement pas montré. Si vous faites ls-a, vous pouvez voir tous les fichiers cachés dans un certain répertoire, et en effet, vous voyez. htaccess est l'un d'entre eux. Allons-y et ouvrez htaccess. - avec gedit - Boom! Tout ce que j'ai est une ligne là-dedans - Document d'erreur pour les erreurs 404 qui sont également connus comme les erreurs de fichier non-trouvé. Voyons les rediriger vers quelque chose qui s'appelle error.php. Vous pouvez avoir des choses amusantes comme CANZ pas trouvé la page z! Et il ya aussi des choses très cool que vous pouvez faire avec. Htaccess. Si vous voulez en voir plus. Htaccess magie, il s'agit d'un site très cool pour aller à - ça s'appelle javascriptkit.com/howto/htaccess.shtml-- si vous voulez effectuer plus magique du serveur. Et cela pourrait être très amusant. 

Whew! Très bien! Plus de photos mignonnes. C'est un gars faisant push-ups, et son chat essaie d'aider. Je pense qu'il est très mignon. Malheureusement, je n'ai pas un chat comme ça. Très bien. Donc, nous avons parlé. Htaccess. Nous avons parlé de la gestion des erreurs. Nous avons parlé de l'hébergement, noms de domaine. Nous avons parlé de la compatibilité cross-browser. Maintenant, comment pouvons-nous nous assurons que votre site fonctionne réellement? Comment nous assurons-nous que si je vais à votre site Web Je peux voir ta page en quelques secondes? Une des choses que je pense que les gens juste une sorte de oublient est l'optimisation de l'image. Disons que vous vouliez mettre une image sur votre site et c'est 2 MG large. C'est peut-être bien pour nous parce que nous sommes à Harvard, et nous avons une connexion Internet très rapide. Mais imaginez quelqu'un en Chine. Imaginez quelqu'un en Inde. Imaginez que quelqu'un peut-être en milieu rural Kansas qui peut-être n'a pas le même genre de Internet à large bande que nous avons. Si vous avez une image de 2 Mo sur votre site et l'utilisateur tente d'y accéder, ça va prendre un temps très long à télécharger. Donc, si vous n'avez pas besoin de ce genre de résolution, alors vous pouvez redimensionner votre image avec quelque chose comme Adobe Photo Shop. Il ya habituellement une option appelée sécurité pour le Web et les périphériques, et ce qu'il fait est qu'il enlève à toute l'information nécessaire et une sorte de pactes votre fichier dans une petite taille de l'image afin que vous puissiez mettre sur votre site web, et tout utilisateur qui essaie de télécharger cette page qui va se télécharger une version réduite de votre image. Si vous n'avez pas Adobe Photo Shop webresizer.com est également une autre ressource où vous pouvez entrer votre image et il va cracher la même image, mais ce sera quelque chose comme 3 fois plus petites. C'est donc très utile pour vos utilisateurs. 

Une autre chose que vous pouvez faire est de rapetisser code. Si nous prenons un coup d'œil à Google.com, vous verrez que ce n'est pas la même sorte de HTML et CSS que nous sommes habitués. Je vais juste regarder le code source ici. Si je fais défiler juste en bas - wow, qui semble assez dégoûtant. Ce serait faire un zéro sur le style. Si vous avez codé ceci pour votre Pset, vous obtiendrez un zéro à votre style. Cela n'a pas d'espacement. Les noms regardent vraiment énigmatique. Tout est vraiment dégoûtant. Et le script de fermer dans le corps - le code HTML de fermeture - ils sont tous ensemble - tout smushed ensemble. Pourquoi font-ils cela? Ils minified leur code. Notez que ce document va être beaucoup plus petit pour moi que pour télécharger quelque chose avec l'espace blanc, que quelque chose avec des noms très longs variables. Si vous rapetisser votre code on enlève tout l'espace blanc. Bien sûr, votre navigateur ne m'inquiète pas si vous avez un espace blanc dans votre code. Vous dépouillez-le, maintenant je peux télécharger un fichier plus petit - maintenant le fichier - le document que nous allons télécharger a une taille de fichier réduite, il sera plus rapide pour moi de téléchargement, et c'est utile. Si vous travaillez avec des sites Web et vous lancez un site web, il est presque toujours bon de rapetisser votre code. Une autre raison pour laquelle il pourrait être bon est peut-être que vous ne voulez pas que les autres utilisent votre code. Peut-être que vous ne voulez pas que les autres à utiliser votre CSS. Vous savez, si vous vouliez vraiment être avare avec qui, alors vous pouvez aussi rapetisser votre code, et il serait difficile pour moi de le voler parce que je n'ai aucune idée de ce qui se passe. Vous pouvez également accéder à des sites comme minify.avivo.si. Des services comme cette ligne vous aident à rapetisser votre code de sorte que vous n'avez pas à faire à la main. Certainement ne pas le faire à la main. 

Okay. Maintenant, parlant de son exécution. Peut-être que dans votre code PHP, il ya quelque chose que vous n'avez pas besoin de le faire. Peut-être il ya des boucles supplémentaires là-dedans. Nous avons parlé de la conception de code dans CS50. Même si vous codez en C si vous avez - si vous faites un travail supplémentaire que vous n'avez pas besoin de le faire, eh bien, cela va ralentir vos scripts sur votre site, et ceci est particulièrement important pour les sites web de nos jours parce que les utilisateurs sont très impatients. Si vous faites un travail inutile, il va prendre plus longtemps à obtenir l'information qu'ils veulent, et ils vont être très malheureux. Enfin, vous pouvez optimiser vos tables de base de données. N'oubliez pas que nous avons parlé index. Ils ne sont pas seulement bon pour faire en sorte que vous avez une ligne qui est unique. Ils sont aussi bons pour faire en sorte que votre base de données fonctionne rapidement. Si vous voulez lire sur qui vont à la documentation MySQL, ou vous pouvez regarder - et bien, comment puis-je optimiser ma table de base de données? Comment puis-je m'assurer que j'ai indices qui m'aident à obtenir de l'information plus vite? 

Il ya aussi des petits trucs que vous pouvez utiliser comme cache. Si vous avez PHP - si vous avez un blog, par exemple, et vous avez - et il est alimenté par PHP ou en toute autre langue - vous pouvez mettre en cache votre blog à Disons intervalles de 50 minutes afin que vous puissiez servir des pages statiques ou HTML statique pour les visiteurs de votre site. De cette façon, les utilisateurs n'ont pas à exécuter le script PHP à chaque fois, et peut-être que ce sera plus rapide pour eux d'accéder à cette information. 

Et enfin, vous pouvez utiliser quelque chose comme CDN. Notez que lorsque vous téléchargez une Pset, vous allez toujours à CDN.CS50.net. Pourquoi est-ce? CS50 utilise aussi comme une sorte de CDN - un réseau de distribution de contenu - ce qui signifie tout simplement que c'est un tas de serveurs peut-être quelque part dans le monde qui aider à servir vos pages à vos visiteurs. Si votre visiteur devient une page à partir d'un serveur qui est plus proche d'eux géographiquement, il est fort probable que votre visiteur va obtenir ce fichier beaucoup plus rapide. Il existe également des sources en ligne qui vous aident à faire cela. L'un d'eux est CloudFlare. Ils offrent un service de CDN gratuit. Si vous avez de gros fichiers que votre service pour vos utilisateurs, alors peut-être que c'est mieux de les mettre sur un CDN afin qu'ils puissent se rendre à leur plus rapidement. 

Le dernier thème de la journée est l'optimisation des moteurs de recherche. Quel est l'optimisation des moteurs de recherche? Ce n'est en s'assurant que les moteurs de recherche comme Google ou Bing ou Yahoo peut aller sur votre site et explorer votre site et indexer votre site et quand Moi, par exemple, passer à Google.com et j'essaie de chercher quelque chose, alors votre site apparaîtra. Comment vous assurez-vous que votre site est l'un des top 10? Parce que, comme nous le savons tous, si vous recherchez quelque chose sur Google et ce n'est pas le top 10 que vous êtes le plus susceptible de ne pas regarder dans les 10 prochaines années. C'est en quelque sorte un sujet qui est enveloppée de mystère. Il ya beaucoup d'exagération là-bas sur l'Internet. Il ya beaucoup de superstitions environ si vous n'avez x puis Google vous aimeront mieux. Si vous n'avez y puis Google va vous aiment mieux. C'est probablement mieux de se pencher sur les documents géant de la recherche elle-même. 

C'est l'un des documents sur Google qui vous indiquent exactement comment optimiser votre site afin que Google puisse accéder et indexer très bien. Vous n'avez pas à recopier cette URL parce que cette présentation va être en ligne de toute façon. Si vous regardez cela et vous lirez ces lignes, il ya quelques conseils très utiles là-dedans. Le Google vous dit - si vous voulez vraiment que votre site soit indexé bien alors vous devriez faire toutes ces choses. 

Une autre chose que les moteurs de recherche aiment vraiment, c'est le contenu frais. Si vous avez du contenu qui est mis à jour très régulièrement puis les moteurs de recherche disent, oh, j'aime votre site. Je vais aller à votre site très souvent. Je vais à l'index beaucoup de vos pages. Si vous avez du contenu frais, alors vous êtes plus susceptibles d'apparaître - vous êtes plus susceptibles d'être plus pertinent. Vous êtes plus susceptibles d'être plus à jour, et les moteurs de recherche sont plus susceptibles de mettre votre site au dessus des autres. 

Les liens profonds sont également importants. Si tu voulais vraiment votre site pour faire bonne figure dans les yeux d'un moteur de recherche ont beaucoup d'autres sites qui lui sont liés et reliés profondément dans votre site web. Ne vous contentez pas un lien vers votre page d'accueil. Lien vers peut-être yourname.com / quelque chose / quelque chose / something.php. C'est - à un moteur de recherche - moyen, wow, ils ont un contenu vraiment intéressant que quelqu'un d'autre est un lien si profondément dans leur site que je devrais vraiment, vraiment mettre plus d'importance sur les pages de ce site. 

Si vous avez les titres des pages précises, si vous n'avez pas d'erreurs c'est bien parce que Si un moteur de recherche tente de visiter votre site, et il se fait une erreur, il va probablement abandonner très, très bientôt. Et enfin, vous voulez avoir un temps de chargement rapide, car les moteurs de recherche - tout comme les humains - NE FONT PAS avoir beaucoup de patience pour les sites lents. C'est une façon pour vous de vous assurer que vous présentez plus élevé dans rechercher les requêtes des moteurs et j'espère ainsi obtenir plus de trafic. Parce qu'après tout, vous avez passé tout ce temps à développer votre site Web. Vous avez passé tout ce temps, le lancement de ce site en ligne. Vous voulez vous assurer que vous avez beaucoup d'utilisateurs qui ont réellement voir votre contenu. 

D'autres bonnes ressources à utiliser. Google Webmaster Tools est quelque chose à regarder dans. Cela permet juste de voir - Google n'indexe pas mon site. Quelles sortes d'erreurs, c'est qu'il rencontrent? Combien de pages est-il indexé? Que faut-il penser est le contenu le plus important sur ma page? Peut-être que ce n'est pas ce que je veux qu'il soit. Peut-être que je dois changer mon site web un peu tel qu'il se reflète mieux ce que mon site est vraiment. Google Analytics est un outil vraiment cool. Vous pouvez ajouter un peu de JavaScript à vos pages. Et puis après, vous pouvez aller sur Google Analytics, et il sera suivi vos données démographiques des visiteurs et la croissance de votre site. Il vous dira exactement combien de visiteurs visitent votre site dans un certain jour, à l'intérieur d'une certaine heure, dans un certain semaines. Combien de visiteurs en provenance de Chine? Combien de visiteurs de l'Antarctique - vous obtenez à votre site Web. qu'il pourrait y avoir quelque chose de cool à voir ou il pourrait même être utile parce que vous essayez de cibler un certain groupe. Peut-être que vous essayez de cibler les adolescents avec votre site, et vous verrez que la plupart des visiteurs de votre site sont peut-être 30 - à 40 ans, alors peut-être soit vous avez un problème ou vous pouvez juste dire, Eh bien, alors peut-être que je devrais juste changer l'orientation de mon site afin que Je me concentre plus sur ce groupe d'âge. 

Google Apps - si vous vouliez avoir tri des e-mails avec votre nom de domaine - peut-être quelque chose comme yourname@yourname.com-- vous pouvez utiliser des adresses gmail - vous pouvez utiliser le service Gmail et Google Apps est une façon de le faire. Vous pouvez configurer des adresses électroniques spécifiques qui sont spécifiques à votre nom de domaine au lieu of@gmail.com. 

Et enfin, il ya des extensions web développeur et add-ons - pour Chrome, pour Firefox, pour les autres navigateurs - qui vous permettent d'entrer et d'inspecter CSS, JavaScript inspecter, voir exactement ce qui ne va pas avec votre script JavaScript et peut-être qui va être utile pour vos fins de-mise sur écoute, pour vous trouver - Eh bien, pourquoi pas mon site s'affiche pas correctement dans votre navigateur? 

Et enfin, si vous voulez en savoir plus sur tous ces sujets - si vous voulez en savoir plus sur HTML et CSS et JavaScript - car après tout, on ne vous apprend un peu - vous pouvez aller sites comme W3Schools.com à chercher d'autres ressources. Ils ont de très bons tutoriaux sur comment dois-je faire x, y ou qu'est-ce que signifie? Si vous voulez en savoir plus sur ces langues, vous pouvez simplement aller ici. 

Très bien. Je pense que je voulais quitter les dernières minutes de ce poser des questions, il ya également des questions sur quelque chose dont nous avons parlé? [Membre du public] Quels genres de choses sont sur W3Schools et comment est-il abordé? [Yuechen Zhao] Quel genre de choses? Ainsi, l'un des très grands choses que j'utilise beaucoup, c'est leurs références. Leurs références détail, par exemple pour CSS - ce que cela signifie ou si vous voulez changer le fond d'une page - comment faites-vous? Quels navigateurs supportent cette commande? Des choses comme ça. Et puis ils ont aussi juste de très bons tutoriels sur le HTML, le PHP, le JavaScript, sur MySQL, sur toutes sortes de sujets différents. Ils ont de belles tutoriels. Ils vous enseignent comment faire les choses. C'est agréable de pouvoir aller et en apprendre davantage sur ces sujets. 

[Membre du public] HTML 5 n'est pas encore compatible avec tous les navigateurs sur le marché. Recommanderiez-vous simplement rester loin de lui en raison de problèmes de compatibilité? Comment réagiriez-vous à cela? [Yuechen Zhao] Oui, oui, la question est de HTML5 est encore une norme de bébé. Ce n'est pas vraiment soutenue par beaucoup de navigateurs, donc devrions-nous éviter cela? Je pense que l'année dernière, j'aurais été un très grand partisan de, Evitons HTML5 car il est encore - c'est encore très nouveau et en fait, la norme HTML5 n'a pas encore été finalisé. Et donc, il n'y a vraiment pas de norme HTML5. Mais je pense surtout si vous concevez un site Web maintenant, il pourrait être préférable si vous allez avec HTML5, parce que c'est en quelque sorte va être l'avenir, et si vous voulez que votre site soit pérenne et que vous voulez que votre site fonctionne dans les futurs navigateurs, il pourrait être préférable de commencer à construire quelque chose pour l'avenir que pour le passé, et aussi tout simplement en raison du fait que HTML5 n'est vraiment pas si différent de HTML4 ou XHTML. Si vous utilisez HTML5, il sera normalement fonctionner dans la plupart des navigateurs. Vous avez juste à trier des aller et assurez-vous que ces screenshots et faire en sorte de passer à ces sites vous-même. Mais le plus probable, il ne fonctionnera sauf si vous utilisez des caractéristiques très spécifiques à HTML5. Notez aussi que pour CS50 - par exemple, pour le lecteur vidéo que nous utilisons - il utilise HTML5 et HTML5 vidéo pour afficher les conférences. Mais si vous avez un navigateur vraiment vieux, alors ça va retomber sur le flash. Donc, c'est aussi autre chose - disposer d'un système de repli pour quand vous savez exactement ce que le navigateur ne va pas gérer ce que vous voulez à manipuler. 

D'autres questions? Tout ce dont nous avons parlé. Très bien. Ensuite, je pense que c'est tout pour moi. Je pense que c'est ça. (Applaudissements) Cool. [CS50.TV]