| Elements of a Good Page | |
||||
|
Back Meta
Tags |
First of all,
before you do anything, you're going to have to decide how you're going to
go about creating your site. There are a few ways to do this.
This can range from a WYSIWYG (What You See Is What You Get) web editor,
such as Microsoft Frontpage or Macromedia Dreamweaver, which writes the
HTML for you as you go, or write the code yourself. Depending on
what stuff you want in your page, the decision can vary, or even
incorporate both methods, because there are some things you can do in one
that you can't do in the other. For beginners, I'd suggest something
like Frontpage or Dreamweaver to get used to how everything works in HTML,
and which also allows you to see the code. The more modern WYSIWYG
editors like Frontpage 2000 (which I use in conjunction with my own code)
can easily incorporate more interactive
features, such as a Flash animation, video, Dynamic HTML and
even some limited javascript. However, the capability to add such
features in these editors is limited, and is sometimes better to write
your own code if you want extensive interactivity. If you want to write
yourself, it is usually best done in an application such as notepad, and
is definitely for those who are more familiar with webpage designing and
used to writing the code. Writing yourself allows you to add some of the
more fancy features that the WYSIWYG editors haven't developed yet, if you
know how you do them. Self-written websites often look better because of
the almost unlimited number of commands and parameters that can be set,
but take al lot longer on average than other methods.
|
| Meta Tags: Meta Tags are the things that let search engines recognise your site, and allow them to display your site as a result for a particular search that a user might perform. They are extremely important if you want as many people to view your site as poccible. Meta Tags are found in the <head> section of HTML code and usually look something like this: <META NAME="Author" CONTENT="Shahin Danesh"> <META NAME="Description" CONTENT="Game8.Com Emulators and Roms, also many Java Games and Free Stuff and lots MORE !"> <META NAME="KeyWords" CONTENT="Nintendo ; Sega ; Playstation ; Games ; Cheats ; Cheat ; Gameboy ; Emulator ; EMulators> As you can see, each META tag has a name, and then a description in its following CONTENT section. These are just a sample of the most common META tags used, and are really the only ones necessary. The "Author" tag should have the name of the Author of the site (you), while the "Description" tag will show up as a description of your site when it appears on a search result. Try to keep this description as brief as possible, as engines only use about the first 20 words of a description. Finally, the "Keywords" tag is the really active one. You can have as much as you want in here, because this is the tag a search engine scans to see if there is any information relevant in your site to what the user has inputted. The more matches , the higher your site will appear on the results page. Each keyword is separated by a space, a semicolon and another space. Check out my source code for another example.
Interactive Content:
|
|
| Page Balance: 'Balance,' in web terms is usually used to refer to the balance of text and other elements on a page, and is essential to a good website. By 'other elements' I mean pictures, animation, background, and even the colours and fonts on a page. However, first of all, it's important to strike a balance between text and things like pictures and animation on a page. You should try to design your page so that neither text or pictures, etc dominate it. This page itself is very bad at this as it is very 'text heavy' and has about one picture on it at the moment. Try and aim for about a text to picture ratio of about 4 or 5:1 as far as page area goes. When you've got this down pat, you should make sure that you don't have too many colours on the page. I don't mean colours in the pictures you've inserted, but main colours on the page, such as that in the background and headings, etc. Try to keep it to about 3 or 4 max. The same applies with fonts. Don't use any more than 3 or 4 and try to avoid small fonts like Brush Script MT, which are hard to read. Page 'weight' is also very important, and has been mentioned a couple of times already on this page. It refers to the size of the page, and how quickly it loads. Something to aim for as far as this goes is about 60kb or so if possible. |
|
| Format: The format or layout of a good page should also be consistent, and shouldn't jump around for every page that is visited. Things like the background, text and hyperlink colours should be kept at the same size and colour if at all possible throughout all pages. Depending on wether your site is more formal or casual, you may choose to use fitting formats and conventions. The layout of a website should also be consistent with the content of that page. A website should be kept 'clean' with all links and images in places where they can be easily identified, and not cluttering up a page. |
|
| Testing: One of the most vital parts of web design is to test the final product to make sure everything works, and looks good. Testing can be done as you go, or at the when the page is finished. I choose to continually test and view my pages so that I can iron out any bugs as I go along, rather than having to re-design three quarters of my pages at the end. When testing, you should firstly test all of your links (preferably in a browser), to make sure everybody's going to be able to access all your pages. Look for mistakes or typos in text. Secondly, you should check your site for cross-browser compatibility. This is important because, for example, a page that looks good in Internet Explorer won't necessarily look good in Netscape. Because of the different browsers, pictures can end up halfway down a page, or text may appear larger or smaller than what you wanted. It's best to try and view your website in both kinds of browsers if at all possible. Also, allow for people with older browsers, such as IE 3, which may not support things like Java or DHTML. |
|
| Do's & Dont's: Do:
Do Not:
|
|
