Tài liệu Web Programming with HTML, XHTML, and CSS- P12 pptx

Most hosting providers actually require that you use FTP to transfer your pages onto their servers, which means that you need an FTP program (sometimes referred to as an FTP client) to put your files on a server. Most FTP programs have two windows, each with a file explorer. One represents the files and folders on your computer; the other represents the folders on the web server. In Figure 13-7, you can see the folders on my computer, and on the right you can see those on a web server. Figure 13-7 The table that follows shows some of the most popular FTP programs. Each of the programs is slightly different, but they all follow similar principles. Product Name URL OS FireFTP http://fireftp.mozdev.org/ Windows and Mac OS X Cute FTP www.cuteftp.com/ Windows and Mac OS X FTPX www.ftpx.com/ Windows Fetch www.fetchsoftworks.com/ Mac Transmit www.panic.com/transmit/ Mac 521 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 521 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. When you register with a host, this host will send you details of how to FTP your site to its servers. This will include: ❑ An FTP address (such as ftp.example.com) ❑ An FTP username (usually the same as your username for the domain) ❑ An FTP password (usually the same as your password for the domain) Figure 13-8 shows you how these are entered into the FTP program called Transmit on a Mac. Figure 13-8 While you can download trial versions of several of these programs before you buy them to find out which one you are most comfortable using, most of these programs have graphical user interfaces that are very similar. Search Engine Strategies Now that you have your site on the server, you want people to come and visit it. One of the best ways to get visitors to your site is to ensure that users can find your site in a search engine when they enter words that are relevant to the content of your site. Preferably they find you in the top ten values returned. Beyond meta Tags You have already seen how search engines can use the <meta> tag’s description and keywords proper- ties to help search a site, but search engines are becoming much more complex in the way in which they address the task of indexing all the sites on the Web. You, too, therefore need to continue to work on your search engine strategies a lot more than just adding in <meta> tags. 522 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 522 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. Staying on top of your search engine rankings is an ongoing exercise and should form part of your stan- dard marketing practice. It’s good to review your search engine ranking at least once a quarter — or once a month if possible. You should never just rely upon the search engine sites to find your site and index it. For example, sites such as dir.yahoo.com and dmoz.org are Internet directory sites based upon categories, and you have to navigate through the categories to find the site you want. This manual categorization of sites requires that you submit the URL of your site to them; it can then take anywhere from a couple of weeks to a few months for your site to appear on theirs. Some sites charge for the privilege of being listed on their site, and in such cases you should carefully consider whether it’s worth the money. While it may be worthwhile to pay to be featured on large popu- lar sites, unless you personally know the site, you may find it does not provide many referrals. This is discussed more in the next section. Once you have manually notified a search engine, you should wait at least a month before submitting the URL again. If you over-list a site it’s considered spamming, and you might not get listed at all. If you have made significant changes to your site, it is always worth re-submitting it (not too frequently) so that the changes get identified. Personally, I ignore programs that promise to submit my site to thousands of Internet directories and would rather do the work myself. Spending just an hour a day for a couple of weeks, first submitting the site manually to major search engines and then looking for other relevant web sites and asking them to list my new site. I do this because some of the programs used generate so many submissions to web search engines that they are considered spam (and as a result are ignored). Remember that if the offer of results sounds too good (guaranteeing you top ten placements on thousands of search engines), the offer may well be too good to be true! Designing Your Page to Maximize Rankings Search engines that use programs to automatically index sites are using increasingly sophisticated rules to determine who gets the highest ranking (top) results in a web page. Following are some points to con- sider when designing your pages to help ensure that your site gets the highest ranking it can: ❑ The titles of your pages are among the most important words in your site and are one of the most important things indexed. So avoid using titles that just contain words such as “Home Page” and instead go for descriptive titles such as “Wrox Press — Computer Programming Book Publishers.” Then on specific pages the title could change to something like “XHTML Programming Books, learn to code and build web sites.” If the words the user types into the search engine are found in your title, the engine will consider your site more relevant. But don’t make the title longer than one sentence or the program will realize you are trying to fool it and count this against you. ❑ Most search engines look through the text content of a page and will index that, too. The first words tend to be considered the most relevant. So you should try to strategically place the keywords for your site in the text near the start of the page as well as in the title. You can also expand on that list of keywords here. ❑ If the keywords a user searches on appear in the page with more frequency than other words, then they are considered to be more relevant. However, do not make them appear too frequently — again, the search engine will count this against you. 523 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 523 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. ❑ If your site uses images instead of text, the site can index only your alt text; so try to make sure any information conveyed with images is also conveyed in text. ❑ If you try to fool the search engines by repeating keywords in text that is the same color as the background (so that the repetitive text is invisible to your users), then the search engines can penalize you for this. ❑ Using keywords that are not related to the subject matter or the content of the site can count against you. ❑ The more sites that link to yours the better. Some search engines will give you higher priority if you are linked to by lots of other sites. But note that they will also consider which site is linking to you. The site should be relevant to your business — a search engine would not consider a used- car dealers linking to a pet shop as being a relevant link. ❑ The more users who click on links to your site when it comes up in the search engine, the better your rating should be. While things such as the title, keywords in the text, <meta> tags, and the number of links may help you appear nearer the top of the search engines, if nobody clicks on the links to visit your site, your ranking will soon fall. It can take a long time to build up your search engine rankings, but constant attention will help you get better and better. See the section “Other Web Marketing Possibilities” a bit later in this chapter for addi- tional marketing tips to help you build traffic on your site. But first I’ll show you what to do if you do not want your pages indexed. robots.txt On some web sites, there will be pages that you do not want to be indexed — for example administration pages and test pages. To prevent pages from being indexed by a search engine, you can include a simple text file on your site called robots.txt (which you write in a simple text editor such as Notepad on Windows or SimpleText or TextEdit on a Mac). The robots.txt file can contain simple commands that prevent parts of the site from being indexed by the web crawlers (the little programs that index sites), which are often programmed to read these files. You should have only one robots.txt file for your site, and it should be placed in a folder called htdocs in the root folder of your web server. Some web hosting companies create the htdocs folder for you; other hosts require you do this yourself if you need one. The first line of this simple text file should be: USER_AGENT: web_crawler_name Given that you are likely to want all crawlers to obey the rules, you can simply use an asterisk instead of the names of any web crawlers — the asterisk is also sometimes referred to as a wildcard character, and it indicates that all crawlers should obey the rules. Next, you can specify which folders you want to disallow the crawler from indexing (another reason why a well-organized site is important) by using the DISALLOW command. This command may be repeated for each folder you do not want indexed: USER-AGENT: * DISALLOW: /admin/ DISALLOW: /scripts/ 524 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 524 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. This simply indicates that no crawler should attempt to index the admin or scripts folders (or any of their child folders). While there is no requirement for the crawlers to obey the rules in this file, it is in their interest not to index pages people don’t want displayed (usually because they will not allow the user to do something), so the main search engines will usually obey the rules. Other Web Marketing Possibilities Search engines are just one way to get people to visit your site — and it is definitely worth allotting time for other types of marketing of your site both on and off the Internet. Here are just some of the tactics you can use to attract visitors to your site: ❑ Search for other web sites that are related to your industry. Some of these sites will have links to sites of interest, and you can ask to be added to the page featuring those links. ❑ A lot of industries have industry-specific directory web sites listing products and services for that particular field. However, many of these charge to advertise on their sites. You will have to decide whether the cost is justified by the amount of traffic it will bring you. You could always ask some people in your industry if they use the site and thus gauge whether you are likely to get many referrals from it. ❑ Many sites offer reciprocal links; that is, they will link to you in return for your linking to them. It is a way for everyone to boost traffic. But make sure that you are not putting someone on the front page of your site when they are going to put a link to you tucked away on a page that few people will come across — the term is reciprocal linking, after all. ❑ Use a few search engines to search for related companies and find out who is linking to them — the sites that link to related sites may well link to you, too, if you ask. You may find sites that you have never heard of before but would be happy to have link to you. ❑ You can provide buttons or banners on your site so that people can integrate them into their sites. This is more likely to happen with community sites than with commercial sites, but hobbyists will often link to special-interest sites, and it is a lot easier for them to do this if you have already pro- vided links for them. If the links look great, too, they are more likely to want to add them. ❑ Take a look at Pay Per Click (PPC) advertising. Google has a PPC system called AdWords, for which you specify keywords, and when a user searches using those words, the ads appear on the right side of the page. These ads can also appear on other special-interest sites. AdWords works in a very clever way. You pay for an advertisement only when the user clicks it. The ranking of which ads appear first is based upon the amount you are prepared to pay each time someone clicks the ad, and the number of people who actually click on your ad. If users do not click the ad, it slips down in position, no matter how much you pay (after all, Google stands to make more money if 10 people click a cheaper link than if one person clicks a slightly more expensive link, and more users are getting value from their service). Generally speaking, this is a very cost-effective way to generate traffic to your site. Yahoo offers a similar service called Overture, and Microsoft has a sys- tem called adCenter. ❑ There are many other forms of paid advertising you can take out on the Web. Lots of sites take out banner advertising, and lots of sites allow you to pay to be listed. You will have to judge each of these on whether you think you will get enough traffic to justify the money. Remember that a lot of web users are immune to advertising and just scan pages to find what they really want — so if you are going to create a banner, make sure it’s visually attractive and that people will want to click on it in order to make it worth the money you are spending to have it appear on other sites. 525 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 525 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. ❑ If there are any newsgroups, bulletin boards, or forums for your particular industry, answer questions on them and add your web-site address as a signature beneath your name when you sign the posts. But be careful to do this only when you can be helpful to someone — do not start posting to newsgroups unless it is relevant; you are likely to annoy people rather than attract any visitors if you do so. ❑ If you have regularly changing content, consider adding a newsletter feature to your site so that people can sign up to receive regular updates. This is discussed more later in the chapter, but it is a great way to keep people up-to-date with your site and let them know about new content. ❑ Of course, you should not just use the Web to market your site; a good site should generate traf- fic by word of mouth. You can also use printed leaflets, place ads in related magazines, put your site address on your letterhead or the side of your car. You could even find a conference or event that relates to the area you cover and use that as a way to make people in your industry more aware of what you do. Statistical Analysis If your hosting provider has a statistics analysis package on its servers, you can find out lots of helpful information about your visitors once your site is live. These packages analyze the log files of your web server; log files contain information about files they send out and to whom they send them. The terms used in site analysis can be confusing; for example, you may have heard people say that a site gets 10,000 hits, but this can be quite misleading. The term “hit” refers to the number of files that have been downloaded from the site — and an image counts as a file in this total as well as the XHTML pages, so a single web page with nine images will equal ten hits (and some graphics-intensive pages can have over 30 images for each page that is served). Therefore, it is often more helpful to look at page views rather than hits, as this represents the number of pages that have been viewed on your site. You may also come across the term “visits.” You should be aware, however, that different statistics pack- ages calculate visits in different ways. Some count everyone using the same IP address as the same visi- tor — so if there are ten people, all of whom work in the same building, looking at the same site at once, then that might look like only one user instead of ten. Different packages also tend to count visits as dif- ferent lengths of times; some packages remember an IP address for a whole day, so if the same person comes to the site in the morning and then again in the evening it is counted as just one visit. Others will remember the IP address for only 15 minutes. You will also find that some advertisers will ask for the number of unique visitors you receive each month — again different statistics packages can count unique users in different ways, so this figure can be a little misleading. Most statistics packages will actually offer you a lot more information than I have mentioned here. For example, it is quite common for these packages to tell you how people arrived at your site — what pages and sites people came from and how many came from each. This helps you learn how people are finding out about and coming to your site, which then helps you determine good places to market your site. Statistics packages also frequently tell you what terms people were searching on in order to find your site — so you can tell what keywords have been entered into search engines for users to find you, and then work on enhancing the frequency of these words in pages and enhancing your search engine posi- tion. Figure 13-9 shows you some of the terms used to find a site about printing equipment and services. 526 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 526 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. Figure 13-9 Some other information you might be able to find out includes: ❑ Which page users arrived at on your site and which they left from. This is very helpful because you can get an idea what people are coming to the site for and where they leave from. If there is one page that makes a lot of people leave, you can do something about improving the design of that page to try to make visitors stay on your site longer. ❑ Which country users are from ❑ What browsers users were using ❑ The language that users’ operating systems are set to, and therefore which language they are likely to speak ❑ How long individual users spent on the site Be aware that all these figures are approximate and there can be differences between figures given by different reporting packages, but the figures are nevertheless very helpful tools in analyzing how people found out about you and what people are doing on your site. In addition to using the built-in statistics system of your web server, you can also use systems that use JavaScript to call a file on the server, and create analytical information for you. A very popular (and free) example of this is offered by Google and is called Google Analytics. In order to run this system you just need to place a piece of code at the bottom of each page; Google then will create all kinds of reports about your visitors, which can complement the statistics package offered by your web hosts very well. Version Control In time, you are likely to want to make changes to your site. As mentioned already, you should not make changes on your live server. Rather, you should have another copy of the site, which you can use for test- ing, both on your local machine and the web server, before you make the changes active. 527 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 527 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. When you are working on any kind of file, it’s easy just to work on one version of a document and save changes as you go. However, this opens you up to problems: ❑ You might save over the file when you did not mean to, or make an error and want to go back to the original. ❑ You might open a file, make some changes, and save it. Then while you are editing your ver- sion, a colleague might come along and open the same file, make their changes, and then save their version after yours — saving over all your changes. ❑ You might be working on a site for a client and decide that you want to go back to an earlier version of a design or some earlier content. ❑ You might need a copy of something your site contained at an earlier date — but if you don’t have these files, you won’t be able to. When more than one person is working on the same files or if you are updating your own files, it can be a good idea to come up with a naming convention to save all older files before saving new documents with the same name. For example, you can simply add a date and time to any file before saving over it. If you want to change your home page index.html, you can save a copy with the date you change it. The advantage to this is that you also know when it was last changed. This does take up more space on your hard drive, but if you regularly make an archive copy of your sites and remove older files that are never used, you can regularly clear up the space they take and maintain a manageable set of files. You can also use your own <meta> tags to indicate a version as well as the name of the last person to update the file. You might remember from the beginning of the chapter that I said you can use anything you like as the value of the name attribute of the <meta> tag; this is a good example of doing exactly that. For example, here are <meta> tags to indicate the last modified date and who made the last changes: <meta type=”last-modified” content=”16-04-04:12:34:00 GMT” /> <meta type=”last-changes-by” content=”Jon Duckett” /> Remember that you also have the <ins> and <del> elements, although these are not likely to be as much use when simply making updates to a site — they are more useful for tracking versions of documents. It is also good practice to add comments into code when you change something that other people have done. For example, if you are working on a site and want to add in a new script, you might do some- thing like the following: <! start of new section added 12/12/03 by Bob Stewart > <b><a href=”specials.html”>Click here for special offers on end of stock items.</a> <! end of new section added 12/12/03 by Bob Stewart > You are not likely to do this for large changes to sites, but for small changes (especially ones in script or programming languages), the comment will help someone coming back to the site later see what changes have been made. 528 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 528 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. You can buy software to handle version control for you. This software allows you to book out files, as if they were library books — preventing two people from working on the same file at the same time. Some of these applications can be quite expensive, although free tools are available such as CVS (Concurrent Versions System) at www.cvshome.org/. If you use Macromedia Dreamweaver, a function when you create a site allows you to indicate whether only one person at a time should be allowed to use a file. This is handy for preventing someone from opening a file while you are working on the same page and then saving over changes you have made and saved since this second person opened the file. What Next? You’ve learned all about XHTML and CSS, made a good start at learning JavaScript, and learned how to put your site live on the Web. You might wonder why there is a section entitled “What Next?” This sec- tion covers two topics: ❑ Tools you can use to add powerful features to your site, using knowledge you already have ❑ What technologies might be appropriate to learn next So, the first part of this final section will look at services provided on the Web that you can use to enhance your site. You learn how to create a blog, how to add discussion groups or forums to your sites, and how to add search features. While these might all sound complicated — and they certainly are advanced features — they can be remarkably easy to implement and you will see how they can be powerful and impressive fea- tures on any site. Much like Hotmail offers e-mail over the Web, most of these services are implemented using other companies’ servers and code — all you have to do is customize them to make them appear like part of your site. Blogs The word “blog” is short for weblog. Blogs were initially devised as a way to add online journals or diaries to a personal web site. The idea behind blogs was to allow users to easily add new entries or posts to their web site without having to manually re-code the page (often called one-click publishing). The user goes to the web site of the company who made the blog, writes a post into a form, and the entry then appears on the web site. The posts are added to the site in a chronological order, and while they are often used for online diaries or journals, they have been used for a wide variety of other purposes, such as a way for people to add news, posts about a topic of shared interest, links, and so on. Indeed, while blogs started as a way for anyone to share thoughts with the rest of the Web, they soon started to appear on company intranets (as a way to share information), and on public web sites as a news feature (rather than just being used as a diary). 529 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 529 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. Several different companies and web sites give you the tools to add a blog to your web site. Two of the more popular ones are: ❑ www.blogger.com/ ❑ www.movabletype.org/ Both of these sites give you the tools to add posts to your blog without having to manually update your page each time you want to write something new. Nor do you have to install software or scripts on your server (although both have applications where you can do so). Furthermore, they can look like they are part of your site under your domain name (rather than that of the company you use for your blog), and they often feature other functionality — such as allowing users to post comments about your posts, or adding keywords to help people find related posts. Discussion Boards or Forums Discussion boards allow users to post questions or comments and then have other users reply to those questions, and are a great way to add a community feeling to your site. They also provide new content without your having to add it yourself and can attract visitors back to your site at regular intervals. For example, if you were running a site about a particular type of car, you might have one discussion group for technical questions and answers about fixing problems with that model of car, and you might have another forum that allows users to indicate when they are buying or selling parts for that car. One of the great things about discussion boards is that, if your site gets known for answering questions, peo- ple will come to that site whenever they have a problem. You may well have to start the community off by answering all the questions yourself, but with luck, other members will soon start adding their thoughts. As with blogs, there are companies that create software and offer it on their servers so that functionality- wise it looks as though your site has a discussion group (even though it runs on their servers). One of the best is www.ezboard.com/. And, as with blogs, you can usually customize the look of the discussion board by using CSS. You should note, however, that you may be held legally responsible for what people write on your dis- cussion board. If someone takes offense to something written on a board or forum on your site, you can be held accountable as the publisher of the content on the Web — even if you do not share the opinion of the person who wrote the item. Some discussion boards get around this by allowing the owner to moderate each post (read it before allowing it to go on the site); others simply regularly check the site for offensive material and remove any posts they consider offensive as soon as possible. Adding a Search Utility As mentioned in Chapter 10, you might want to add a search utility to your site. In Chapter 10, you saw that you can add a Google search utility to your site, and you can even customize the search by going to www.google.com/coop/cse/. Another site that offers a free customizable search service on sites of up to 500 pages is the Atomz Express service at www.Atomz.com/ (you may need to follow the links for the trial service). 530 Chapter 13: Putting Your Site on the Web 59313c13.qxd:WroxPro 3/23/08 9:38 PM Page 530 Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark. [...]... make use of them on web sites I hope this helps you decide what technology you might want to start learning next when you have gained experience with everything you’ve learned in this book Server-Side Web Programming: ASP.NET, and PHP You’ve already seen the very basics of what a programming language such as JavaScript can do in a browser, but when a programming language is used on a web server, it becomes... languages discussed here are in far higher demand and are more powerful Different developers will have different opinions about which language to choose But most people learn one environment and stick to it (although to a certain degree it is much simpler to learn a second language and environment when you already understand one and know what can be done with server-side scripting languages) If you... easier, by being strict with how you use markup, separating as much of your markup from styling as possible, and using JavaScript only to enhance pages, you end up with pages that will be available to more browsers and more people for a longer time So, thank you for choosing this book, and congratulations on making it to the end I wish you all the best in creating your first web site and hope that it is... Site on the Web It is also increasingly being used as a way to show audio and video content on the Web with sites such as YouTube relying on Flash to stream their video Very few sites need to be designed completely in Flash; it is much more common to see parts of pages created in Flash (such as banner ads and animations) This is partly because it is much quicker to develop a site in XHTML and partly... with databases than do with XHTML The Flash movie creation software does cost money, but the plug-in is free If you are not sure whether Flash is the right thing for you to learn next, you can download a free trial version from the Adobe web site Learning Graphics Packages Learning how to deal with text, illustrations, photos, and images correctly is very important if you are going to be involved with. .. which are then filled in with colors You learned a bit about the difference between bitmapped graphics and vector graphics in Chapter 3 Adobe Photoshop is by far the most popular graphics program used for developing web graphics You need only look at job ads for web designers and you’ll see that knowing Photoshop is often a prerequisite Photoshop not only allows you to work with photos, but it can also... text and logos (although an experienced designer would usually favor a vector program when it comes to creating logos and diagrams from scratch) Photoshop is a valuable tool to know because it not only allows you to edit photos, but also lets you create all kinds of images, such as navigation images and logos It will then take these images and create optimized versions of them ready for the Web with. .. the relevant recommendation and that you are following the rules you should), checking links to make sure all of them work and are not pointing to the wrong place, and checking that your site meets accessibility guidelines Next, you looked at the potential minefield of choosing a host on whose web servers you can put your web site This ever-changing market is hard to keep up with, but it can be well worth... than going with the first one you find New deals with more storage, greater bandwidth, larger mailboxes, and newer features are coming out all the time, so it pays to shop around Once your site is live, you will want people to come and look at it One of the major ways to attract new visitors is through a combination of techniques such as carefully chosen titles, keywords, content on your pages, and manual... that allows them to add new products to the site (rather than having to create each new page and link to it individually) ❑ Discussion boards and forums: The examples you have already seen mentioned in this chapter of discussion boards and forums rely on another company’s server-side programming and code to handle all of the posts The term “server-side application” can be something as simple as one . experience with everything you’ve learned in this book. Server-Side Web Programming: ASP.NET, and PHP You’ve already seen the very basics of what a programming. the site — and an image counts as a file in this total as well as the XHTML pages, so a single web page with nine images will equal ten hits (and some graphics-intensive