Website redesign

[Sam Fraser]

This is Sam Fraser, PERMANENT Webmaster. (Although it hasn't always been permanent! :rolleyes:) I originally designed the current look of the website back in 2000-2001 as well as wrote the HTML by hand. (Yes, by hand - an "artiste" like moi would never use something as crass and blunt as Dreamweaver. :p ) There was also a pinch of CSS and Javascript thrown into the mix over subsequent years. It's gotten pretty old and creaky after PERMANENT's hiatus.

So, now that PERMANENT's back and the content needs some updating, one project I'm embarking on is a major rewrite and clean-up of all the HTML. CSS is now fully supported consistently across all major browsers and can be used in a much greater way to control content. It's just too cumbersome updating the website right now and implementing a simple change across part or all of the site often means editing pages individually and manually.

Now, as I go through the code and strip out the redundant HTML that CSS can now take over the role of, I will NOT be redesigning the visuals. One benefit of the code optimisation, however, is that a future visual redesign or tweak will be much easier to implement for the whole site. (I tend to think it's a bit "stark and dark" by today's web standards and design trends.) So, if anyone sees an attractive website that is also logically constructed and easy to navigate, let me know here. I like the following:

http://www.spaceadventures.com/index.cfm

This has a nice light, modern feel, and has a similar structure as PERMANENT in terms of sections and subsections (on the left).

http://www.spacex.com/

This has more of a cool WOW factor visually, but may not be entirely suitable for a website like ours with hundreds of pages of content.

Space Adventures had a pretty awesome website a few years back graphically, but they've changed it now and the Wayback Machine can't get past their stupid Flash intro.

If anyone sees any other websites with graphics, layout, functionality etc. you think would work for PERMANENT, post it here. This can include just ideas for new sections or features you think PERMANENT should have to engage and educate the public. The websites do not have to be space-themed or works of art, just have something useful for our website visitors.

What I'm not looking is tacky gimmicks or pointless extras that add nothing of any value to our website e.g. an animated 3D Java applet of our logo or a 2-minute Flash intro that takes 10 minutes to load for those don't have broadband. :eek: Although at some stage, we ARE going to have to put together some sort of video......but that's a project (and thread) for another time.

[Rhyshaelkan]

Would you also like a list of dead links? I have found dead links to old papers. Then with a search on google with the paper's title have refound those pages. Happy to help.

[Sam Fraser]

Would you also like a list of dead links? I have found dead links to old papers. Then with a search on google with the paper's title have refound those pages. Happy to help.

Oh yes, Rhy! That's an excellent suggestion! Anything that helps update PERMANENT and make it relevant again. I'll give my e-mail address by PM.

[Boxy]

Hey, I can play that game, too!

Would you be interested in game developer's websites? They're generally pretty sleek and sexy and have futuristic motifs to them.

[Sam Fraser]

Sure Boxy, anything goes at this stage. I tend to prefer a "clean" design that is not too "busy" myself. However, I'll consider anything that's both attractive and functional.

[Phenix]

Boxy,

Are you part of the gaming software development ?

I think if you are, it would be very useful for PERMANENT to create games related Asteroid mining with all challenging topics covered by PERMANENT. It would also certainly through entertainment facilitate communication with the public ;)

Thank.

[Sam Fraser]

Phenix, that's not a bad idea at all. A lot of games have very cool, slick websites. Have you seen any attractive game websites that might give us ideas on how to redesign the PERMANENT website?

[Sam Fraser]

Here's a good example of a website that isn't slick, but has some interesting features:

http://lifeboat.com/ex/main

Notice the various "funds" and major donor names at the top? It also has buttons on the left like "Programs" and "Reports" and "A-Prize" that draw your curiosity and invite you to click. Then there's the donations page:

https://lifeboat.com/ex/donations

This features pictures of major or recent donors, as well as quick and easy ways to donate almost whatever amount you want by PayPal, credit card - and also through Amazon somehow.

[Rhyshaelkan]

I blundered across http://www.blender.org/ it is a free 3d modeling software. While I have not tested it yet. I intend to.

Much like gimp.org is good for image manipulation. I assume blender.org will be good for 3d manipulation. And did I say free? :D

As you pointed out in the space hotel thread. Let us make the site easy to read. So the text is formatted for a certain size window. Not text that runs right off the page requiring you to scroll for days. And then back and then off again.

My monitor displays max resolution at 1248×1024. However I never run full screen windows. I like the PERMANENT homepage. It fits in my windows/monitor configuration nicely.

[Sam Fraser]

Hi Rhy. Yes, standard screen resolutions are much higher than when I redesigned the site back in 2002 or so. I've read it's very safe to make a website viewable at a minimum of 960 pixels wide now. So, we could maybe fit a donations sidebar on the right, like Mark's suggested privately. Once I've redone all the CSS, it will be a cinch to change widths of individual columns or the whole website.

By the way, I'm open to any criticism of the current visual design. Personally, I think it's a bit dated and dark, but Mark likes it and he's the boss. :rolleyes: Mark will also tell you I'm your typical hyper-self-critical artiste. Don't hold back if you think something is just god-damn awful for words. I'm not a professional graphic designer or anything, I just taught myself Photoshop and HTML basics from library books. :eek:

[Sam Fraser]

SpaceDev's website is very nice:

http://www.spacedev.com/

[Alexander Declama]

Sam,

I actually like the current design scheme. To me it feels like an outline for a plan to get into space, which I'm sure you did on purpose. It's unique and I think that's more important. I personally feel flash and other extras when not necessary bog the site and end users computer down. A flash intro with a skip button generally means you don't need the flash intro. Permanent.com was always to me a source of information and changing the site design would change the feel of the page.

My two cents.

[Sam Fraser]

Thanks, Alexander. What a great way to make your first post by flattering me. :p

This is useful feedback. Designers can be a bit anal and hypercritical of their own work. (Mark will concur there!) I worked commercially as a designer (briefly, back around 2000). In the company I worked in back then, "Flash-turbation" was definitely frowned upon. I also learned it's easy as a designer to get bored with a design you see every day. You become convinced it must be changed, CONVINCED. To the average or new visitor, though, it looks fine.

Anyway, I'm focusing right now on rewriting the code (which is taking forever, but must be done), so the whole website will become much easier to update later (there's still lots of out-of-date info and new sections to be added). I plan to increase the default width to 960px (the website was designed for 800x600 resolutions way back in the Stone Age), which will require tweaking of a few graphics. It won't be a redesign, however (relax Mark! :D ) and the current theme will remain.

[Alexander Declama]

Have you thought about using a wiki style interface?

I personally created one using information from permanent and other sources.

I started with moinmoin and settled on dokuwiki. It's something you may want to look at, especially for its collaborative aspects.

[Strobelix]

I agree to alexander. A wiki is indeed a good thing to easy collect knowledge and there are several additional features like discussion stuff. I use trac for SW developent, which is a wiki combined with some basic porject management tools.

I also did use MoinMoin on my private server and it was quite easy to install and to maintain.

[Rhyshaelkan]

It looks like PERMANENT might be moving in the direction of a wiki format.

As we get closer to that we will ask for trusted member volunteers to help build and update it.

Is it html/xml based?

*Rhy runs off to research wiki

[Sam Fraser]

Yes, it should at least generate validated XHTML-compliant code. Mark's got an CMS or Content Management System nearly ready, so I'll take a look at that.

[Sam Fraser]

See Mark's new post re wiki here:

http://www.forumlog.com/nanobiotechnologyspace/showthread.php?p=1136#post1136

[Mark Prado]

What's the URL to your wiki?

What's the URL to another GOOD wiki on space or some other topic else equivalent in structure? I want to see their navigation.

[joertexas]

What's the URL to your wiki?

What's the URL to another GOOD wiki on space or some other topic else equivalent in structure? I want to see their navigation.

Howdy, Boss. Long time no see :)

JR

[Alexander Declama]

What's the URL to your wiki?

What's the URL to another GOOD wiki on space or some other topic else equivalent in structure? I want to see their navigation.

They use media wiki
http://www.lunarpedia.org/index.php?title=Main_Page

My preferred wiki is doku wiki. It has a auto-generated TOC and it lets you categorize pages according to user defined namespaces, which allow you to organize pages in a tree structure.
http://www.dokuwiki.org/features
http://www.dokuwiki.org/index

And you can use the wiki matrix to compare their feature sets
http://www.wikimatrix.org/compare/DokuWiki+MediaWiki

[Mark Prado]

What would be most useful is a sample site using Doku Wiki which has table of contents.

The Lunarpedia has "Category Tree" which is nothing but an alphabetical index. The closest thing is under "Maintenance", something called "Peter's Outline". Yeay, that's a good start. Same outline method as permanent.com such as 4.2.18 though there is a lot of room for improvement. I see no way to expand Peter's Outline for the entire website, only to expand one section at a time.

http://www.lunarpedia.org/index.php?title=Lunarpedia:Outline_draft/BREAKOUT_AGENDA

I still prefer our old sitemap:

http://permanent.com/site-map.htm

What I would like is an expandable tree menu similar to www.thailandguru.com (and note its sitemap without section numbers, http://thailandguru.com/top-level-menu-2.html )

In the next version, I'n not sure whether to stick to numeric sections like 4.12.6 because the numbers may change as we add articles and it creates confusion when people reference a section number rather than just a name. We need to consider the advantages and disadvantages. Maybe use names like:

/lunar/minerals/titanium
/lunar/industry/excavators
etc.

So, the hunt continues for the best Wiki. I think we should research the tree wiki I have installed. I am not a programmer, so I cannot customize it, but if we can complete an analysis so that we can make a reasonably sure decision then I can put some time and effort and money if necessary into this.

Notably, in the side by side comparison in Alexander's link at wikimatrix.org, I don't see any significant difference between Doku Wiki and Media Wiki. However, they don't have any parameter for "SiteMap" or "Table of Contents" or "Tree View" or anything like that. This has always been a frustration in using Wikis. I've seen so many Wikis, but never -- not once -- been able to see a simple Table of Contents, except for "Peter's Outline" on Lunarpedia.

The only Wiki I ever use is Wikipedia -- which I use all the time -- but the only way I find pages on Wikipedia are either by a Google search or else clicking on a link within Wikipedia.

Wikis are popular, but for many content projects they will not realize their potential until they simply add a SiteMap / Table of Contents / Tree View.

If the Tree View plugin for MediaWiki does this, then we have what we need. However, somebody needs to tinker with that, have a look under the hood, and probably tinker with the code to get it all working together well.

[Rhyshaelkan]

I like the side tree of the current PERMANENT page. What would be even better is if the tree stayed with you as you scrolled down through the current topic.

[Alexander Declama]

http://www.pvs.me.uk/dokuwiki/doku.php

This is the auto generated index page, showing the pages indexed according to namespace
http://www.pvs.me.uk/dokuwiki/doku.php?do=index&id=Home

And this is dokuwiki's explanation or how namespaces work
http://www.dokuwiki.org/namespaces

Hope this helps

[Sam Fraser]

I'm starting to lean towards a Content Management System or CMS. Wikis don't seem to be as versatile or comprehensive as I thought. All the good CMS products that allow non-techies to update websites easily as well as do the all-important search engine optimising retail for hefty prices. The free or open-source ones don't seem to cater for SEO needs very well, even now in 2010. While it's not possible to find the perfect CMS that does absolutely everything, settling for a very basic one that only does 60% of what we need and leaves us (Mark/me) to tweak the other 40% by hand isn't much use.

Still looking..... might try leaving a few posts on some webmaster/SEO messageboards.

[Sam Fraser]

Here's a good example of a website that isn't slick, but has some interesting features:

http://lifeboat.com/ex/main

Lifeboat Foundation have since given their website a makeover. Compare the old version (http://web.archive.org/web/20080528074018/lifeboat.com/ex/main) (courtesy of the Wayback Machine) to the new version (http://lifeboat.com). I like how they push various funds and programs. Check out all the stats for Twitter followers, newsletter subscribers, major donors, targets reached etc. It makes the place look like a hive of activity.

[joertexas]

Lifeboat Foundation have since given their website a makeover. Compare the old version (http://web.archive.org/web/20080528074018/lifeboat.com/ex/main) (courtesy of the Wayback Machine) to the new version (http://lifeboat.com). I like how they push various funds and programs. Check out all the stats for Twitter followers, newsletter subscribers, major donors, targets reached etc. It makes the place look like a hive of activity.


I don't know what their goals really are, but it looks like they've raised the better part of a half million dollars to pursue them. Must be nice...

JR

[moonus111]

If we're going to do any image revamps, I think the easiest thing to do would be to add some kind of theme to the forum... Nothing fancy, just something other than the default theme. I think Rhy said he could do something like this, but since I've never used vBulletin idk..

[Sam Fraser]

http://spacefellowship.com/

I like the header and footer, although the font looks too retro-futuristic and the green looks out of place.

[Rhyshaelkan]

I think Rhy said he could do something like this, but since I've never used vBulletin idk..

vBulletin can look quite different if the time is spent on it. Here are a few different vBulletin pages I have seen

http://www.animeb.com/content/

http://forums.civfanatics.com/index.php

http://www.boxxyboards.com/

Sam and I would need more access to the file directory of the server to get that deep. Where to upload images, buttons, smilies.

**cough**need Mark's vBulletin credentials for tech support and to download many templates floating around on the vBulletin support boards.