Web Design Workshop #26: Michiel De Wilde
tuts workshop

Web Design Workshop #26: Michiel De Wilde

on Nov 17th 2012 with 26 comments

Web Design Workshop is our regular community project where we ask readers to submit their work for your friendly, constructive criticism. It’s the perfect way to learn, offer opinions and have your own work critiqued! This week, something miminalist, but functional..

Rules of Engagement

Play nice! We deliberately select work which will benefit from advice and pointers. If you can’t be constructive in your comments, don’t. Other than that, offer any advice you can give. Feel free to link to examples and images which back up your points.

The Design

Web Design Workshop #25

I’m a beginning web designer and developer that is looking for constructive comments on my work. Every bit is welcome. – Michiel De Wilde

Looking for constructive criticism on your own work? Submit it for a workshop – most but not all submissions are published. Be patient though, there could be a queue..

 
Enjoyed this Post?

Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!

By

Rollover to read this author's bio or click through to see a full list of posts by this author.

Hi there! My name's Ian Yates. Welcome to Webdesigntuts+ :)  

Plus Premium
 
 
Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
  • http://www.facebook.com/benjamin.s.graham Ben Graham

    I really like that it’s totally responsive but I think there needs to be more attention to looks. Add a portfolio of work, galllery and some visual interaction. I personally like multiple pages rather than single scrollers, also I recommend using some JQuery tricks you can source. But hay my page isn’t totally responsive so I could take a leaf out of your book !! Well done m8

  • http://twitter.com/RobertReda Robert Reda

    Try reducing the space between your name, in the header, and the social links. Doing this, the whole “Who Am I” paragraph will be fully visible without having to scroll down.

    • http://twitter.com/Michiel_DeWilde Michiel De Wilde

      thanks for the tip. Will get right to it.

      • http://twitter.com/RobertReda Robert Reda

        Anytime ;) nice work.

  • John

    The design is similar to the CSS Portfolio tutorial you guys previously posted.. The top border, noise BG, navgiation..
    Good implementation..

    • http://twitter.com/Michiel_DeWilde Michiel De Wilde

      thanks

  • http://twitter.com/Duncankrebbers Duncan Krebbers

    It’s definitely a very clean design, but maybe it needs some more visual-elements, especially for a webdesigner. The responsiveness is nice!

    And you’d might want to update your favicon.ico, because the default HTML5-boilerplate icon is still there ;)

    • http://twitter.com/Michiel_DeWilde Michiel De Wilde

      just updated the favicon but my angle for the portfolio was to keep it clean. What other visual elements do you suggest?

  • http://www.facebook.com/jesus.bejarano.948 Jesus Bejarano

    Simple as rice without salt , glad that is responsive but there is nothing more to say about the design.

  • NLG

    I’ll throw out a few cents on the message. Few things that I noticed.

    You brilliantly state it big “Web designer and Developer”, but in the “Who am I?” section you say it again, and don’t bring too much new to the table. What are you like as a person?

    Second, in the “Who am I?” section, you strive to do “pixel perfect” websites which as an ideology is arguably a bit off (or old). One shouldn’t focus on pixel perfect across anything, but focus on the general visual appeal and functionality etc. Others wiser than me can elaborate more, but I’m sure you already know it :)

    Bonus for the github, but a lack of portfolio (or something else descriptive) makes me think “Okay, he can talk the talk, can he walk the walk?”

    And as a foreigner to you, your name doesn’t tell me if you’re a boy or a girl and what age you are. While irrelevant in it self, it makes me hard to relate to you and can’t anticipate how it would be to work with you.

    Anyways, hats off for making visually really clear, concise web presence for your self! (Hell, I don’t have one, so I’m all talk :))

    • NLG

      Wow. That sounded rather preachy of me. Not my intention!

      • http://twitter.com/Michiel_DeWilde Michiel De Wilde

        No problem

  • Rob

    Looks good, only I noticed a typo; Under “My Skills”, you wrote “knowlegde” which should be “knowledge”. No biggy, we’re only human. :)

    • http://twitter.com/Michiel_DeWilde Michiel De Wilde

      Thanks

  • http://www.faridesign.net/ Farid Hayati

    Looks good, it’s little bit too empty and clean. I would add some nice and clean social icons and add some visual interaction to spice it up. It would be good to add project examples and portfolio.

  • Pingback: Web Design Workshop #26: Michiel De Wilde | Webdesigntuts+ | inLine Media RSS Blog

  • Pingback: Web Design Workshop #26: Michiel De Wilde | Webdesigntuts+ | Beachdrop

  • http://twitter.com/skids89 skids89

    The Web design and Web Development headers are not on the same line in my browser. The dev heading appears to be 5-7 pixels lower. It appears to be as a result of the icons you chose as they are aligned perfectly at the top but the beaker is taller by that 5-7 pixels. Every Icon set i have ever used has used icons of equal height and most are also close if not equal in width to allow equal visual weight and easier implementation for spacing.

    The page is VERY low on information I personally like a little more info before I hire someone!

    Good Luck!

  • http://www.facebook.com/auct.uz.ua Дмитро Тарас

    make selection color light blue or smth that fits in design

  • Esharat

    Wow! Awesome your sharing. your post is very effective and helpful for everyone. Thanks for your sharing.

  • http://twitter.com/JoseTomasTocino José Tomás Tocino

    On the technical side:
    - The Email/Twitter/Github menu is not centered due to the ul element not having its padding reset to zero. The normalize.css file you use sets a left padding of 40px.
    - You should really minify the css selectors you use. For instance, you use header ul#social li a, you should just use #social a, as IDs should be unique and given #social is ul, there can’t be links outside a list-element.
    - The same happens with your #table div inside header, there’s no need to use header#table. Also, “table” is not a good name for an ID. ID elements should not be related to the appearance but to the semantics of the document.
    - Do not use inline styling. The h2 inside #presentation has its font-size set inline, as well as #tale’s width,
    - There’s no need to use javascript to position the two skills blocks responsively. Using display: inline-block, percentages and media queries should to the trick, instead of adding enormous left/right margins.

    About the design, I find it too minimalistic. There’s too much space, and too little information. There are 79 words of information. That’s it. This comment has more than twice as much.

    About the github account you’re linking, I’m wondering why you’re linking it. You have four repos, three of which are forks of other projects. The fourth one is a repo named “symfony” with “lol” as a description, and that’s it. Certainly not a good impression.

    I hope you find this helpful.

    • http://twitter.com/JoseTomasTocino José Tomás Tocino

      And after two weeks of making this comment, the website’s author hasn’t fixed any of the points I commented. Pretty nice.

      • ann

        Is he compelled to do so?

  • Lachy

    I think it needs a little more interactivity and some things that make me want to read more. Other than that the design it amazing and the texture and colours work very well, but as said in previous comments I would like to know a bit more about you as a person.
    Hope this helps. :-)

  • Diana

    A personal portfolio.. But where is your portfolio? Who are you? I would like to see some of your work. I think your design is a bit boring. You’re a designer. Play with (good) colours and/or some icons. :)

  • http://www.facebook.com/creativethien John Tran

    If your not going to have any content (i.e. a portfolio) the site better look damn good, now it looks more like a hand coded one page html page from 2001.

  • Super Apple Butter

    I understand you were going for a clean look, but you need to think about your audience too. I don’t understand the purpose of this site. Is this is for prospective employers or potential clients? Unfortunately, neither are catered to. Or is it for someone else entirely? As others have mentioned there’s too little content for someone to get an understanding of your actual skill and talent.

    As a potential employer I find it odd that you have no work samples, your GitHub has one personal project and it’s blank, and you claim you use HTML5 & CSS but you don’t actually use it on your own website. This would be seen negatively from a director/leader role looking at your website from an evaluation purpose. And as a potential client I see nothing about your work, style, background, or experience to convince me to contact you.

    The responsibility of a designer is to engage your user, convey the purpose and message, and really cater to your audience, among other things. This is a good foundation, especially given that it is responsive, but I would strongly suggest you consider your audience and think about what they want to see, and understand about you.

  • web designing hyderabad

    Hi
    this web design plan is very nice.i can use my next design.thank you so much