Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

russelldirect

macrumors member
Original poster
Apr 4, 2011
45
0
Berkeley, CA
A couple of friends and I are basically trying to create a craigslist competitor with a better interface and social network integration. So far, all we have in place is the rough appearance, so I wanted to see what you think, since I've really liked some of the sites made by MacRumors members.

http://aucdog.appspot.com/

Any suggestions?
 
What you're trying to do is a tough row to hoe, but I'll give you some general suggestions:

1 - overall the entire design needs some padding, especially on the left hand menu

2 - The liquidity of the design is having some issues when you shrink your browser window down. Funky wrapping and non-desired behavior in the header

3 - Make the menu items on the left side links. That's what they do, that's what they should do.

In general, your markup needs some work -- you're using div and p tags all over the place, when those aren't really the best way to represent your data. Also, I see a lot of places where you're using classes that would be better served by ids.

Making your markup semantic and valid will go a long way towards addressing cross-browser issues. Especially on a site like this, where pixel-perfect reproduction isn't important, but you do want the site to look good and be usable across all browsers.

Shoot me a PM if you want any more specific suggestions - it seems like you have the desire to "get it right", so I might be able to offer some experience + advice.
 
If I'm looking at this right you're loading all the information on one page and then using javascript to hide that div until the user clicks the page?

This means that every time someone will visit your homepage they will be loading the entire site, this will slow down massively as people add more content, as an alternative you could maybe create pages for individual sections and use php includes for your headers, navigation and footers.

Also, you need to check how it looks in other browsers, its sort of broken in Chrome at the moment.

Good start tho :)
 
it's not loading right in safari either... the text just mashes up against everything and shoots off the right.

so... i have to ask, do you have someone to work on and develop this site? Like who knows databases and sql etc stuff that you will ultimately need? If you are having trouble with divs and basic layout stuff, then I'd be really worried about the complex database stuff you are going to need to be able to do to get this to work.
 
You need to hire or find a friend who is a UI designer. Wireframe how you want your website to look and work rather than programming and tweaking the design as you go along.
 
Need to do basic browser testing. There are some severe bugs.

Social network / verified accounts is a good idea and might be better than the current CL methods.
 
Thanks for the recommendations everyone. I really have been doing the HTML/CSS "quick and dirty" so that we could get functionality up and running. Tonight I'll be implementing formatting along the lines of this.

I really needed to do browser compatibility checks though. I pretty much only checked in maximized Chrome and Safari windows, so I didn't notice the content freaking out when the size of the window was changed.

pete, the plan is to automatically check the location of site viewers and only show listings within a certain radius of their location, and only load sections when they are clicked on.

bpaluzzi, I'll be sending you a PM later today.
 
Quick and dirty is fine for small sites, but really if you want to make a "craigslist competitor" you might want to look into using a well formatted database, doing some hard work now will really pay dividends for you in the future and any changes you do make will be much simpler.

That layout is pretty standard and is a good framework to build off, as I said before, php includes are your friend :)
 
Not sure if this would be right for your concept, but at my day job we have made every single page on the WordPress platform. Fantastic CMS and infinitely easier to manage/modify AFAIK.
 
For the technical side of things you will definitely need to integrate with a database. Also I recommend that you avoid using Javascript as much as possible.

But at the moment there isn't much to critique apart from the design. Design-wise you should definitely make the left-hand links actual links (at the least, change the mousepointer on hover).

This will be a big big project so good luck!
 
Also I recommend that you avoid using Javascript as much as possible.

I'd caveat this by saying: "avoid using Javascript as the only way to do something".

For example, don't have javascript instead of links. If you want a cool javascript interaction that happens when you click on a link, make sure it works as an _extension_ of the native "a" tag behavior. It's all about "progressive enhancement". If the user has javascript enabled, they'll receive a cool little bonus, but if they don't have it, they can still use the site.

This is less of an issue today than it was even a couple of years ago, but still a good design/coding philosophy to adhere to.
 
The site's actually already integrated with a database. It's running on the Google App Engine platform, and you'll notice that if you try to post a listing now it works, as we got the Python working to use the Datastore.

Also, I'm going to take your advice and make the links into normal links and use PHP includes to go to the html files for the categories.
 
currently when you're over a link you can't tell you are. My cursor turns into a text selector as usual instead of an arrow. You need to give the user some basic website feedback as far as hover color change or something.
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.