HTML Project
Suggestions & Hints & Comments
and How to Avoid Problems/Errors
Suggestions
- You may use either a simple text editor (Notepad) or you may use any HTML editor (DiDa HTML Editor & Viewer, HotDog, HTML Writer, Web Wizard, MS FrontPage, DreamWeaver, etc.).
- Write your page, save it and then thoroughly test it out before uploading (posting) it. (= debug offline)
You must also thoroughly test your page out after uploading (posting) it. (= debug onfline)
- Your main page must be called index.htm
- Use an FTP program to upload your files to the server.
-
- Your homepage must be index.htm, not homepage.htm or index.html, etc...
- All your filenames must be in DOS 8.3 format.
- All your filenames must be in lowercase (NOT UPPERCASE) characters.
- If your HTML code refers to a file that is not there, the user will get an error message. Be sure to test/debug every part of your HTML files.
- index.htm must be your main page
- File names must be in DOS/ASCII format: 8.3 lowercase:
- White space:
- Please put each new item on a new line (when using Notepad).
- Please feel free to put blank lines between structures.
- Please indent 3 spaces (= a tab). (lists, tables, etc.) This makes it much easier to read and debug the code.
- You must have both local links (e.g. href="index2.htm") and remote links (e.g. href="http://www.remotecomputer.com/folder1/folder2/filename.htm")
- Personal information: You should not put your address, telephone number, social insurance number, credit card numbers, passwords, etc. on the Web for the world to see.
Local references (and absolute references)
- DON’T DON'T DON'T make any absolute local references to a drive (A: B: C: etc.) (file://a|/…)
- If you must make reference to a directory, make sure the directory is available for your posted homepage. (i.e. Make sure the directory is also on the web server.)
- DON'T DON'T DON'T make any absolute references to refer to any file in your website. These are local files. Just use the the filename (href="mypage.htm")
URLs
- Use lowercase (not uppercase) all the time. Addresses are often case sensitive.
Underlined text
- NEVER use the <u> tag.
- If text is underlined, it should be a hypertext link.
- This is very very bad. You should never underline text. This is very very bad. You should never underline text. This is very very bad. You should never underline text. This is very very bad. You should never underline text.
English
Debugging
- Debug = Check everything to see that it works and looks the way it should. = Debugging
- Broken link = You click on the link but no page is loaded (because the link was spelled wrong or because the page does not exist).
OR
There should be a graphic (<img src=...>) but it does not show in the HTML document (because the link (src=) was spelled wrong or because the graphic does not exist).
- Make sure all files you refer to are in the same directory on the server
- Use your browser to go to your home page. If it doesn't work for you, it won't work for anybody else.
- Please test your page before you post it on the Internet. (offline)
- Please test your page after you post it on the Internet. (onfline)
- Remove your USB pen drive (or remove your diskette from drive A):. while you are testing your page on the Internet. Your HTML pages may be accessing your USB pen drive or your floppy disk. Once all your files are uploaded to the Web Server, you will be the only person in the world with that particular file on a local drive. That means that your Homepage will not work for anyone else in the world. This warning is also true for files that you have on your computer's hard drive.
- Make sure all files you refer to are in the same directory on the server
- Test out every single link. If it doesn't work for you, it won't work for anybody else.
- Format your program correctly. See your textbook for example code.
- Use white spaces.
- Use Tab to align related structures.
- Browser types/versions, Screen size, Screen resolution/color depth, Operating system, Browser settings
- Testing/Debugging is essential. You must do offline testing before you upload to the server. You must do online testing after uploading to the server.
- offline = not on the Internet; on a local drive or a network drive (e.g. on A: or C: or D: or H: etc.)
- online = a site on the Internet, on a remote site
- Errors
- syntax errors
- logical errors
index.htm
- index.htm
- NOT index or Index or INDEX or ...
- NOT .html or .HTM or .HTML
- Must not have any other name.
.htm
- Not .HTML or .html, because DOS-based systems cannot read this extension.
- All web pages must have a .htm file extension
Mailto:
- <a href="mailto:ImaGreatStudent@videotron.ca"> Don't forget the quotation marks (opening and closing)
- The protocol is mailto:, not http:
- <a href="mailto:… Don't forget the terminating ">
- mailto:Ima Student@videotron.ca ….. No spaces allowed
- mailto://….. No slashes or backslashes allowed
- E-mail link
- WebMail link should be <a href="mailto:A999999@yahoo.com">Ima</a>
- WebMail link should NOT be <a href="http://www.yahoo.com">Ima</a>
Background
- Some colours and images make the text difficult to read. Please test your own page using a browser.
- Try accessing your page from someone else's computer. Does it still look great?
- Don't use white or light characters on a dark background if you plan to print out your page. White characters are very difficult to see on white paper. Avoid white characters.
- Never use reverse font (white text on a dark background)
- Dark blue or dark red on a black background is practically invisible. Avoid black backgrounds.
http:
- http://www….. NOT http:www…….
Content
- Personal Information
- NEVER NEVER NEVER post your home address, telephone, number, SIN, credit card numbers, or other personal information on the Internet.
- Your name must be on the site. You must identify yourself as the author of the site.
- Never post a message that the page is under construction. All pages are always under construction. You should never post a page that is not ready to be posted.
- Must be appropriate for CEGEP students (and their parents)
Plagiarism
- Do not copy someone else's file from the Internet into your directory (unless you have written permission from the author). You should make a link to that person's Web page. If this is impossible, you should, at a minimum, give credit to the creator of the web page.
- Copying...
Graphics
- Put all graphics in JPG or GIF or PNG format. JPG files are smaller and load faster.
- Do not use BMP graphics format.
- Use a graphics viewer to convert files from one graphics file format to another graphics file format. You can also make your graphics files smaller, or reduce the definition or number of colours.
- Graphics load slowly. The larger the graphic file(s) the slower your page will load. Be considerate. Don't make your audience wait unnecessarily. Try using a smaller version of the graphic, or just put a link to the graphic.
Other Suggestions
- Your HTML Project files must be the only files you submit. Make sure not to submit your files from other courses or assignments.
- Make a backup of your files. Do not submit your only copy of the files. The files will not be returned to you.
- Rename any files with a tilde (~) in the filename. If you worked on a computer with Windows or MacOS, your filename may be too long. Rename all files to the DOS standard of 8.3 (up to 8 characters in the filename and not more than 3 characters in the filename's extension).
- Don't copy HTML files or graphics files (or any other files) from another web site, unless you have legal authorization. Plagiarism is illegal. All the files on your website should those you created all by yourself. However, there are many sites that allow you to legally download files (graphics, etc.).
- White characters on a white background print out as nothing. Black on white prints out quite nicely.
- Background colours and graphics often do not print. You will see them on the screen, but you will see nothing on the printout.
- Page Width
Strategies for a successful Web site:
- Keep it simple
- Use neutral colours. Never use a black background.
- Make it fast. Avoid unnecessary GIF, Flash, animation or plug-ins.
- Give directions. Visitors can get easily confused on a complex site. Keep the site's architecture simple. Always give the visitor a way back to the main page. Keep the site consistent by having items such as navigation bars in the same place on each page.
Even More
Suggestions & Hints & Comments
and How to Avoid Problems/Errors
- No blinking text, svp. Blinking text is very annoying.
- Spelling and grammar. Use the spell checker & grammar checker included in your HTML editor or your word processor. You can also ask your parents and friends to double-check your work for you.
- Punctuation. There is no space between the word and the punctuation mark (,.;:?!"). There must be two spaces after a period or colon or exclamation mark or question mark. There must be one space after a comma or semicolon. All punctuation must be inside any quotation marks.
- Put the period at the end of the sentence. Put a comma after each item, item, item, or item.
- This is what he said: "I'll be back!"
- Sources. You must have a section or page to document where you got your ideas, sites, graphics, code, etc... Indicate which work is an original creation by you. Indicate which material was borrowed or inspired by another site. Give the URLs of your sources. (citations)
- If you don't give credit to your sources then you are guilty of plagiarism!!
- Copying...
- Editor. Please indicate how you created your masterpiece. Which software did you use? (Notepad, Front Page, Paint Shop Pro, etc...)
- WDVL: Timeless Typography
- Mail link alternative
- Include an e-mail link on your page (to contact you).
- Suggestions