please critique my website (i made it myself)

Discussion in 'Website Creation' started by cavaugeois, Mar 7, 2010.

  1. Where to start: Your pages are not aligned so as you mouse-over and move around the site the pages "jump" or realign continuously.
    Why the huge white borders around the work? very distracting.
    Can't see the work for the overabundance of copyright protection - what are you worried about?
    Overall, graphically unsophisticated - the huge rounded buttons for example - the choice of font for your about page leaves something to be desired.
    Take a look around at other sites (or mine) and see what I mean. Good start now clean it up.
    gary
     
  2. I agree with all of Gary's points.

    The copyright sign really is too much. You have a few minimalistic shots with snow where the copyright sign is so
    prominent and the photo so understated that the copyright sign looks like the subject of the photo.

    I suspect the jumping around is caused by the DIV sizes getting recalculated when the border appears around the linked
    buttons. You really don't need the borders so you might be able to fix it by changing the css for the hover over the links.

    Also, the top title and navigation section takes up too much real estate. It forces me to scroll down to see the entire
    main image. Then each time a click a thumbnail the whole page reloads and I have to scroll down again. That gets old
    very quickly.

    You should consider rewriting your bio. Currently, your bio suggests that your journey as an artist is a string of camera
    purchases. If this is just a way to share photos then it's really not a big deal, but otherwise a bio should be about you
    and your work, not your gear.
     
  3. I think it might be good for you to talk to a designer. The design is really pretty clunky and not very sophisticated or elegant. Probably it is just that everything is oversized and overdone. Also, the site is just too big. An optimal site, for even the graphics industry, shouldn't probably be any taller than about 760 pixels. I have a big monitor and you jump off of it! I can't imaging someone with a more modest monitor viewing the site.
    It is really important to have your navigation not jump around. No one wants to chase around to move to the next image. If I am looking at someone's work, I want to skip through it fast to get a sense of the work and then maybe go back slowly. I don't want to have to work this hard.
    In some ways, it is better than many I see actually as it is at least easy to figure out where I am going, if not easy to move around when I get there.
     
  4. Christophe, I noticed that the source code on your pages was largely strait HTML. You might want to check out a website like this: http://www.w3schools.com/css/default.asp
    Last week I coded a web page in some old HTML and found out that newer Microsoft browsers wouldn't open a frameset on that page. This meant that all my viewers would see in Internet Explorer was a large blank page, the same color as the background.
    You pretty much have to pick up some basic CSS.
    In those tutorials, there is a page that explains, although very briefly, how to connect your HTML to a CSS. It is in this page: http://www.w3schools.com/css/css_howto.asp When they show examples in their sample box, frequently it is in "inline style." I liked the ones with external style sheets; same ideas, just different places to put the info.
    I have been tinkering with that this weekend and found I was able to get about 2 and a half web pages worth of old material crammed into one, and have it still load half as fast as a previous version.
    I have used a WYSIWYG editor for the past two years or so; the website became too cumbersome to use that thing. I was trying to hand code to see myself to a better way. On the first pass, I was able to cut down the size of a folder for a web page to about one third or one half; I got better stuff loaded in the first second; and overall load times dropped significantly. My WYSIWYG editor used lots of PNG files for everything, and it clogged up the works.
    I see over and over this saying, "CSS will save you work." Ha! This must be some corporate joke. It didn't save me any work, but it made things easier to plan out in advance; and it made things a little easier to adjust later.
    It did make it easier for me to use a page I made as a template for making varieties of that page. Once I figured out two pages, I was able to make about 8 pages. It was basically the same page, with the different sections moved around in different ways. Then, with the page roughed out, I go back and put in the content. Then, the page still needs some smoothing over with the CSS and the HTML, but I can get it working.
    Try those W3C schools web pages. They have some good tutorials with the sample code boxes.
    If you use the CSS, and you get into absolute positioning, that'll cure that jumping around with the positioning. It might help to break up those large HTML tables into three sections, and then position each section on the page. You can allow some space between to account for the expansion; keep the images in the thumbnail row centered, vertical aligned.
    Good web designers will be as expensive as a copy of Dreamweaver. If you work the tutorials and plan it out, you can polish up some of these aspects that are giving you trouble. You've done pretty well so far.
    You are organized, and have a good idea of what you want to put where, in what order, for what reason. Those are some important influences to web page design. It'll help fill you with purpose.
     
  5. In your bio it's not clear which person in the photo is you.
     
  6. thank you everyone for your contributions. i havent gotten around to getting rid of all the watermarks but i think ive solved the navigation issues. so thank you and let me know what you think of the fix.
     
  7. Gary said it. No point to the "on mouseover" to just put a white frame around a button.
    I count at least 4 fonts, not counting the font on the watermark. One, maybe two, no more. And they should be from similar font families.
    The font on the buttons has to go. Its too thin in places, not enough weight. Think about a Sans-serif font as they are easier to read online and in all cases, you need one with enough weight to not break apart.
    Bio is the only word centered on the button. Gallery is to high, Contact is too low. There are TONS of free buttons available for download.
    The bevel on the button is to big for the size of the button. Go to http://kuler.adobe.com/ to find some color schemes.
    You create an upper left light with the bevel but no drop shadow. Its a disconnect.
    The background color is......well horrible.
    Sorry, navigation not fixed.
    You have LOTS of HTML errors:
    http://validator.w3.org/

    some resources:
    http://www.webpagedesign.com.au/category/free-templates/
    http://www.freeiconsdownload.com/Free_Png_Icons.asp
    http://www.smashingmagazine.com/
    Good Luck!
     
  8. ok again thanks for the help. the copyrights are off. i think ive finally resolved the navigation issue except in chrome for a couple of the landscape images but it works in both ie and ff. a couple other minor touch ups as well. still dont see whats so bad with the background color. its just a charcoal grey.
     
  9. Christophe - reference the color - its a greenish color on my screen. Im pretty careful about my screen colors and its not grey on mine. Check on another computer.
     
  10. no its charcoal. look up #222222 thats the color
     
  11. its about the same color as your inside grey the ligher of the two tones you have one your site. prob a little inbetween the two shades actually
     
  12. Start with this suggestion. While insufficient, but definitely necessary.
    http://luminous-landscape.com/forum/index.php?showtopic=41252
     
  13. Thank you Robert those site are incredibly useful. i was just thinking i would love something like that. so thank you
     
  14. Glad you found them of help. Being aware of the differences and problems is just the beginning. Knowing how to avoid or fix them can be quite challenging. A handful of web designers have come up with ingenious solutions (hacks, if you will) and have generously shared them online. Even so, most web designers, pros and amateurs, are either unaware of them or have chosen to ignore them.
     

Share This Page