Websites

[masqueradeball]

I just signed up to a web host and am working on a website that I hope to be a central hub for my games and other activities (art and fiction) as well as any contributions I can get from others. So this post is about asking a broad question: What resources and guides should I look into to find out more about web design, etc... specifically ones that other publishers have found useful. What general advice, if any, do publishers/designers/would be publishers have about site content, etc...

[Eero Tuovinen]

What kind of experience do you have with web programming? That impacts any answers quite a bit.

[masqueradeball]

Very little, I know a mild amount of HTML. I have friends who can help with Flash and other editing programs. I think I can work my way up technically to whatever point I need to be and/or I know people who would help for free. I don't really know what kind of advice I'm looking for, really... not technical advice really, but more some things not to do... or pieces of advice that might be hard to mine from traditional sources, especially ones that are aimed at the RPG market as opposed to general advice.

[Peter Nordstrand]

Are you on a mac or a pc?

[masqueradeball]

PC, I'm using Hostmonster as the hosting service. Currently I'm using Nvu, a free web design software, but I'm looking at getting something better.

[Eero Tuovinen]

Well, I can tell about my own experiences with web programming. This is not so much technical advice as advice on how to proceed:

• Learn more web programming and do most of the website yourself. You don't have to rely on others and it's useful and interesting knowledge. It's not too difficult at all for a technically minded person, and once you know what you're doing, it's much more efficient to be able to do everything yourself rather than badgering others about it. Don't think that your skills are not enough for what you're doing - work in harmony with your skills and let your needs drive your skill development.
• When I was learning this stuff I started by creating simple web pages for various purposes in HTML. I started with simple commands and worked my way to integrating multimedia and some simple script commands nabbed from tutorials and such. Then I learned CSS, which is a very useful and very different ballgame. I made my first larger pages with Server Side Includes. Finally, when I got a powerful and flexible service provider, I learned PHP and SQL databases, which was pretty simple after the previous steps. It was only after this that I started using prepackaged web softwares like forums, so I found installing and modifying them to be easy, at least compared to people who start by using them.
• The web is full of simple tutorials on the techniques, as long as you know what you're needing. If you don't know how to do it already, learn to formulate efficient questions and find information in the internet; that's an increasingly useful life skill in general, and it makes learning the necessary web programming a foregone conclusion. For example, the way I learned to make dynamic web pages was by deducing that such would, by necessity, be possible, after which I hunted down the necessary information; think of what you want to accomplish and find out how web engineers do it.

But first thing you need to do is plan your website: think of what things you want for it, and what your service provider can provide for you. Some helpful questions:

• Do you have any server-side programming languages on the server? Databases? Your own domain? Subdomains? Email controls? These matters affect the kind of solutions you can use.
• Do you want to have static or dynamic pages? Dynamic ones are technologically more involved and eat more bandwidth, which might be an issue for some applications. Also, it's a surprising amount of psychological pressure to update pages, which might be a reason to prefer a static set.
• Do you want to sell stuff from your own website?
• How much material would you have on the site? Think in terms of separate pages: would you have more than half-dozen separate pages? More than 20? More than 100? The ideal solutions in terms of page design depend on this stuff.
• What do you want your pages to look like? Professional? Hobbyist? Indie? Slick and commercial? Cultured and/or tech-aware? What medias would you like to offer on your pages? Comics? Web-comics? Music?

[jag]

I just signed up to a web host and am working on a website that I hope to be a central hub for my games and other activities (art and fiction) as well as any contributions I can get from others. So this post is about asking a broad question: What resources and guides should I look into to find out more about web design, etc... specifically ones that other publishers have found useful. What general advice, if any, do publishers/designers/would be publishers have about site content, etc...

I can't speak to the design skills you'll need (though several others here are able to do that), but I can definitely give some advice on the coding skills required.

1. If you are just starting, only take of tiny bites.  Start by just trying to make one page.  Once you get that done, try a couple pages, and so on.

2. Learn and love the (X)HTML/CSS separation as early as you can.  It's really quite slick.  The definitive reference for this is that from the W3 schools themselves (they define the web standards), but it's also nice to look for more newbie-friendly tutorials.
http://www.w3schools.com/

3. Don't try to do dynamic pages until you are comfortable with static ones.  Databases are nice, but do you really need one yet?  Javascript is great, but it's a cross-browser quagmire unless you are very careful.  Just because something works in IE 6 is no guarantee that it'll work in IE 7, much less Firefox, Safari, etc.

4. As you are just starting, you should expect to completely rewrite your pages at least 5 times.  If after a few months you haven't done that, I'd wager that your code is painful and unmaintainable.

Making a static webpage isn't hard, but it does take some effort to learn all the pieces.  Invest in a couple books -- the $40 you spend will be a small price compared to being frustrated for many hours.

[masqueradeball]

Thanks for the advice folks. Right now I'm looking at designing the pages using Flash with the help of a friend. Any ideas about Flash?

[Eero Tuovinen]

Nope, haven't got around to doing that myself yet. I also find flash slow, ugly and low-quality as a consumer of websites, so I haven't had any motivation for delving into it. Perhaps someone else will have more concrete information.

[Anders Larsen]

Ok, her is my advise on flash: DO NOT USE IT. It is nonstandard, it motivate people to make annoying design (animations and stuff), you can not navigate it with the keyboard, copy-parse generally don't work, you can not resize page/text (the text doesn't reflow), it take a lot of computer power (more than standard HTML pages), it does not work with screen readers (you may not think about it, but blind people actually use the internet), and there are probably a few other thinks I can not think about right now.

There is a few places flash is ok - like embedded mediaplayers (eg. youtube), but for site navigation and text, use standard HTML (or better XHTML).

2. Learn and love the (X)HTML/CSS separation as early as you can.  It's really quite slick.  The definitive reference for this is that from the W3 schools themselves (they define the web standards), but it's also nice to look for more newbie-friendly tutorials.
http://www.w3schools.com/

It is not http://www.w3schools.com/ who define the web standards, it is www.w3.org. The tutorials on w3school are ok, but not entirely correct, so you should be careful. An example is that they say the minimal XHTML page is this:

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>simple document</title>
</head>
<body>
<p>a simple paragraph</p>
</body>
</html>

That is not true (even though it probably works). Here is the minimal XHTML page:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
 <head>
  <title>title</title>
 </head>
 <body>
  <p>a simple paragraph</p>
 </body>
</html>

The difference may at first glance seem insignificant, but if you know which problems confusions between different char-encodings can create, a declaration like "encoding="UTF-8"" is not trivial.

General stuff about web design: as jag says, understand the importance of the CSS and XHTML separation. Keep everything as simple as possible. don't use anything blinking or moving on the page. Don't use frames or iframes (unless you really know what you are doing). Be sure that the text is easy to read: do not use less than 10pt text size, do not have to long lines of text (preferable less than 80 characters) and have a good contrast between background and text color (and don't put an image behind the text). Some people do not like a completely white background (it hurt their eyes). Make sure that the pages work in all popular browsers (IE, firefox and opera), and with screen resolutions down to 800x600. Do not make any assumptions about text size and fonts because that can change from browser to browser and system to system.

I can recommend that you take a look at CMS/wiki systems. A good place to start with this is http://www.opensourcecms.com/ where you can test a number of these system (I recommend you to take a look at "CMS Made Simple"). A CMS systems may seem complicated at first, but when you have learned to use them it is much easier to work with and extend your site, without thinking about html/css stuff all the time.

 - Anders

[jag]

Ok, her is my advise on flash: DO NOT USE IT. It is nonstandard, it motivate people to make annoying design (animations and stuff), you can not navigate it with the keyboard, copy-parse generally don't work, you can not resize page/text (the text doesn't reflow), it take a lot of computer power (more than standard HTML pages), it does not work with screen readers (you may not think about it, but blind people actually use the internet), and there are probably a few other thinks I can not think about right now.

It is not http://www.w3schools.com/ who define the web standards, it is www.w3.org. The tutorials on w3school are ok, but not entirely correct, so you should be careful. An example is that they say the minimal rs

I stand completely corrected.  I made the error of recommending tutorials i didn't actually use much, and was caught.

[jag]

Sorry, i got a session time out while posting, and reposted poorly.  The first half of my post was going to be:

Ok, her is my advise on flash: DO NOT USE IT. It is nonstandard, it motivate people to make annoying design (animations and stuff), you can not navigate it with the keyboard, copy-parse generally don't work, you can not resize page/text (the text doesn't reflow), it take a lot of computer power (more than standard HTML pages), it does not work with screen readers (you may not think about it, but blind people actually use the internet), and there are probably a few other thinks I can not think about right now.

I agree completely.  Flash is meant primarily for animations, although some of the more recent advanced uses can be more general purpose.  In general, for all technologies, you should only use it if you have a clear need.  What is the need you have for which static HTML is insufficient?

james

[guildofblades]

>>Make sure that the pages work in all popular browsers (IE, firefox and opera), and with screen resolutions down to 800x600<<

For the last few years I had been designing all our web pages to the minimum 800 x 600 standard. As of a month ago, I switch to the 1024 x 768 as our minimum design standard. The reason...more recent surveys show that 1% or less of the people use monitors with 800 x 600 resolution anymore.

I have begun to design all pages on 1483online.com to the larger standard now and not one person as complained since we started doing so.

I agree. Avoid flash intros....as much as 50% of people leave a site rather than waiting for the flash to load. Entirely too many people may not even have a good enough flash viewer to display it anyways. And if a flash intro is a bad idea, a flash navigation system is 10 times worse.

Ryan S. Johnson
Guild of Blades Publishing Group
http://www.guildofblades.com
http://www.1483online.com
http://www.ms-crm-consulting.com

[masqueradeball]

All right FLASH= BAD... thanks for the in put.