Choosing a suitable web layout for my site

I'm stuck trying to find a suitable layout style for my website and
could need some new input.
I've already read a lot about and given thought to keeping the site
clean and simple, focusing on the content and so on.

But I just can't seem to find out what kind of visual style to go for.
I know that I need to do this in CSS (I'm slowly learning), and I'm
aiming for something along the Web 2.0 styles which to me means style,
attractiveness, modern functionality in addition to a well laid out
form of content.

A little bit about my site:

- a supporting website for a mailing list (discussing a specific
computer program)
- contents: FAQ, downloadable support files, searchable list-archive,
links to other relevant sites. Basically an "information" type of site
with lots of text, but also the occasional photo or illustration.

At first I thought I had gotten the perfect idea with the dark, high-
contrast visual style which seems quite popular. A black and/or dark
gray background with a light colored text (I was thinking blue, light-
gray, white). Something like these sites:
http://macintalk.com
and
http://web.mac.com/tomohiko/
and
http://www.jahshaka.org/


But having started work on this I have a feeling this style might be
better suited for an art/photo gallery or something else where there
is a high emphasis on the visual communication rather than text.

My site on the other hand will really be the opposite; lots of textual
information, with the occasional photo or illustration related to that
informative text.
I don't know, but the more traditional white background with black
text might be more pleasing and relaxing to the visitor although I
must admit it sounds boring.
But then again I can probably make it a lot more interesting by taking
advantage of CSS (this will be my first site using CSS). Any thoughts
on this?

Every page on my site should probably contain the following (probably
in the exact same location as well):

- a graphic/textual header (which links back to the main page if
clicked)
- some sort of site navigation
- "join mailing list" form and a search form for the list archives

Then there's the FAQ page which is pretty long.
It should probably have some sort of navigation as well, allowing
users to jump right into the section they feel is relevant to them,
but a navigation bar for this would make the page different from the
other pages, so I don't know if this is a good thing.

OK, enough talk from me... what kind of layout solution would be good
for my site when I want functionality, web 2.0 type design with
emphasis on a clean, simple, modern and attractive user-interface, and
of course user-friendliness?

On Nov 8, 5:37 pm, CyberDoug <CyberD... (AT) muchomail (DOT) com> wrote:

I'm stuck trying to find a suitable layout style for my website and
could need some new input.
I've already read a lot about and given thought to keeping the site
clean and simple, focusing on the content and so on.

But I just can't seem to find out what kind of visual style to go for.
I know that I need to do this in CSS (I'm slowly learning), and I'm
aiming for something along the Web 2.0 styles which to me means style,
attractiveness, modern functionality in addition to a well laid out
form of content.

A little bit about my site:

- a supporting website for a mailing list (discussing a specific
computer program)
- contents: FAQ, downloadable support files, searchable list-archive,
links to other relevant sites. Basically an "information" type of site
with lots of text, but also the occasional photo or illustration.

At first I thought I had gotten the perfect idea with the dark, high-
contrast visual style which seems quite popular. A black and/or dark
gray background with a light colored text (I was thinking blue, light-
gray, white). Something like these sites:http://macintalk.com
andhttp://web.mac.com/tomohiko/
andhttp://www.jahshaka.org/

But having started work on this I have a feeling this style might be
better suited for an art/photo gallery or something else where there
is a high emphasis on the visual communication rather than text.

My site on the other hand will really be the opposite; lots of textual
information, with the occasional photo or illustration related to that
informative text.
I don't know, but the more traditional white background with black
text might be more pleasing and relaxing to the visitor although I
must admit it sounds boring.
But then again I can probably make it a lot more interesting by taking
advantage of CSS (this will be my first site using CSS). Any thoughts
on this?

Every page on my site should probably contain the following (probably
in the exact same location as well):

- a graphic/textual header (which links back to the main page if
clicked)
- some sort of site navigation
- "join mailing list" form and a search form for the list archives

Then there's the FAQ page which is pretty long.
It should probably have some sort of navigation as well, allowing
users to jump right into the section they feel is relevant to them,
but a navigation bar for this would make the page different from the
other pages, so I don't know if this is a good thing.

OK, enough talk from me... what kind of layout solution would be good
for my site when I want functionality, web 2.0 type design with
emphasis on a clean, simple, modern and attractive user-interface, and
of course user-friendliness?

Well first off if you want it to be WEB 2.0 I would also suggest you
use AJAX as that is definitely WEB 2.0 technology. You will need to
have rounded corners on your graphics as well which will make your CSS
more complicated as well but not impossible. I am not sure I like the
idea of the same form being on every page but that is completely up to
you. For your FAQ page you can simply use named anchors to get the job
done if it is a very large list you may want to not only use an
alphabetical list but also use back to top links as well. Your general
navigation can be done with CSS which will load faster then its
JavaScript counterpart.

Before you start to build the site you may also wish to consider your
search engine optimization as well while you are choosing the domain
name and creating a directory structure. Having keywords in the Domain
name or directory structure will give you an advantage later.

There are a few suggestions to get you thinking anyhow hope it helps.

Kevin
http://www.lakeareawebs.com

On Nov 9, 3:38 pm, Kevin <kevinlen... (AT) lakeareawebs (DOT) com> wrote:

On Nov 8, 5:37 pm, CyberDoug <CyberD... (AT) muchomail (DOT) com> wrote:

I'm stuck trying to find a suitable layout style for my website and
could need some new input.

Well first off if you want it to be WEB 2.0 I would also suggest you
use AJAX as that is definitely WEB 2.0 technology.

I've read a little about Ajax, and it sounds like a good idea although
I don't know how complicated it is to set up. If it's a server-side
sort of thing that needs to be installed I really can't do much as I'm
not in charge of the server. If it's similar to CSS or HTML I can
probably learn.

You will need to
have rounded corners on your graphics as well which will make your CSS
more complicated as well but not impossible.

Yup. I read a really good article about web 2.0 characteristics which
discussed this and various other aspects of a modern, functional
design where they call the use of rounded corners "casual design":
http://www.masternewmedia.org/inform...s-20071017.htm

I am not sure I like the
idea of the same form being on every page but that is completely up to
you.

Why don't you like the idea? All I want is the ability to search from
any page you're currently on.

For your FAQ page you can simply use named anchors to get the job
done if it is a very large list you may want to not only use an
alphabetical list but also use back to top links as well. Your general
navigation can be done with CSS which will load faster then its
JavaScript counterpart.

Do you have any example links for this so I can see what you mean?

Before you start to build the site you may also wish to consider your
search engine optimization as well while you are choosing the domain
name and creating a directory structure. Having keywords in the Domain
name or directory structure will give you an advantage later.

I actually made the site years ago and have updated it several times.
However, this time I want to go overboard and do it really well with
CSS and so on.
The site is located here: http://www.notator.org/

At least I have the contents all there, so what I need to work on is
the layout. Like I said I want to make the user-interface cleaner and
more stylish, and generally just make the site better.

The search engine feature isn't the best, and only searches among the
mailing list archives. It's a quick hack by the person in charge of
the server. I know nothing about that sort of thing and have actually
received help when it comes to the HTML code to access it.
In time I'll try to find a better, more streamlined solution for
searching (I guess it would be useful to search the actual website as
well).

Anyway, I'm still at loss for a final idea for my layout. 3 columns
was my initial idea, now I don't know.
By the way, I found a perfect example of a "dark" styled site that is
along the lines of what I would like to use: http://www.feedicons.com/

It has several rounded corners (but "sharp" ones as well) softening it
up a bit, gorgeous bright colored icons giving a contrast towards the
dark background.
But at the same time I'm not sure it would work for the contents of my
website which mostly contains a lot of text.
Does anyone know of similar websites as my own (a "support" and
"information" type site for a specific subject) which has a more
pleasing web 2.0 style? I would love to get some ideas that would
fulfill all the needs of user-accessability, a pleasing user-interface
and so on.

On Nov 10, 6:15 am, CyberDoug <CyberD... (AT) muchomail (DOT) com> wrote:

On Nov 9, 3:38 pm, Kevin <kevinlen... (AT) lakeareawebs (DOT) com> wrote:

On Nov 8, 5:37 pm, CyberDoug <CyberD... (AT) muchomail (DOT) com> wrote:
I'm stuck trying to find a suitable layout style for my website and
could need some new input.
Well first off if you want it to be WEB 2.0 I would also suggest you
use AJAX as that is definitely WEB 2.0 technology.

I've read a little about Ajax, and it sounds like a good idea although
I don't know how complicated it is to set up. If it's a server-side
sort of thing that needs to be installed I really can't do much as I'm
not in charge of the server. If it's similar to CSS or HTML I can
probably learn.

You will need to
have rounded corners on your graphics as well which will make your CSS
more complicated as well but not impossible.

Yup. I read a really good article about web 2.0 characteristics which
discussed this and various other aspects of a modern, functional
design where they call the use of rounded corners "casual design":http://www.masternewmedia.org/inform...ation-design-p...

I am not sure I like the
idea of the same form being on every page but that is completely up to
you.

Why don't you like the idea? All I want is the ability to search from
any page you're currently on.

For your FAQ page you can simply use named anchors to get the job
done if it is a very large list you may want to not only use an
alphabetical list but also use back to top links as well. Your general
navigation can be done with CSS which will load faster then its
JavaScript counterpart.

Do you have any example links for this so I can see what you mean?

Before you start to build the site you may also wish to consider your
search engine optimization as well while you are choosing the domain
name and creating a directory structure. Having keywords in the Domain
name or directory structure will give you an advantage later.

I actually made the site years ago and have updated it several times.
However, this time I want to go overboard and do it really well with
CSS and so on.
The site is located here: http://www.notator.org/

At least I have the contents all there, so what I need to work on is
the layout. Like I said I want to make the user-interface cleaner and
more stylish, and generally just make the site better.

The search engine feature isn't the best, and only searches among the
mailing list archives. It's a quick hack by the person in charge of
the server. I know nothing about that sort of thing and have actually
received help when it comes to the HTML code to access it.
In time I'll try to find a better, more streamlined solution for
searching (I guess it would be useful to search the actual website as
well).

Anyway, I'm still at loss for a final idea for my layout. 3 columns
was my initial idea, now I don't know.
By the way, I found a perfect example of a "dark" styled site that is
along the lines of what I would like to use:http://www.feedicons.com/

It has several rounded corners (but "sharp" ones as well) softening it
up a bit, gorgeous bright colored icons giving a contrast towards the
dark background.
But at the same time I'm not sure it would work for the contents of my
website which mostly contains a lot of text.
Does anyone know of similar websites as my own (a "support" and
"information" type site for a specific subject) which has a more
pleasing web 2.0 style? I would love to get some ideas that would
fulfill all the needs of user-accessability, a pleasing user-interface
and so on.

Ok Lots of questions I will start at the top here. I think that even
though the below mentioned article is a bit old it is still pretty
accurate in general.

http://www.oreilly.com/pub/a/oreilly...is-web-20.html

The beauty of AJAX is it will allow you to refresh only certain parts
of a page almost instantly. Not having to reload the page entirely at
all. Ajax allows you to only load the portion of the pages that have
changed.

The reason I was unsure of having a form on every page was I was
thinking you were going to put multiple fields on each page within
this form. I can see having a single field to do a search on
something but having a form asking personal information like email
address, name, address, phone etc to sign me up for an email list I
would not like to see. I would expect if you were doing a WEB 2.0 page
rather then having an email list like in the old days you would
instead setup an RSS Feed so they can click on a button and be
subscribed to the feed.

I also mentioned

For your FAQ page you can simply use named anchors to get the job
done if it is a very large list you may want to not only use an
alphabetical list but also use back to top links as well. Your general
navigation can be done with CSS which will load faster then its
JavaScript counterpart.

and you asked for an example of this.

You can see an example on my FAQ page or my Glossary page on my
website at http://www.lakeareawebs.com/faq.html or
http://www.lakeareawebs.com/glossary.html of the two the glossary has
an alphabetical list on the top of it and the faq page has the
questions themselves listed at the top of the page.

The notator site is definitely overdue for updating Last update: 18-
October-2004

Onto the next topic you had here the icons web page you listed while
it is very 2.0 looking it should be based on its topic. That site
promotes icons for feeds. What they are talking about is the icons
for RSS Feeds. There is not a lot of content there when you look at
it in general they are offering three products and google adsense.

Your site has far more textual content. You will need to come up with
a web 2.0 layout that links to your content. If you use AJAX to do it
you can have your content fill only the areas of the page that changes
which will save you on bandwidth. There are web 2.0 templates
available out there as well you may wish to look into. I am not sure
how much knowledge you have in this field or how much desire you have
to learn the new technologies out here. I would think you will
probably want to be highly proficient in (x)HTML, CSS, JavaScript and
AJAX to build this project in general. You will need to test it in
multiple browsers and versions of browsers prior to releasing it to
public view.

For your convenience you can view some tutorials on AJAX at this link:

http://www.google.com/search?q=ajax+...n___US207&aq=t

I hope that helps you
Kevin
http://www.lakeareawebs.com

On 10-11-07 15:23, Kevin wrote:

There are web 2.0 templates
available out there as well you may wish to look into.

You're right, and I found a couple of templates that (almost) fit my
request. However, they're made for Wordpress, and I'm a little
confused.

As I've understood it, Wordpress is a free service for people to
easily create their own "diary" type blogs without knowing a shred of
HTML or CSS (using a point and click web user-interface) as well as a
software application which allows people to edit their own web pages
in the same web "point and click" user-interface but without being
signed up at Wordpress' website or some other free blogg site.

Since my website isn't going to be a constantly updated "diary" or
"news" type site and I also need to edit the code for my own specific
needs I don't think Wordpress is for me.

The theme file I donwloaded consists of a folder with lots of PHP,
Javascript (.JS), CSS files and images. But no HTML file.
Is there a way I can convert all of this to a standard web template?

Failing that I'll have to do it the slightly harder way of finding a
website that uses it, then download the source/CSS file etc. in order
to recreate it locally here on my own Mac and edit whatever I need.

I am not sure
how much knowledge you have in this field or how much desire you have
to learn the new technologies out here. I would think you will
probably want to be highly proficient in (x)HTML, CSS, JavaScript and
AJAX to build this project in general. You will need to test it in
multiple browsers and versions of browsers prior to releasing it to
public view.

Definitely. I want it to work in as many browsers as possible.
Actually, all my sites up to now have been designed with the text-only
"Lynx" browser in mind.
I still hope to retain compatibility across the various browsers and
platforms, but it's time to move on to something more advanced than
basic HTML.

On Nov 12, 4:27 am, CyberDoug <CyberD... (AT) muchomail (DOT) com> wrote:

On 10-11-07 15:23, Kevin wrote:

There are web 2.0 templates
available out there as well you may wish to look into.

You're right, and I found a couple of templates that (almost) fit my
request. However, they're made for Wordpress, and I'm a little
confused.

As I've understood it, Wordpress is a free service for people to
easily create their own "diary" type blogs without knowing a shred of
HTML or CSS (using a point and click web user-interface) as well as a
software application which allows people to edit their own web pages
in the same web "point and click" user-interface but without being
signed up at Wordpress' website or some other free blogg site.

Since my website isn't going to be a constantly updated "diary" or
"news" type site and I also need to edit the code for my own specific
needs I don't think Wordpress is for me.

The theme file I donwloaded consists of a folder with lots of PHP,
Javascript (.JS), CSS files and images. But no HTML file.
Is there a way I can convert all of this to a standard web template?

Failing that I'll have to do it the slightly harder way of finding a
website that uses it, then download the source/CSS file etc. in order
to recreate it locally here on my own Mac and edit whatever I need.

I am not sure
how much knowledge you have in this field or how much desire you have
to learn the new technologies out here. I would think you will
probably want to be highly proficient in (x)HTML, CSS, JavaScript and
AJAX to build this project in general. You will need to test it in
multiple browsers and versions of browsers prior to releasing it to
public view.

Definitely. I want it to work in as many browsers as possible.
Actually, all my sites up to now have been designed with the text-only
"Lynx" browser in mind.
I still hope to retain compatibility across the various browsers and
platforms, but it's time to move on to something more advanced than
basic HTML.

I can't agree with you more when you said

Definitely. I want it to work in as many browsers as possible.
Actually, all my sites up to now have been designed with the text-only
"Lynx" browser in mind.
I still hope to retain compatibility across the various browsers and
platforms, but it's time to move on to something more advanced than
basic HTML.

Have you been to template monster yet?
http://www.templatemonster.com/categ...2-0-templates/

I would add to the google search either HTML or XHTML maybe something
like searching for web 2.0 html templates might be a good thing.

You are right to stay away from wordpress for your main site. You see
word press was designed to be a web blog . It was also designed to be
very much like a small CMS (content management system) as well. What
that means is that there are several things that you are not allowed
to edit without breaking the entire web site.

Many web developers build web sites in programming languages like PHP
because they can dynamically generate pages on the fly from the
server. Yes they still need a sound understanding of the above
mentioned languages in order to tell PHP to generate the pages but the
actual process can save a great deal of time in development if you
think about a site with thousands of pages. A good example of that
would be a high school reunion site may want to have a student profile
page for each student. The student information could be stored in a
Database and printed out to an html page on the server then delivered
to the client browser seamlessly.

Other then a template though if you can lay out what you have in mind
on paper you should be able to recreate it on the web in general.
Rounded corners are possible with css as well as custom borders (if
you use images). In other words you can have a very web 2.0 looking
page with out really having a web 2.0 technology under the hood. If
you had a page that looks like it is web 2.0 then all you have to do
is add the functionality and technology to it as you learn it. As an
example maybe you want to start by adding RSS feeds to it or
integrating an RSS feed from another site to your page to improve your
page content.

Another thing that is big in web 2.0 is to have some advanced
JavaScript called AJAX in it. That can be a double edged sword though
as AJAX is asynchronous javascript and xml. What that means is if a
user turns off javascript or is using a browser that does not support
javascript it will not function at all. Also keep in mind that the
search engines themselves cannot interpret javascript at this time
either.

One of the advantages to using AJAX is you don't have to reload entire
pages you only load the parts of it that have changed. If you build
for LYNX browser then you may not be able to use JavaScript or AJAX
and still be compatible.

Another point you will probably want to create the page in XHTML
because it will have more capabilities then HTML in the long run as
far as WEB 2.0 goes. However, Microsoft has already announced that
their browsers will never support the mime type of application/xml and
they will just interpret it as text/html instead. That will limit the
abilities of what will work in XHTML to the HTML level for anyone
using IE as a browser.

Overall it sounds to me like it is time for you to expand and learn
more about a new technology overall. If you are comfortable with HTML,
XHTML, CSS, JavaScript including DOM scripting already why not
consider learning AJAX, PHP, Ruby, Python. You may even want to look
into learning a framework such as Rails. You could then consider
building a site with ruby on rails or ajax on rails for that matter
and it would be very efficient and web 2.0 as well

If I have learned one thing in the past few years it is that in this
field the opportunities to learn new technologies never stop piling
up. I cannot keep up with them but I spend my life trying to learn as
much as I can.

I feel like I am rambling as I have gone from talking about templates
people purchase to learning the languages behind Web 2.0 sites and in
turn learning how to write your own templates if you wanted too.