Apache parses the files for your site with an .htaccess file. Just create the file in your website root directory. It will take effect without restarting the server.
Add or modify the DirectoryIndex entry in you httpd.conf file or .htaccess file.
DirectoryIndex index.php index.html welcome.html, etc.
Apache configuration changes listed in a .htaccess file apply to all of the files in the same direcotry and to all of the files in subdirectories below it that don't have their own .htaccess file.
You need to make sure that your web site can be accessed both with and without the "www" prefix. nslookup can be used to list your DNS record.
If your web server has the rewrite module enable, you can create rules that tell apache to seamlessly change the URL requested by the browser.
Put your web pages in a directory one level below your login's home directory and create and use directories at the same level as the 'web root' to hide private files.
Unix-based web servers come with a built-in task-scheduling utility called cron that can do everything for you.
Restart your web server
apachectl start
apachectl stop: turn off the server immediately
apachectl graceful: leave the current connections open and starts applying changeed settings to new connections
Monitoring web server activity
tail -f access_log: returns the last part of a file.
grep "GET /news/nesrelease.html" access_log
2. Site planning and Setup
A functional specification for a web site should:
- Identify the audience
- State the goal of the web site
- Establish a method for measuring success
- Define interaction points
- Describe the site both textually and visually
- List key decisions to be made
- Identify and assess similar sites
- Outline a schedule
- Provide a guide for testing.
Start by listing all the goals that can be accomplished with the site, then prioritize the list from most to least important.
site map, an icon-based site map outlines a site's levels and pages.
Make URLs easy to find and remember: Use mod_rewrite rules in an .htaccess file to invisibly trun simple URLs into complex query strings that return dynamic pages to the visitor's browser.
color schema: http://www.wellstyled.com/tools/colorscheme/index-en.html
3. Page design and navigation
Expanding your web site
separate shared code block into include files.
Isolate content from display rules using CSS stylesheets
Creating breadcrumb links
Use a PHP script to generate the link on the fly from the directory names on your web site. (getenv("REQUEST_URI"), 1)
Creating a link menu to other pages.
You need to create a way for visitors to quickly navigate to the most popular pages on your site.
add a goToPage(url) in the html head.
Creating navigation that does not link to itself
Use PHP or javascript function on each page to match the address of the current page in a list of related pages. Then build the menu from the list, leaving off the link for the matched address.
4. Formatting Text and Code
Write standards-compliant web pages
Add a DOCTYPE declaration to the first line of your HTML code.
Displaying foreign and special characters.
Use a <> right after the head tag to declare a character set on all the pages on your site.
< equiv="Content-Type" content ="text/html charset=utf-8">
Choosing type sizes for display and body text
Avoid absolute type sized in pixel or point in favor of relative type sized using percentages and ems for text elements on your web page.
Include dynamic content in static pages
Use your server's build-in SSI parsing of and tages in the body of your static pages
Adding a hyphen to long words
The soft hyphen - "­"; or
For example: Chandrasekhar ---> Chan++dra++sek+har
Reformatting database content as HTML
You need to convert characters in text stored in or retrieved from a database to their proper HTML entities. such as "\n" single-quote, double-quoto, and backslash, etc.
PHP build-in function: addslashes(), stripslashes(), htmlspecialchars(), htmlentities(), nl2br(), etc.
Optimizing web page code
Remove whitespace, hidden characters and other unnecessary tags from your code.
5. Formatting graphics
Optimizing your images
GIF is a 256-color, lossless compression format. It support transparent. GIF are best for images that depict text, drawings or graphics with large, flat areas of color.
JPEG can include 16 million colors, which is true color. It does not support transparent.
PNG(portable Network Graphic) can be 256 color or 24-bit color. It supports transparent.
Creating watermarked images on the fly
Use the php image generating functions in GD library to merge a transparent watermark image with your original downloadable images.
6 Displaying and delivering information
Adding preview information to links
<_a title="*****" href="http://www.blogger.com/***">.....
The title attribute for links works similarly to the alt attribute of the <_img>
Create effective pop-up windows
<_a href="popup.html" title="new window">popup window <_a>
_blank can be popup, then if a window with the name popup is already open, the link will load in that window.
<_a href="#" title="new window" onclick="window.open('popup.html', 'popup,'width=480, height=360'); return false;">Pop-up window<_a>
return false can prevents the same window from opening twice.
Highlighting the search term
add a rule to your stylesheet
.arg{
background-color: #00CCCC;
font-weight: bold;
}
function processText($text, $arg){
text = str_replace($arg, ".$arg.", $text);
return $text;
}
Embedding RSS feeds on your site
feed parsing tools: Feed2JS, CaRP(PHP)
Creating an RSS feed from database content
setup a cron job to automate the process using the Unix utility wget.
0 * * * * /usr/localbin/wget http://yourwebsite.com/path/to/feed.php
The enclosure element allows feed publishers to attach a media object, such as mp3 file. It must include attributes for the file's url, size, and type.
<_enclosure url="****" length="221223" type="audio/mpge">
Create a printer-friendly versin of your site
The media attribute of teh stylesheet tage specifies which CSS rules to use depending on teh device.
<_link href = "screen.css rel=" rel="stylesheet" type="text/css" media="screen">
<_link href = "print.css rel=" rel="stylesheet" type="text/css" media="print">
<_link href = "handheld.css" rel="stylesheet" type="text/css" media="handheld">
Generating downloadable files dynamically
Dynamically build PDFs, PNGs, JPEGs and other type of files using PDFlib library, GD graphics library.
7. Interacting with visitors
Preventing blank form fields
Use the onBlur, onClick, or onSubmit javascript event handlers in your form to check for empty fields before the form data is sent to the server.
Using sample input to reduce errors
<_input name="name" type="text" value="First and Last Name" onfocus="if(form.name.value=='First and Last Name') form.name.value='';">
Javascript is case-sensitive. take care of the variable name.
Formatting user-entered information
You need to change names, phone numbers or other data entered through a form to match your preferred format.
Generating form menu choices from a database
function makeSelectList($dbTable, $dbFieldValue, $dbFieldDisplay = "", $menuField, $idSelected = "--", $size=1, $defaultText="--")
{
}
Storing multiple values in one database field
PHP build-in function implode() to convert the array to a string
$favcolor[];
...
$favcolors_imp = implode("", $favcolors);
convert the string back to an array
$favcolors_exp = explode("", $favcolors_imp);
Using a graphical character string for form authentication
Captcha (completely automated public turing test to tell computers and humans apart)
Putting additional information in mailto Links
<_a href="mailto:address@domain.com&Cc:a@domain.com&Bcc:b@domain.com? Subject=Web%20site%20Comment&body=Type%20you%20message%20here:">address@domain.com
8 Promotion and E-Commerce
Trust-building: strive to make every page on your site share the same look and feel. The navigation should occupy a constant location on all pages.
Landing page: a page from a external link to your site from an ad, email newsletter, etc. Reiterating the search tern to assure visitors they've come to the right place. The response device, the form, must be simple and straightforward. Make the "Submit" button big and eye catching.
favico: a icon that appears in front of your website address. Save the icon as favicon.ico and upload to the root directory of your web server. Avoid cache, You can also add a \ tag in \. \< rel="shortcut icon" href="/path/to/favicon.ico“ type=">
Forcing a secure connection
When Apache gets a request that begins with https://, it responds to the request over a different port than the one it uses for a standard request. Port 443 is Apache's default port number for secure connections.
Create a self-signed SSL certificate
Third-party SSL certificate(VeriSign, Thawte, GeoTrust) is not cheap. You can generate your own certificate.
openssl
Disabling a form submit button after the first click
<_script type="text/javascript" language="JavaScript">
var ordersend = false;
function placeOrder(){
if(ordersend==true) {return;}
document.orderform.submit();
document.orderform.orderbtn.value='Please Wait...';
document.orderform.orderbut.disable=true;
ordersent=true;
}
<_form name="orderform" method="post" action="...">
<_script type="text/javascript" language="JavaScript">
<_!-- type="button" name="orderbtn" value="Place Order" onclick="return placeOrder();">');
_//-->
<_script>
<_noscript>
<_input type="submit" value="Place Order">
<_noscript>
<_form>
Tracking and blocking visitors based on their IP
Adding a few lines to an .htaccess file in your website's root directory will prevent a specific IP.
order allow, deny
allow from all
deny from 70.113.31.107
9 Maintenance and Troubleshooting
Auto-indexed file list
It is a good idea to turn off the indexing optoin at the web site root level, and then turn it on for specific sub-directories as needed with an .htaccess file in that directory.
Web site testing:
Usability testing
Any amount of usability testing is better than none, and a significant number of potential problems can be discovered by doing testing with just a handful of people.
Browser testing
The time to discover display inconsistencies among various browsers is not after every page on your site has been coded, but when the first mockups or templates has been translated to HTML.
Quality assurance
The QA process incorporates checking pages for spelling, grammar error, and style inconsistencies, checking pages for broken links and unloaded images, verifying error messages.
Load testing
Apache-ab
ab -n 100 -c 5 http://..../index.php
www.anybrowser.com will mimic how a variety of browsers will render your site.
Preventing email address harvesting
you can use Javascritp's document.write() to disguise email address. document.write(name + '@' + domain)
A contact form + Perl script is allow user to hide their email.
0 comments:
Post a Comment