Posts Tagged ‘HTML5’
We are pleased to present below all posts tagged with ‘HTML5’.
We are pleased to present below all posts tagged with ‘HTML5’.
Developing for the Web can be a difficult yet rewarding job. Given the number of browsers across the number of platforms, it can sometimes be a bit overwhelming. But if we start coding with a little forethought and apply the principles of progressive enhancement from the beginning and apply some responsive practices at the end, we can easily accommodate for less-capable browsers and reward those with modern browsers in both desktop and mobile environments.
Resetting our CSS styles is where we’ll start. Browsers have different default styles for the elements we’ll be using, so understanding this and getting all of the elements to look the same is important. In this example, since we’re using an unordered list, there will be default left padding, top and bottom margins, and a
The Web is just starting to use animation well. For years, animated GIFs and Flash ruled. Text moved and flashed, but it was never seamless. Animations had boxes around them like YouTube videos. HTML5 canvas changes everything about Web animation.
The canvas element makes it possible to integrate drawings and animations with the rest of your page. You can combine them with text and make animations interactive. This drawing mechanism is powerful, but very low-level. Animations get more power and need less coding when you combine the canvas tag with higher-level libraries such as Paper.js. This article introduces HTML5 animation and walks you through creating an animation of dandelion seeds blowing in the wind.Read more...
To keep this article from turning into a book, we won’t look at each in depth. Instead, this is a taster menu: you can see what’s available, and there are links that I’ve vetted for when you want to learn more. Along the way, we’ll see that HTML5 semantics are carefully designed to extend the current capabilities of HTML, while always enabling users of older browsers to access the content. We’ll also see that semantic markup is not “nice to have,” but is rather a cornerstone of Web development, because it is what enhances accessibility, searchability, internationalization and interoperability.Read more...
Disclaimer: This post by Jeremy Keith is one of the many reactions to our recent article on the pursuit of semantic value by Divya Manian. Both articles are published in the Opinion column section in which we provide active members of the community with the opportunity to share their thoughts and ideas publicly.
Divya Manian, one of the super-smart web warriors behind HTML5 Boilerplate, has published an article called Our Pointless Pursuit Of Semantic Value. I’m afraid I have to agree with Patrick’s comment when he says that the abrasive title, the confrontational tone and strawman arguments at the start of the article make it hard to get to the real message.Read more...
Update (November 12th 2011): Read a reply by Jeremy Keith to this article in which he strongly argues about the importance of pursuing semantic value and addresses issues discussed in the article as well as in the comments here on Smashing Magazine.
Disclaimer: This article is published in the Opinion column section in which we provide active members of the community with the opportunity to share their thoughts and ideas publicly. Do you agree with the author? Please leave a comment. And if you disagree, would you like to write a rebuttal or counter piece? Leave a comment, too, and we will get back to you! Thank you.
Allow me to paint a picture. You are busy creating a website. You have a thought, “Oh, now I have to add an element.” Then another thought, “I feel so guilty adding a div. Div-itis is terrible, I hear.” Then, “I should use something else. The aside element might be appropriate.” Three searches and five articles later, you’re fairly confident that aside is not semantically correct. You decide on article, because at least it’s not a div. You’ve wasted 40 minutes, with no tangible benefit to show for it.
This is not the first time this topic has been broached. In 2004, Andy Budd wrote on semantic purity versus semantic realism. If your biggest problem with HTML5 is the distinction between an aside and a blockquote or the right way to mark up addresses, then you are not using HTML5 the way it was intended. Mark-up structures content, but your choice of tags matters a lot less than we’ve been taught for a while. Let’s go through some of the reasons why.Read more...
Images have always been the heaviest component of websites. Even if high-speed Internet access gets cheaper and more widely available, websites will get heavier more quickly. If you really care about your visitors, then spend some time deciding between good-quality images that are bigger in size and poorer-quality images that download more quickly. And keep in mind that modern Web browsers have enough power to enhance images right on the user’s computer. In this article, I’ll demonstrate one possible solution.
Let’s refer to an image that I came across recently in my job. As you can see, this image is of stage curtains and has some (intentional) light noise:
Optimizing an image like this would be a real pain because it contains a lot of red (which causes more artifacts in JPEG) and noise (which creates awful artifacts in JPEG and is bad for PNG packing). The best optimization I could get for this image was 330 KB JPEG, which is quite much for a single image. So, I decided to do some experiments with image enhancement right in the user’s browser.Read more...
Perhaps one of the most talked about websites in the last 12 months has been Nike Better World. It's been featured in countless Web design galleries, and it still stands as an example of what a great idea and some clever design and development techniques can produce.
In this article, we’ll talk to the team behind Nike Better World to find out how the website was made. We'll look at exactly how it was put together, and then use similar techniques to create our own parallax scrolling website. Finally, we'll look at other websites that employ this technique to hopefully inspire you to build on these ideas and create your own variation.Read more...
Subscribe to our email newsletter for useful tips and valuable resources, sent out every second Tuesday.
Nothing is more frustrating than stubborn management. That's why we published Digital Adaptation, a new book by Paul Boag on how to help management overcome legacy practices — for good.
It's done. The Smashing Book #4, our brand new book with smart front-end techniques and design approaches. Written by respected designers and developers, neatly packed in a gorgeous hardcover.
Hungry for more content? Over 60 eBooks are waiting to be discovered in our lovely Smashing Library. And guess what? You can watch Smashing Conference talks there, too.
About the Role Help build the future of how we experience the web. Sharethrough is a new type of marketplace for brands and publishers, ......
SkyVerge is looking for part-time Rails contractors with at least 10 available hours per week to join our team. You'll be responsible for contributing to projects...