Can you find any bugs in my website?? Rep for the helpful...

[TonyB]

I have FINALLY gotten around to doing some work on the MotoEquip website. Yes! I know....:gob:

A few times in the past I've seen members who have put together a web site ask KB'ers to check it for bugs, so I'm hoping some kind soul will do the same for me.

Now, some of the criticisim I've seen in the past has been a tad harsh, so before you experts launch into me for some crappy piece of code or whatever, please try and remember that I am totally self taught and I've been learning as I go... please?....

I've worked on the KEEP IT SIMPLE STUPID theory. Well actually, I didn't have much choice... but I realised after looking around some sites that they spend soooo much time putting wizzy flash whatsits in that they kinda forget to put any info.

Anyhoo, if you find anything wrong, let me know... gently LOL. Rep for the helpful.

Cheers
Tony

CLICK HERE (http://www.motoequip.co.nz)

[skelstar]

Is the image at the top (banner) supposed to be missing?

[skelstar]

GIve your pages a title (the "title" tag). It comes up as 'index' on my browser.

[skelstar]

Me again :).
Your banner menu looks different in each page. Not sure if this is intended or not.

Site looks good though...:niceone:

[TonyB]

Is the image at the top (banner) supposed to be missing?
That was quick! Erm.. no it's not. I can see it... see attached image

[SimJen]

Personally I'd prefer a smaller font and some slightly better formatting.
Rollover Buttons not that obvious perhaps a little "click the image below" in small font. Remember sometimes Joe Public isn't as web literate as you or I.
Yep and don't forget to name the pages as mentioned above.
Otherwise its simple and fast, just how it should be :)

[onearmedbandit]

Tony, you obviously made the page to suit for 800x600, which is from what I understand the std, but I view at 1204x768 which is pretty low res itself (p.o.s. computer) and the site doesn't full the whole page. Most sites suit to the users res setting, but for some reason yours doesn't seem to.

Oh yeah, and get a new phone as well you tight bastard!

[TonyB]

GIve your pages a title (the "title" tag). It comes up as 'index' on my browser.
What, every page? Thought I had that one sussed...

[SimJen]

Yeah its good to be backwards compatible but just about everyone uses 1024x768 as a minimum these days.
You could always centre justify?

[skelstar]

OAB - to be fair this is something that a web-dev struggles with. Esp when you have tables full of data. You want to be able to control the size of the tables...forced formatting I guess.

[TonyB]

Most sites suit to the users res setting, but for some reason yours doesn't seem to.
Wouldn't have a clue how to get it to do that. Anyone got some hints? Will it destroy the table formatting?

Yeah its good to be backwards compatible but just about everyone uses 1024x768 as a minimum these days.
You could always centre justify?
I wanted to do that. Can't see it being that hard, but have no idea how.

[onearmedbandit]

That was quick! Erm.. no it's not. I can see it... see attached image

I saw the banner, but I don't see the image....

[thehollowmen]

Banner looks like it is repeating.. I get a "mo" underneith a big M before the "Parts Accessories Apparel Contact Us" menu at the top right of the index page.

It doesn't fit on monitors over standard size very well. My 1280 by 1040 has a huge black boarder underneith and to the right, lesser so on the 1024 by 768 one but that's me just being picky.

yeah, the menus cycle weirdly as you move through the site.. a little disorientating.

[Biff]

No bugs found from this end mate. Looking good. Although - I don't know if it's a Bug Tony - but there's some familier dodgy looking geezer in the Minotaur getup. It's not D is it?

[Karma]

Yep.. need to use percentages for size instead of pixels

[bugjuice]

I've got the banner repeating itself in the top right.
Aside from that, seems to work ok on a mac 10.4 with Safari and FireFox

[skelstar]

I think that when you have: "background='Images/MotoEquip-logo.jpg'" Firefox dont like it. It prefers './Images/MotoEquip....blah blah'. Note the './' bfore hand.

Image aint there on my firefox anyway.

[onearmedbandit]

Wow, popular thread.

[bugjuice]

What, every page? Thought I had that one sussed...
are you using a master frame? If so, just have to change that title, not every page within the frame

[TonyB]

Banner looks like it is repeating.. I get a "mo" underneith a big M before the "Parts Accessories Apparel Contact Us" menu at the top right of the index page..
Bloody tables...mutter mutter




yeah, the menus cycle weirdly as you move through the site.. a little disorientating.
I'll fix that

[TonyB]

Wow, popular thread.
I reckon. Must be the rep carrot?
I'm gonna go strip some paint of my house for a bit. Will check back later.
Thanks.

[Good Girl]

I think look good.
From a professional point of view - the lay out of some text just needs to be refined to look more visually attractive. I.e Home page & contact page Content is good. easy to use straight forward and good deals available nice equipment too which is one to initially attract the consumer. nice work.

[Flyingpony]

Need to add 'alt' and 'title' tags to the images.


GIve your pages a title (the "title" tag). It comes up as 'index' on my browser.

What, every page? Thought I had that one sussed...

Yes.

Home page link?

Have a look at this site: http://validator.w3.org/
It'll tell you some more bits which are incorrect or missing.

Site copyright doesn't include this year - META tag.
Meta tag should be on every page.

[Karma]

<title>Index</title>

change that to <title>MotoEquip</title> or whatever it is you want to use

[SimJen]

Its good to have the rollover altered to "rolled over" when you are on the page concerned??? if you get what I mean.
Are you using anything to make it? or just HTML coding in Notepad?
I have a tendancy to use Notepad, Dreamweaver etc depending what I'm trying to do. Dreamweaver can make it easy to spot and fix things and is good for layouts.
I prefer CMS systems now with Database's etc. Lot more fun ;)

[WRT]

The menu sizes for the Parts and Accessories pages are both the same size and look good with the logo. The others are all of varying sizes, and as mentioned earlier, some of them are small enough to cause the logo to start repeating.

FWIW, I am using firefox 1.5 and it all appears fine.

And just another thing to consider, on most sites the logo is a link back to the home page, its not a major but you might like to consider doing the same, as a lot of users will expect this.

[HDTboy]

Damn, it's all nerd speak. I thought it was a treasure hunt organised by Elmer Fudd

[Sniper]

Yea, you haven't mentioned me. :lol:

Looks pretty good tony

[TonyB]

To those that couldn't see the MotoEquip banner- I've updated the home page (clicky!) (http://www.motoequip.co.nz)
Any better?? It was a background image rather than one with a place holder.
I guess theres a way to change a master page and have all the others change too? Not sure I want to know if there is.

Those that couldn't see the banner- what do you see on the Apparel page? There shoul;d be a black bull in the background

[Karma]

I use templates in dreamweaver... every single page uses the same bulk information apart from a text area.

Any changes made on the master template are then put into any child pages.

Would require completely rebuilding your site thou :(

[skelstar]

Dreamweaver is evil, as is Frontpage, and def Word. Sorry but the best way to write a site is to type it. Get a editor that has autofill type stuff and syntax highlighting. Def recommend skEdit for Mac.

Tony - Ill have to check at work. Use FFox on a Mac at home (bliss).

[Karma]

Well it could be said that the best way to get somewhere is walk, so why do you ride?

I can type in raw HTML if I need / want to, but why make things harder than they have to be?

[skelstar]

Believe me in the long run its faster. You control exactly what happens, where you want it to happen. I am def one for looking for shortcuts :) this is better once you learn HTML fairly well.

[Karma]

Guess it's personal choice really... I do a fair bit of playing around with graphics and layers and such, and find that it's easier to see if done in a GUI environment as opposed to saving and previewing the website all the time.

[Biff]

I love Dreamweaver. It helps make me look like I know what I'm doing.

[skelstar]

Ah yeah. I have two screens at home. Have a browser open in one, editor open in the other. I can hit a hotkey and it updates automatically in the browser. *not a preview window*. Preview windows arent very ...umm...faithful sometimes. Some render the page badly. Besides I use PHP in my page, and preview browser windows dont like that :). Lots of dB stuff too.

I use (almost exclusively) DIV tags and CSS a lot also.

[riffer]

Dreamweaver rules. Everything else I've tried is yuck and I'm too lazy to code.

A couple of points.

1. Your banner.

On the Index page works well. Subcategory pages - not enough space allowed in table. So it crops the bottom of it. See first attachment for example. Happens in all your subcategory pages.

2. No rollover pic for Minotaur page rollover on Index page

3. When you go to a subcategory page and go back the subcategory rollover remains in rollover state until rolled-over, in which case it goes back to non-rollover state once you roll off.

4. Having your email address in a "click-here to email" text is inviting masses of spam. Suggest you use a pic here and make people use their brains.

[TonyB]

Dreamweaver rules. Everything else I've tried is yuck and I'm too lazy to code.

A couple of points.

1. Your banner.

On the Index page works well. Subcategory pages - not enough space allowed in table. So it crops the bottom of it. See first attachment for example. Happens in all your subcategory pages.

No attachment LOL. I'll fix all the pages and post for a response

2. No rollover pic for Minotaur page rollover on Index page
There is when I look- it should say "APPAREL"

3. When you go to a subcategory page and go back the subcategory rollover remains in rollover state until rolled-over, in which case it goes back to non-rollover state once you roll off..
If I understand you correctly, then I don't seem to have this problem either??


4. Having your email address in a "click-here to email" text is inviting masses of spam. Suggest you use a pic here and make people use their brains.It's all 'obfoscated'- code for letters and stuff. Downloaded it from somewhere or other.

[kro]

The top image (the piston), has a gap under it that is slightly wider than the gaps between the others. Did you use tables or &nbsp (hehe) to space them?.

I am viewing in 1024 res, and it wont fill the page, but thats an easy fix if you go change all your pixel widths to % instead. So if a column width = 750px, then change it to 100%, and it will resize to the users screen res automatically.

Your contact us page hasn't aligned hard left against the images like the apparel page does etc etc. Its a pretty sweet site really, its simple and uncluttered, and thats a major bonus.

Nice work dude, looks good.

ps, I would copy the basic page tremplate from your riding gear page, get rid of the bull pic, and use that for your contact us page, it would keep some consistency about it then (just friendly suggestion)

[TonyB]

Hi Kronos- for the gap thing, I'm using tables but they are kinda erratic. I'm using a preview release of Dreamweaver MX thats probably 1,000,000 years old. I've been going through and sorting out the banners, and if I try and insert the banner image for MotoEquip (rather than set it as a background) in the back protector or gloves page it just shits itself. Buggered if I know why.:scratch:

Will try the % thing, but given the probs I've had I can see it turning pearshaped..

Thanks to everyone for the comments and advice:woohoo:

[Sniper]

I can get a hold of the new dreamweaver for you if you want

[riffer]

for the gap thing...if I try and insert the banner image for MotoEquip (rather than set it as a background) in the back protector or gloves page it just shits itself.

One way to control the size of the table is to create a 1-pixel graphic (I call it x.gif for want of a better name), place that in a column to the right or left of the banner column and size that to whatever height you like.

Dodgy, but it works...

As for the rollovers, I think it's more to do with the Mac I'm on here at work (Quicksilver 800 running MacOs Z1-9.2.2 with Internet Exploder 5.0) than anything you've done wrong.

I'll check out the site at home later (hopefully) using my Sawtooth G4/400 (10.3.5 with Firefox 1.5) and PC (Athlon64 3500+/Windows XP SP2 Firefox 1.5) and let you know how it looks if you like.

[Karma]

Yea, you haven't mentioned me. :lol:

Looks pretty good tony

I'm sure he could have put on the photo of you with your lovely white socks... but I think he actually wants to sell some leathers :nya:

[TwoSeven]

No doctype at the start, missing alt tags no background color in the .testcss class (although I suspect you dont use that) - other than that - seems fine.

[Big Dave]

Tony - only thing I noted was the table alignemt on some pages that you know about and some pages are named with upper case starts - doesn't really matter but the gurus will complain.

I use dreamweaver and tidy it up/modify manually - even for css sites - I know people who still fight the fight - but for me it stoped being about the 'purity' of the code ages ago - now it's show me the money and wysiwyg editors do that.

[Cookie]

Hi TonyB. Here are a couple of opinions which I hope are helpful as you develop your site. Others may disagree

The use of “rollovers” to conceal navigation information has been referred to as “Mystery Meat Navigation” (MMN) (although this term will mean something entirely different to Maurice).

A fun place to learn a bit about good web design (by looking at bad design) is at www.WebpagesThatSuck.com. Here is his reasoning for not being a fan of MMN: http://tinyurl.com/c3jl5.

Your site works around the problem by providing duplicates of the main navigation links on the upper-right of the homepage – which is using up your valuable screen real estate.

On http://www.motoequip.co.nz/Minotaur-frontpage.htm, the user can miss the fact that there is some additional info available for each product. I would remove the second "rollover" images on the product graphics but leave them linked to the detail pages as they are. In addition I would make the product descriptions/names (e.g. “One Piece Suit”) a coloured hyperlink maybe, so the user can NOT miss the fact that there is some great additional info available for that product just a click away.

I recommend avoiding the use of hyperlinks that start life out as black text. Blue is a good colour but others have been known to work – something other than just a mouse cursor change needs to say “I can be clicked”.

Once you start adding more content the site will benefit from a “search” function.

There is something about the font type and font colour combinations that need a tweak in my view. There are some talented graphic designer types around here who might comment – (the comment might just be that I am full of BS :) ).

Best wishes!

[TonyB]

Thanks man, I can definitely see your point. But I like MMN:( ... it looks cool and stops my pages from just being a bunch of boring text. I think I'll stick a "Click here" on each of the images.

On the subject of mystery meat- does anyone NOT realise that when you go to one of the Minotaur product pages, all of the small images can be clicked on to open a large image in a new window?

I'm still having issues with the tables stuffing up the spacing for the MMN stuff on the left. :mad: Riffer- I'll try what you mentioned.... when I figure out what you meant LOL.

As for the coding stuff, I will look at it- promise! Try to remember that I did a bit of work on the website for my last job- just manipulating existing pages to make new ones. This is my first ever crack at starting a website from scratch, so if you imagine someone who's done less than 2 weeks over 3 years manipulating an existing site, and then probably about 16 hours fumbling about creating their own website with zero training, that'd be me!

Thanks to all that have offered advice. I'm all repped out at the moment- been giving out too much- but once the system lets me, I'll make sure everyone gets some bling.

And yes Biff, that would be D. Some of them are me as well. I was going to hire a model- models themselves are fairly cheap, its the royaltys that add up. D did a great job, as did Rashika on the camera.

[Cookie]

Thanks man, I can definitely see your point. But I like MMN:( ... it looks cool and stops my pages from just being a bunch of boring text. I think I'll stick a "Click here" on each of the images.
[snip]


Glad you appreciated the perspective. I like the graphics down the left side too Tony and I would keep using them on the site but they don't necessarily need to fullfil the additional navigation purpose. Adding the "click here" text to each of them will tend to spoil the very nice clean look you have achieved with those graphics.

That guy has a good (and amusing) review of many basic design issues that are easy to avoid at the link below (if you have not already read it).

http://www.webpagesthatsuck.com/biggest-web-design-mistakes-in-2004.html

Happy coding!

[Karma]

On the subject of mystery meat- does anyone NOT realise that when you go to one of the Minotaur product pages, all of the small images can be clicked on to open a large image in a new window?


Not at first glance no, you'd think they were just pure decoration.

General rule of thumb of web design, as with many things, Keep It Short and Simple, but I'm sure you already know this.

The site looks great, and considering you're catering to a specific market who will have gone to your site looking for leathers (as opposed to something like Amazon where people just browse and don't know what they really want) then they're more willing to take the extra time to explore the site than Joe Public would.

BTW, that's a great first effort for someone with as little programming knowledge as you say you have... most first sites are dodgy frames pages with pure text all over the shop.

[Lias]

My 2 cents.

As of this post, the main page is still only titled "Index"
Find this and change

<title>Index</title>to
<title>Motoequip - Killing small kittens since 1839</title>
Or whatever you want it to say

"Under Construction" pages are evil. If you havnt built it, dont have the link to it in the first place. Unless you have your acessories page nearly ready to go, remove the entire button/link and add it back in when you have it gtg.

Other than that it looks good to me.

[Devil]

Hey mate,

Here's a few idea's from me, sorry if any are repeats from previous posts.

Put the contact details into a header or footer on each page (including the index page). Being able to pick this information up on a website without having to click anything is very handy. I'd go for a footer myself, it would tidy the bottom of the page nicely, instead of the page just "finishing".

Regarding the table widths and screen resolutions: I would say leave it as it is if you're not that experienced. The downside with a variable width is that it can get untidy very quickly. If you fix the table width like you have, you are guaranteed a tidy presentation of information.

Text is "good" but I think it could be better. Investigate a few different font types, keep it clear and simple. Not sure if it was mentioned earlier, having a little extra space on the right side of the text before the end of the white space would make for a tidier page.

Switching between your apparel pages and the main page I noticed the gaps between the picture links on the left changes depending on the page you're in. Does this table have the same properties on each page?

Well done in any case!

[Yokai]

List of issues:

1 - no Doctype - this is a problem for search engines and means that your html will not validate correctly

2 - Useful to keep the links to where you are going and have been in the same place. i.e. if you are gonna have a home link keep it at the top of the list or whatever - Also - keep that list in the same order. It changes too much.

3 - Contact page has no home link (just a contact us link)

4 - Apparel page has a different layout (the links at the top are wider, the clickable images are slightly further apart)

5 - No Contact Us on the Accessories under construction page

6 - Navigation changes on the actual leathers pages - i.e. should have an "Apparel" link at the top (to cater for those who don't see the roll-overs)

There are some problems in the html too, but these will be sorted differently depending on what you want the html to validate as.

To get around the layout changes you can sort this by using CSS...
Tables can be populated with the &amp;nbsp; code for blanks which provides content and allows the tables to be easily aligned

Hope that helps!

[Sparky Mark]

This is a bug rather than a criticism.

I notice that your logo is active as a link from most pages back to your home page. However from the parts page it isn't.

Nice layout though, easy to navigate and simple. :)

[k14]

There's a major bug I found. Some ginga has managed to get his photos on the site under the photos of the leathers. I think you may have been hacked by some ginga's rights activist group to try and get some equality for all the gingas out there. I think you should change these photos asap as they will most definately impact on sales.

.....now where's my rep

[TonyB]

To get around the layout changes you can sort this by using CSS...
Tables can be populated with the &amp;nbsp; code for blanks which provides content and allows the tables to be easily aligned
:blink: :scratch: :spudwhat:

[TonyB]

Some ginga has managed to get his photos on the site
:killingme The ginga actually did a bloody good job:yes:

[skelstar]

&_nbsp; stands for 'non braking space'. Its like a code to tell the browser that its a space character (no not like R2D2). Like &_amp; is ampersand (?). So....if you put lots of &_nbsp;'s you will be filling out a table cell with spaces, making the cell bigger and bigger, thus moving the image over...or something.

Your code has the odd &_nbsp;, dreamweaver put it in there.

Note: I have written non-braking-space with a '_' to stop your browser thinking its a space character :).

[Devil]

&_nbsp; stands for 'non braking space'. Its like a code to tell the browser that its a space character (no not like R2D2). Like &_amp; is ampersand (?). So....if you put lots of &_nbsp;'s you will be filling out a table cell with spaces, making the cell bigger and bigger, thus moving the image over...or something.

Your code has the odd &_nbsp;, dreamweaver put it in there.

Note: I have written non-braking-space with a '_' to stop your browser thinking its a space character :).
Thats "breaking" mate ;)

[skelstar]

True :). Old habit.

I think the non-braking space is between my ears.

[TonyB]

Right, I've made some small changes. All of the image buttons (MMN) on the Minotaur detail pages now have "Click for larger image" on them. It doesn't look quite so purdy now, but at least it's clear.

I've updated the titles so they now give a better indication of what is on the page.

I'm confused about this Doctype thing. Exactly what do I need to insert?
is it (between <>)
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" ??
This is what my version of Dreamweaver mentions in the help files.

HELP!