1 page PSD to HTML - with potential for future work
$30-250 USD
Completed
Posted over 11 years ago
$30-250 USD
Paid on delivery
This PSD needs to be turned into a HTML page using Twitter Bootstrap for some components.
Each component is stored separately in the PSD.
You need to include all elements from the PSD in the HTML.
Notes:
- Text inside e-mail box does not need to be added, this will be added afterwards.
- The “I want to” section with the check boxes needs to appear later, so they should be in a separate block (with the style “display: none”). There is another smaller yellow layer that should be shown in place of the checkboxes while they are hidden.
- The “days until launch” number should be in a separate element so that it can be modified independently.
- There are hover states for various items in the tree and the social media icons at the bottom, as specified in the PSD. Both the hover and non-hover states should be included in the HTML with the hover states having CSS “display: none”.
- The yellow dots (top and bottom), the notesy logo and the sub titile should each be separate elements.
- Sensible class names must be applied to all elements, and elements must be wrapped in DIVs as appropriate
- You will need to cut up the background image into repeating images. You should create one horizontal image that includes the two red margins, and one of the horizontal lines, as well as the white space. This can then be repeated vertically down the centre to form the background. Additionally, you must make another repeatable image that is the height of one line (in the background) and is 1px wide, so that it can be repeated in the sides of the browser, extending the ‘notebook’ effect right to the edges.
- All images should be included in the page by means of CSS attributes. Don’t use IMG tags unless necessary.
- The fonts in the page are specified by the CSS: “font-family: Courier New, Courier”, you should include DIVs with the text and CSS fonts applied, No text should exist in the images (with the exception of the ‘notesy’ logo, and the textual parts of the tree/clock).
- All images should be exported as PNGs (of course, with transparency where necessary).
- Twitter bootstrap must be used for the the elements: Email textbox, 3 checkboxes below the textbox - using appropriate LABEL tags as per Bootstrap examples. [login to view URL]
- Must be W3C validated - if it cannot validate, you must have a good reason.
If you do a good job on this page, we will be looking for many other pages to be converted in the near future.
Feel free to ask questions if you require clarification.
Greetings for the day....! I am ready to work on this project.... i am very good in web designing , logo designing , graphic design and also good in open source like wordpress , magento , joomla.... i am in this field from last 5 years......... so please see your private massage box...