Contact Us
  • HYPERlinks Dec 14 2011: A Weekly Roundup of Links to Great Design, Web Tools and Services

    Web Development and Design Resources for Web Developers

    HYPERlinks: December 14, 2011

    This week both Tim and Jenni have links about Responsive Web Design that are must-reads for developers working on sites that need to look good on any screen, from a desktop monitor to a smart phone. Jason shares some HTML5 resources and fixes for IE stubbornness. Analisa is in love with the Pandr‘s color tool, you will see why…

    Thanks for following our weekly link series, we have fun picking the best links to share with you!

    Jenni Schwartz / Designer

    Responsive Web Design

    Responsive web design is a hot topic these days. From desktops to mobile browsers to netbooks and tablets, users are visiting web sites from an increasing range of devices and browsers. Are your designs ready?

    The term “responsive web design” is related to the concept of developing a website design whereas the layout changes according to the user’s screen resolution. The practice consists of flexible grids and images and an intelligent use of media queries.

    50 Gorgeous Responsive Web Design Examples:
    http://designmodo.com/responsive-design-examples/

    Techniques in Responsive Web Design:
    http://www.webdesignerdepot.com/2011/11/techniques-in-responsive-web-design/

    Tutorial: A Basic Responsive Grid (plus handy CSS3 media quiery reporter)
    http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/a-basic-responsive-grid-plus-handy-css3-media-query-reporter/

    Tim Ware / SEO, Web Design & Development

    Responsive Design & Facebook

    With people increasingly viewing websites on devices of many sizes and shapes and resolutions, the Responsive Design approach—one design that adapts to various displays via HTML5 and CSS3 —is really building steam. This article on the Facebook Blog looks at it in depth: http://developers.facebook.com/blog/post/599/

    Comparison of CMS Platforms

    There are a gazillion Content Management System (“CMS”) options out there, but WordPress, Drupal and Joomla lead the pack. Here are a couple sites that compare them, by features and by popularity/usage.

    WordPress vs Drupal vs Joomla

    Usage of content management systems for websites

    Jason Amor / Facebook Designer & Developer

    HTML5 Reset

    On your next HTML5 project, rather than starting from scratch and hacking your way through the haunted forest of browser inconsistencies, consider starting with an HTML5 template. There’s a few boilerplates out there, but the two most popular are HTML5 Boilerplate (http://html5boilerplate.com/) and HTML5 Reset (http://html5reset.org/). These jump-off points create a level, HTML5-compatible playing field for your web project.

    HTML5 Placeholder Fix for IE

    Speaking of HTML5… one of my favorite things is the Placeholder feature, which allows you to specify placeholder text for your input fields. This way, you can display what field something is by showing text inside of the input field, rather than alongside. Once the user clicks in the field, the text is replaced with a cursor. Unfortunately, IE doesn’t even pretend to care about this functionality, so you have to fix it with jQuery. This post shows you how: http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html

    Native Form Elements

    http://nativeformelements.com/

    Form elements don’t look the same in everywhere. If you want to see what they will look like in certain browsers, just visit nativeformelements.com in the browser you’re wondering about. This is especially useful for design mockups. Just screenshot a form element and toss it into your PSD.

    Analisa Svehaug / Social Media & Project Manager

    The Pandr Color Tool

    http://wearepandr.com/labs/colour_bookmark

    It’s a bookmarklet, it’s a website, it’s a color palette detector! Pandr, web design company from the UK, developed this awesome tool that you can use as a bookmarklet in your browser, or just copy and paste a URL into the web page. When using the bookmarklet you can instantly see the color scheme of any website* you visit. Or paste the URL into their site and see the range of colors being used.

    *If the site does not have a style sheet, the tool might not work. We tried on Google and got an error message.

    Designer Resource – Free Social Media Icon Sets

    http://www.designdeck.co.uk/s?cat_type=icons

    Design Deck has some great free PSDs, icons and other resources for designers. I especially love their social media icon sets. Most of them are simple, clean, and work well on most sites. Browse through their collection of icons suites and see what you think.


    Redesigns of Major Social Media Websites

    In the last few weeks we have seen several big social networks unveil major design overhauls (or promise them, and not deliver…ahem, Facebook Timeline anyone?). Here are 3 significant ones that you have probably already seen. It’s interesting to see how these social industry leaders approach UX and overall design on sites that get a lot of use and traffic. Plus, mobile is a huge part of their markets now, so you can see how that influences design and interface structure. Twitter, for instance, rolled out the mobile update first (we are still waiting on the website update).

    Twitter
    YouTube
    StumbleUpon

    Stay tuned, next week will be a special holiday gift edition of HYPERlinks!
     

    Comments

    1. Would disagree that WordPress is a CMS. It is a blogging platform with some cms functionality.

      A true cms provides far more functionality than WordPress. WordPress may be trying to morph and to some extent, and for many applications, will provide all the facilities that many site owners will need but there is always the situation where it results in more cobbling together than would be required with a true cms.

      I develop client sites with Joomla and blog sites with WordPress and integrate them together when appropriate to provide the functionality I believe clients need in the easiest, most practical and most convenient way.

      No doubt WordPress afficionados will disagree but I’m not arguing for one or the other but using the tool for the job that is most appropriate. It’s ‘horses for course’!

    2. Rob, we develop almost all sites these days on the WordPress CMS and find it a fully functional, easy-to-use, platform …. much easier than Joomla and Drupal. If the particular requirements of a site are outside what WordPress can handle, we go with Drupal.
      Really, it sounds like you’re describing the WordPress of a couple years ago, because these days we find it an great CMS platform on which to develop sites.
      And it’s not like we’re just WordPress fans who operate from love rather than facts; we want to develop on the best platform available, and for most sites we’ve found it’s WordPress, hands down. We find it *much* easier to develop on than Drupal, Joomla, and the rest.
      We use the Genesis Framework which is pretty awesome.
      But thanks for chiming in.

      • Disqus generic email templateTim, you have confirmed just one point that I was making that in not all circumstances is WordPress the obvious or best choice by confirming that you would go with Drupal rather than WordPress.
        The point made was not that WordPress has no merits as a cms but that in some cases it is not the best platform. We also use WordPress not only as a blogging platform but for general web site development but have also found that, again in some cases, there is no simple or easy way to achieve some of the functionality required.
        The objective is to create a user-friendly and easy to maintain and update site that contributes to a client’s online business success. Both WordPress and Joomla are platforms that are in the frame.

        • Right, Rob. What you’re now saying is what I said, that both Drupal and WordPress have their benefits and weaknesses and, again as I said, we choose based on the project needs.
          If you read your original comment, you should notice that you originally stated “Would disagree that WordPress is a CMS. It is a blogging platform with some cms functionality.”
          And I think WordPress, for most websites, is the better solution. In a tie, I’d go with WordPress for its superior admin interface and cleaner code.

          • Hi Tim. Looks like we actually agree that it’s ‘horses for courses’ and that both Drupal, or in our case, Joomla, and WordPress have benefits and weakness and are chosen based on the project requirements. 

            But, I think we will just have to ‘agree to disagree’ on whether WordPress is a true CMS and whether it is the best solution for most websites. If we all thought and felt the same what a boring world it would be.

            However, the criterion is that the ‘finished’ website has all the functionality the client needs and contributes to their overall business marketing objectives regardless of the platform it’s built on.

    Speak Your Mind

    *