9 ms·
It's 2012, HTML5 is awesome, and I'm surfing a PDF
- avirambm 14y agoWebsite is down, cache is available here: http://webcache.googleusercontent.com/search?q=cache%3Ahttp%3A%2F%2Fstephanierieger.com%2Fits-about-the-content-stupid%2F http://webcache.googleusercontent.com/search?q=cache%3Ahttp%...
- padolsey 14y agoI think the real issue here is a lack of graceful degradation on the Camper website. Built the right way, their fancy paper.js presentation thing would source whatever content it needs from within the page itself. The only excuse is laziness coupled with an unhealthy infatuation with new shiny technologies. I guess there are some bored people behind this who think anything, even a shoe catalogue, can be revolutionised. And that's fine, but they forgot about the core fundamentals of the web -- the kind I can rely on when loading up lynx and firing off a GET request to see some ... content.
- AndrewDucker 14y agoDegradation wouldn't help here - her browser can cope, it just takes an age to download the contents of the web page over a slow link.
- padolsey 14y agoTo see a "degraded" view though, I would just disable JS. Isn't this viable?
- virmundi 14y agoProbably not. It is often the case that a site is built entirely (read meaningfully) in JS. If one wanted to degrade gracefully without JS, one would have to have two sites: JS and Plain-Old-HTML. Now this is not possible, especially for a startup. You have a set number of resources. DRY helps allocate them. If you violate DRY with 2 sites, you're focus is going to be lost. Now some might say that good web design was violated by make the site dependant on JS. However, as the title shows, this is 2012. My cellphone has the ability to render most JS effectively. The old adage about degrading JS is just that, old. It was in a day before ECMA Script was sanctioned or common on the browsers. It was before jQuery and the like unified the browsers. tl;dr: JS is ubiquitous and is what the front end, and even the whole app is built on.
- idonthack 14y agothe camper website doesn't work without JS.
- _feda_ 14y agousing a text browser at all feels quite pointless these days, as much as I like them. Even programming website (case in point stack overflow) just don't work at all without javascript and images.
- pbhjpbhj 14y ago>Even programming website (case in point stack overflow) just don't work at all without javascript and images. // I just tried with Links 2.6 and it worked fine on StackOverflow.com.
- mhurron 14y agoRecent versions of Links support Javascript, so that was helping. However, I've been on Stackoverflow with javascript turned off (noscript) and it is one of the few sites that still renders usable.
- gyaresu 14y agoIrony alert: Database overload for an article on lightweight websites.
- objclxt 14y agoI also find it odd that the masthead for the blog is a 737KB PNG...I don't know why you wouldn't use a JPG - at a high quality level it's virtually indistinguishable and 1/4 of the size. It's a little pedantic, but if you're going to talk about how sites should be lightweight and then use a sizeable PNG image you're sort of opening yourself up for criticism.
- asciident 14y agoThey could at least run the PNG through a png compressor and shave 91kb off the size (tested on pngout) and without any loss in quality. Would save a lot of bytes over time...
- jarofgreen 14y agoShe's tweeted saying that was a mistake and she'll fix it.
- josefresco 14y agoA good lesson though to remember before calling someone out publicly. We all make mistakes, and the author is not exempt from this rule.
- unalone 14y agoYeah, but she's a blogger and Camper is a company worth millions of dollars. I don't expect good design from bloggers. If they say smart things, I'll read. I expect good design from people who theoretically want my money, because it's their job not to irritate me when I'm trying to pay them. I've avoided buying products from companies who make terrible design decisions. Not even to punish them, just to avoid having to deal with the pre-product bullshit.
- dlokshin 14y agoHTML5 and "fast" aren't mutually exclusive. Plenty of examples where HTML5 mobile sites are plenty fast over 3G like Quora and Asana (just two that I use often).
- leviathan 14y agoI don't know what you mean by "fast over 3G" but over here 3G is faster than any available ADSL plan you can get. I sometimes tether to my phone to download some contents when I'm in a hurry. I'm guessing the article is talking about sub-256kbps wifi.
- pajju 14y ago3G is never meant for Live Traffic. There are latency issues and packet losses being wireless. There is no proper QOS guarantees on top of the Wireless Stack. So never expect good skype experience or any real-time services like - Live search on 3G networks.
- bambax 14y agoFor some reason I thought this would be about PDF parsing on the client -- actually it's just somebody complaining that some eCommerce site takes so long to load that it's faster to download and read their PDF brochure offline. Who cares?
- lunarscape 14y agoI thought it would be about pdf.js[1] or something similar. [1] http://mozilla.github.com/pdf.js/ http://mozilla.github.com/pdf.js/
- codeka 14y agoActually, when I read the headline I thought it was going to be about websites who make you download PDFs to read what could easily be presented in HTML as well (restaurants always seem to have PDF menus, for example).
- andybak 14y agoI care. I make websites and this article made me think some more about page weight vs other trade-offs. I'm not sure what your comment has added to the debate.
- bambax 14y ago> I'm not sure what your comment has added to the debate. You're entitled to your opinion. But if your job is to make websites you shouldn't need a random post on a random blog to think about page weight...?
- andybak 14y agoSigh. Of course I think about page weight and a 100 other aspects of my craft. Listening to other people's thoughts is valuable in weighing up all the different priorities that compete for my attention.
- koide 14y agoIt's 2012, and I'm using a lousy hotel wi-fi shared by 503 guests that takes me back to 1997 connection speeds. No wonder PDF is the solution. Sure, sites should be optimized to the fullest extent possible and probably even detect connection speeds and offer a low bandwidth version (are there libraries for this already?) when appropriate; but that's a huge amount of work (and money) for what basically are outliers (I wouldn't expect many people to browse the Campers site from a lousy wi-fi in Bangkok)
- joliveira 14y agoI am on unshared 12Mbps ADSL, not the fastest around but surely faster than 1997 connection speeds and my experience was similar. Around 20 seconds for the initial loading and 5-10 for each collection. I am glad I wasn't actually looking to buy shoes and just checking the times the content took to load so I wouldn't say this design example is a problem just for the outliers.
- koide 14y agoThat wasn't my experience. It would be interesting to arrive at the bottom of the problem. I take it I'm being served a different page than you are, maybe due to location (I'm not on the US, but then, neither was the article author)
- deleted 14y ago[deleted]
- Cogito 14y agoI agree with her. I don't go to most sites to have some 'experience', rather I am there to find certain pieces of information or to use a service. Any technology that hinders me in the pursuit of that purpose, flash intro videos being the typical example, is frustrating and annoying. If the technology is super cool I might play with it for a while, but in the end I am skipping through trying to find what I came for originally. This particular example annoyed me - I found it glitchy and there was no compelling reason for me to want to look at it. I had no reason to visit the site in the first place, so perhaps my opinion is not that important. On the other hand, the designers may have done lots of testing, and determined that this design is the one which results in the most sales (or whatever). In any case, technology should never be a substitute for good user experience, not even flashy html5.
- isnotchicago 14y agoThis is the most important point: what is the site trying to accomplish? Or better, what are users trying to accomplish with the site? Presumably, the site is trying to sell shoes, and creating an "experience" around those sales might be crucial for Camper. On the other hand, such an experience may be (as in this case) an impediment. As others have mentioned, the trick is using tools appropriately. But first you need to know for what use cases you are designing.
- deleted 14y ago[deleted]
- munimkazia 14y agoIt's 2012. Start caching your database queries! (Looks like the website's database connection has maxed out)
- Devilboy 14y agoMaybe if Stephanie's site was lighter weight it'd still be up and running :P
- TomGullen 14y agoIt's never a problem with the technology, it's a problem of misuse of the technology and bad design.
- codeka 14y agoI don't know if the camper website is differentiated by region, or if I'm looking at a totally different website (http://www.camper.com http://www.camper.com ?) but I'm not seeing what she's seeing at all. I see a pretty standard e-commerce website with no "loadings" at all. It's pretty image-heavy, for sure, but that's to be expected when how else are you supposed to look at shoes?
- phylofx 14y agoI see what she is seeing. http://www.camper.com/en/lookbook http://www.camper.com/en/lookbook
- codeka 14y agoOh yeah, I do see that. But if you just click "Men" (or "Women") then you don't get any of that... which is what I would've done had I been looking for actual shoes.
- rurounijones 14y agoBloody hell, I am on super-fast Japanese broadband and that still took about 10 seconds to load.
- chris_wot 14y agoThe slowness has nothing to do with connection speed! I'm on blazingly fast Optusnet Cable Internet in Australia, and it's still incredibly slow on my (fairly recent) Asus laptop.
- deleted 14y ago[deleted]
- smoyer 14y agoI have a good Internet connection into my home here in the United States (I telecommute from a home office) but I also have 4 kids. The older two have graduated to streaming video to their laptops, but the younger two still prefer choosing titles from Netflix. When they're all streaming video, I find have the exact same problem on a desktop with plenty of resources. I think Stephanie's message should be applied several ways. We should degrade gently for underpowered devices like phones, but we should also be cognizant of the network capacity of the user. Coming from the embedded systems world, I know what it is to count every clock cycle and every byte of RAM. I need to remember those techniques when I'm designing and implementing web applications. Thanks Stephanie!
- koide 14y agoYes, Google Maps interface comes to mind every time I get reminded about this issue: "Still loading? Use the basic HTML version or click here for help" Although I wonder if this really is the best solution. Problems: User has to explicitly select a change. Once you change it might go faster, but it's no guarantee and makes you wait a longer total time to get to the first complete view. Benefits: It does not depend on directly measuring bandwidth (wasteful and still would take longer) Relays information about the problem to the user and not just a bad experience. Although, short of dynamic loading of less intensive interfaces until it ends up rendering a "basic HTML" view, I fail to see one. I haven't seen this implemented though.
- dave1010uk 14y agoI wrote a bit about this [1]. The basic idea is that CSS media queries, which currently just let us know about screen sizes, should also give us otherwise information like network latency and CPU [1] http://www.createopen.com/blog/2012/05/taking-responsive-design-a-few-steps-forwards/ http://www.createopen.com/blog/2012/05/taking-responsive-des...
- deleted 14y ago[deleted]
- rapind 14y agoSo let me get this straight. You're interested $100+ shoes but prefer substance and functionality over style only when it comes to the website that sells them?
- RyanMcGreal 14y agoI only buy $100+ shoes. High quality shoes are so much more comfortable and long-lasting than their cheaper counterparts that their performance and usefulness more than makes up for the higher cost.
- rapind 14y agoI only buy < $40 shoes and I've bought maybe 2 pairs in the last 4 years. High quality shoes are definitely more comfortable and long-lasting, however high price != high quality, even if the marketing and branding says so. You buy $100 shoes because of style and brand. And this price tag does not always mean quality. There are plenty of expensive brands that fall apart under everyday usage.
- manmal 14y agoI bought some Vibrams some weeks ago (> $100) and they are the best shoes I ever had, a small change of lifestyle. Don't overgeneralize on that, the topic "shoes" is very broad, as is "education".
- effigies 14y agoI got some Vibrams around Christmas and have been wearing them solidly for about 2-2.5 months (since the weather warmed up). The harder layer of rubber has already worn through on the heel, exposing the softer layer. I'm not so sure I'll be getting another pair.
- manmal 14y agoYou might consider changing your walking style. Children most often walk middle-footed or even forefooted when barefoot, and this is considered the most natural way of moving. Setting down the rear end of the foot before lowering it completely is a necessity when wearing normal shoes, but it's not natural. Before I adapted fully to the Vibrams my soles even started burning on the heels when I ran longer distances. I read that it's best to just set down the whole foot plainly (or forefoot first) when walking/running with Vs.
- MatthewPhillips 14y agoI know this will never happen, but how great would it be if we saw a revival of Gopher for this very reason? HTML is clearly going to be for applications in the future, so Gopher could fill in the hole of "just show me the content". Again, won't happen. But I can dream. If only there were a 0-click way to convert a html site to a gophermap/text files.
- runn1ng 14y agoPeople don't want to just "see the content". If you want that, you can just fire up links/elinks/lynx; it, surprisingly, works fairly well even today. But even the writer of the article didn't want to just see the text - she wants to see the shoes and decide which one to buy. You don't want to see a table with shoes numbers, descriptions and prices when you are shopping; visuals are important, too. That's why noone is actually using text-only browsers.
- MatthewPhillips 14y agoGopher supports images.
- effigies 14y agoIf you turn off Javascript and cookies, a ton of sites that serve what at least could be static content and which you don't need to log into simply stop working. What happened to graceful degradation? Is it not agile enough to expect a server to be able to work at least minimally with any browser?
- johnchristopher 14y agoIt is my belief graceful degradation got discarded when the "ditch ie6 movement" began to get full over-blown coverage.
- glesica 14y agoShe wanted to "see the content". The "content" just included images as well as text. What she didn't want was the heavy interface. Maybe a new content type would work... "text/html" would be the application and "text/static-html" would be "just the content"? Browsers would then just have a toggle option of some sort.
- chucknelson 14y agoThe Camper site is, like many other sites on the web, a bit over-produced. I would much rather have a clear layout and fast loading product pages than a fancy animated-just-for-kicks "experience" that starts to annoy after the first 30 seconds.
- robmcm 14y agoIt's like flash websites all over again, bring back HTML4!!!!
- dlitz 14y agoI think the Camper website needs more animated GIFs, Javascript image rollovers, MIDI music, and a tiled background.
- simonbrown 14y ago> I saw some nice shoes today at the mall and want to know if they’re available back home (because i’ve learned from experience that region-blocking also applies to shoes). Region blocking applies to shoes?
- unalone 14y agoThe problem with the "design" profession is that in both name and in practice it emphasizes the shallowest aspect of creating everything. I'm not criticizing designers, who are often much smarter than their field and do meaningful work. But design has the same problem as advertising (which I've studied): it's an essential part of making things for people, and in fact it's the first thing that many people experience, yet many of the people who study it never get into the deeper, more essential nature of creating things which make people's lives better. The result is shit like that Camper site, which is utterly terrible design in every sense. It's not especially successful even as a print layout: it's simple and big, but there's not much intelligence going into the creation, nothing clever that couldn't have been done with a long HTML page and a request to scroll, or even a slideshow with several panels. The only cleverness here is in the actual HTML 5 work, which does not matter to any sane consumer. Yet just like Stephanie said: this is a web site that's bound to win some awards from some jackass web design awards group that aims to further the cause of the web design circlejerk. It's not about good design, or good advertising, or good product brochuredom. It's about the self-satisfaction of people who have been trained to pursue a certain kind of "design" that, rather than designing for users, simply designs for itself. Very few functional web sites are "beautifully designed" in the sense that this Camper site is designed. There's such a thing as beautiful structure, which is the opposite of this, but which doesn't win as many awards: beautiful structure takes its medium into account, which means that beautifully-structured web sites look and feel like web sites, and are often frill-less save a design which makes perfect sense for their content. Google at its best, when Google's not pursuing a bullshit "Apple-like" fanciness which Apple themselves don't actually pursue. Facebook at its best (they weirdly go back and forth between terrific data visualization and some truly odd design choices). Some sites, like Tumblr and Pinterest, manage to slip in some nice pretty design things while maintaining the great structure which drew their users in initially. That's not saying there isn't a place for interesting, challenging web design which is more intensive and experimental and less purely functional. But that place isn't on a promo page for sneakers, and it's not where most "designers" tend to congregate. It's stranger and more off-putting than the stuff which most awards try to look for. People playing with the pure form of a web site, seeing how to use structural components for non-structural needs. People thinking about how, fundamentally, the web is different than other mediums, and what that means for creativity online. The web comic Homestuck mixes animated gifs with lengthy text logs with Flash animation (and interactive games) to tell its story. Sometimes it branches out into non-linear narratives, where several stories are told simultaneously and readers have to navigate through clicks. At one point, it loaded a new page header for every strip, and the header told a separate story from the main comic image, which in turn was telling a different story from the text beneath the comic. Recently, a couple of its "strips" have broken the frame which the comic normally uses, playing with our expectations of what a comic panel ought to be by having events break the panel and spread out onto the rest of the page. That's the sort of design that's really fascinating – not only playing with the nature of the web, but figuring out how to tell a compelling story that can only be told in the one medium. Mind you, if you go to Homestuck's web site, you're not going to be blown away, even though it's a very well thought-out design that does a number of interesting things with its layout. Nothing about the design says "Look at me! Look at me Design Things!" It just tries to house a very strange piece of entertainment as simply and sensibly as possible. Which is what design should do, rather than get in the reader's way to stroke its designer's ego. It's funny that lots of web professionals pride themselves for being "logical" and "rational" in a way that non-computer nerds are not. We're as bad as anybody else when it comes to stupid, unnecessary frippery. Worse, even, because we're hypocrites about it.
- danenania 14y agoThere's really no reason for that camper app to load so slowly. Rendering the initial screen then loading additional assets in the background with a prioritized queue could probably cut the load time by 90%.
- dwc 14y ago> There's really no reason... Well, no. Of course not. It's not at all about the technical feasibility, or even the ease, of delivering content up front. The web first began with the ability to deliver content up front and it's remained a viable option all long. The continuing problem is that people (CEOs, designers, developers, et al) get sidetracked and forget what their site is supposed to be doing. They forget what their customers or prospective customers actually want to do: get information; use a service; buy stuff.
- 89a 14y agoAnyone else noticed how unbearable Javascript has made the internet on older browsers? Google on an iPhone 3G is utter pain Any Tiger PowerPC Mac is utterly painful because browser JS engines have got so much better that we throw way too much for older browsers to cope with at them.
- Domenic_S 14y agoShould we get off your lawn, too? ;)
- ekidd 14y agoThis isn't a problem with HTML 5, it's a problem with the Camper site itself. The Chrome developer tools show 202 HTTP requests, including tons of tiny images, and many non-minified JavaScript files. And there's only about 500k of data, so it's not really a bandwidth problem unless you're on an EDGE connection or something horrible like that. The big bottlenecks here are round-trip latency and the maximum number of parallel requests made by the browser—if a round trip ping takes 250ms, and you can make 6 requests at a time, then it will take you a minimum of 8.4 seconds to load the page, no matter how big your pipe. For the sake of comparison, the main Hacker News page takes 6 HTTP requests to load. A Google search results page takes 22. Camper could fix their site by tiling all their little PNGs into a couple of large PNGs, and merging all their JS into a single file. If they got their file count under 25, they'd load quite quickly.
- SquareWheel 14y agoExactly right. The number of HTTP requests is ridiculous on this site. Check out the waterfall view on WebPageTest[1]; even though the files are all small, it's another connection for every single one. As ekidd said, CSS spritesheets and combining js/css is the answer. [1] http://www.webpagetest.org/result/120528_SJ_E14/ http://www.webpagetest.org/result/120528_SJ_E14/
- heliodor 14y agoYes, the site itself is immediately at fault, but the author used it as an example of her point, which is that the web in its current state is pathetic. There are plenty of little things that can make a website faster: image sprites, minified js, etc. Why don't the tools we use automatically handle this? Why are we so focused on creativity and customization instead of standardization and ease of building? Look at the waves of designers who are crying foul over Twitter Bootstrap and trying to convince us not to use it because they realize that the demand for their services has just been cut in half! Why are there no tools that provide the myriad of widgets we roll by hand each time? Lists, sliders, progress bars, drop-downs, calendars, etc. Well, there are. There's GWT, there clones of it for python, there's Wicket, and more. But few people seem to use them. There's more that can be added here, but the point is the web needs much better tools, processes, standardization, and ease of programming. We're giving people the tools to make the web a bad experience and in general that's been the end result, though we try to avoid those websites.
- CubicleNinjas 14y agoI like the idea of a world that dynamically responds to you better. Are you on a speedy networked desktop? You get the bells and whistles version. Are you own a tablet with less bandwidth? We note this, and load the appropriate version. Are you on a mobile phone on the move? We load the mobile edition which is about efficiency and speed. The user doesn't need to make decisions, but the site architect should be seamlessly making them behind the scenes. Also, I'd love it so all versions to have the same content, optimized for all homes. If I visit another mobile/tablet site that reduces content for "my convenience" I will start punching web developers. :)
- ereckers 14y agoTo be fair, the blogger is pointing to the Camper website "Lookbook" which in this industry is more of a "vanity" type display. It's meant to be a little creative and in this case it's extremely creative and extremely heavy. If the author of the blog just wants to look at some shoes, then the Camper website catalog is probably where she wants to be: http://www.camper.com/en/eshop/productos.xhtml?type=W http://www.camper.com/en/eshop/productos.xhtml?type=W I'm confident that if you looked at the Camper website daily visits a majority of browsing/shopping (90%+) will be taking place through the Catalog and not through the Lookbook. If you take a minute to view the homepage HTML you'll notice that there is only 2 links through to the Lookbook and that is only accessible after hitting the arrow down / MENU menu item and then clicking through the SHOES menu and submenu items (which itself is a pretty unintuitive element). The author brings up some good points about the Lookbook, but we shouldn't pretend that the website is using it as its main interface to the products.
- h84ru3a 14y agoIt's web developers that are responsible. It's a little like advertising perhaps. Advertising has become more of an art form than a tool. Awards given for achievement in creating ads are based on the perceived artistic value of an ad, not on its market effectiveness. Web development is viewed as an art form by web developers. The web is not a tool to them. It's a canvas. But the reality is that for many users in many cases, the web is a tool. They just want to accomplish some task, and they are not going to pay attention to artistic value. Maybe a good example is Amazon. Many web developers criticise the site's design. But Amazon is doing just fine. Because users do not visit Amazon for an "experience". They visit it to buy things. Maybe there should be two versions of every website: 1. an artisitic one aimed at "user experience" where the developer could display their design skills and 2. another aimed at getting some task(s) done, quickly and efficiently. The latter might follow some universal standard. No thinking involved in its "design", just following a spec. The user could choose. The problem for the author of this blog post was she had no choice.
- Domenic_S 14y ago> It's web developers that are responsible. No way. It's marketing people who are responsible. Obvious example: http://www.dustincurtis.com/dear_dustin_curtis.html http://www.dustincurtis.com/dear_dustin_curtis.html At the level that Camper (or Amazon) is operating on, the marketing department holds all the cards when it comes to the web site. The web devs mostly decide how to implement, but they're operating at the behest of marketing.
- h84ru3a 14y agoIn general, do marketing people know how to create websites? If not, how can they even know what is possible to create using HTML, CSS, etc.? If the answer is "they look at what the competition is doing," then how did the marketers at the competitor know what is possible? It has to start somewhere. Who was behind the web back in 1993? Marketing departments? Are marketers the ones who know what can be done with HTML, etc., and what cannot? If a marketing department asks a web developer to implement something that the developer knows will be an annoyance to end users, and then he decides to tell them it is not possible, does the marketing department not accept this answer? "Look, we know how to make websites, we know this can be done and we'd do it ourselves if we had the time, but we're busy doing marketing. Either you do your job and build this site as we ask, or we'll find someone else." So, at some stage, some web developer somewhere makes a decision. I remember reading the confession of a talented developer who wrote, using mini scheme, stealth malware to serve pop-ups. His skills were so good that he could disable all competing malware; the competition was helpless. The NY Attorney General later shut down his employer on consumer protection grounds. The developer was not typically an author of malware, and knew what he was doing was wrong, but his excuse for working with this outfit was that he needed a job. Without that developer making a choice, the malware company would never have known it was possible to do what they were able to do with the help of this particular talented developer. The use of mini scheme, self modifying code and disabling all competing malware were not in his "job description". He showed them what was possible. And surely they loved him for it. But how about the users infected with the malware, who had to see his employer's pop-ups every day with no way to "turn it off"? What would they think of his work? Just something to think about.
- halayli 14y agoI ended up buying a camper shoes.
- kylebrown 14y agosnarky blogger underwhelmed by website after patiently waiting thru load screen. news at 11