PuffyPanda

PuffyPanda

***-- (Rated by 7 people, viewed by 173 people)

This is a graphics resource site with tutorials and graphics. It's still pretty new so I know I have a very long way to go. Some constructive criticism would be very much appreciated.

Added by puffypanda in Graphics

PuffyPanda has 7 Reviews

Below are the reviews left by other members on PuffyPanda. Jump to review form?

  1. zaizai gave it ***-- on 18th May 2011 and said:

    The overall effect of all the colours is pretty cool and interesting. I don't really like the navigation, which is larger than the title; the font is also a bit fuzzy because of the low quality but on the plus side the layout loads fast.

    I checked out your validation and you have 55 errors. It would be useful to go through and correct as many as you can so the layout shows correctly in as many browsers as possible. validation
    Anyway, I do really like all the colours but maybe for your next layout you can try sticking to a definite colourscheme from colourlovers.com or something like that? Just a suggestion and it may look neater overall! I love your past layouts too, it's clear you have an eye for design.

    Your content is also quite original and you've put a lot of work into it, so well done!

    Using Chrome on Windows | Report This?

  2. sarahmae gave it **--- on 24th Nov 2010 and said:

    1. FIRST IMPRESSION

    I love the layout and some of the colours, not fond of how its positioned. Its too big. Its 1396 px wide. Thats huge! I'll discuss more...

    2. THE DESIGN

    a. the header

    I don't get why theres a million girls on it. They're not even the same person. This confuses me. And the girl on the far left is just randomly there with some random squares on her back. Not sure what the point of it is. But i do like the top part with random textures. It looks good. Bravo on that. (:

    b. the structure

    I agree with amphigory.

    The easiest way to merge your header and body together would be to trail some of the design aspects of the header into the nether regions of the body. In a sense, it becomes almost like dripping paint: the header serves as the introduction of the theme, and continues down the rest of the page. Nick at n.design studio has over the years become a master in terms of keeping header, body and footer in unison. His current theme is grunge-styled, something that may be of interest to you, in the fact that you've added some grunge elements to your header.

    All the way down the page you have a big footer, but nothing there. Sure, you have a couple links an a button (argh, 88x31 buttons!), but there's no heart. Such a big footer calls for some more designing. Footers exist to answer a question: Where do I go from here? Once I get to the end of your page, I'm instructed to go back, home or forward. Well, I don't want to go back; I was just there. Ditto to home. And forward? I can't go forward if I haven't gone back. Your footer in its current state is an excuse to leave your site, rather than digging into the rest of your site. Also, most visitors would be leaving on a bad note: the footer is bland and unmemorable.

    c. typography

    This falls in the same realm as the structural problems. Using a sans-serif font with a grunged theme (I'm gather grunge from the header, the introduction to the theme) is out-of-place. A readable serif font can do wonders with your style, probably Georgia. Keep the body text size the same. It's perfectly sized; I appreciate that I'm actually able to read the content on your site.

    d. design conclusion

    Your designs are pretty good. I none of the uncoded layouts draw my attention. They all look bland and cookie cutter like your "blends". I however prefer the coded layouts over the uncoded. Even though theres nothing but squares on the first. But they're unique.

    3. THE CODING

    a. html structure

    "Best viewed in: IE?" Sorry, I refuse to switch back to an inferior browser just to look at your site. Taking the time out to ensure your site looks perfect in all browsers and operating systems is a step towards your visitors' trust. If you're having trouble, read up on HTML standards and make regular use of BrowserShots and Adobe BrowserLab.

    4. THE CONTENT / PRESENTATION

    a. readability

    I can read your tutorials very well which i enjoy. But I don't enjoy how on your image rollover tutorial, you make the user go to another page to view the rest. I recommend a table to fix this. As you can see in my css on my site: here

    b. originality

    Eh, not really. If I wanted, I could get most of this stuff at other sites. How much of those graphics were actually created by you, especially the icons? It looks like a bunch of photos cropped to 100x100 and some text squeezed in for good measure.

    Much of this looks like it was added just to bulk up on the content. Code snippets with no explanation for usage or reason are useless. Past layouts are unnecessary, and I'm starting to wonder if there's a general "history" story floating around somewhere. I can't begin to tell you how often I've read, "I first started on Piczo."

    c. content conclusion

    I suggest editing your history page with some clear paragraphs. They're just kind mushed together. I also recommend re-writing it. Its very boring. Granted, most are. But spice it up a little. && Get rid of the past layouts. I don't really care to see your old layouts.

    5. FINAL THOUGHTS

    It's decent for the category, I suppose, but nothing really sticks out for me. I think if I were to visit regularly, I'd stick to the home page (the blog) rather than going to any other pages. Perhaps it's time to reconsider the focus of your site? Blogging can make for some awesome content, and matching that with a design that flows can keep visitors coming back for years, especially if you give them little surprise snippets every now and then.

    Using Firefox on Windows | Report This?

  3. amphigory gave it **--- on 20th Nov 2010 and said:

    Ciào! Time for me to spit out some thoughts on your site. :) I'll go through a few things, mostly in the order in which I view them on your site (design, coding, content presentation).

    1. FIRST IMPRESSION

    I must admit I grew a frown upon visiting your site; rather like that of Herman Munster. Justification: a massive x-axis scroll bar on a vertical layout. Don't get me wrong, I love a good horizontally scrolling website, when it's meant to be horizontal. Incidentally, problems arise when that ugly grey bar pops up at the bottom of my screen. It's no doubt a coding issue, which I'll cover in the coding section.

    2. THE DESIGN

    a. the header

    I've never really understood the use of celebrities/models/people in headers. What's the point if the site is unrelated to them? If it's a personal site, it's great to have items related to your interests, but you have this listed as "graphics." I do admit, though, the actual construction of the header is better than most in terms of sites of similar content as yours. While it's nice to have a cool-looking header, it's better to have a cool-looking header related to your site content. A concoction of random elements doesn't quite cut it.

    b. structure

    Again, this is falling into the general standard of "graphics" websites. While the structure of your layout is well-formed, it's far too divided from the style of the header, which brings about a sensation of unbelonging; it doesn't do any justice in tying together your site. If you prefer the dainty, intricate style that you've used in your header, consider incorporating this theme into the rest of the layout.

    The easiest way to merge your header and body together would be to trail some of the design aspects of the header into the nether regions of the body. In a sense, it becomes almost like dripping paint: the header serves as the introduction of the theme, and continues down the rest of the page. Nick at n.design studio has over the years become a master in terms of keeping header, body and footer in unison. His current theme is grunge-styled, something that may be of interest to you, in the fact that you've added some grunge elements to your header.

    All the way down the page you have a big footer, but nothing there. Sure, you have a couple links an a button (argh, 88x31 buttons!), but there's no heart. Such a big footer calls for some more designing. Footers exist to answer a question: Where do I go from here? Once I get to the end of your page, I'm instructed to go back, home or forward. Well, I don't want to go back; I was just there. Ditto to home. And forward? I can't go forward if I haven't gone back. Your footer in its current state is an excuse to leave your site, rather than digging into the rest of your site. Also, most visitors would be leaving on a bad note: the footer is bland and unmemorable.

    c. typography

    This falls in the same realm as the structural problems. Using a sans-serif font with a grunged theme (I'm gather grunge from the header, the introduction to the theme) is out-of-place. A readable serif font can do wonders with your style, probably Georgia. Keep the body text size the same. It's perfectly sized; I appreciate that I'm actually able to read the content on your site.

    Unfortunately for me, you've resorted to one of my biggest pet peeves: excessive styling of fonts. I don't think I'll ever understand why people change the colors, fonts and styles of simple italics and bold text. I hovered over each differently-colored word thinking they were hyperlinks.

    Hmm...actually going deeper into your site, I'm seeing a serifed body text. Why are you using multiple styles for the body? There's no consistency, and a lack of consistency is highly distracting. Then comes the awful centering. Why is the text centered? A book doesn't center its text for a reason: when we reach the end of a line, our eyes instinctively shoot back to where they were originally. It's just natural flow. With normal writing, you'll always end up with lines of varying length. Centering the text makes it very difficult to read, because the reader needs to do extra (consciously, albeit almost unnoticeable) work to figure out where the line starts. It sounds far-fetched, but it makes all the difference compared to left-aligned text.

    Along the lines of centered text and readability is the lack of paragraph margin. The text is centered, so there's no way to indent. Without indenting, it's hard to know where a paragraph begins and ends. Since the age of the internet is slowly doing away with indenting, people usually add some space between individual paragraphs. It's basic language structure: letter, word, sentence, paragraph, page. Without those divisions, everything jumbles together and a reader can get very frustrated. I'd highly suggest adding in some margins to your paragraphs.

    p { margin:15px 0 0; }
    p:first-child { margin:0; }

    This will give all of your paragraph tags a top margin of 15 pixels. p:first-child covers the first paragraph. I usually give the first paragraph no margin so there isn't extra space at the top. It depends on margins of other text, though, like headings, and where you put items. You can also give paragraphs a bottom margin and remove margins for p:last-child, but IE6 doesn't support the last-child pseudo-element. That said, I don't believe anyone should be paying attention to IE6 anymore.

    d. design conclusion

    It might seem like I've all but ripped apart every aspect of your site in that bit, but it's not as bad as it seems. The biggest thing you need to work on is consistency. Once you have that down, the design will certainly be enjoyable.

    3. THE CODING

    a. html structure

    Ahh, a doctype and indenting. Awesome!

    But, "Best viewed in: IE?" Sorry, I refuse to switch back to an inferior browser just to look at your site. Taking the time out to ensure your site looks perfect in all browsers and operating systems is a step towards your visitors' trust. If you're having trouble, read up on HTML standards and make regular use of BrowserShots and Adobe BrowserLab.

    b. tag case

    The only thing that pops out at me is one script. In your footer, you have <style type="text/css"></STYLE>. Besides the fact that it's empty, styles always belong in the document head, and using an XHTML doctype requires you to keep all tags in lowercase. The same goes for script following that mysteriously empty style sheet. Not only are the tags uppercase, but the script is also using a deprecated attribute, "language." More appropriately, it should read as:

    <script type="text/javascript">
    // scripts
    </script>

    I'm also seeing an uppercase textarea in there.

    c. unnecessary scripts

    I'd suggest an entirely different method of displaying a random image. JavaScript is a bit overkill for such a simple function. If you're running PHP, try something like this:

    <?php
    $images = array();
    $images[] = array(
    'url' => 'http://example.com',
    'src' => 'http://example.com/example-banner.png',
    'alt' => 'example alternate text'
    );
    $img = $images[array_rand($images)];
    echo '<a href="', $img['url'], '"><img src="', $img['src'], '" alt="', $img['alt'], '" width="88" height="31" /></a>';
    ?>

    $images is an array of the images you'd like to display randomly. To add more, simply copy the style of $images[]. The benefit of using a server-side language over JavaScipt is that it will always display to the user, regardless of having JS turned off or not. Not only that, but because the script is executed before being sent to the user, the browser doesn't need to download it, saving you bandwidth.

    d. malformed code

    This is in regards to the textarea in your sidebar. Not only should you not be using a textarea (which is meant for multi-line text, not usually code that you're offering people to use), but you also have HTML inside that textarea. When displaying HTML code in a browser, you should be using the entity values of that code.

    Using PHP again:

    <?php
    $code = '<a href="yay">some code</a>';
    echo htmlspecialchars($code);
    ?>

    If you want to do it manually, you should use &lt; for the < symbol and &gt; for the > symbol.

    e. coding conclusion

    What you need to focus on in coding is using the entity values of special characters. You have coding tutorials which absolutely need to be reformatted for entities. Also, consider using <code></code> or <pre></pre> in place of <textarea></textarea>

    4. THE CONTENT / PRESENTATION

    a. readability

    This is the part I was talking about with typography. So many of your tutorials are unreable because of centered text and lack of paragraphs. Choosing at random, your "CSS Coding" tutorial is a prime example of this problem. This could be merged with design, but I don't feel like going back to edit it. On many of your pages, you have a greyish-blue border. The text next to those is flush against the border, making it difficult to read. Tangents in design are annoying in general, but in regards to text, it's sinful.

    b. originality

    Eh, not really. If I wanted, I could get most of this stuff at other sites. How much of those graphics were actually created by you, especially the icons? It looks like a bunch of photos cropped to 100x100 and some text squeezed in for good measure.

    Much of this looks like it was added just to bulk up on the content. Code snippets with no explanation for usage or reason are useless. Past layouts are unnecessary, and I'm starting to wonder if there's a general "history" story floating around somewhere. I can't begin to tell you how often I've read, "I first started on Piczo."

    c. content conclusion

    There's not really much to discuss since it's not very unique. I'd suggest getting rid of the "history" and writing an "about" page, something that describes the site itself and why people should be using it over others.

    Blogging is your strong point. Your visitors are enaged, which is excellent. As I said before, it seems like the site's content is there simply to make it look like a bigger site.

    5. FINAL THOUGHTS

    It's decent for the category, I suppose, but nothing really sticks out for me. I think if I were to visit regularly, I'd stick to the home page (the blog) rather than going to any other pages. Perhaps it's time to reconsider the focus of your site? Blogging can make for some awesome content, and matching that with a design that flows can keep visitors coming back for years, especially if you give them little surprise snippets every now and then.

    Using Firefox on Windows | Report This?

  4. [img: avatar]
    PopJustice gave it ****- on 13th Nov 2010 and said:

    Hi there, I hope you enjoy reading my review
    My first impressions are that the layout is good, I would recommend you put your blog/content higher up so its not down and separated from your layout header. Your navigation needs to be sorted out as it covers some parts of your blog, also the background colour of your navigation needs to match the background of your site or layout header so it looks more professional and appealing.
    I dont like the way that at the bottom of your layout the legs of the person has been cut off, this looks highly unprofessional.
    Your sidebar is done up to better standards, but your header of your sidebar could match the header of your blogs but thats up to you.
    On the site section your links need to have a description as overall its too small
    You have an amazing amount of graphics. and most of them are amazing, I recommend using some as your layout for your site as you are giving the viewers to good layouts, your site layout needs to be the best of your ability.
    You also have a range of tutorials which is good to see. Under cutenews you have a description of what you offer, its a good idea but you should not put it as you havve not put it on the other heading but only on that one. Either you do all of them or none of them
    Your HTML codes need to be organised into different catogaries like with tutorials. Also you need to add more content to match the amound of content with graphics.
    Contests look good but you need to promote it further to get more hits and more people to enter.
    Overall your site review did not start to well but it got better, improve you layout to get a higher mark.
    JAMES // POP-JUSTICE.PICZO.COM

    Using Firefox on Linux | Report This?

  5. [img: avatar]
    Sarai gave it ****- on 12th Nov 2010 and said:

    Hi my name is Sarai and I will be reviewing your site using Chrome in Windows 7. Since i just had a quick look through and I like what I see and just because its good you leave me no other choice but to nip pick in a constructive way..^_^ so here are my thoughts and ideas on how your site could improve a little. I apologize in advance if anything I say is not to your liking.

    first impression
    Well to be honest I like how you blended the PNG though first thing i notice is the sharp edge on the girls legs where it says hello which could have been a little softer. I read your entry and I noticed that you bold lettering colour is quite hard to read, i had to get closer to the screen to see what it said. I see that the navigation is on the top and thats ok but it doesnt look like navigation at all, maybe if the werent all in that blue box it would look better. I like the fact that you have an updates bar. I also like that you have aligned the layout to the left BUT you have something going on in the background on the right, makes your site look balanced. You have a blog going on aswell and well what else could any visitor ask for? Its nice that you have a graphic site and a blog in the same place, most just have different links to a blog.

    Site
    I like how you talk about yourself and what you want to do and what you like though i still think you should brighten BOLD since its quite hard to read with the dark grey background.
    In your history you mention when you started with other websites and how it lead to this one and i think its pretty sweet on how you decided the new name of your site, though for your past layouts I would suggest you left align them and have a little infor about them like the version name, who were the characters you used and little thigs like that, that will give your site a more professional in a fun way look. On your link back since the first button is centered and the other two are left aligned why dont you just make them all centered or vice versa. Its good that you have a credits page linking to everything you used for help.

    Resources
    I think that as i go through your site the font is very small why not make it a little bigger and the links as well. In your graphics section i like how you have little buttons that lead to a certain type of graphic you made. I really like your variation of colours and lights and your mix and match on the blends. However your mini blends dont have a lot of change in them just little things like adding something or change in contrats, why dont you try experimenting a little more, like the way you did on the older ones at the bottom.
    I like how you have a celeb layouts with pictures that are not photoshoots but how celebs look normaly.
    Your button bases are pretty sweet but some of them need a little more definition since you can see the blurry pixels, other than that i really like your variation. I like how all your icons are categorized and not all together and how you have the same female but in different style icons. I like your misc section because its very randome and there is no repetitiveness
    I think that you shoud have everything that is button related together and everything that is icon related together because its easier to see all of them before someone gets bored of going back and forth. I like the variation of your scan section and to be honest its the first time i see a scan section and i think its pretty cool.
    Your Tutorial section is nicely dona and easy to navigate however there is the issue with the text, it is very small and hardly readable since the text colour is very dark, so maybe change it to a lighter blue? I think its pretty useful that you have a codes section though I think you should have a little sample of what they are for people that are very new to html and css other than that your resourse section is very nicely done.

    Contests
    Its very nice that you have something else going on apart from just graphics and to be honest I have nothing to say about this part of your site except again the text is small and dark.

    Tutorials
    I noticed that you have tutorials under resources and on the navigation bar, even though its not bad I believe you should remove it from the resources and leave it on the navigation bar.

    Navigation
    Its pretty easy to use but I still think it would look better without the blue box or if you would like to keep it then maybe use a transparent lighter box because it stands out more than the layout image.

    Image and colour
    I really like the image of your layout and how you made it work with the dark grey background. maybe next time be softer with raw edges.

    Even though I am no expert of this myself your CSS has some errors so maybe check that out before someone with experience tells you its all wrong.

    http://jigsaw.w3.org/css-validator/validator?uri=http://www.puffypanda.dearoxygen.com/&profile=css21&usermedium=all&warning=1&lang=en

    Also check your HTML since it has 46 errors

    http://validator.w3.org/check?uri=http://www.puffypanda.dearoxygen.com/&charset=(detect+automatically)&doctype=Inline&group=0

    Again you left me no other choice but to nip pick your site because its good and everything I wrote was just to improve some little bits to make it even better. Overall I loved your site and it has potential, keep going since I will definitely visit it frequently soon when Im not so busy with uni myself.

    I really hope this constructive critism helps in one way or another and keep up the good work!! And good luck with Uni ^_^

    Using Chrome on Windows | Report This?

  6. [img: avatar]
    miaWithLove gave it ***-- on 9th Nov 2010 and said:

    GENERAL

    Header:
    You're actually off to a great start here! I can see a lot of potential in this layout. For the header itself, I think it could have been improved if you had cut the models out of their original picture better. There are some ugly jagged lines that could be fixed by going over them with the eraser tool just a bit. I actually love the colors you used which is an important part of any layout. How it flows out of the left side of the screen also leads the eyes in a great way.

    Main links:
    I think you need to space your links apart more. At first, I didn't realize that they were links, and when I did I have a heard time telling one from the other until I hovered over them. Also, never make links change size, vertically or horizontally, in this case, it never works well. The colors you used here were awesome, though. The blue really stands out, just space them apart more.

    Blog:
    The text on your blog is what really made me detract a star. It's way too small. A rule a thumb is that you should never make the main text of your website under 12px tall, maybe 11 if you want to stretch it. The content of your blog though is fine. You treat it like a journal, which I think it a great way to do a blog. The blog I read was well typed and free of grammatical errors. Good job there.

    Sidebar:
    Your sidebar is nice and neat. I like it, you don't have to much content over here. To much stuff in your sidebar can make a website look really disorganized.

    LINKS

    Site:
    You have a good assortment of links here, everything is well organized and where I'd expect. I like how you have the rest of the links in this section located at the top at all times. I never thought about that, it's very convenient and prevents me from pressing the back button constantly.

    Resources:
    Whoa. You have TONS of stuff. That's awesome, but you have so much stuff that it can be hard to organize. Again: that small font is really biting you here, because I can barely read the links in this section. That coupled with the dark blue font you're using against a dark background it not a good combination. Use white against black when in doubt. Also, make the three main links in this section bigger.

    Contest:
    I have the same complaints here I had with the last section: make fonts bigger, make text color lighter.

    Tutorials:
    This link seems unnecessary. since you have the same link in the "Resources" section. Remove one, having two can confuse the visitor.

    OVERALL

    Like I said, you have lots of potential. Keep up the good work, just make the font bigger. The aesthetic look itself is pretty good (just remove the jaggys), it's the functional side that needs work.

    Using Chrome on Linux | Report This?

    puffypanda's Response:

    Hi,
    Thank you for your review. I will defiantly make the font larger and change some colours around.
    About the double tutorial link, it's because I saw this as the main page visitors went to so I thought it would be easier for them if I had a link in my main navigation. But you're right, I will delete a link from resources.
    I'm also working on a new layout-hopefully it is better made :)

  7. [img: avatar]
    thinkxinfo gave it ****- on 2nd Nov 2010 and said:

    Hey Hajera. My name is Lindsay, and I own Think-x.info ( we've met :P ), and I'll be reviewing your site today! :D

    First off, I'd like to make sure that we are on the same level. Any criticism I give you here, is constructive criticism. I have done quite a bit of reviews in the past, and I have been set straight on how to properly do them many times. So I really hope that what I say here helps you, and doesn't offend you at the least.
    If you have any questions about anything, please ask them here:
    I don't really come on here that much, so questions would be good there! ;P
    http://think-x.info/askme.php
    First Impressions: When I open your site, I see colours. Loads and loads of colours. Which personally, I think is wonderful. Your main layout isn't that great, but it's pretty. I think the main problem for me is the navigation, the background, and the pngs aren't that good.
    The css is really amateur (and I mean that like, it's kind of simple/basic. So like, that doesn't mean I'm saying "It looks like a beginner made this website." You may be a beginner, or maybe you've been doing this for a while. I just mean that it's quite basic css.) I don't really like it. Something I would suggest would be to add a translucent/transparent box under your sidebar and blog. It looks really nice if you do it right! (if you would like to do that, you can always ask me!) And the reason I suggest this is because the words are a bit hard to see. Some of them. And I think it's more of the fact that they kind of just look like they're floating.
    And last thing before I move on is just the fact that your sidebar is kind of just there ? Like, I feel it has no shape to it or anything. Just a bunch of words. I would just suggest organizing it a bit better. ;)

    Now it's time to categorize. lol

    The Name: Puffy Panda. I love it. It's actually so cute. hah. There's honestly nothing bad I can say about it.
    Your blog: What can I say? Your blog is amazing. You talk about EVERYTHING. Seriously. Your life, and your website. What else could anyone ask for ?
    Visitor Content: The amount of visitor content you've made is unbelievable. Really, that is A LOT of stuff. Not all of it is the best quality, but hey... who's is ? And it doesn't really matter anyways, due to the fact that hardly anyone even uses visitor content these days! It's basically just like a must-have for all websites.. :P
    Owner section: I still try to figure out why I bother marking with this category. It doesn't really have too much to do with any website, but I always count it in. So... here we go.
    I've noticed that most people these days don't have "owner" in their main navigation. And honestly, I'm kind of liking that idea. I like how you go to website, and THEN click owner. Cause really, who reads that stuff ? On the info you've got... perfect! You explain just enough about you, all that anyone over the internet needs to know! :D
    Website section: You have the following links (which you already know, so I have no idea why I'm stating them.)
    Hostess with the Mostess
    History
    Link Back
    Credits
    And for those, I am proud of you. :) Those are like the four most important things a website needs. And you've got them! Great job.
    Overall and final comments: So here we are, coming to the conclusion of this like 700 word review. I don't exactly know if this helped you at all. I really hope it did, because I told you the truth about what I thought!
    Anyways, overall thoughts on your website would just have to be that it's actually really nice. I don't really like the whole front page ordeal, but other than that... you just have everything perfectly amazing. :D Great job!

    Using Firefox on Windows | Report This?

Write Your Own Review

Leave your feedback for PuffyPanda below, and remember - the longer your review, the more points you receive. Don't forget to look at things like style/design, content, coding and originality as they will all help to improve the quality of your review.

You have to be logged in to write a review.