21 Aug 2011 5 Comments
Part of My Work on EEPIS New Site
About two months ago I designed a new theme for Electronic Engineering Polytechnic Institute of Surabaya (EEPIS). There are some requirements for the new theme, one of them is to simplify the menu and its contents. EEPIS is one of the best polytechnic in Indonesia which has so many information to share on its website, and I have to make it to look simple at first look.
Before I discuss the new look of EEPIS site, below is the screenshot of previous theme.
For the new theme, I decided to use a large picture for its background as it is become a trend in recent years and also EEPIS has a beautiful building which is great to use as a background. The background will stay on its position when user scroll down their screen. This is the result of my design.
To make the background stay on its position when user scroll down their picture, I use “fixed” for “position” in my CSS and put the style on the outer div, before my wrapper div. For example like the div below:
<div id="page">
<div id="wrapper">
<div id="header"></div>
<div id="content"></div>
<div id="footer"></div>
</div>
</div>
I put the background style on div page and below is the CSS script to make background stay on its position
#page{
background: url(images/myimg.jpg) no-repeat center center fixed;
width: 100%;
display: table;
padding-bottom: 15px;
}
To simplify the menu, I use mega menu to make it look elegant and simple. I use the tutorial from tutsplus and this is the result.
So, I need your comment for this new design of EEPIS site. It is possible that EEPIS will need another theme by the time they have a new logo.
Aug 21, 2011 @ 16:18:15
So, finally I’ve found the one who designed eepis site. What a good work. ^_^
Aug 21, 2011 @ 16:43:37
Thanks Andika…
Sep 06, 2011 @ 15:42:43
A good design,
Sep 07, 2011 @ 14:08:37
hoho.. just as I thought.. the designer is my-sensei.. remember the first time you ask me?
D : “what do you think about this website?”
Me : “not so good”.
D : “great. the designer is here. it’s me”.
Me : “!#@$!%#$^$%^&%#$$TT{>L:L:”}{[p)&#^@”
Sep 15, 2011 @ 12:44:12
Great