Meanwhile, at home, I managed to create a far more realistic web page layout using photoshop.
In this design, I used various tutorials which i shall later discuss. Anyway, I quite dislike the pattern of the menu button. It looks rather unprofessional. Also the rainbow does not seem to blend with the mild blue of the bottom. However, my basic ideas are there. In this website, the student is able to click the menu and have several options drop down, such as the syllabus, the image gallery etc. I still havent decided if i want to menu to flow horizontally or vertically. Also, down in the corner, there is a search engine. There is also a login box near the top, however it looks extremely out of place. Once the student logs in, they will be able to see bookmarked courses and information about them. I haven't really thought about that yet either.
I used a tutorial from
http://psd.tutsplus.com/tutorials/tutorials-effects/quickly-build-a-abstract-background-of-colored-bars/
to build the rainbow bars at the top
Also, I used this website http://home.zonnet.nl/epragt/tutorials/photoshop/texture/gold/index.jsp.htm to create the gold texture on the button. I doubt the final button will have this texture. It looks very unprofessional. It shall be a rollover button. Perhaps it will be an image instead of a mere box.

Finally, i used this tutorial for the main background. http://www.drquincy.com/blog/stripy-abstract-wallpaper-in-photoshop/ However i dislike the little lighter and darker patches. It would be ideal to get rid of them.