Website Template

We need to design and code (HTML & CSS) a template for our new website.
We already have logo designed and ready to use – see attached (dobovo_logo.jpg). Can send PSD and/or EPS files.

1) Common things and preferences
Here’s the website which we like a lot in the mean of webdesign and would like our website to have design almost exactly like it: http://www.tourpartner.com.ua (will call it ‘tourpartner’ in the future).
We need to have well-structured HTML, CSS and JS files as a result of this project in order for our programmer to be able to implement these templates into the system which he almost finished.

2) Homepage template
Attached you can see the approximate look of the homepage which we’ve done in photoshop on a fast hand, but you can see the placement of boxes on the page.
The design of the header should be exactly like on tourpartner – with light nice clouds, our logo and box for information which you can see.
‘UAH – Ukrainian Hryvna’ – this should be in a nice select box as this is where customers will change currency on the website.
The same is for switching language at the bottom-right side of the header – it should be like on this website: http://www.venere.com (see the bottom-right side of the header).
the main content of the website should be 980px in width – actually you can take widths of boxes from ‘tourpartner’ website.

BOX WITH A SEARCH FORM:
The top-right box on a front_page_001.jpg is a search box with a header of ‘Find Apartments!’ and this box should be in the same style like top-right box on ‘tourpartner’ where you can see mail, mobile, credit cards icons – it should be on a blue background with white content and yellow Search button. Basically the content of the form we need to be the same as a search box on the following website: http://www.redappleapartments.com/ (you can see the form at the right side near the map). Fields in the search box:
‘City’ – it’s a select box to choose a city (instead of ‘destination’ on redapple website)
Check-in and Check-out – should be calendar fields like on redapple (this is where I think should be JS which you can take from them or anywhere in the internet) and ‘nights’ field should be calculated automatically according to check-in and check-out dates (it’s the part of the above mentioned JS as I understand)
We don’t need ‘Guests’ field, so the last field is ‘Bedrooms’ – it’s a select box to choose between: Studio, 1, 2, 3, 4
And there should be a nice Search button in yellow color (from our logo).

BOX WITH HOT OFFERS:
The design of this box should be like the design of the box at the right side of ‘tourpartner’ where you can see ‘city -> price -> button’.
There should be a title of “Hot Offers” above the box with yellow border. The approximate content of this box you can see on a front_page_001.jpg – or maybe one photo at the left, then ‘Address’, ‘Type’, ‘Price’, ‘Conditions’ information at the right side near the photo and a nice yellow button ‘Details…’ at the right.

BOX WITH A MAP:
The header of the box should be on a blue background to keep the same style like on ‘tourpartner’ (our header is where you can see airplane, suitcase and flag icons on ‘tourpartner’ website). The title in white color: ‘Get apartments list by clicking on a city below’. Below this header there should be a map of Ukraine with clickable cities (there should be just 3 cities for now: Kyiv, Lviv and Odessa). You can take a map itself from front_page_001.jpg or find one in the internet. The style of the map should be exactly like the style of the map on http://www.redappleapartments.com/ – the map should be gray and country borders should be thin and white, cities should be marked by a circle and a name – both circle and city name should be clickable (by the way, you can see that redapple website has exactly cities in Ukraine we need – Kiev, Lviv and Odessa – so, it will be easier for you).

The bottom of the page should be a actually like a bottom of the redapple website:
First column – header(link): Main Page, links: About us, Help, Contact us, List your apartment
Second column – header(no link): Destinations, links: Kyiv, Odessa, Lviv
Third column – header: Hot Offers, links: Kyiv, Odessa, Lviv
And at the right side (like on redapple website) should be our logo, contact information below, and (c) 2010 Dobovo.com, (c) All rights reserved.

Leave a Reply

Your email address will not be published. Required fields are marked *