Website ContentsMake a website for your robot. The website must include the following information;
- Home Page. (index.htm) with student's name, robot name, contents or navigation, and at least one full image of your robot.
- Description Page. Images and descriptions of your robot - showing what it is and what it has in it.
- History Page. A brief overview of what you went through and how you arrived at the final design. List problems you had and things that didn't work out.
- Improvements. Describe how your robot could be improved, and outline three areas of further development to improve its performance.
- Costing Table. List all the costs for parts, batteries etc in a table. Each part must be named, with sources stated and numbered to a matching assembly drawing.
- You website must contain the following:
- CAD produced images and drawings (converted to images such as jpg or png).
- Photos of the finished robot and during construction.
I recommend Kompozer Portable (6.7MB). Download
It is a free WYSIWYG web page program, like Microsoft FrontPage, Adobe DreamWeaver etc. Save it to your USB memory stick and extract. You can run it anytime directly from the USB drive, without ever needing admin password to install the program on the college computer. This type of software is called "portable" because it does not require installation, so it can be moved from computer to computer, or even run directly from your memory stick.
Pictures and FormatingAlthough Frontpage (or any WYSIWYG web page program) is very similar to Word, there is a big difference between Word files (*.doc) and internet files (*.htm). On the internet the pictures are saved in separate files. This keeps the downloads smaller and quicker because you can start reading a page before all the pictures have arrived.
This is where it is very important to keep yourself organized. This is what the files used in THIS page looks like on the hard disk (see below). I made a folder for the whole thing (I called it Website). Inside this folder there is the homepage index.htm and another folder for the pictures - called index_files.
So here are the pictures inside the index_files folder...
Take care with the type of picture files too. You will notice that the files01.bmp is 129kB. This is very large for a web picture. When I converted this files to a gif it was 22kB. Try to keep them around 20 - 50kB. (jpg, gif and png are compressed image formats so they are much smaller filesize)
jpg This is best when you have graduated colours (gradients) - like a photograph or a 3D picture from CAD. Non-transparent.
gif This is best for line drawings and solid colours like charts, comic style pictures. Transparency
png Similar to gif but improved image quality. Sometimes it can smaller than jpg, usually for non-gradient images. Transparency.
When you upload the files, you must keep them in exactly the same arrangement of folders as you have on your computer.
How to grab a picture from the ScreenAt any time while using (almost*) any program, you can take a "photograph" of what is on the computer screen.
* Some applications, such as some computer games or video, will not copy this way.
Simply press the Print Screen key (which is directly above the Insert key on your keyboard).
This will place an image of what is on your screen into the Clipboard. To place this image into a document, simply choose Paste from the Edit menu in the application you are creating your document in (be it Microsoft Word, Frontpage, PowerPoint, Adobe PhotoShop or whatever). If you paste it into an image file using a graphics package, such as PhotoShop or PaintShopPro, you can do all sorts of things to the picture:
Example of grabbing a picture from SolidEdge.
- Set up your CAD view with appropriate background, no reference planes, anti-aliasing, perspective, textures etc etc. Once you have it looking right and zoomed to size you want it on the webpage, press Print Screen
- Open Paint. Start > All Programs > Accessories > Paint
- Edit > Paste. The whole screen is now shown inside
- Select the bit that you want, using the rectangular
select window. The Edit > Cut
- Start a new Paint document. File > New. (Make sure the blank picture is small, then it will zoom up automatically to your new picture size). To set this smaller size use; Image > Attributes > 5x5 pixels (or something smaller than your image). Paste the cut picture Edit > Paste (or Ctrl-V).
- Save as jpg. Here it is...
Hosting Your WebsiteHosting a website: This is when a copy of your entire website folder is stored on an internet computer (server). This is like sending files to an external drive, but the 'external drive' is on a computer somewhere - and that drive is open to the internet (i.e. It can be read by everyone on the Internet).
You need to find a free website host. (Don't use an ISP website because they don't usually last very long).