In Progress

HTML5 CSS Simple Website Navigation Bar

I'm soliciting help with the creation of my website's navigation bar. I've attached a PNG of the template.

The most difficult part of this project will be constructing the navigation bar. You can see by looking at the attached PNG that the only graphics on the page are the five ink-blots and a 1pt horizontal bar. These are considered part of the navigation bar. The navigation bar will function as follows:

1. When a user mouses-over the link text (home, data, community, etc.), that text will become bold-faced. The text must be wrapped and within an ample buffer so that any bold-faced resizing of the text causes absolutely no other movement on the page. The text must also be text at all times -- no images of text.

2. When a user mouses-over the ink blot directly above any link text, the link text also becomes bold-faced and the mouse changes from the arrow to the hand (and back when mouse-off occurs).

3. The user can pursue the link by clicking on either the link text or on its corresponding ink blot.

4. The click area for each link will be appropriately "snug" so that only the area in or directly around the ink blot and text functions as a link.

Other details:

-The website title "MyWebsite" will use the font Monotype Corsiva and appear as (or near) font-size 28 by default (use of percentages or other adaptable font settings rather than a strict 28-point font would be appreciated).

-The website title will also use (or appear to use) the same center-line as the navigation text "home".

-The navigation bar text will be Courier New font-size 14 (half-as large as the header) and all lowercase;

-The paragraph text will also be Courier New fons-size 14 (half-as large as the header).

-The website content will be whithin a wrapper that is center justified on a user's screen and features sizeable margins of white-space.

Your job will be to transform this template into a website. The website will feature 5 identical pages, each featuring the header/navigation bar and 1 paragraph of Lorem Ipsum text:

1. [url removed, login to view];

2. [url removed, login to view];

3. [url removed, login to view];

4. [url removed, login to view];

5. and about.html.

CSS will be used to limit total coding as much as possible.

The website will use the HTML5 Doctype and pass validation at [url removed, login to view] with no errors and ideally no warnings.

I will provide the 5 images (PNG files) of the ink blots and an MS PowerPoint slide similar to the PNG attached to this posting.

Thank you very much for your interest and please contact me for any clarifications.

Skills: HTML, PSD to HTML, Website Design

See more: html5 navigation bar, horizontal navigation bar html5, html5 horizontal navigation bar, ink blots css, html5 navigation css, html5 navigation css simple, navigation bar html5, html5 simple page navigation, html navigation bar, html css simple horizontal navigation, www coding org, website home psd, website graphics psd, website coding help, w3 validation, use psd in html5 css, template website html5, template for simple website, slide graphics, psd a html5, powerpoint slide design help, powerpoint design help, mark job, job near me, job courier

About the Employer:
( 1 review ) Cambridge, United States

Project ID: #783378

Awarded to:

kickloop

Dear sir/madam, greetings from Pro Media. We are ready to start right now.

$50 USD in 1 day
(17 Reviews)
5.0

17 freelancers are bidding on average $117 for this job

salientcomputer

Hi Please see PMB.

$100 USD in 2 days
(184 Reviews)
6.3
chiuaua27

Check PM! :)

$50 USD in 1 day
(19 Reviews)
4.4
Reactor4

Please check your PM box.

$70 USD in 2 days
(13 Reviews)
4.0
fluxiz

Please refer to your PMB for further details, thanks.

$80 USD in 2 days
(8 Reviews)
3.6
rommaz

I have over 10 years experience in web development and am interested in your project. I still have some questions, please check PM for detailed info. Thank you

$100 USD in 1 day
(5 Reviews)
2.1
Ajun

Please check PMB

$100 USD in 0 days
(2 Reviews)
2.0
Outlancer

Please check pmb for sample designs and [url removed, login to view]

$250 USD in 3 days
(1 Review)
1.0
StrongDecs

It will be done.

$80 USD in 2 days
(0 Reviews)
0.0
thangpdtt

Please check PM

$250 USD in 4 days
(0 Reviews)
0.0
mybridgetech

I can definitely pull this off for you. You have a very clear definition of what you want and with that I can have this done in no time for you. Your site should be fun to create and I hope you work with you soon.

$100 USD in 3 days
(0 Reviews)
0.0
reynan14

we can negotiate for the price if you want

$200 USD in 4 days
(0 Reviews)
0.0
sureshsummy

Hi, This is Venkata Suresh from Hyderabad India. 6 Years well Experience in Web & Graphic Designing. Have good track record from all the clients. able to do with every task as per the web standards that is W3C / Web 2. More

$70 USD in 2 days
(0 Reviews)
0.0
Iqamd

hello sir I am a web developer and my designing skill is very high and i hope i have finished my work according to your time. Best Regards Iqbal Ahmed

$130 USD in 3 days
(0 Reviews)
0.0
davidbdr

Greetings! See PM for more details about this bid.

$200 USD in 2 days
(0 Reviews)
0.0
designsolution99

Dear Project Owner, Please look at the PM for my bid details. Warm regards designsolution

$55 USD in 2 days
(0 Reviews)
0.0
SunilTirumalaset

I'm an experienced web developer and am really interested in doing this project. Please check my PM for further details.

$100 USD in 2 days
(0 Reviews)
0.0