Menu Search
Jump to the content X

Showcase Of Delicious Coffee Websites


For designers approaching a deadline, coffee is a delicious necessity. Lucky for us, having a coffee break is not really difficult. But it’s more than just a 3am fix. With every late-night run to the local coffee house, we contribute to a populous network of coffee trading, sales and experience.

And in fact, coffee houses and suppliers are quite a business, with online presences ranging from simple layouts with striking typography to advanced layouts with remarkable photography. Coffee websites: what do they look like? What do they have in common? What metaphors, visuals and typography are they using? Well, this is where this showcase comes handy; let’s take a closer look at tasty coffee websites and examine their distinctive features and peculiarities.

Showcase Link

Far Coast1
Rustic oranges and blues are at play Far Coast’s website, with hints of distressed textures for an even more vintage vibe. The top navigation bar complements the large images that span the bottom, and the size of the centered text balances these for a pleasing look. Contrasting the richness of imagery is a neutral background, as well as low-opacity shots on either side.


Gorilla Coffee3
Thick lines, a dark two-toned palette, heavy shapes and an urban setting remind the user that coffee can be just as enjoyable when sipped in a fast-paced city as in the mountains. Flash in use.


Ipsento Coffee5
Instead of working with generic templates, Ipsento Coffee provides truly professional photography, displaying various navigation options in a quite unusual but attractive way. No links, no pages, no frustration with poor navigation. Ipsento shows that you can be complex and professional in design without having to indulge in equally complex development.


Coffee Club7
It’s no accident that the word “Indulge” emphasized in this design. With the aerial view of the natural setting, multiple areas of primary and secondary focus and beautiful balance of features, you’ll be indulging in this design as much as the Coffee Club’s menu.


America’s Best Coffee Roasting Company9
Balance is key in this design, and in many ways. America’s Best balances the abundance of gray tones in the big background image with a few shots of bright blues and rusty reds. In the same vein, the small text on the right side of the text area is balanced by the large focal text on the left. Overall, this text and link area is centered in the design. There are subtle balances as well: the “heavy” part of the picture is the top right, balancing the logo on the left.


Pura Vida11
Lime green isn’t an obvious tone to associate with coffee, nor with a website. But Pura Vida uses it to embody the qualities of its coffee: fair-trade certified, organic and shade-grown. The tone is cooled down by the rich browns, crisp whites and suede neutrals.


Seattle’s Best Coffee13
The most interesting part about Seattle’s Best Coffee website is its interactivity. You can rotate the cup to reveal different information about the company, its partners and the coffee. As the website says, “Go ahead. Take it for a spin.” Your design taste buds will be satisfied.


Café Henrici15
With a simple “flip” of the menu, you get all the information you need about Café Henrici. Café Henrici’s use of perspective in the layout image draws users into the scene, making them feel as though they are sitting at a round table in the Café, sipping a steamy cup.


Sweet Sallie’s Bakery & Cafe17
Though Sweet Sallie is as much a cafe as a bakery, its website exemplifies the cute-cupcake vibe found in many bakeries. With various blues, lavenders and teals and a feminine background pattern and type, this website’s all about baked-goods deliciousness. The cafe is simply the cherry on top.


Influx Café19
With a design as modern as the furniture in the photo, the Influx website is sure to please. On the home page, we are first presented with a sped-up video of goings-on in the cafe, giving us a fly-on-the-wall look at the cafe… and some tasty-looking muffins. From there, users can navigate to the sub-pages, which continue the clean palette.


Tapped & Packed Coffee21
The Tapped & Packed website combines the beauty and simplicity of modern design with traditional charm. A simple yet elegant palette of deep grays, crisp whites and soft yellows is combined with crisp lines to give a modern touch, while the serif fonts and roman numerals lend traditionalism.


Caravan’s website (or rather “Coming Soon” page) is decadent in rich grays and browns. Crisp whites bounce off the dark tones in both serif and sans-serif fonts, giving the typography a professional look. The background image gives us a view of its modern product design, which reflects the website itself, with its sparse text and neutral color choices.


Cilantro Café25
With drawn images dancing about a meditating man, impulsive swathes of paint and a variety of colors and objects, Cilantro Café reminds us that coffee can be both impulsive and relaxing. Reinforcing this contradiction is the radial balance of links that are off-kilter.


Kicking Horse Coffee27
The classic black and white palette of this website reflects the product design of Kicking Horse Coffee’s cups. The website uses splashes of bright tones to (ahem) kick it up a notch, and it adds slight textural elements for intrigue. The large focal point anchors the design, allowing the designer to make the links and text area large. It’s big, in your face and effective.


Robust-ah’s large photo could have easily overwhelmed this space, becoming a distraction from the information featured below. Instead, the design actually benefits from the large photo, which anchors the rest of the information by giving the structure clean lines and the information a hierarchy. Robust-ah’s design is not what you would expect from a coffee website, with its deep-purple and light-blue tones. However, some things need to be improved here: larger font-size would help, and so would removing text-shadow from some parts of the text.


1369 Coffee House31
This coffee house website may look generic and simple, and that’s because it is. But the generic vibe and simplicity ensure that the large photo and generous information remain clean and organized.


Park Avenue Coffee33
Park Avenue Coffee gives a playful feel with all the vintage charm of its busy patterns, whimsical logos and strong color palettes.


Greyhouse Coffee & Supply Co.35
Greyhouse Coffee emphasizes its menu so much that you have to hover around the bottom or top for the sleek sub-navigation bars to float into view. Design-wise, the menu’s cork background lends organic relief to the modern feel of the other pages.


Tre Amici37
Reminiscent of I Spy books, Tre Amici’s links are scattered across the various photos of its coffee house. With images that skate in and out upon link clicks, Tre Amici shows an interesting, interactive take on the stagnant photo tours of other websites. The transitions in the Flash-based navigation could be certainly improved, though.


Dunn Bros Coffee39
The Dunn Bros Coffee website has multiple textures, including burlap, paper, and photography, to exude a cozy vibe. The aerial view is also quite nice, giving us a few extra textures to enjoy: the blackness of the coffee, the shininess of the mug and the roughness of the coffee bean.


Marley Coffee41
Marley Coffee’s website is aesthetically pleasing, with a simple yet modern palette, lovely Flash and a simple point of focus. But don’t be so quick to click, not until you see Mr. Marley close up, sipping a cup of coffee and peering over the mountains and wilderness.


Jones Coffee Roasters43
Jones Coffee Roasters has a simple website with a simple layout, but the colors are bold and comfortable, and the textures add coziness and warmth. Easy navigation and a homey feel: a workable, beautiful combination.


Blaser Café45
Blaser Café’s website features crisp whites and a no-nonsense, user-friendly structure, which reminds us that coffee isn’t just about sipping brew and enjoying a break. It’s a business. But we all know what all work and no play leads to, and so Blaser Café adds a fun touch, too, with whimsical image transitions on the home page.


A Chacun Sa Tasse47
A Chacun Se Tasse lets us take in rich screen-wide images of its coffee house while reading information in an elegant gray information box. Sifting through images requires only a quick hover on the right side of the page, with no jolting image or page transitions.


Turquoise Coffee49
At the opposite end of the color spectrum is Turquoise Coffee, which uses calm neutrals, muted turquoises and subtle splashes of unexpected tones to grab the user’s attention. The website may not be as flashy or inspirational as some others we’ve seen, but it’s pleasant, easy on the eyes and user-friendly, and it gets the job done. It reminds us that simple isn’t so bad. The line-height and padding could be increased though.


Looney Bean Roasting Company51
Nothing says decadence quite like red. And nothing is a more perfect match than red and subtle khaki neutrals. Reds and beiges may not be the go-to colors for coffee products, but here they play off the large coffee-swirl background to emphasize the coffee’s creamy delectability, rather than its high-energy potency.


Storyville Coffee Company53
This website is tasty enough on the low bandwidth option, but go high bandwidth if possible. Here, everything says rich: the warm tones of the large transitional images, the rich grain in the borders, the page transitions, the balance of information on the secondary pages, the decoration upon link-hover and the elegant, deep-toned pattern background. The coffee is “artfully roasted,” and the website is certainly artfully crafted.


Bean Exchange Coffee House55
History comes alive on the website for this old Philadelphia coffee hub. The coffee house communicates its rich history in the look and feel of the website, with every bit of ornateness, palette and structure contributing to the theme.


Java Cabana57
There is such a thing as too much of a good thing, and certainly in the case of color. But Java Cabana’s heavy use of brown—typical of coffee websites—isn’t overbearing, thanks in part to the texturing of most of the brown elements, which help to break up the monotony. In addition, the steel accents bring a gray neutral that breaks up the brown without becoming an overt accent tone. Add in some great illusions of dimension, and you’ve got yourself a delicious website. Flashy transition effects in the footer of the page could be achieved with CSS3; you don’t really need Flash for that any more.


Cuvée Coffee Roasting Company59
This company boasts, “We take our coffee seriously. But we don’t take ourselves seriously.” It may sound like a cliché, but if its design is any indication, Cuvée Coffee is being honest. With fun cheesy yellows, handwritten fonts and playful graphics, the website feels as whimsical as it is professional. The palette stays grounded in warm hues, helping to maintain professionalism and hint at Cuvée’s birthplace: the arid state of Texas.


Café Britt61
An abundance of imagery is on Café Britt’s website to stimulates several of the senses. The stainless steel logo against the rich gray background convey the professionalism of the company. The wood and plant imagery in the navigation bar and footer brings a natural aura. We also get an intimate feel from scrapbook-like elements such as the handwritten fonts, old-paper textures and painted scenery on sub-pages. The website is wide, but that helps to accommodate the abundance of content.


Paul Dequidt Torrefacteur63
Soft plays on opacity and drop-shadows give texture to the large white information areas at the center of the page. The large background contains the palette from which all tones are pulled. The dimensions could be overwhelming, stifling any smaller images in the text area, but the large image in the white section maintains equal proportions. In addition, we get a definitive sidebar and two-column balance, adding stability to the layout.


Starbucks Coffee at Home65
Starbucks uses a chalkboard as it’s background, providing an instant means for texture. The dark hue of the board helps anchor the bright colors that appear upon link-over. Balance is kept centered; this simplistic form of balance keeps the intricate links and unique coffee navigation in check.


Cafeshop Especial67
Dimension, texture and the colors in the links and sidebar ensure instant recognition of important sections, while the soft background adds a neutral base and subtle interest.


Swiss Water69
In the rotating pictures, you’ll find women talking to one another over a cup of coffee, women enjoying a solitary cup of coffee, women sipping coffee while working. These scenes highlight coffee’s status as both a vehicle for social interaction and an occasion for brief solitude, and they form the largest part of the website, above the fold and in your face. The soft blues and whites minimize the distraction of the top links, search box and the like. Even the logo takes a back seat to the driving concept: coffee’s friendliness and warmth.


Café Théâtre de la Marionnette71
It’s not often that a torso with a coffee-cup head descends from above on strings and slides down the page, but with a name like Café Théâtre de la Marionnette, the sight is not surprising. Neither are the rustic textures and intriguing images (such as the doll-like dresses). But what keeps this website in the modern era is the beautiful development, which gives us a realistic bounce as each page loads.


First Colony Coffee and Tea73
Using a mix of old and new design, First Colony Coffee and Tea definitely breathes new life into tradition. The serif fonts, black and white imagery and crest in the logo create a colonial vibe and take the edge off the stark modern yellow in the image and background. With the expansive space along the right side and abundance of text, this website could easily have been boring at first glance; but the focal point comes to the rescue, with the smooth sway of steam from the coffee cup and the soft scrolling of the background image.


Juan Valdez75
This website gives us more than a warm welcome. Here, we are personally greeted by Juan Valdez, we traverse the rich countryside scene, and we enjoy all the animated goodness that this design has to offer. And if you don’t have time to take it all in, you’re in luck: the easy navigation makes the content extremely accessible, an advantage that many heavy websites don’t have.


Lavazza’s neutral brown background emphasizes the big links of rotating coffee cups that occupy most of the page. The neutral background also accommodates bright tones that run the spectrum. These whimsical touches are balanced by a simple white font for navigation and darker browns for drop-shadows and highlights.


Café Rouge79
Various textures create a warm, entertaining vibe on Café Rouge’s website. The textured background, rough paper, old stickers and supple light are just a few of the touches that make this website cozy. The movement in the photos and scrolling images below add flare.


Anodyne Coffee81
Anodyne’s website is simple. Its coding is basic, and its design is line-based and simple, which might cause some designers and developers to cringe. However, with the Web now so obsessed with bells and whistles, seeing a simply coded, simply designed website is a breath of fresh air. The traditional serif fonts hearken back to simpler times. What would be really necessary, though, is to replace an image used under the header to display opening times and the address with simple text that would have higher contrast against the background.


Dôme Café83
Like Café Rouge, Dôme Café uses a variety of textures to make the user feel cozy. The rotating images add excitement, and elements such as the white ribbon in the logo and the trim around the links instill tradition.


Double Coffee85
Double Coffee matches its big imagery with big text, big text areas and bold white fonts, achieving proper balance. Red runs rampant across the website in different hues and tones, bringing consistency and cohesion to the website. Adding to the cohesion are white cups, dishes and creamers that mirror the font. It’s proportionately spot-on and features interesting touches, such as a credit card. The consideration for all of these basic design principles make the website appealing and make us want to stay for one more page.


Like the Far Coast website, Kaffebrenneriet balances big rich imagery at the top with a neutral brown and taupe bottom, as well as focused images and simple fonts. Shadows set off the logo and two navigation bars, and the play on opacity and light make for an overall professional feel.


Mugg & Bean89
The dominance of one color, the balance of the large imagery and text areas, the traditional white font and the accent tones make this website easy on the eyes. Drop-shadows, reflection effects and beautiful image movement make it look even more professional.


Old Town91
Old Town plays up its name in this design, with its yellow-sepia blend in the background, the old village nestled in the countryside, the italic serif fonts and the flock of birds in the sky. We also get a touch of modern, with scrolling videos on the billboard and an animated delivery truck. The heaviness of the billboard is balanced by the town, and together they are balanced by the six links along the bottom, which reveal sub-navigation in white boxes upon hover.


Copper Door Coffee Roasters93
A multitude of textures, along with paper, wood and nails, give this website its natural look. The nice handwritten font for links and page headers and the drawn lines under hovered links punctuate the naturalness. Warm greens and oranges bring out the equally warm hues in the textures.


ROM Coffee Bar95
The circle of ROM Coffee Bar’s logo is reflected throughout the website, providing continuity and visual interest and giving the crisp whites and steel blues a softer feel.


Quills Coffee97
Big images, fonts and links provide balance, while the contrast of font types adds variety to this big neutral design.


There’s no better way to involve a user in your product than by simply throwing them into the scene. Most coffee websites do this with a close-up of coffee or a large static image of customers enjoying the atmosphere. Not Melitta. Melitta puts us at eye level with the rest of the coffee shop’s patrons, making us feel as if we too are sitting and sipping. We get a large view of the coffee shop’s charming exterior, and we can even watch as the patrons move, change and enjoy the experience. What’s best is how large the graphic is, giving us a full-on view of the perfect Melitta experience.


You may be interested in the following related posts:


Footnotes Link

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18
  19. 19
  20. 20
  21. 21
  22. 22
  23. 23
  24. 24
  25. 25
  26. 26
  27. 27
  28. 28
  29. 29
  30. 30
  31. 31
  32. 32
  33. 33
  34. 34
  35. 35
  36. 36
  37. 37
  38. 38
  39. 39
  40. 40
  41. 41
  42. 42
  43. 43
  44. 44
  45. 45
  46. 46
  47. 47
  48. 48
  49. 49
  50. 50
  51. 51
  52. 52
  53. 53
  54. 54
  55. 55
  56. 56
  57. 57
  58. 58
  59. 59
  60. 60
  61. 61
  62. 62
  63. 63
  64. 64
  65. 65
  66. 66
  67. 67
  68. 68
  69. 69
  70. 70
  71. 71
  72. 72
  73. 73
  74. 74
  75. 75
  76. 76
  77. 77
  78. 78
  79. 79
  80. 80
  81. 81
  82. 82
  83. 83
  84. 84
  85. 85
  86. 86
  87. 87
  88. 88
  89. 89
  90. 90
  91. 91
  92. 92
  93. 93
  94. 94
  95. 95
  96. 96
  97. 97
  98. 98
  99. 99
  100. 100
  101. 101
  102. 102
  103. 103
  104. 104
  105. 105
  106. 106
  107. 107

↑ Back to top Tweet itShare on Facebook

Katie Thompson has a BA in journalism and design from Ohio State University. She has written for both print and online media, including Ohio-based CityScene Magazine and Web Designer Depot, and has more than seven years experience in web design and development.

  1. 1

    Coffee <3 – First!

  2. 2

    An hour ago, i was looking for some good coffee webites. And now your post.
    I love smashing Magazine :D

  3. 3

    Nice delicious yummy coffee website layouts.

  4. 4

    I’m surprised the Starbucks At Home site didn’t make the cut

  5. 7

    great showcase! love the gorilla coffee site… makes me really want some since it feels like a big blast of energy… I think it’s the red they used mmmm… coffee

  6. 8

    Good timing, I’ve just made a coffee.

  7. 9

    Great list! And I appreciate the included descriptions as well.

    Check out a few more I have posted:

  8. 10

    Hey guys!
    You did this post just for me, right?? ;)

    Cheers, Oliver

  9. 12

    what a total waste of internet.
    thank God/Allah/etc I use Firefox with ADBLOCK(tm)

    • 13

      Hey Steve,
      you know what is great about the Smashing Magazine??
      – You don’t have to read it if you don’t like it.

      Think about it and have nice day.

      • 14

        That’s your response, FanBoy?
        While you are apparently content to have Smashing Magazine decay into some stupid attempt to substitute for a simple Google search, I have higher hopes for it.

        I believe Smashing Magazine can be the premier source for intelligent articles and content for designers, artists and developers – a goal that is somewhat impeded by running these mentally deficient ‘list of xxxxx’ pages.

        “Gorilla Coffee
        Thick lines, a dark two-toned palette, heavy shapes and an urban setting remind the user that coffee can be just as enjoyable when sipped in a fast-paced city as in the mountains. Flash in use.”
        Are you f*king kidding me?
        That crap and a screenshot ( * 10) constitutes an “ARTICLE”??

        What is FUNNY, is that SmashMag posted an article a week or so back, pointing out editorial standards…sigh

        • 15

          Sounds like someone needs to switch to decaf . . .

        • 16

          What most people like you don’t understand is all the hard word it takes to manage a successful blog like this one. You take and take and take but never give back to the design community except in your childish offensive comments. If you don’t like the stuff you read online, try to make something better. Start your own site and see how far you get. It’s not as easy as some people make it look, but if you want change to happen, offer something “better”.

          Not my favourite post here at smashing, but I’ve got nothing against you guys trying to make a living while we all feed off of your free content. Thanks for the hard work.

        • 17

          Thank you steve! so many of us were thinking the same thing….

        • 18

          I imagine by now, after all this time wasted typing your stock detractions, you could have written an article yourself, worthy of the standards you claim to aspire to on Smashing’s behalf. That assumes, of course, that you have anything useful to contribute. Though if you did, perhaps your envy of SM’s success wouldn’t be so transparent.

        • 19

          Well said! Echo’s my thoughts exactly!

          All too often recently, I’ve been thinking that the editorial standards are dropping like a stone. So much so that I’ve gone from being a daily visitor/reader to a weekly or less reader.

          Reading comments like ‘don’t read it’ are pathetic. We come here to read. When the content is, quite frankly, crap, that stops us reading. It annoys me when fanboys support everything unquestioningly. Criticism is a good thing when it’s due.

          It’s due.

          • 20

            @Piggy and Tazzy I see. But please take a look around here on Smashing Magazine. Check articles published over the last month or so. How many lists do you find? How many round-ups do you find? How many showcases do you find?

            And how many educational, in-depth articles do you find?

            It’s always about the right mix, the right balance. We are here to protect and advocate interests of our readers, but because we have quite a big readership, sometimes we publish posts that appeal to some readers, and do not appeal to others. And I think it’s OK, really. You can’t make everybody happy.

            We do work hard on thought-provoking articles though, but we need to take care of various groups in our readership.

          • 21

            Normally I don’t comment the Smashing Magazine’s articles, not because their bad … on the contrary they are very inspiring and educational as well as pretty specific.
            But this article (yes article… and if you don’t know the meaning, well how about instead of you buying the smashing mag book start by buying a dictionary? =) ), or better saying, this comments are getting extremely great success….

            … For me, these kind of articles – the showcases – became a point of update and knowledge gathering. Instead of using Google (as someone said) to search for “Café Websites” and all kind of crap on its results , I can actually see here good quality and, as I said before, inspirational content and design.

            And as for haters, You could be much more if you weren’t less… =) You think you can do better? You think that a bunch of text and a small image is better than “a bunch of images” ? Apparently you don’t know that “an image says more than 1000 words” … therefore, if you don’t know this you don’t know design (either good or bad) …

            … that’s why You probably design on terminal console @ linux (ascii rules right?)


    • 22

      Dear Steve,

      I respect every single reader, I do. But what I do not respect is criticism that doesn’t suggest anything concrete. I understand that you hate Smashing Magazine, hate Smashing Magazine’s writers, hate Smashing Magazine’s Editorial work, hate Smashing Magazine’s articles and hate everything that is in any way related to Smashing Magazine. I get that, I really do.

      But why exactly do you keep coming to Smashing Magazine then? If you really care about the content published here, then please suggest concrete improvements. We are always looking out for new ideas, better content and further improvements of the site. And we could certainly use professional help.

      And I would love to give you the opportunity to write an article for Smashing Magazine as well! Please reply to my e-mail and we will figure something out.

      Please: if you don’t like an article, tell us what can be done better. If you find typos, let us know where they are so we can find them. I am sorry, but in my opinion it just isn’t helpful to publish hate-comments all the time, in almost every single post. So tell me: why are you doing this?

      I really would love to hear your opinion.

      • 23

        More concrete:

        What it seems markedly obvious that Steve was saying…

        Too many blogs are just becoming lazy. WebDesigner Depot, Smashing Magazine, Speckyboy (Smashing Network site), 10Steps….used to have far more educational articles.

        Now there are days when I run down my personal blogroll, and find nothing but roundups when I really need to start my dad with a tutorial to help get my juices flowing – something that doesn’t come from looking at screenshots.

        Honestly, I think I’d rather have a no-update day, than another “I took 20 screenshots” article.

        Steve may need some work on his delivery, but his post is a compliment, not a complaint. His expectations of Smashing are higher – because he has come to expect Smashing to be something bigger and better. That says something about the brand you had built. A brand that will be tarnished if it comes another roundup mill.

        I took two blogs that were daily visits for me off my toolbar this week, because they had become just that.

        • 24

          Oh – and seriously – how could you omit Starbucks and Tim Horton’s? As well as Peet’s. You type in “Coffee” in Google, and Peets and Starbucks show up on the first page, and are both giants in the industry.

        • 25

          Mark, I get your point. But please take a look around here on Smashing Magazine. Check articles published over the last month or so. How many lists do you find? How many round-ups do you find? How many showcases do you find?

          And how many educational, in-depth articles do you find?

          It’s always about the right mix, the right balance. We are here to protect and advocate interests of our readers, but because we have quite a big readership, sometimes we publish posts that appeal to some readers, and do not appeal to others. And I think it’s OK, really. You can’t make everybody happy.

          We do work hard on thought-provoking articles though, but we need to take care of various groups in our readership.

        • 26

          To the other Mark:

          Trying to produce top-notch/exclusive content at the rate people expect Smashing to publish (almost daily) is nearly impossible without a HUGE team of talented/experienced writers.

          Yet, Smashing’s reputation shouldn’t rely solely on the content of their articles. Why not let that reputation expand to include a discussion-rich community of professionals who share insights on designs and article topics?

          There’s a need for a change in the comment system / comment-reading experience (and Vitaly: I know you guys are working on it!) but I don’t think the articles themselves are to blame.

          • 27

            To the other other Mark:

            Smashing has a team. And authors that aren’t ON the team. It’s not a single person running this blog in the corner of his or her basement. It’s a group of professionals aided by a world of freelancers. Their “regular authors” page lists 20 regular authors. The author of this article isn’t one of them. With all the freelancers and 20 regulars, they should have no problem writing one article per month. If not, they are certainly in the wrong business. I don’t think I could survive in my profession if I used the “it’s hard to do, so I’m not going to do a good job today” excuse.

            With 20 regular authors on or off staff, daily content shouldn’t be a problem. Even so, I said in my first comment that I’m fine with them not producing content every day. This isn’t TV news. They aren’t forced to fill a time slot on a slow news day with fluff. They can take a day off.

            To Vitaly:

            Certainly there are many others that think this, but are not so eager to say something that is dismissed as “negative commentary”, since the community jumps on them with the “then go somewhere else you ingrate” attitude. Telling us “well, we have wonderful stuff elsewhere” doesn’t really fix the problem, it just paints over it, leaving the problem to remain under the surface.

            Rather than explaining/dismissing away these, why not take it from the approach of “ok, we have unhappy people, can we fix this and improve our site – thereby improving our loyal readership?” Wouldn’t that be more productive for your own needs? Or are these answers designed merely to appease those that are already loyal and you don’t want to be influenced by those comments – in which case my entire post is moot.

            To Vitaly and all those that shoo away the people with “negative” advice or comments:

            Are you sure Smashing Magazine/Network wants you doing that? Those that have “negative” comments have an equal value when it comes to pageviews. Ranking engines to not rank pageviews and time on site by “happy time” or “not-so-happy” time. But they do measure repeat business. A pageview lost is a pageview lost, and lost readership equates to lower advertising rates and therefore revenues.

      • 28

        You people at Smashing Magazine shouldn’t worry about the people who don’t appreciate the efforts you people are putting in to produce such great content, for free. This website is one of the best I have come across till date.

        There are always some people who only know how to make fun of people and their efforts, without doing anything themselves.

        Keep up the good work!
        – a loyal reader.

    • 29

      Hey Steve, if I were you I’d write to Vitaly and the team to request a refund. You’re obviously very unhappy with the content here on Smashing Magazine so it’s only fair that you should be reimbursed… wait! The content is free!

      Could I humbly suggest that if you hate this post so much you exercise your middle finger in a different way, use it to press that wee button there on your mouse. Yes, that one. Now click on the back button et voila, no more annoying articles to vex you.

      Now if you’ll excuse me, I’m going to go back and study the collection of designs Katie Thompson spent hours working on.

      • 30

        Thank you:)

      • 31

        I would hope it would not have taken her “hours” to google and take some screenshots of 10 sites. I suppose a college degree isn’t all its cracked up to be nowadays, but c’mon now!

        • 32

          Please let me learn your techniques. I would love to have been able to find these 60+ examples of good webdesign by way of a few hours ‘google searching.’

          Also, please tell me the sites you write for. I’d love nothing more than to work for a company that accepts google-searched showcases that took two hours to complete.

  10. 33

    Not yet completely finished, but perhaps nice to show off :-)

    shameless but relevant plug: , hope people won’t mind too much.

    • 34

      No shame required. I genuinely liked your site, unfinished or not and I would truly be interested if you would write an article (with your client’s permission perhaps) that outlined your experience as you brought this fine site from an idea to completion, maybe exploring some of your design choices and trade offs, the difficulties and compromises?

      now THAT would be a ‘smashing’ article!

      • 35

        That wouldn’t be a bad idea :-).

        I’ve used Smashing Magazine articles for some parts of the site, and I think I have some different design propositions somewhere around.

        Would be nice to have an article about that, as well of course, have the site tuned and completely ready.

        cheers :-)

  11. 36

    yummy ^ ^

  12. 37

    Unique & different show case! I checked my RSS feed first this morning, saw the title, and just like I do for my morning cup of java, I got instantly excited! I LOVE COFFEE.

    Good job…

  13. 38

    After seeing all these site I’m going home to make some coffee (with goat milk ;)).
    Great article.

  14. 39

    WHAT? No Tim Horton’s!?

  15. 40

    Whoa. I’ve just started working on a website & fresh branding for a local coffee house in my town. Thanks for the inspiration!

  16. 41

    What an amazing gallery of designs, regardless of the coffee! Thanks Smashing.

  17. 42

    Some of the actual coffee from these sites makes me vomit, however.

  18. 43

    Wait… a whole list of coffee sites without including Starbucks, and Coffee Bean?

    (Starbucks’ sites are notably excellent)

  19. 44

    nice website here. I like 1369 Coffee House website :)
    I love coffee also. One cup every day :)

  20. 45

    There are typos and grammatical errors all over this post. Doesn’t anyone proofread???

  21. 46

    This comment was removed by moderator because of the personal insult.

    • 47

      @ steve42: Why don’t you start your own site and show us what perfection looks like?

    • 49

      Exactly, steve42! Vomiting is the best word to describe your comments. Or maybe you really thought you sound critical and your comments are the righteous anger? Well, you don’t. For example, the comment of Mark below makes sense and provides valuable critics, try to learn.. or just spare this place your wordorrhea.

  22. 52

    Just amazing Gallery of coffee site designs
    Good Show!!!!

  23. 53

    Have you checked out Coffees of Hawaii? Pretty neat website.

  24. 54

    Can Smashing get a comment rating/karma system? Perhaps akin to Slashdot? The articles could generate some excellent discussions but all the “Wow, great designs! I like designs.” and “lol-I-could-do-better” comments are useless to most readers…

    • 55

      I feel your pain, but that additional level of complexity will still be superseded by fanboys + rating their own comments and/or those of their sycophantic friends.

      I’d just be happier with BETTER articles instead of this fluff, filler bullshit.

    • 56

      I’m saying we ought to be using these articles as discussion starters.

      Most readers of Slashdot don’t RTFA, they skim the summary, skip the article link, and scroll down for the insightful discussion, intelligent arguments, and hilarious witticisms.

      In this case, most readers probably won’t find a use for this type of article beyond light design inspiration but what about discussing the purpose behind these sites? How do you approach the design of small-business/restaurants/cafe websites? What is the user looking for when they browse the site? How should you present content effectively? A number of the featured designs fail in key areas, what are these areas? How can it be improved?

      Perhaps I’m assuming a different sort of readership…

    • 57

      We are listening, Mark. I think it’s a great idea. Let me put it on my to-do list and we’ll see what I can do.

      @steve42: what kind of article would you prefer instead of this “fluff, filler bullshit”, please?

      • 58

        This is why one should not post blog replies before having their ‘coffee’… Wouldn’t you agree?
        BTW – Great article – keep it up!

    • 59

      That’s a GREAT idea. And not just cuz the person with the idea has a great name!

  25. 60

    Nice list, I love coffee!

    Here is one I made a while ago:

  26. 61

    Great pieces! Really makes me run to take a cup of coffee… delicious!
    We have here a great one too:
    They just finished, take a look!

    See ya!

  27. 62

    Disappointed that Starbucks and a local fave of mine New England Coffee was left off this list. Great list though. And I see the need for articles like this, along with articles full of information. I think postings like this serve as good inspiration and people that balk at that only need to read the articles they find of interest.

  28. 63

    Was Starbucks left out for a good reason?

    • 64

      Well, we featured Starbucks’ website multiple times in our previous showcases already. But I already contacted the author and suggested adding it to this post.

      • 65

        No problem, I was just wondering if there was a specific reason. Thanks for the reply.

  29. 66

    Nice list and funny it just came out as we recently launched a coffee website for a local company here in Denver –

  30. 67

    I’m thirsty!!! :D


↑ Back to top