Archive for the ‘WebDesign’ Category
-
What’s A CHMOD?
CHMOD is another name for setting the permissions of files on your server.
All UNIX based web servers understand the concept of permissions. these are broken down into three distinct areas.
Permissions for the person who OWNS the file.
Permissions for the group (all users are members of one or more groups).
Permissions for everyone else.Permissions are listed one of two ways either using numbers such as 755 or, using letters such as rwx-xr-x however they both mean the same thing.
The first number or first group of three letters stands for the permissions of the owner (IE 7 or rwx).
The second number or second group of letters stands for the permissions of the group (IE 5 or xr).
The third number or third group of letters stands for the permissions of everyone else (IE 5 or x).The way the system works is as follows:
1 = x = you are able to execute (run) this program.
2 = w = you are able to write to this file.
4 = r = you are able to read the contents of this file.so if you add it up rwx = 7.
So, in the example given above (755 or rwx-xr-x) the owner is allowed to read and write the file AND execute it.
The group is allowed to execute and write to the file.
Everyone else can execute the file.We hope this gives you a little more insight to how CHMOD’ing or, setting the permissions on your server can affect how files act.
Article written by Lee
-
What On Earth Is CGI?
Let’s unlock a little bit of the mystery about something called CGI. If it helps any, CGI means Common Gateway Interface.
This is a method which is used to swap data between the server (the hardware and software that actually allows you to get to your web site) and a web client (your browser). CGI is actually a set of standards where a program or script (a series of commands) can send data back to the web server where it can be processed.
Typically, you use standard HTML tags to get data from a person, then pass that data to a CGI routine. The CGI routine then performs some action with the data.
Some of the more common uses of CGI include:
Guest books – The CGI routine is responsible for accepting the data, ensuring it is valid, sending an email acknowledgement back to the writer, perhaps sending an email to the webmaster, and creating the guest book entry itself.
Email Forms – A simple CGI forms routine just formats the data into an email and sends it back to the webmaster. More complicated routines can maintain a database, send an acknowledgement and validate data.
Mailing List Maintenance – These routines allow visitors to subscribe and unsubscribe from a mailing list. In this case, the CGI routine maintains a database of email addresses, and the better ones send acknowledgements back to the visitor and webmaster.
A CGI routine can be anything which understands the CGI standard. A popular CGI language is called PERL, which is simple to understand and use (well, compared to other languages). PERL is a scripting language, which means each time a PERL routine is executed the web server must examine the PERL commands to determine what to do. In contrast, a compiled language such as C++ or Visual Basic can be directly executed, which is faster and more efficient.
Okay, in a nutshell (and greatly simplified), here’s how it works:
1) You (the webmaster) specify a form tag which includes the name of the CGI routine.
2) You create HTML tags which retrieves data from your visitors.
3) Each of the input tags includes a variable name. The data which is retrieved from the visitor (or directly set if the tag includes the “hidden” qualifier) is placed in the variable name.
4) When the visitor presses the “submit” button, the CGI routine which was specified in the form tag is executed. At this time, the CGI routine “takes control”, meaning the browser essentially is waiting for it to complete.
5) This CGI routine can get data from variable names. It retrieves the data and does whatever action is required.
6) When the CGI routine finishes, it returns control back to the browser.
Some important things to remember about CGI routines:
You can install CGI routines on your own site if your host allows it http://www.webair.com is an example of a web host which allows for CGI routines. Some web hosts do not allow you to install your own routines but do provide some pre-written ones to you. If these are not sufficient for your needs, you can find a remote hosting service to provide the necessary functions.
Generally, if you install your own routines they must be installed in the cgi-bin directory of your site. This is a special location which allows scripts and programs to be executed.
CGI routines work best on Apache-style servers. Windows NT and Windows 2000 does support CGI, but it tends to be slow and problematic.
If you use a remote hosting service, you must remember that although they appear to be giving you this for free, you are actually paying a price. Usually they want to display advertisements, although some of them actually take visitors away from your site.
When you write a CGI routine, you have the choice of a scripting language like PERL or a compiled language such as C++ or Visual Basic. Anything which can execute on the web server is acceptable.
I hope this short introduction to CGI has cleared up some of the mystery.
Article written by Lee
-
Using TITLE Tags effectively
Microsoft Internet Explorer has supported the TITLE attribute for links since version 4.0. Netscape began supporting it in version 6.0
The TITLE attribute allows you to enter descriptive text about a link that’s displayed when the mouse moves over the link. For an example, move your mouse over the link below:
European WebmastersThe HTML source code for this link is shown below:
<a href="http://www.europeanwebmasters.com" title="Click Here To Learn Foreign Adult Marketing">European Webmasters</a>
If your browser supports the TITLE attribute you should see a small popup box appear, similar to the way alternate text for images is displayed when you move your mouse over the image.
This attribute is similar to the ALT attribute for the IMG tag, both in its appearance and its limitations. The value of the attribute must be inside quotation marks, and it can only contain plain text (no HTML tags). You can include carriage returns in the title, and these will be displayed in the text. The maximum length of the TITLE text for Internet Explorer is very large; we’ve tested it with over 500 characters. Try to keep your descriptions below 25 words, though; any more than this can be hard to read and, because the search engine spiders can read this text you may be considered as spamming the engines.
The TITLE attribute is useful in places where your HTML design limits the length of your link text. That’s often the case for links in a navigation bar, especially if your page has a multi-column layout. Try using the TITLE attribute to give your visitors extra navigation information.
In addition you can also use the TITLE tag on standard text for extra information where you just don’t have the space to be as affluent as you would like. An example of this is shown below:
Use of the TITLE tag on plain text
The HTML code for this is also shown below:
<font size=”2″ face=”Verdana” color=”#000080″ title=”Use Of The TITLE Tag On Plain Text”>Use of the TITLE tag on plain text</font> This attribute is part of the HTML 4.0 standard. Internet Explorer, Netscape 6.x and Opera (Version 3.0 or higher) support it. However, the attribute degrades gracefully, visitors with non-supporting browsers (like Netscape 4.x) would see the link as if you hadn’t used the attribute.
As you can see from the above examples by using the TITLE tags effectively you can double, if not treble your use of keywords however, caution should be paid when using these features of the tag so that you don’t inadvertently spam the search engines.
Article Written By Lee
-
Using SSI For Auto Updates
We all realize the benefits of being able to save time when building sites so, I got into thinking, how can I make my sites look as if they are continually updated without the need to go in and update them manually? Enter the world of SSI.
SSI is actually a nifty little tool, not only can you include files from a central location but, you can include them at specific times of the day, days of the week or even months of the year, very handy indeed if you are building any type of site that needs updating periodically.
Once the main burst of work has been completed you can pretty much use the same files over and over again to help you out.
So onto the auto updating SSI, the following SSI coding will enable you to update a page or pages based on which day of the month it is. It will check the day the page has been accessed and display the relevant information again, this is a handy thing to have should your sponsor be running a promotion over several days, all you need to do is update a selection of SSI files and all of your sites are updated instantly.
<!–#config timefmt=”%d”–>
<!–#include virtual=”/yourdirectory/$DATE_LOCAL.txt”–>What you need to do is create 31 text files named 01.txt right the way through to 31.txt take the SSI call above and edit the location of the SSI files on your server, you may like to have a central folder named /SSI/ for this purpose so the location would be changed to /domain.com/SSI/$DATE_LOCAL.txt
I the 31 files you created you could have a table ad with eight of your sponsors links, an article in each one or even just a simple text link, anything that you may want to update can be included in these files.
As I mentioned above you can base the time, date and even month of rotation to whatever you like to alter how the files are rotated and ultimately viewed on the web you should change the %d in the timefmt field to one of the following:
%d : Day of the month requires 31 files named 01.txt to 31.txt
%w : Day of the week requires 7 files named 0.txt to 6.txt
%j : Day of the year requires 365 files named 001.txt to 365.txt
%u : The week of the year requires 52 files named 00.txt to 53.txt
%m : The month of the year requires 12 files named 01.txt to 12.txt
%H : Hour of the day requires 24 files named 00.txt to 23.txt
%M : Minute of the hour requires 60 files named 00.txt to 59.txtAs you can see from the above there really are no limitations to the uses of updating using SSI and, apart fro the relative ease of use and the time saved using them should one sponsor not be converting for you all you need to do to swap sponsors is alter your central set of SSI files and you have instantly changed sponsors over all of your sites.
Article written by Lee
-
Using JavaScript To Auto Scroll Text
Using JavaScript To Auto Scroll Text.
There may come a time when you would like to have some text on a page that is simply just to big to fit on a single page. Of course, you could always create a new document for this text but, what if you could make the text actually scroll through the surfers browser?The following JavaScript will do just that.
Place the following section of JavaScript coding between your <head> and </head> tags:
<SCRIPT LANGUAGE=”JavaScript”>
<!–function scrollit() {
for (I=1; I<=1200; I++) window.scroll(1,I);
}// –>
</SCRIPT>Along with the following JavaScript coding someone in the Body of your page:
<FORM>
<INPUT type=button value=”scroll” onClick=”scrollit()”>
</FORM>Have a play around with the numbers in the first section of the JavaScript to speed up and slow down the rate of scrolling until you find a speed that is easy on the eye.
Article written by Lee
-
Using Basic Server Side Includes (SSI)
Server side includes are what their name sounds like. A way to include the contents of another file into your current web page BEFORE the web page gets sent off to the surfer. Not only does this include contents of a static file but you can also include the results of a CGI program and on some web servers, you can even have it display the current date and time.
Now, many web hosts do not normally have server side includes turned on. You will have to ask your host if they have SSI turned on and if they do, what is the file name extension for SSI. By default, SSI files have an .shtml extension.
Sometimes, you can turn SSI on yourself. If you host doesn’t have SSI turned on for you already, you can try adding the following two lines to your .htaccess file. Then create a file with the .shtml extension, include a SSI command and see if it works.
AddType text/html .shtml
AddHandler server-parsed .shtmlWhen you use SSI commands, you place them exactly in the location within your web page where you want the output of the SSI command to appear when you finally browse the page. If you have SSI, then you can use the following command to include a file. When you include a file, you can either give it a path name to the file or you can give a URL to the file. I’ll list both here.
<!–#include file=”/some/path/above/my/web/to/my/header.html” –>
This is an example of how to include a file based on its path name. Now,
here’s the same file put included with its URL.<!–#include virtual=”/to/my/header.html” –>
And this is an example of how to use a URL. With a URL however, it cannot be a complete URL such as http://www.somesite.com/somefile.html. It has to be within your current website. You can also use the URL method to run a CGI script! Here’s an example of that:
<!–#include virtual=”/cgi-bin/somescript.cgi?myfirstarg=1amp;mysecondarg=2″
–>As you can see, we can even pass arguments to the CGI script just as if you typed it into your browser! There is also another way of running a CGI script but this is not as widely used any more and you should use the #include virtual method instead. Here is the same example so that you will know what it means when you see it.
<!-exec cgi=”/cgi-bin/somescript.cgi?myfirstarg=1amp;mysecondarg=2″ –>
As I mentioned earlier, you can use SSI to display the current time and date. Here’s how:
<!-echo “$DATE_LOCAL” –>
This will display the current date and time. SSI is usually used when you want to have a standard header or footer on each page. It’s also used for displaying rotating banners or page counters. As you see above, you can also use it to display the current date and time or the date when the page was last modified.
SSI has also been used for cloaking and some tracking software uses SSI to track each incoming hit to the web page. If you would like more information about SSI, go to
http://www.apache.org/docs/mod/mod_include.html. This is the definitive guide on SSI on the Apache web server.Most other web servers that use SSI also follow these conventions.
Article written by Lee
-
How To Use ALT Tags On Your Sites
One simple technique can improve your search engine rank, make site navigation easier, and increase the accessibility of your site to disabled visitors. Yet, as many as 78% of sites don’t use it! Boost your site’s profile with human visitors and search engine spiders with the <ALT> tag.
Inserting ALT Text
Adding <ALT> descriptions to your <IMG> tags is quick and easy. You don’t have to do any complex HTML coding. If you can describe your image or link, then you can add ALT tags to your code.
We’ve used some examples below:
<img src="thumbnails/porn.jpg" width="100" height="78" ALT="Explicit Teenage Sex Pictures">
You can also include an ALT tag when your image is a link:
<a href="porn.html"> <img src="thumbnails/porn.jpg" width="100" height="78" ALT="Explicit Teenage Sex Pictures"></a>
Ideally, your ALT text descriptions should be complete sentences, rather than a list of keywords or obscure phrase like “company logo small 2.” Remember that all visitors are likely to see (or hear) some version of your ALT text so be sure that it’s meaningful.
Optimize ALT Descriptions For Search Engines
Besides helping human visitors, ALT descriptions help you rank higher in some search engines. AltaVista and Google are two of the search engines that use ALT descriptive text when they rank Web sites. The growth of search engine/directory partnerships means that a high rank in one engine can often translate into an improved rank on its partner sites.
Search engine algorithms calculate the number of times keywords are repeated and give higher rank to pages that use them often. Keywords in the ALT descriptive text help you increase their frequency on the page. Search engines assume the terms are more relevant and important if they’re used in the page content, not just listed in the META tag.
For instance, the descriptive text in the example code uses keywords and keyword phrases from the META keyword tag: Explicit Teenage Sex Pictures. Since these are relevant to the site’s content, they’re easy to include as descriptive text.
If you’re having problems choosing relevant, targeted keywords, refer to this article, How To Pick Your Keywords. It provides helpful tips about selecting keywords and using them to improve your search engine ranking.
Make Your Web Site Sticky
ALT tags help you promote your site in another way too: they help make it “sticky.” Sticky means that visitors stay at your site longer so they see your advertising and purchase your memberships. Visitors who feel comfortable at a site will stay longer – and hopefully return more often to make further purchases.
Disabled visitors who use text-only or spoken word browsers rely on the ALT text for clues about the image’s content and function. This can be a lucrative audience: they represent a worldwide audience of 750 million and spend twice as much time online as the average user. But it isn’t just a disability issue: ALT tags make your site more accessible to everyone.
Visitors see your ALT text while the images are downloading or when they mouse over images. The descriptive text helps them decide if they want to wait for an image to download or move on to a different page. If your image is also a link, then visitors can read the explanatory text and quickly jump to the section they want.
Site navigation is easier, so impatient visitors are less likely to leave the site.
Don’t Follow The Crowd
ALT tags are a small addition to your HTML code that can make a big impact on your site. Since many of your competitors don’t use them, give your site and edge and include them on all images.
Article Written By Lee
-
Using .htaccess Effectively
The .htaccess file is an ASCII text document that can be placed in any directory on your site. It can be used to control access to files and directories, and customize some server operation in your site. A .htaccess file can be created in any word processor but must be saved as text only. You must use FTP software in ASCII mode to upload or edit your .htaccess file. For the examples provided here, place the .htaccess file in your root directory.
There are a variety of functions that you can control using .htaccess some of the more useful of these are explained below:
Custom Error Messages.
Add the following to the .htaccess file::
ErrorDocument 404 /notfound.html
After “ErrorDocument” specify the error code, followed by a space, and then the path and filename of the .html file you would like to be displayed when the specified error is generated, each specific error code is detailed below with the recommended codes to be used in the .htaccess file in bold :
200 OK
206 Partial content
301 Document moved permanently
302 Document found elsewhere
304 Not modified since last retrieval
400 Bad request
403 Access forbidden
404 Document not found
408 Request timeout
500 Internal server error
501 Request type not supportedUsing the codes above your error section of the .htaccess file should look like this:
ErrorDocument 301 /notfound.html
ErrorDocument 400 /notfound.html
ErrorDocument 403 /notfound.html
ErrorDocument 404 /notfound.html
ErrorDocument 500 /notfound.html
ErrorDocument 501 /notfound.htmlRedirect to a Different Folder.
Add the following to the .htaccess file:
RewriteEngine on
RewriteRule ^/oldfolder(.*)$ /newfolder/$1 [R]This redirects the user from /oldfolder/anyfile.html to /newfolder/anyfile.html, when the .htaccess file is uploaded to the otherwise empty “/oldfolder” directory.
Denying User Access.
Add the following to the .htaccess file:
<Limit GET>
order allow,deny
deny from 000.00.00.
deny from 000.000.000.000
allow from all
</Limit>This is an example of a .htaccess file that will block access to your site to anyone who is coming from any IP address beginning with 000.00.00 and from the specific IP address 000.000.000.000 . By specifying only part of an IP address, and ending the partial IP address with a period, all sub-addresses coming from the specified IP address block will be blocked. You must use the IP addresses to block access, use of domain names is not supported
Redirect a Machine Name.
Add the following to the .htaccess file:
RewriteEngine On
Options +FollowSymlinks
RewriteBase /
# Rewrite Rule for machine.domain-name.net
RewriteCond %{HTTP_HOST} machine.domain-name.net $
RewriteCond %{REQUEST_URI} !machine/
RewriteRule ^(.*)$ machine/$1This will redirect requests for the machine name machine.domain-name.net to the directory machine on the site domain-name.net.
Different Default Home Page.
Add the following to the .htaccess file:
DirectoryIndex filename.html
Then a request for http://domain-name.net/ would return http://domain-name.net/filename.html if it exists, or would list the directory if it did not exist.
To automatically run a cgi script, add the following to the .htaccess file:
DirectoryIndex /cgi-local/index.pl
This would cause the CGI script /cgi-bin/index.pl to be executed.
If you place your .htaccess file containing the DirectoryIndex specification in the root directory of your site, it will apply for all sub-directories at your site.
Preventing Hot Linking.
Add the following to the .htaccess file:
# Rewrite Rule for images
RewriteCond %{HTTP_REFERER} <URL of page accessing your domain>
RewriteRule ^(.*)$ http://<same as above URL>You would replace the <URL of page accessing your domain> above with the domain name and path of the page that is referring to your domain. For example: www.theirdomain.com/users/mypage/
The RewriteCond directive states that if the {HTTP_REFERER} matches the URL that follows, then use the RewriteRule directive. The RewriteRule directive will redirect any reference back to the referring web page.
Using the above you should, safely be able to publish your sites on the internet knowing that you will not be privy to bandwidth thieves via hotlinking and also, that you will not lose any traffic through pages that are ‘not found’.
Article Written By Lee
-
The Web Safe Color Palette
The “Web Safe” palette is a bit controversial. It is a set of 216 colors that are, supposedly, guaranteed to appear as intended on all graphical displays when used in HTML, CSS, and images embedded in Web pages. Many Web developers believe that sticking to these colors is one of the holiest commandments in the Web design scripture.
This was mostly a concern when most computers had 8-bit color displays; these days, most people run at 16-bit or 24-bit color. Although these bit-depths render the Web Safe palette pointless, dithering and quantification bugs in browsers and operating systems still cause problems in 16-bit displays (16-bit display, also known as “High Color” mode or “Thousands of Colors,” is generally problematic). Extensive testing has led to a new palette, called “Really Safe,” whose colors are guaranteed to appear correctly on all displays and all browsers.
If you use different colors than these, you might see images and backgrounds of the same color appear at a slightly different tint, so that a “box” will be visible around them if the background extends beyond the image’s edges.
Below is the table of ‘Web Safe’ and ‘Really Safe’ colors, you will see some of the color hex codes are in red, these are ‘Really Safe’ colors.
Code Color Code Color Code Color Code Color Code Color Code Color 000000 000033 000066 000099 0000cc 0000FF 003300 003333 003366 003399 0033cc 0033ff 006600 006633 006666 006699 0066cc 0066ff 009900 009933 009966 009999 0099cc 0099ff 00cc00 00cc33 00cc66 00cc99 00cccc 00ccff 00FF00 00ff33 00FF66 00ff99 00FFCC 00FFFF 330000 330033 330066 330099 3300cc 3300ff 333300 333333 333366 333399 3333cc 3333ff 336600 336633 336666 336699 3366cc 3366ff 339900 339933 339966 339999 3399cc 3399ff 33cc00 33cc33 33cc66 33cc99 33cccc 33ccff 33ff00 33FF33 33FF66 33ff99 33FFCC 33FFFF 660000 660033 660066 660099 6600cc 6600ff 663300 663333 663366 663399 6633cc 6633ff 666600 666633 666666 666699 6666cc 6666ff 669900 669933 669966 669999 6699cc 6699ff 66cc00 66cc33 66cc66 66cc99 66cccc 66ccff 66FF00 66FF33 66ff66 66ff99 66ffcc 66FFFF 990000 990033 990066 990099 9900cc 9900ff 993300 993333 993366 993399 9933cc 9933ff 996600 996633 996666 996699 9966cc 9966ff 999900 999933 999966 999999 9999cc 9999ff 99cc00 99cc33 99cc66 99cc99 99cccc 99ccff 99ff00 99ff33 99ff66 99ff99 99ffcc 99ffff cc0000 cc0033 cc0066 cc0099 cc00cc cc00ff cc3300 cc3333 cc3366 cc3399 cc33cc cc33ff cc6600 cc6633 cc6666 cc6699 cc66cc cc66ff cc9900 cc9933 cc9966 cc9999 cc99cc cc99ff cccc00 cccc33 cccc66 cccc99 cccccc ccccff ccff00 ccff33 CCFF66 ccff99 ccffcc ccffff FF0000 FF0033 ff0066 ff0099 ff00cc FF00FF ff3300 ff3333 ff3366 ff3399 ff33cc ff33ff ff6600 ff6633 ff6666 ff6699 ff66cc ff66ff ff9900 ff9933 ff9966 ff9999 ff99cc ff99ff ffcc00 ffcc33 ffcc66 ffcc99 ffcccc ffccff FFFF00 FFFF33 FFFF66 ffff99 ffffcc FFFFFF Hopefully, you will find a use for the two different color palettes that are now available and, you can begin designing for your surfers, regardless of which browser they use.
Article written by Lee
-
The Curse Of The Broken Image
At one time or another we have all done it, uploaded a new site only to find out that when we view the page in our browser one of the images are broken because we either didn’t link it properly or the filename wasn’t named correctly on our server.
We may think that this is a bad thing however, recent experimentation on my part has found quite the opposite.
We all search for new ways of getting the surfer to visit our sponsors in order to have them buy a membership and earn us a nice little slice of $$$ in the process but, what methods could we use that quite simply are overlooked?
One such method is that of utilizing broken images, lets be honest here, no-one wants broken image son their site, it makes the site look unprofessional but, lets think about this, on a page full of banners and graphics all nested together neatly on an FPA (Full Page Ad) what’s more likely to grab the surfers attention, a completely loaded heavy bandwidth graphic or a single solitary broken image placed in a such a spot the surfer actually notices it?
Makes you think doesn’t it. Our recent testing of this method has actually shown that our CTR (Click Through Ratio) rose slightly on a couple of sponsors we used this method on all of the sites in question had nice looking text and banners with corresponding thumbnails leading tot he full size image but, upon deliberately leaving an image off the server thus resulting in the ‘appearance’ of an erroneous broken graphic the spot where that image should have been was were a great deal of our click throughs came from.
I am not saying you should immediately go and delete all graphics from you pages but, a single, well placed broken image on a free site can work wonders in getting traffic off your site and to your sponsors pay site tour which ultimately, is what we want to happen at the EARLIEST possible time.
Article written by Lee
Premium Sponsors
Categories
- 2257
- Billing Solutions
- Blogging
- Branding
- Content
- Domain Names
- Employment
- Forms & Contracts
- General
- Hosting
- Link Lists
- Opt-in Mail
- Paid Traffic
- Pic Posts
- Promotion
- Scripts
- Search Engine Optimization
- Sponsors
- TGP
- Traffic
- Tutorials
- Viral Marketing
- WebDesign
- Writing