Mel Choyce

  • Are we going in the right direction?

    Recently, I’ve been seeing a lot of really cool sites taking advantage of HTML5 and CSS3. The web is growing in leaps and bounds as designers and developers continue to invent and innovate using emerging web technologies. This is, of course, really awesome. But are people going in the right direction?

    Take the Nike Better World site, for example. My first reaction to this site was “wow, this is awesome!” Hell, that was even my second reaction. It is visually stunning. I’m drawn to the giant, vibrant images, the parallax animation… Just about everything but the text, which I always manage to gloss over. Oh, sometimes I’ll read the headlines, but that’s about it — the rest of the text is small, cramped, and sometimes on top of a busy image, which makes it very low contrast. At the end of the site, you’re informed:

    I scrolled 14,260 pixels toward a Better World.

    Unfortunately, I don’t know what I’ve done to make the world a better place, other than ogle impressive web design.

    One of the key tenets of web philosophy we seem to be forgetting amidst gorgeous visuals and slick animations is “Content is King.” When it comes down to it, the message of your website is usually expressed through text. You’ve hopefully included some images to support your text, but you don’t necessarily have to. Supplementary images should not overshadow text. If your site is driven by visuals and animation, you need to make sure those visuals are getting across the message of your site in place of text.

    The biggest danger we face today, as web designers and developers, is falling back into “Flash Syndrome”: the idea that shiny animations and graphics make a great website, instead of great content and readable text. I have seen many a site these days fall into that trap. My biggest fear is that the HTML5/CSS3 bubble is going to pop, leaving web professionals to wallow in conformity. The good ‘ole days of free Flash templates on every corner will make a comeback in the form of HTML5.

    Remember, folks: don’t forget your text. Don’t throw content to the wayside while showing off your shiny new web trinkets. Don’t let HTML5 and CSS3 become the new Flash.

    I don’t mean to sound “Doomsday.” There are tons of people that continue to push the envelope. In contrast to Nike, one site that manages to pull off vertical-scrolling animation really well is Contrast Rebellion. Content is the highlight of this site. The illustrations emphasis the text, not detract from it. How you interact with the site isn’t the star — content is. The animations are fun and cool without overshadowing the message of the site.

    What do you guys think? Am I being over dramatic, or are we focusing too much on shiny?

    mel

    , ,

  • Just wrote an email close to an essay on the Hidden Tech mailing list

    Recently on the Hidden Tech mailing list, someone asked what screen sizes/resolutions designers used while working. Someone replied:

    I am not a *web designer*.  I am a computer programmer.  I am also an old-school UNIX user and until recently *never* maximized program windows.  Now I *needed* to maximize my Firefox window, since almost all web sites just do not work properly with a 600×800 window.

    *I* think:

    1) Web Designers need to have a ‘low-bandwidth’ Friday, where their bandwidth is cut back to dialup speeds one day a month, to give them a ‘feel’ for how the web sites they design (don’t) work for dial up users.

    2) Web Designers need to have a ‘small screen’ Monday where they are forced to use smaller screens or run at a lower resolution, so they can see how their web sites look and feel on smaller screens.

    I disagreed, and felt compelled to reply. This is what I said:

    Currently, <1% of internet users are working on 800×600 screens. About 14% of users have 1024×768, which is why any designer with a modern focus on web design will do one of two things: use a grid system such as http://960.gs/ or http://978.gs/, which are optimal on 1024×768 or higher screens, or create responsive designs.

    Let’s look at the first option. Using a 960 or 978 grid system, well over 97% of internet users will see the design as intended. Here comes the ideological debate — should, then, designers cater to the <3% of users who use smaller browsers? Let’s say there are a few people like you and I, who never maximize their browser windows. As I am on a higher screen resolution, this is rarely, if ever, an issue for me personally. However, should this be an issue for you? Should web designers be forced to constrain their designs to cater to a tiny minority, or should the minority be jolted into the present, where screen resolutions are almost always higher by default? One could argue that people using smaller screen resolutions, unless they are on mobile devices, etc., need to either evolve and adapt with the rest of the internet or get left behind.

    One also might insist that by not designing for users on smaller screen resolutions, designers are catering to the tyranny of the majority. There is some validity in this. The ideal designer would be able to design for all users, regardless of screen resolutions. This leads into the second method modern web designers can use: responsive design. Responsive design has been gaining serious ground lately due to the expansion of mobile platforms. Why create a second site for mobile when you can use media queries to adapt? (For a good look at media queries, look here: http://mediaqueri.es/)

    Using media queries, web builders can create sites that adapt to whatever screen resolution a user has. You can target within specific ranges — under 1024×768, for instance, or between 800×600 and 1024×768. It’s pretty excellent. However, how often does a web designer have the resources to be able to create responsive designs? Not all web designers are developers. Many designers just design. Many developers, front- and back-end, do not design at all. Many designers just are not given the time/budget to create upwards of four separate sets of mockups for various screen sizes. Many are not included, at all, in the development of the sites they design. When this is the case, how, then, can designers create responsive designs? Currently, the vast majority of people creating responsive designs are either web designer/developer hybrids (such as WordPress designer/developer Sara Cannon and web guru and writer Ethan Marcotte) or designers working at large firms with the resources to be able to pursue the extra time that goes into designing responsively. This is not necessarily something a freelance web designer, some of which have very little, if any development skills, can realistically pursue. While responsive design, I believe, is the future, it is not something that the vast majority of web designers currently have the resources to create.

    As for dialup, well, that is rather unfortunate. However, as web technologies advance, the need for giant, uncompressed images is growing smaller. Sites are becoming faster as more people start looking into advanced caching methods, compression and minifying, and use web fonts instead of images of text. Google is now counting slow loading speeds against websites. Flash, a major slow-loader, is becoming ancient technology: a thing of the past. Even Adobe sees this — just look at Wallaby.  And really, it is not just the job of the designer to make sure a site loads quickly; it is also the job of the developer coding the site.

    Of course, the web also has plenty of hacks who create sub-par work.

    I believe that while your arguments are valid, in that in the ideal world, all web design would be quick and responsive, I think you are in a minority, falling behind the times and refusing to adapt while the web evolves around you. I would encourage you to explore new web technologies and reevaluate your opinions.

    mel

    , ,

  • Excellent Brewery Websites

    I’ve been toying with the idea of compiling a list of good brewery websites for a while.  Beer is a major passion of mine (currently drinking a Heavy Seas Peg Leg Stout), along with design, so lately I’ve been exploring the combination of the two. 

    My search left me kind of dismayed.  From what I could see, the vast majority of brewery websites ranged from bad to downright terrible.  Do breweries just not want to shell out the money to get a good, reliable, typographically elegant and cleanly organized website?  All the microbreweries I know put so much love into their beers, and even into their print — why not their online presence? 

    In the end I managed to find some pretty decent brewery websites, most of which are higher-profile, well known breweries.  Unfortunately, the vast majority use Flash.  This is another trend I wish breweries would stop.

    Blue Moon
    http://www.bluemoonbrewingcompany.com/

    Though powered by Flash, Blue Moon uses the platform to its advantage, making one of the most colorful, fun brewery websites I’ve seen.  I love the illustrations, the texture, and how all of their beers have been painted for display.  The typography is also pretty nice — their chosen typeface has character but is still readable.  Overall, a brewery site with a lot of character.  (Plus, their Honey Moon?  Delicious.)

    Yuengling
    http://www.yuengling.com/

    While not necessarily my favorite brewery, Yuengling has a nice website.  Good imagery, use of slideshow, typography, even use of flash.  I love the beer description animations.  It’s also well organized and consistently styled, and also incorporates an e-commerce section well.  It’s a bold and strong site.

    Santa Fe Brewing Company
    http://www.santafebrewing.com/

    I’m not going to lie, all of the noises on this site are driving me a little crazy, and this site almost didn’t make the cut.  That aside, this site looks pretty nice.  I LOVE the background — the colors, the texture, it’s all really beautifully done.  It’s got a unique navigation, pages with actual body content are readable and nicely styled, and the site incorporates images well.

    Pyramid Breweries
    http://www.pyramidbrew.com/

    Love the contrast.  Love the navigation and drop-downs.  Love it’s little collapsible newsreel near the footer.  The different backgrounds for beers (and the images of the beers themselves) are great, and I love the typefaces they chose.  Overall, a strong brewery website.

    Guinness
    http://www.guinness.com/

    What can I say?  Guinness is sexy.  Just like their beer, Guinness’ site is dark, elegant, and oh-so-pleasing.  Great slider on the homepage, interesting way to organize content and navigate between sections, even video tutorials seamlessly integrated into the site that show you how to pour the beer correctly.  Guinness’ love of its beer shows through in it’s site.

    Dogfish Head
    http://www.dogfish.com/

    Definitely my favorite brewery, Dogfish Head has a unique and zany site as unusual as they are.  Though it’s more cluttered than I would like, especially since the header is so top-heavy, once you get down to looking at individual sections and beers things get more organized and clear.  Their visuals reflect the character of the brewery well.  While it has plenty of room for improvement, I’m still a big fan of the wonky Dogfish Head website.

    Samuel Adams
    http://www.samueladams.com

    Sam Adams is probably my favorite brewery site.  Probably my favorite parts of the site are it’s EXCELLENT typography and it’s unique navigation system, which conserves space without losing organization.  It’s full of different textures and colors, it’s got some pretty good functionality (check out the brews section and note the awesome slide format), and it goes beyond just the beer itself — there’s a section for pairing each beer with food, giving you multiple ways of finding the perfect meal.  Same goes for how to treat their beers — what glasses to use for each type, how to pour, etc.  There’s a lot of love and a whole lot of pride put into this website.  While Sam Adams isn’t my favorite brewery, by far it’s my favorite brewery website.

    Breweries that almost made it:

    Interested in your brewery having a kick-ass website?  Let me know.  I’m willing to work with breweries on a limited budget to either improve your current website or more.  I’m also willing to trade work for beer, to a limited degree.  I’d love to help you have the website you deserve, which shows your love for your craft.

    Any breweries I didn’t mention with awesome websites?  Tweet me @melchoyce and let me know!  If there are enough, I can do a follow-up entry.

    mel

    , ,

  • Coming up with a tumblr theme.

    I’ve been thinking about having an all-purpose design blog for a while. It didn’t need to be anything special, I told myself; maybe a WordPress blog? WordPress, however, seemed too much of a project for something I would want to keep simple. What, then, to use?  I keep seeing people on forrst creating tumblr themes, so I decided to come over here and check it out. Tumblr offers exactly what I was looking for in a blogging engine — simple, clean, and fully customizable.

    Now that I’m here, I guess the next step is to start designing my theme. It’s going to take some playing and some brainstorming, but I hope to get some ideas rolling soon.

    Note: This was eventually imported from Tumblr into my WordPress site.

    mel