My very first website.... what you all think?

[robbone74]

Hey all, so i'm on a web and interactive media course and had to build a website for my assessment but i only started working with computers last year so don't really grasp alot of the stuff involved yet so if you could let me know any good or bad points it would be much appreciated. My site is www.robbone.x10.mx

[Murphy65]

if you made that yourself is that good ! Dont hawe nothing bad to say!


Thumbs up

[Darkmere]

You may have a contrast error on your nav bar and the 4 second rule

[SJ.Wolfe]

You should brighten the text a bit. The dark red on black strains my eyes.

[essellar]

Well, Rob, the good point is that it works. But in the words of the Old Master, "there is much yet to learn, young Grasshopper."

The most egregious error is that you are not using any header tags (<h1>Main Heading</h1>, <h2>Top-Level Subheading</h2>, <h3>Second-Level Subheading</h3>, et cetera) except on the individual menu pages. Because your site is using graphics rather than text for the main page heading, it might not be apparent why this should be important. It's not just about the size and alignment of the text; it's about the structure of the document. A machine can't read your page and make sense of it. Not only does that mean that visually impaired users can't access your page (they rely on screen readers, and often on browsers that display all text at a single size and don't display images at all), it also means that search engines can't tell up from down.

That brings me to point number two -- your images are just images; there is no alternate text. The alt="some text goes here" attribute on an image tag should not be thought of as optional if the image is anything more than a decoration. (And if the image is just decoration, then it should come from your CSS style sheet, not from your HTML markup.) If your "Dignan's Catering" logo image fails to load for whatever reason, there is nothing but a hole in the page left behind because you have alt="" in your markup. The text in the alt attribute is what the browser will display if the image cannot or will not load. The same thing applies to your menu images -- there are no navigational clues left if the images don't load.

Speaking of the menu, there's a spelling mistake in the word "Menu's". I'm not mentioning that because I want to make fun of you, but because the mistake is in an image, not in some text. You may be able to correct that easily right now, but let's imagine that it's not a spelling mistake, but rather a menu item that needs to be changed later on. It's going to be very difficult for anybody who doesn't have exactly the same version of that font and exactly the same image editor to match the rest of the menu (different versions of the font may have slight differences, even if the name and "feel" are the same, and different image editors handle text in slightly different ways). Whenever possible, try to use text instead of images. If you need to use a particular font to get the effect you want, then you can use the @font-face CSS rule -- that lets the user's browser temporarily download and use a font that they may not have installed on their machine.

Oh, and you don't need to use anything like the mm_menu script for anything anymore. CSS will do the same thing better-faster-cheaper through the use of the :link, :visited, :hover and :active pseudo-elements. You might want to Google for "CSS menu" for some examples.

I hope this doesn't come off as discouraging. There is a lot of old and outdated information in libraries and on the internet that can lock your web efforts into a 1996 time bubble, but there is also a lot of really good, up-to-date, "best practices" stuff out there as well. Nobody's expecting you to become an instant expert; learning takes time. But it helps to know why you're doing what you're doing, otherwise you can become a cargo cult developer/designer, just doing things the way we had to do them in the bad old days without understanding that there are much better ways to do things now.

[cristopher_caducoy96]

I agree with ezellar if i am not mistaken, i'll not repeat those and i got some additional suggestions. This site is great for the thing that it was manually coded or i think made by some site generator programs. This site is static, highly vulnerable for intrusion. I suggest, make it dynamic for more secure. Think of this, you made that site all of your might and someone think to overwork your site; it can be taken down easily. What i'm saying is strive more for advancements and upgrades.

If you are already familiar with the code syntax of HTML and CSS including PHP, why don't you try some simple Content Management Systems? It has few automation, awesome interface (admin panel) and easy to understand.

[vekou]

Congratulations on your very first website. But I feel the need for constructive criticism in order to better your website and your skills.

1. First, balance the color scheme of your website. Make sure that the colors don't fight against each other. Make sure that text colors are clearly visible against the backgrounds.
2. Second, use text as much as possible. If your making a navigation menu that displays texts, try not to use images with rendered text since it makes more sense. Using images as a full-time substitute for text is a bad idea. Since web browsers are not limited to IE, Firefox, Safari, Opera and Chrome, there are tons of browsers out there and some of them are unable to display images. Also, screen readers used by blind people can't read the text that is rendered on an image. Majority of the reason why people tend to use images instead of text is because of font issues. Font support for browsers is very limited. But there are other alternatives, for example, you can use Google fonts to design your text using free fonts.
3. Use valid HTML/XHTML. I've noticed that you've used XHTML Transitional as the doctype of your documents, which means most tags must have an ending tag. But you've probably used a WYSIWYG editor so your "probably" have less worries regarding that. When in doubt, you can use W3C's Validation Service.
4. Visit other modern-esque websites and try to incorporate some of their designs into your own. Don't be offended, but I've noticed that your design is geocities-like. It has a feel of an early to mid-90's website design. In order to attract more pageviews, thus more customers, you need to adapt your page design to the times. It is the reason why big companies pay millions just to have a neat web design. Don't be mistaken, I'm not criticizing your design skills, just implying that there's a lot of room for improvement and you can learn other techniques from the works of others. I admit that I'm not that good in terms of webdesign but I am proud that I have improved a lot compared back from those days.

[essellar]

This site is static, highly vulnerable for intrusion. I suggest, make it dynamic for more secure.

What on earth makes you think that a dynamic site is more secure than a static site? If I can get write access to the file system, I can just as easily change a PHP page as an HTML page. And changing things at the level of the file system is the only way to deface a static site. With a dynamic site, all I need to do to change content is to gain control over an author's account (and there is usually more than one), as often as not by sniffing usernames and passwords from HTTP packets. Or I can often count on SQL injection because the site's developer(s) disn't use parameterized statements. Or I can use cross-site scripting because you didn't properly sanitize user inputs. Or I can do cross-site request forgeries. The list goes on.

There is one "default secure" dynamic web environment out there that I'm aware of (IBM Lotus Domino), and even that is often insecure in practice because the developer/administrator is not aware of techniques to keep it secure. (It's often easier to "open a door" than it is to code things properly.) Dynamic doesn't mean safe; it means you've chosen to add attack vectors (that you are responsible for minimizing) in exchange for increased functionality or ease of maintenance.