W3C home > Mailing lists > Public > public-webplatform@w3.org > April 2013

Re: Wire Frame for the web site

From: Chris Mills <cmills@w3.org>
Date: Tue, 23 Apr 2013 10:22:34 -0400
Cc: <public-webplatform@w3.org>
Message-Id: <7450E027-D4F6-4563-A329-AAAFF01EC6A7@w3.org>
To: <wpd@theherzes.com>
On 22 Apr 2013, at 14:46, "David R. Herz" <WPD@theherzes.com> wrote:

> I have been looking, not very hard I will admit, for how I set the width of
> my web page.  I have been wandering the beginner stuff, the HTML, the CSS,
> and then I arrived at the Planning a website page.  It suggests that the
> normal process behind planning a website is 1. Having the idea (we've got
> that) and 2. Wireframing the site's layout.  Do we have a wireframe model
> that I can view, especially for the beginner side?

I will be adding this to the beginner's article series, for sure. 

There is a wireframe model at http://docs.webplatform.org/wiki/concepts/wireframing_a_site

The basic concept is that you would design a site as a wireframe of some kind. At this point, you would choose a width for your layout, either a fixed width (such as 1024px wide for desktop, 480px for mobile, etc.) or a variable width (such as 90% of the browser window width.) This is more complicated than it used to be because of the variety of devices we now have to view the web. This is the foundation of so called "responsive web design" - making a single sit that will adapt its layout for display on different devices. But I'll leave that there for now, and just concentrate on your original question.

When you have chosen a width to make your site (let's just say 1024px for now, to make the discussion easier), you will then create your site inside a container element that is 1024px wide. This could be the <body> element, or it might be a container elements such as a <div>, depending on your circumstances. I mostly just use <body>.

In your CSS, you can set the width like this:

body {
  width: 1024px;
}

> 
> Also, I would like to suggest an index that might be more intuitive for a
> beginner.  We have an "Index of all HTML topics," but when I look there, it
> is not clear to me where I can find information for how to set the color of
> my text, the width of my page, or even something as simple as a first line
> indent on my paragraphs, or justification of my text.  When I search for
> justification, I get a dictionary definition, but am in no way pointed to
> how I would actually justify my text.

Ok, so a much more granular index of typical tasks. This could be useful yes. I agree that we need to also sort out the organization of the articles in general.
Received on Tuesday, 23 April 2013 14:22:39 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 19:13:46 UTC