Navigate
Home
ArticleWiki
Forum
Journal
Search
Newsletter
Links
Tech News
expertsrt.com
Welcome Guest.
Username:

Password:

Remember me

The New Look Prototype --- Ready for viewing
Welcome, Guest. Please login or register.
December 02, 2008, 08:04:41 PM
11304 Posts in 1248 Topics by 498 Members
Latest Member: katCheeme
Experts Round Table Network  |  Community Affairs  |  Soapbox  |  The New Look Prototype --- Ready for viewing « previous next »
Pages: [1] 2 3
Author Topic: The New Look Prototype --- Ready for viewing  (Read 1680 times)
COBOLdinosaur
ERT.com Admin

Offline Offline

Posts: 481



WWW
« on: April 01, 2006, 08:52:12 PM »

Prototype for new ERT Look and Feel

Check it out and comment please:

http://layouts.expertsrt.com/prototypes/prototype.html


The new look will be the basis for a change of look and feel for the whole site, both the content side and the forum side. The new pages will get rolled out one at a time as I get them done.  That approach gives us a chance to deal with problems as they arise instead of having many problems all at once.  

Changes and suggestions need to come quick.  I am going to start deploying as soon as I put the final touches on the RSS pages; probably within a week.  So if you have suggestions, think changes are necessary, or see a problem or spelling mistake let's get it out here in a comment. The new look and feel allows for a lot of flexibility, so if you have thoughts on how specific pages should use the format, please bring them forward. Every page that gets improved puts us closer to a completed site.


For the new look I have gotten away from the metal look; aluminoid is going to be history, and the whole PHPbb look will disappear (along with a lot of crappy code).  Instead the trim and highlights will be wood textures; much warmer, and eye appealing.  Some of you will recognize suggestions you have made that you thought I was not listening to.  Esopo, the collapsible elements in the sidebar are not the same design as you gave me but the functionality is there; and it will be extended to do the forums and topics that way as well; thanks for that effort, you will be seeing a of more of your collapse approach in the forum as well.

The standard navigation is now a top and bottom bar; no drop downs or slide outs. Where sub menus are necessary they will be on the child pages.  The menus will be primarily straight text links.  There will not be a lot of graphic buttons except where impact is need, like the registration,  The forum will use the same menu bar for site navigation, and most of the buttons in the forum will get converted to link.  The buttons make it look too much like a million other forums.

As an aside, the pages are optimized for a resolution of 1024x768 or higher.  This is the first time I have optimized that way.  Up to now I have always optimized at 800x600 or higher, but our stats say 98% of site users are using 1024x768 or higher, so it would be stupid to do the extra work necesssary to support low resolution. The page are usable but ugly at low resolution; and prbably some of them are going to come up broken.  We are optimized for FF with careful hack using IE specific CSS overrides and conditional HTML to support the relic.  The site will look better in FF but will be usable for IE6... we still have to see how badly IE7 will be screwed up.

The page layout have four sections the banner, content, sidebar, and footer.  The banner as you see it including the nav will be identitcal on virtually every page except for the heading text; except where we have to make provisions to support an author's artistic control.  The footer will be similar on most content pages, though on some there may be additional credits and the copyright notice will vary on th econtent pages.  On the forum side the footer design allows for elements to be both above and and below the nav bar so we will have plenty of flexibility.  The copyright notice will always be the last line of all pages.  The copyrights for the skin and eventually for PHPBB will disappear, though we will continute to credit PHPBB with a "based on" acknowledgement or something similar.

The content section is basically a big box.  The borders will be played with.  I have about a dozen different wood textures, and there are any number of images that will work for framing content.  The inside of the box is free format, we will lay it out in whatever way is appropriate for the content.  That includes the forums.  Rather than complex nested tables, we will put each category in a content box as collapsed divs, and when a category is expanded it will have its forums listed in a collasped layout.  The forums will be independent tables, containing the topics.

The format of the topics will start out resembling the current layout, but we can experiment and customize each of them independently, so Mentors can get their forums to a look that suits the taste of the members active in the forum and reflects the kind of content the forum has.  In other words the forums do not all have to look the same, and in fact, topics within the same forum do not have to look the same.  They will start out looking the same, but because they will be CSS based, we can do a lot with custom presentation. The first few might take some effort, but then it will like everything else, we will discover the easy way to do things.  We are not going to get held up or avoid customized presentations because they look hard to do.

The side bar is the catch all.  Anything can go there; links, widgets, news feeds, notices, submenus, lists, cartoons, jokes, external bits of eye candy, even bits of content too small to warrant their own page.  That holds for both the forum and the content side. Smilies will go in a popdown layer.  Member contact information will also go in a popdown so we get rid of the clutter of buttons.  Almost all the little PHPBB graphics will get replaced by text links and CSS.  For the few icons we retain, they will get a new look based on the wood paneled theme.  

All the support pages will also go to the warn wood look, and they will be seperated from the forum by eliminting the common header, and footer.  Stand alone pages for registration, FAQ, members list, cp, etc will make it easier to maintain those if they have their own header and footer without being restrict to what the topics and forums need in them for navigation and admin.

All content pages will start carrying (as RSS) the list of latest forum topics, and will have a registration button to try and move some of the content traffic to the forum.

You will nottice in the sidebar I have brought in some external content.  The dictionary stuff is free, right now the page we are going to is ugly, but there are a bunch of different options I can do off that widget, and there will be a number of variations on other pages.  The satelite weather is not only free, but we are now partnered with Accuweather When you select a region, the page they present with the map is branded.  There is a small banner at the top that says "Welcome visitor from Experts Round Table" and there is a link back to our home page.  Notice these have been brought in without having to put up ads.  There are hundreds of sites with specialty content that are hungry for traffic, and as long as I can get good content for nothing more than a link; I will grab good stuff.  If any of you run across something that will fit in on the site, that is free without ads let me know and I will see what we can use.

I expect it to take some time to get the pages rolled out and new functionality implemented, but I knew it would be mostly a work in progress for the first year.  The rollout will be prioritzed based on where the traffic action is.  The pages that are getting the outside traffic will get improvments and upgrades first, and priorities may change as we grow, if that causes changes in traffic patterns.

And we are growing! Inspite of what looks like a very slow growth based on the number of new members in the forum. We used 85% of the bandwidth allocation for March.  I am going to be upgrading in the middle of April to triple our bandwidth.  Here are some stats to bore you or maybe encourage you; as it does me:

In March, we delivered 15,914 pages to 4,239 unique visitors who came from 422 different referrers.  I know where about 300 links are.  I have not had time to try and track down the other 122, but we are getting treated very favourably by other sites it would appear.  The referrers include hits from del.icio.us and stumbleUpon, an some community type blogs.  Also a couple from Wikipedia where I posted a link to ERT in the similar sites catagory for  EE entry (which is little more then spam anyway). I can than VGR for that idea.

I track traffic using the server stats, and two different tracking services where I have code on the pages to determine where users came from and how they move around the site, I also keep an eye on Alexa for how we are trending.  I do all 4 because I do not want to be mislead by an error in a single source.  There are some differences in detail, but the trend for all 4 is exactly the same; we are on a steep up trend.  We got a big boost in the middle of the Month when Alf's site made Digg.  We got a big boost because he has our link on his site.  I expected it to be a spike, but it wasn't. We were trending up when it hit we went up like a rocket for 5 days, flattened out for three days; and then continued up. We should all thank Alf for the help.  It was worth about 800 or 900 hits.  We also got over 1400 hits from Google, and some from MSN.  Yahoo has done a crappy job of indexing us.  Even AOL delivers more.

The hottest pages on the site are Matt's articles, especially the PAR and timezone pieces.  The other hot thing is our topics.  Google appears to have us fully indexed, including the topics, and we are coming up high in the SERPs for both the topics and the content.  Not just near the top.  We are getting page one hits every day.  We are coming up NUMBER ONE in searches every day.  When we compete head to head with EE we come up ahead of them 60% of the time. (Google recognizes and rewards quality).  We don't have near as many threads as EE, so we are not going to get the traffic from Google they get but WE ARE VERY COMPETITIVE not just with EE but with all the major forums and help sites.  It is not just one or two topics, but right across the board.  The kind of comments we have posted are hitting the nail on the head, and we are current.  The other biggie for us has been the RSS feeds.  Ours going out is consistently among the top page requests every day.  The stuff coming in on both the home page and the tech page are giving us causal and indirect hits.  

When Google indexes those pages they include the content of the feeds because I generate them once an hour and put them into the pages as static content.  All the key words in the feeds get treated by Google as being in our pages.  So, when someone searches on one of those news stories we frequently come up in good position and get a visit.  About half of them see we are not what they are looking for and leave.  The other half, look at what we have, and sometimes stay a while.  As we expand our content, more and more of those visitors will find what they want.  As we push the promotion of registering in the forum, some of them will decide to ask about what ever news story they were tracking.

It all works.  It's all coming together the way it was supposed to; but somethings like registrations are a little slower then anticipated.  

A couple of more items:  
  • Adsense ads, will start later this month on a small scale.  I have looked at other cheaper options, but Google is just to effective to not go with them.  It will be small to start.  The tracking has given me a good idea of what low competition key word phrases should be effective for us, but I am going to be cautious. It is better to take a little time, and avoid wasting a lot of money; with out getting any traffic.
  • Email.  The host has installed a new email UI (Horde) and it is first rate.  Those of you who are using an ERT email you will need to change your url to https://supremecenter25.com/horde/imp/login.php to get the new interface.

The new interface is clean, fast, secure and seems to be pretty robust.  There is virtually no spam because I control the spam filtering levels and there is individual user control for filtering, plus a blacklist and white list. As soon as I am sure it is stable (remember when they upgraded PHP) I will make free email WITH NO ADS OF ANY KIND abailable to members. I have about 30 accounts available now and after I do the upgrade later this month I will have 1000 mail accounts.
  • Personal web page hosting.  Will be a reality withing about 2 weeks, I am just working out some mechanics.  I have 20 subdomains but that will go up to 200 after the upgrade.  The number of virtuals we can do with personal folders is virtually unlimited.
  • New content.  The key to getting up in the rankings is a flow of new content.  On the forum side we are able to do that by commenting on topics as they get posted.  However on the content side it is more work.  There is a little bit of stuff in the pipe line, but we are going to need more during the month of April.  I appreciate any effort you can make if you have something you are woking on, or if you can take some of the great topics and convert them to articles/tutorials.  So far we have been a small community and some of you have done a lot of work; hopefully we will start to see enough new members coming in over the next couple of months to spread the load.


I don't think I say thank you often enough; if I fail to see a contribution please smack me with a board and point it out.  I know what it is like to have effort ignored, and if I do it to someone else, please let me know what a moron I am.

T H A N K S

Roy
Logged
coral1
Governing Council Member
*
Offline Offline

Posts: 321



« Reply #1 on: April 01, 2006, 10:52:07 PM »

I did quick scan, and it looks good. Even at 800x600.
I will take slower look later.

And the pic in the bottom left...   :notworthy:
Logged

NS,NR!!
Huntress
Administrator
*
Offline Offline

Posts: 133



WWW
« Reply #2 on: April 02, 2006, 11:33:06 AM »

Looks good in Firefox except when the screen is scaled down, which I tend to do since I have so many screens open.  It doesn't quite wrap correctly and the right sidebar ends up at the bottom and one of the buttons on the upper and lower bar wraps wrong so that it overlaps the other buttons.  Other than that it looks wonderful!
Logged
COBOLdinosaur
ERT.com Admin

Offline Offline

Posts: 481



WWW
« Reply #3 on: April 02, 2006, 08:04:06 PM »

Okay the sidebar going under the content box was caused by the code in the dictionary widget because they used IE hacks and .net slopcode.  It took me 20 minutes to re-write it for FF, then 5 hours of screwing around to get IE to work decently, and in the end I had to resort to a javascript hack to help it figure out how to re-size the elements.

FF will now let you bring the width down to the minimum and still keep the side bar there.  The Redmond scap collection will handle it down to about 40% of width before it drops the sidebar off, but by then it has messed up the rendering anyway.  

FF also looks better on the full page.

So far this year Microslop owes me about $15,000 for the time I have wasted trying to support their garbage browser.  There is no point in putting any extra effort in for IE at this point.  When IE7 comes out we will have to go re-hack everything anyway.  So from now on if a page is broken in IE 6 and I can't fix it in less than a half hour it will stay broken, and I will wait and fix Microlops mistakes when we have to start dealing Incompetant Exploder 7.  

I thought it was impossible for any one to screw up worse than M$ did with IE 6 but from early reports of IE7, I was wrong and they have reach new heights of arrogance, by stating many web sites that support IE6 will have to re-write  some pages to support IE7.  

I'll have the new version up in about 5 minutes.
Logged
coral1
Governing Council Member
*
Offline Offline

Posts: 321



« Reply #4 on: April 02, 2006, 10:11:27 PM »

Ok. AT 1024x768 it looks good. (Firefox 1.5)
At 800x600 the Register tab drops to the center of the "second row", with a slight overlap of the Tutorials and Scripts tabs, but all tabs can be Highlighted and Clicked.

And I still like that pic, even though it is now on the bottom-right.    :wink:
Logged

NS,NR!!
Huntress
Administrator
*
Offline Offline

Posts: 133



WWW
« Reply #5 on: April 02, 2006, 11:54:54 PM »

1280x1024 with the window at 50% and it looks great except for the "Register" button like coral says.  But everything works fine.   =D>
Logged
Daydreams
Site Builder

Offline Offline

Posts: 3


« Reply #6 on: April 03, 2006, 12:36:41 AM »

I have the same problems as coral with 800x600.

I hate to say this but I feel the design is going in the wrong direction. A clean, light modern look is IMO, better than "wood". Wood images make it look like a beginner's homepage (sorry but that's how I feel.

My opinion does not deny the excellent progress made in the site in general.
Logged
Daydreams
Site Builder

Offline Offline

Posts: 3


« Reply #7 on: April 03, 2006, 12:41:04 AM »

Also the repeating text673860.gif for the background is distracting. I don't like being critical, especially after so much work has been done, but it's how I see it.
Logged
VGR
Mentor

Offline Offline

Posts: 682



WWW
« Reply #8 on: April 03, 2006, 01:16:23 AM »

Quote from: "Daydreams"

I hate to say this but I feel the design is going in the wrong direction. A clean, light modern look is IMO, better than "wood". Wood images make it look like a beginner's homepage (sorry but that's how I feel.

My opinion does not deny the excellent progress made in the site in general.


itou / ditto

abut the CSS : tidy chokes on :
   #firstP {
            font:weight:bold;
should be font-weight: bold;

also, you should put the scrollbar-* IE-proprietary attributes in the "IE hacks" CSS you mentioned, because Tidy/FFox also complains about those.

regards
Logged

techie overlord, answers all kind of questions on http://www.europeanexperts.org
CrYpTiC_MauleR
Site Builder

Offline Offline

Posts: 489



WWW
« Reply #9 on: April 03, 2006, 01:20:55 AM »

Quote from: Daydreams
I hate to say this but I feel the design is going in the wrong direction. A clean, light modern look is IMO, better than "wood". Wood images make it look like a beginner's homepage (sorry but that's how I feel.


I agree, a modern look is what ERT needs. Just my 2 cents.
Logged

[x] Fight | www.crypticmauler.com
"You must be
VGR
Mentor

Offline Offline

Posts: 682



WWW
« Reply #10 on: April 03, 2006, 01:24:22 AM »

may-be that in stead pf "woody" style you should orient yourselves to a "mentor-style" look, like what you know of academic attributes : mortars, books, students, mentors...
Logged

techie overlord, answers all kind of questions on http://www.europeanexperts.org
Anonymous
Guest
« Reply #11 on: April 03, 2006, 02:12:53 AM »

Quote from: "Daydreams"
Also the repeating text673860.gif for the background is distracting. I don't like being critical, especially after so much work has been done, but it's how I see it.


In my earliest days of very bad page design, I use to use a logo background VERY similar to this.

But instead of the image just being rotated in a cell on its own, the background was like an entire sheet being rotated.

Took a while to work out how to do it as the dimensions on the image are important. In the end I used good old Pythagorus to help me out.

But then the logo changed and the customer didn't like it and now it is no more.

But I personally like a nice off white background. Looks like  watermarked paper.
Logged
COBOLdinosaur
ERT.com Admin

Offline Offline

Posts: 481



WWW
« Reply #12 on: April 03, 2006, 06:57:37 AM »

The wrap on the nav bar elements is by design the options are: horizontal scroll bars, shrink the nav or wrap.  The wrap has a tab look and is better than the other two.  I did change the background on hover though.  The transparent does not look right for tabs, so now the background is white. See if that looks a little better.  There is not going to be any special support for 800x600 but it should still degrade politely.

Quote
I hate to say this but I feel the design is going in the wrong direction. A clean, light modern look is IMO, better than "wood".


A matter of opinion.  The brushed metal look did not work, and it makes the forum look dull and inactive.  The clean look makes the site look just like others of its kind.  Back when we did the informal survey of what members liked on the internet, the sites selected were not even close to what the same group described as being professional looking.

The popular pages on the site are the ones that don't look like everything else.  The pages that returning visitors come to are the ones that don't fit the templates.  The ones that seem to be triggering visitors to stay longer and explore are the ones that don't look like they belong in a museum or boardroom.

What we have is a forum that says "nothing to see here, move along".  In March Google gave us 300 hits directly on forum topics.  Only 7 of those visitors looked at another page.  On the content side Google gave us 800; half on the home page.  Over 90% of the home page visitors left without looking at anything else.  The 50 who hit the tech_news page first all left without looking at another page.  The 350 who hit content pages that don't look like the rest of the site; on average, looked at 5 additional pages but 80% of that subgroup left immediately after looking at the forum index page.

Conclusion... Our visitors want a comfortable site with a more casual look, not a site where they have to wear a suit and tie. It does not matter what we think the site should look like or what we want our image to be. Visitor behaviour tells us what they want and what they done like.  They have said loud and clear they do not like the stark clean look, they do not like the forum, and they do not like formal presentation.  What they like are Matt's pages, my pages, and Coral's pages.  The more formal looking pages that Rod and Alf have done get traffic and hold visitors because they are good content,  but do not move the visitors to look at more.  Therefore the "wrong direction" is what the visitors seem to favor; and we spend time on academic dicussions of "good" design on we can observe what visitors are favouring and give them more of it, and keep adjusting to what they indicate works.

Quote

 #firstP {
font:weight:bold;
should be font-weight: bold;


Oops typo -- fixed.

What scrollbar code are you talking about?  There is nothing in that page for scrollbars.  There is some of that crud in the PHPBB CSS, but that will be history as we start to deploy the new look.


General:

I can show you 10,000 articles about the right way to design web pages, and when you are finished reading them you will find that every single general theory is countered by another general theory that is opposite.  I can show you a million failed web sites and 100,000 failed forums that cover the whole range of design possibilities.  I can show you the 10,000 most successful websites on the internet, and again every conceivable design idea will be represented.  The difference between the failures and the successes it that the successful sites pay attention to what works for the visitors they are targeting and those that fail, don't meet the needs or expectations of the users they are trying to attract.

It does not matter what we think.  The visitors to the site by their behaviour tell us what they want. We either give them that, or join the millions of other dead zone sites on the Internet whining about how hard it is to compete.

Thanks for the input so far.  We got a couple of things corrected;  and I probably irritated some people. I don't hear anyone saying it is unattractive; so it comes down to taste, and I think this is closer to the taste of our visitors than what we have. As they tell us more we can give them more of what they want, or we can stand on principle, and decide what the "right" design is based on academic discusssion that leaves the user outside the room.

Cd&
Logged
nicholassolutions
Administrator
*
Offline Offline

Posts: 133



WWW
« Reply #13 on: April 03, 2006, 01:56:23 PM »

I don't love the wood either, especially since it clashes with the logo we've already got, and I don't think it would be productive to go redesigning that again...

I think VGR's idea
Code:
may-be that in stead pf "woody" style you should orient yourselves to a "mentor-style" look, like what you know of academic attributes : mortars, books, students, mentors...


might be worth playing with.

I also find the watermark distracting -- I think I'd make it closer to white, a little larger, and repeating less often.

That said, it's a small detail that can be toyed with, and it's worth seeing if it makes a positive difference. I think the layout itself is nice, the content is much better than before, and it is much easier to see how and why to sign up.

Eventually, everyone should be able to pick their own theme for how to view the website. For now, I think it's worth giving this a try and watching how it affects traffic and signups. At the very least, it will give us another data point to help analyze what users are looking for.
Logged
COBOLdinosaur
ERT.com Admin

Offline Offline

Posts: 481



WWW
« Reply #14 on: April 03, 2006, 03:41:22 PM »

Quote
Eventually, everyone should be able to pick their own theme for how to view the website.


It is CSS based and is designed to be fully skinable; including some limited ability to modify positioning.  Themes will become available onece it is rolled out and I play with a couple.  We can also do a contest to develop a couple more.  Sometime after themes become available, I will have an interface to allow full customization of the CSS, but we are not going to go as far a zengarden I don't think.  However there will still be a debate over what the default theme should be.  I tried to give options when we first start out with the forum, but PHPBB is not CSS based and the one attempt at a CSS based phpbb was full of major bugs.  So the new design will flow to the forum and a lot of the presentation code will go in the dumpster so we can do custom themes properly.

I've tried to write this next paragraph 3 times and it always ends with me sounding angry and ungrateful.  I will try to do a couple of alternate style sheets, but given history; there is nothing that is going to satisfy everyone. As for the background. ...  <Frustration_not_anger> every background color I have tried (including white) has been criticized.  Every background-image I have tried has been criticised.  Apparently a custom watermark also does not fly. I will see if I can do a lower contrast one(graphics is not my specialty); but it is staying until someone else comes up with a background that satisfies everyone.</Frustration_not_anger>

Let me see what kind of presentation I can come up with.  I was hoping there would be some reference to color combinations; as there isn't I guess a color blind dinosaur got it right for a change.

Cd&
Logged
Pages: [1] 2 3
« previous next »
    Jump to: