I have yet to write a single line of code. I am just finishing the "pencil and paper" part of the layout design.


Here is my rant/explanation of what I want to do with the website


I am only beginning to learn CSS. Do you think the whole thing is doable in Microsoft Expression Web? What other tool(s) will I need for this website? I appreciate all the criticism and suggestions I can get. This is my first post but if you see gaping mistakes, please feel free to yell at me.

Attachments psOneLayoutTwo.png 16.24 KB
6 Years
Discussion Span
Last Post by 3825


There is nothing realy wrong with your layout. It is basic.

I dont know if your drawing is to scale, but looking at your header part, I personally would give a larger size for page title, (vertically or down) and rather drop the search box next to the site navigation area, or better still, I would take the search box out of the header area and insert it into the left side bar to stay at its top at all pages.

As for the search bar how to question in your notes, to perform a search, you need a database. If you are not having a database, you can use the google search bar and set it to results on your site content only.

As for your question on Microsoft Expression Web, I have never used it, but what I read about it, it sure looks like it can do everything. Be carefull however with any microsoft product, as it sometimes favour IE browsers above Firefox and other opensource browsers, so make sure your site displays the same accross platforms.

Now, start getting that first line of code down, and come back to show us.

Good luck.


Thank you for such a quick reply! (:

The only reason I put the search box in the top right was because I read that it was the custom to have the logo on the top left and the search box on the top right. Honestly, I was questioning this to begin with but I decided not to bother with it.

I don't have a database and I guess will leave it out altogether in the first version. When it comes back, it could be in the left_col like you suggested.

I am learning the ways of Microsoft Expression slowly. Earlier, I was working with a feature to set text of the status bar. I quickly realized that neither Google Chrome nor IE9 shipped with anything like a status bar (and Firefox 4 seems to be getting rid of it too from what I see in the nightly builds).

I'll be back (probably should start a new thread) but if you or anyone would like to add something, I have this page bookmarked.


Using basic div separators you can string together that layout using notepad. I would assume that expression web should be able to recreate your layout quite easily but I recommend you learn how to div and style your website from scratch to get a better understanding.

I recently learned how to do exactly what your trying to do by notepad and it's actually quite easy to pick up. The trickiest part I found was learning how the CSS float attribute worked along with pushing your footer to the bottom with the CSS clear attribute.

If you like what I suggest post a reply and I would be happy to give you further instructions to achieving your layout.


If you like what I suggest post a reply and I would be happy to give you further instructions to achieving your layout.

I just started coding and already see different behavior between different browsers. The only "feature" I have used so far is super preview. Maybe I should not have attempted to make a liquid website when my primary focus will be text?

I don't know how to make the footer float yet and would love to hear from you on how to do it.

Here's a screenshot: using super preview. Am I worrying too much over nothing?



I guess you are worried about the colors that display different in different browsers? If so, try to use the actual color codes, and not the color names, it may help. Different pc's/operating systems/browsers may read different things in names, but should read the same thing in browser friendly codes. See here for getting color codes. You can play around with the settings at the bottom of the page and create your own shade of color.

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.