The Internet Archive discovers and captures web pages through many different web crawls.
At any given time several distinct crawls are running, some for months, and some every day or longer.
View the web archive through the Wayback Machine.
CSS will-change is a new property that allows you to let a browser know ahead of time that an element may change, so that it can make any preparatory optimisations. Sara Soueidan shows you how to put an end to cargo-cult hacks, and speed up your animations.
CSS Blend Modes provide a way to specify how one layer will interact or “blend” with the one underneath. Until now, this was the domain of photo editing applications, but now they are available on the web using CSS itself!
IndexedDB offers a powerful way to store and retrieve data in the browser. As with server-side databases, IndexedDB allows us to generate keys, search data, or sort it by a particular field. In this article, we’ll dig into the IndexedDB API by building a to-do list manager. But first, let’s look at some of the concepts around databases and IndexedDB.
The W3C device orientation API allows us to determine the orientation of a device in physical space. In this advanced tutorial we cover some of the pitfalls and propose some new ways of working with this data for developing practical device-orientation-aware web applications on mobile devices.
We sat down with Ben from Adblock Plus, and asked him all about the product, how it started, how it’s different, how the company behind it makes money, whether ad blocking is hurting the internet or not, and more.
Ready to enter the world of parallax scrolling websites? Yes, scrolling sites are absolutely everywhere. Sadly, sometimes they do little more than distract and disorient a user in an attempt to show off, but when done correctly, they can make the web a more exceptional place. At its best, parallax scrolling can help users explore content in an immersive and engaging way.
Due to the major architectural changes we’ve been going through recently, the first versions of our Chromium/Blink based Opera browser (versions 15, 16 and 17) do not support themes. However, from Opera 18 onward, themes are supported again! This article explains you how to create themes for Opera 18+.
Media Capture is one of the most interesting features in web applications, especially for mobile devices. Surprisingly capturing media on the spot is quite a new thing for browsers in general, until recently always being delegated to browser plugins such as Flash or Silverlight. In this article we will explore how to use the Media Capture APIs, their compatibility across mobile browsers and the current state of the W3C specifications that define them.
We sat down with Ulla from Web of Trust, and asked her what makes WOT special, how the service makes money, which extension development tools the WOT developers use, and much more.
In this article, Tiffany Brown has a look at mutation observers, how they are different from mutation events, and how you can use them in your web applications.
We sat down with Brian from Disconnect, and asked him about his team, extension development tools and UX processes, where the service’s revenue comes from, and much more.
CSS regions is a nascent CSS feature that provides a way for us to completely decouple our content from our layout, flowing specified content containers into layout containers to give us a lot of flexible power. This article provides a basic introduction to using regions and serving fallbacks to non-supporting browsers.
CSS viewport units allow us to size lengths on web pages relative to the viewport size, which has some interesting applications for responsive design. In this article we’ll explore the fundamentals of this topic.
We sat down with the developers behind the novel cottonTracks extension, and asked them some questions over a (virtual) coffee. We talked about what the cottonTracks extension is all about, what their development workflow is, what they have learned thus far, and much more.
In this article we’ll dig in to 3D transforms in detail, looking at the fundamental differences between 3D and 2D transforms, the 3D transforms available, and some demos that show how these work.
This article discusses how you can (and should) improve the performance of your animations, using the requestAnimationFrame API instead of the old setInterval/setTimeout methods, and how requestAnimationFrame is used.
With Opera switching from Presto to Chromium and a complete UI remake, our extensions infrastructure has also gotten a major overhaul: from Opera 15 onward, Opera 11 & 12’s extension format is no longer supported, and instead, we’ve switched to Chromium’s extension model.
Now that Opera for Android is out, you’ll sometimes need to debug it, as there are differences in Standards support between Opera and Chrome for Android and Chrome on Android 4+. Here’s how to connect Opera for Android to Chromium-based desktop browsers for remote debugging.
In this article, Chris Mills explores what can be achieved by using animations and transitions — along with a little JavaScript — in conjunction with Flexbox.
The CSS Flexible box module level 3 brings with it a lot of power and some very exciting possibilities for web development, allowing us to put together complex site layouts easily and rapidly, and dispensing with some of the illogical hacks and kludges that we’ve traditionally used. In this article Chris Mills goes beyond the basics, showing some more interesting uses of flexbox, and how Modernizr can be employed to serve different styles to browsers with differing levels of flexbox support to provide the best level of cross browser support available.
This article covers Web Storage, a new W3C specification supported in Opera 10.50+ that allows data to be saved on the client-side in a much more powerful, more secure fashion than before. Here Shwetank Dixit discusses both facets of Web Storage - Local Storage and Session Storage - and how to use them to store web application data on the client, along with some simple examples to get you started.
We have practised feature detection to allow us to provide appropriate code to browsers with differing levels of standards support for a while now, but we’ve always needed 3rd party libraries to handle it. But not for much longer: the CSS3 Conditional Rules Module Level 3 provides the @supports at-rule and associated JavaScript API, providing a native mechanism for doing CSS feature detection. In this article we’ll give you the lowdown on how this rule works, looking at a real example in the process.
In the first article in this series, we looked at the basics of RoboHydra, the flexible test server tool for testing client-server interactions. In this — the second article — we are taking this knowledge further, looking at more complex examples that utilize RoboHydra as a mock server to send customized test responses back to your client applications.
The Network Service Discovery API enables web pages to communicate with devices advertising themselves on the network via different discovery protocols in a peer-to-peer configuration. Now you can use JavaScript to find a UPnP server locally, browse its content and send that content to a UPnP client. This article, with links to experimental builds, shows you how.
This article looks at what image post-processing is and how to use the raw WebGL API to apply real-time post-processing effects to images and other media like video, canvas, etc.
This article shows how to handle client-side error logging, a very useful practice that helps you better understand and discover issues that your users are having.
This article provides a basic introduction to Flexbox, the gifted new kid on the block with respect to CSS layouts. Here we’ll show you how the most exciting new features of Flexbox work.
This article presents a case study that specifically details solutions to some responsive design problems encountered when developing sites with WordPress, including responsive images, responsive video, and site planning.
JavaScript has allowed us to create animations on our web pages for a number of years, with JavaScript libraries making such code easier to create and more reliable cross-browser. CSS3 animations, a more recent contender, also allow us to create animations on web pages, although they are currently not quite as reliably supported cross-browser. Which one should you use? This article compares the two approaches in terms of performance and other benefits.
In the first article in this series, we looked at the basics of Robohydra, the flexible test server tool for testing client-server interactions. In this — the second article — we are taking this knowledge further, looking at more complex examples that utilize Robohydra as a mock server to send customized test responses back to your client applications.
Opera Mini is one of the world’s foremost mobile browsers, which runs on pretty much any device, even low-powered ones. It is a proxy-based browser, which has many advantages, including reducing the size of pages downloaded onto the user’s phone by up to 90%. On the downside, JavaScript can behave in unexpected ways when requested by Opera Mini. In this article we’ll discuss exactly what this means for your development work, in detail.
XMLHttpRequest is the primary technology that allows us to do Ajax-style updates to our pages — essentially, more dynamic content updates that don’t require page reloads. The XHR1 spec (and earlier versions) worked okay but had a number of shortcomings. The new version — XHR2 — addresses many of those shortcomings; in this article we’ll look at how, providing an overview and explanatory examples of all the main features.
Opera Mobile brings the Web to millions of people through their mobile phones and other non-desktop devices. Opera believes in giving people access to the full Web, and not making the distinction of a “mobile web”. To help automated mobile testing, we’ve updated the Opera Mobile Emulator so it can talk to our browser automation library, OperaDriver.
RoboHydra is a web server designed to help you write and test software that uses HTTP as a communication protocol. This article will take you through the basics of how RoboHydra works and how to install and use it at a basic level. You’ll see how to use it as a proxy for an existing site, and how you can make changes to local files and see those changes immediately reflected on the live site!
In this — the third part of Erik’s raw WebGL series — we will walk you through the creation of a more advanced shader example, culminating in a rather colourful fractal.
The WebRTC standard allows supporting browsers to stream video and audio content directly from native devices such as a webcam. One rather exciting use case for WebRTC is head tracking — detecting the movement of your head (or other appendages) in relation to a webcam — which in turn allows us to create gesture-based controls. This article looks in depth at how head tracking can be implemented.
Using the W3C’s device orientation API, we can determine the orientation of the device as well as gather information about its movement. This information is valuable in certain types of applications, such as games that require the user to tilt the device in some way. In this article we’ll look at the basics of how device orientation works, along with some simple examples.
Opera is proud to present an experimental labs release that includes support for SPDY, Google’s new networking protocol that enables performance increases across the web. Please try it out, and let us know what you think!
This article picks up where the previous article in the series left off, looking at creating a simple shader to apply a gradient to a sample shape and offset it.
The second part of a series of HTTP tutorials written by Karl Dubost. This article explores how HTTP is used to communicate between clients and servers.
The HTML5 specification includes two features for improving media accessibility — the WebVTT format, for marking up external text tracks such as subtitles and captions, and the <track> element, for applying those text tracks alongside HTML5 <video> and <audio>. This article provides a detailed introduction to both features, showing how you can make use of them in your projects today.
Responsive images is a surprisingly complicated topic, and one that’s been steadily gaining attention over the last year as more developers discover they need them and then discover there’s no good solution yet. This article aims to give an overview of the problem itself, and show the different proposals in the works to address it.
In this article we explain how transform matrices work — these involve some rather complicated math, but they are not so hard to understand when you sit down and check out a few examples! Once you understand how to put together matrices, you can use them inside the CSS transform: matrix(); and transform: matrix3d(); functions to apply transform effects to your web pages.
We’ve been working hard recently to improve the functionality available inside Opera extensions, and today we are proud to reveal some of the fruits of our labours. In this article we’ll share with you some new experimental desktop builds that feature three new extension APIs: the screenshot API, the resource loader API, and several updates to the URL filter API.
Through our site compatibility work, we have experienced that many site authors only use -webkit- prefixed CSS, thereby ignoring other vendor prefixes and not even including an unprefixed equivalent. This leads to a reduced user experience on non-WebKit browsers, as they don’t receive the same shiny effects, even although they support them. To tackle this problem, we are releasing an experimental Opera Mobile Emulator build with experimental support for selected -webkit- prefixes.
HTML5 includes the Drag and Drop API, which gives us the ability to natively drag, drop, and transfer data to HTML elements. Up until now, JavaScript libraries have commonly been used to achieve something similar. What libraries such as jQuery UI or Dojo can’t do, however, is interact with other windows, frames, and applications (to and from the file system) or access a rich drag data store.
CSS animations allow us to animate our web content, by declaring property values at different keyframes, and then applying the animations you’ve declared to the elements you want to animate. And what’s more is that they’re available in Opera 12+! In this article, we’ll walk you through the basics and look at some examples along the way.
The challenges of responsive web design go way beyond media queries and screen widths. In this article we look at some of the key issues you need to explore when embarking on a complicated web project, considering if, how and why the project should be made responsive.
When adding extensions support to our Presto engine, a lot of time was spent behind the scenes so as to make our extensions framework very versatile and lightweight, with the aim of using it on other platforms as well. Today, we’re happy to present you with an early preview of extensions running on Opera Mobile!
Responsive design is quite easy when you control everything to do with the page, and you’re working on a small and manageable site. But what about a sprawling CMS? In such circumstances, you’ll often have to rely on plugins or extensions. WordPress developer Rachel McCollin shares some of her wisdom on this very subject.
WebGL allows you to create real 3D content and render it in a web browser. This article series provides a gentle introduction to writing raw WebGL, rendering 3D creations without relying on libraries. In this part we aim to get you set up and started, concluding by running through a simple example.
Opera is proud to unveil a labs build of Opera Mobile 12, for devices built on Intel x86 architectures, which has already been run successfully on top of Android Ice Cream Sandwich.
Opera is proud to unveil a labs build of Opera Mobile 12, for devices built on MIPS architecture, which has already been run successfully on top of Android Ice Cream Sandwich.
Since our previous releases of Opera Mobile for MeeGo, we have noticed that a lot of our users have been hanging out for an official Opera Mobile build for the Nokia N9 and N950 Harmattan phones. Well, today is your lucky day – we’re happy to announce that a Labs release of Opera Mobile 11.5 for Harmattan is available for download now.
Originally published just before Christmas 2011, and now updated with a new set of builds on February 9th 2012, Opera is proud to present a new labs release featuring 64-bit builds and out-of-process plug-ins.
HTML5 web messaging provides a way for documents to share data without exposing the DOM to malicious cross-origin scripting. This article provides an introductory guide to using this new functionality, and some simple examples to get you started.
This is the first of a series of articles to teach HTTP basics, and how we can use it more effectively. In this article we will look at where HTTP cog fits in the Internet machine. HTTP is an application-level protocol on top of the TCP/IP, a communication protocol.
getUserMedia alllows access to a device’s camera and microphone. This article shows how to access the camera and demonstrates a Privacy User Interface that Opera is experimenting with. Includes moustaches and exploding cameras.
This article explores importing existing 3D models into WebGL — a much easier way to go than creating them from scratch in WebGL! The steps include exporting models from 3D packages (including Blender, SketchUp and Shade) into .obj format, converting them from there into JSON, then rendering them from there using the Three.js WebGL library.
In this article Chris Mills takes a look at techniques and technologies that we can adopt to create adaptive (or responsive) web sites, including percentage units, media queries and viewport. He also discusses some recent happenings in the area, such as considerations for display on tablet browsers, object-fit, and the @viewport CSS rule.
This article provides an introductory guide to cross origin resource sharing, or CORS, a technology allowing you to control communication and access between resources residing at different origins in a secure manner, getting around problems associated with the traditional same-origin security policy.
In this article we will look at when and how to use window.onerror, a new programmatic error handling mechanism available in JavaScript, including some examples to get you started.
The newest version of ECMAScript to get widespread browser support, ES5, brings with it many useful changes from ES3 and new additions to the language. In this introductory article we’ll review these, showing what is available.
This article introduces the HTML5 custom scheme and content handlers, showing how you can employ them to allow use of custom content types on your sites.
Mapping applications are very popular, and it is easy to embed a simple map on a page using something like the Google Maps API. In this article we are going to show how to build a fully fledged SVG-based, windowed mapping application using the Pergola framework and its libraries, with the Polymaps library plugged in, and tiles imported from Bing.
Building on the famous exploding video demo by Sean Christmann, we’re going to see how we can explode the video stream from a camera. With a few performance tweaks, this works surprisingly well both in desktop browser and on mobile devices.
This is the first in our series of articles about WebGL. The objective of this series is to provide the information and resources you’ll need to get started learning WebGL. In this piece, we will discuss how WebGL works, what you need to create WebGL applications, and what a simple example looks like.
Opera Mini uses a number of custom, unregistered HTTP headers. Most of these are specific to Mini, and are sent in addition to the regular HTTP headers sent by Opera on any platform. “But what are they, and what can I do with them?” I hear you cry… Let’s find out.
The HTML5 history API - supported in Opera 11.50+ - provides a means to perform tasks such as moving forward and backward in the session history, adding new entries into the history, and so on. In this article we’ll look at the API’s basic syntax along with a simple example to show you what’s possible.
HTML5 includes a means to set custom attributes on elements using the data- prefix. Called “data attributes”, they can be scripted to define and store data as well as increase options for attribute selection when styling with CSS.
The W3C file API provides a way to load files into the browser and find out information about them, such as size, type, etc., as well as manipulating their contents. In this article Bruce Lawson takes you through the current partial implementation of the File API available in Opera 11.10 final.
To make applications run fully offline, we should make ourselves familiar with three very interesting technologies: The HTML5 Application Cache, Web Storage and WebSQL Databases. This article looks at al three, showing how they can be used together to create an effective offline application.
Support for the viewport <meta> tag in Opera’s mobile products has been around for quite some time — in Opera Mobile 11, we have made our viewport implementation more robust, added support for new mechanisms to deal with different screen densities, and included an implementation of our own @viewport rule proposal. So, what better time than now to give you an introduction to the various viewport related mechanisms you can use to optimize your site for mobile.
Multiple column design that allows text to flow naturally from column to column depending on width and other parameters has proven invaluable in print design, crossing languages, cultures and a range of media. The good news is that now it is coming to web design, courtesy of the CSS3 Multi-column Layout Module. In this article we show you how to get to grips with it.
This article introduces the new Web Open Font Format or WOFF, explaining the benefits of WOFF, showing where to download and create WOFF font packages and presenting two WOFF demos.
Want to put video onto your web page? HTML5 enables us to do this as easily as placing images with an <img> element – and in this tutorial, we’ll show you how the magic is done.
This article presents a detailed set of guidelines for optimizing web content for viewing on Opera Mini. It covers a complete range of topics, including HTML, CSS, JavaScript, design considerations and more.
HTML5 brings two new things to the table: new APIs that add essential new features to the open standards web development model, and new structural elements that define specific web page features with much more accurate semantics than were available in HTML 4. This article looks at how the new semantic elements were chosen, what the main new features are and how they are used, how headings work in HTML5, and browser support for these new elements, including how you can support them in older browsers.
HTML5 includes many new features to make web forms a lot easier to write, and a lot more powerful and consistent across the Web. This article gives a brief overview of some of the new form controls and functionalities that have been introduced.
Cristian returns this week with another detailed look at custom HTML5 <video> players! Following on from his last article, he shows us how to make a much more accessible, while still visually appealing, video player including WAI-ARIA support, captions, transcripts, and more.
The beta release of Opera 11 debuts our support for Web Sockets. In this article we will explain the background to Web Sockets, show why it is a cool feature, and give you some simple usage examples to get you up to speed.
In this article, Corey Mwamba shows you how to create an inspiring horizontally scrolling interface using only CSS, with some clever use of CSS3 transitions and the :target pseudo-class.
If you play around with the HTML5 <video> element for any significant length of time, you may well run into a problem with inconsistently firing events: sometimes you don’t seem to get some events, and sometimes it behaves differently depending on whether you’re testing locally or over the network. This article explores the problem, and puts forward some solutions.
The number of people with cognitive disabilities using the Web is comparable to those with visual impairments using the Web, yet the factors involved in making sure a web site is accessible to those with cognitive disabilities are much less well understood. In this article well will redress the balance, giving you a gentle introduction to the area of web accessibility for cognitive disabilities.
Everyone wants to make their sites “mobile friendly” these days — the mobile web market is becoming big business. This article takes you through the different available strategies for making your websites mobile browser compatible, sharing many tips and tricks along the way.
In this article we make full use of the HTML5 video element and associated media elements API — along with jQuery and some CSS3 magic — to make a fully-customizable, themeable HTML5 video player. To round things off, the player is encapsulated as a jQuery plugin for easier reuse.
CSS3 box-shadow is a very useful property — creating drop shadows programmatically can save web designers a lot of time in image editing software. However we have a problem if we need to replicate those shadows in Internet Explorer, which does not support this property. In this article, we present a cross-browser solution that uses box-shadow in supporting browsers, and IE filters to fake the drop shadows in IE.
In this article Trygve Lie takes you through the basics of the HTML5 <audio> element, then uses jQuery and jPlayer to build a cross-browser radio player based on <audio> with a Flash fallback. As a final step, he converts the player into an Opera Widget for added cross-device appeal.
In this article you will meet Web Workers, one of many technologies that, together with HTML5, are forming the next generation of the open web. Web Workers allow you to create separate processes in your JavaScript to deal with number crunching, while your main process remains as responsive as possible for the users of your applications.
In this article, Opera Web Evangelist Shwetank gives you a guide to the W3C Geolocation API, which is newly-supported in our Opera 10.60 beta release. Find out how to add location awareness to your Web apps for a lot of interesting possibilities!
Creating expanding and collapsing (or show and hide) content on websites used to be the domain of JavaScript, but in modern times we can recreate such functionality without JavaScript, using a combination of :focus, and CSS3 opacity and transitions. In this article, Corey Mwamba shows you how.
Today is a very significant day for the Web. WebM, a new, high-quality, free, and open video format is now available, and Opera has released Labs builds that support this format in HTML5 <video>. In this article, we look at some examples, how this came about, why it is such a good thing, and what the technical details look like.
CSS3 shadows and rounded corners are easy to understand at a basic level, but what if you want to start using them in more advanced UI styling, such as textured buttons and semi-transparent glass effects? In this article Opera designer Jan Henrik Helmers hows you how to create these UI features and more, using CSS3 features, and no images whatsoever.
With generated content, developers can easily add decorative text and images to their pages directly via CSS. In this article we look at the basics of CSS generated content and give a few interesting examples of where it can be used.
This article builds on our previous HTML5 <video> publications by offering deep coverage of the functionality available in the <video>/<audio> API, a detailed reference of <video> and <audio> attributes, and guidance on codecs, and creating video/audio suitable for use with these elements.
This article gives you an introduction to <video> and some of its associated APIs. We look at why native video support in browsers is important, give an overview of the element’s markup, and outline the most important ways in which video can be controlled via JavaScript.
In this article Mihai Sucan explores the differences between SVG and Canvas and presents a few examples to help you decide which one is best for the functionality you are trying to implement.
The HTML5 <video> element provides a fantastic way to embed video into web pages without relying on plugins, and it is now supported in Opera, Firefox and Chrome, so things are looking up. One burning question however is “how do we provide alternative content for users that either can’t see, or can’t hear the video?” In this article, Bruce Lawson looks at the issue and suggests a solution.
In this article, you’ll learn about CSS3 transitions and transforms (as well as their SVG and SMIL corollaries), all of which are supported by Opera versions 10.50 and later.
Opera 10.50+ comes with support for the CSS3 Backgrounds and Borders specification. Amongst them are border-radius, border-image, multiple backgrounds and box-shadow. Opera 10.60+ updates this support with box-decoration-break and an updated background shorthand. We’ll showcase all these and more through examples and explanations.
The default HTTP error pages served up by a web server such as Apache will not be very helpful to your site’s visitors, should they ever be unlucky enough to stray across them. In this article, Stuart Colville shows you how to add custom error pages to your web site, and design them so that they draw your site visitors back into your site, for example to related articles.
This guide explains how the RGB (Red, Green, Blue) and HSL (Hue, Saturation, Lightness) color models work, and how web designers can make clever use of them in CSS to improve their designs, and make more logical color scheme choices. It also looks at the alpha channel, and how that can also be beneficial.
In this - the third article of his series on the business of software development - R Blank lifts the lid on scheduling with a detailed look at creating task- and resource- based project plans, buffering in case unexpected surprises crop up, and more.
There is increasing interest in, and importance being laid upon, making modern dynamic web applications more accessible. New specifications such as WAI-ARIA and HTML5 provide the means by which to do this; in this article Gez Lemon presents a solution for implementing accessible drag and drop functionality using JavaScript and WAI-ARIA. Some discussion of HTML5 drag-and-drop features is also included for good measure.
In this article, security expert Gareth Heyes details some of the more interesting JavaScript hacks he has uncovered while focusing on browser security. The knowledge presented here should give you some insights on making your web applications more secure.
In this article, Christopher Schmitt follows up his hCard introduction by showing us how add some style to hCards, to make them fit nicely into a page design.
Looking for some practical implementations of HTML5 Canvas? Look no further. This article takes you through Mihai Sucan’s first development steps at creating a Canvas-powered online painting application. In this article he sets up the basic environment, shows how to make the event interactions work and implements some of the basic drawing tools.
In this, the second part of Jacob Seidelin’s series on creating games using HTML 5, JavaScript, canvas and raycasting, he takes the game put together in Part 1, and adds better collision detection, performance improvements, scenery and enemies to chase you!
In this article, Christopher Schmitt follows up his hCard introduction by showing us how add some style to hCards, to make them fit nicely into a page design.
In this article, we have the pleasure of introducing you to Raphaël, a JavaScript API for SVG that not only allows you to write SVG functionality using JavaScript code, but also provides support for SVG in IE, by emulating it in VML. This is a great tool for introducing more people to the power of SVG, and we’d like to wish it every success.
HTML5 canvas is a powerful, flexible way to create two dimensional graphics on web pages using scripting, and a number of previous dev.opera.com articles have demonstrated usage of it already. This article goes back to basics, giving beginners a starting point to work from and explaining the basics. Get drawing!
Jacob Seidelin has a lot of exciting tricks up his sleeve, with regards to creating games using HTML5 <canvas>. This week we are lucky enough to have him sharing some of his techniques with us, in the shape of some code for creating pseudo-3D first-person perspective games using canvas and raycasting.
Google Maps is a fantastic API for adding powerful mapping functionality to your web applications quickly, but the accessibility leaves a little bit to be desired. In this article, Patrick Lauke shows how to construct a solution to improve things, adding keyboard accessibility to Google Maps.
Barcodes are becoming vastly more interesting in recent times, with 2D barcodes allowing you to represent anything from URLs to invoices, which in turn allows us to connect physical images to applications in all kinds of interesting ways. In this article Brian Suda discusses the history of barcodes, what’s available today for creating and reading barcodes, and real-world use cases.
In this article David Storey looks at how to use CSS counters to provide robust sequential numbering for reoccuring HTML elements such as list items or paragraphs.
In this article Chris Mills gives the lowdown on OBML, the one of the main technologies behind Opera Mini, which is also available in the Opera Devices SDK 9.6.
In this article, Christopher Schmitt carries on his detailed exploration of what CSS3 has to offer us, looking at CSS3 attribute selectors that allow us to write selectors matching strings of text inside attribute values.
In this article, Craig Grannell builds on his previous article to take us through the basics of actually laying out pages on a grid. It’s packed with essential tips.
Another article in Craig Grannell’s fabulous series on design basics. In this article Craig gives us the lowdown on grid design basics - how to create a baseline grid in CSS, and how to position text on screen using it, with distances measured in both pixels and ems.
The elephant in the corner of modern web development has been Ajax accessibility.The W3C has been working on a new technology called ARIA - Accessible Rich Internet Applications - that provides a way for “Web 2.0” developers to bridge the gap between desktop-like interaction and accessibility.When I was reading up on ARIA, I found that I couldn’t see the big picture because the specifications focus on the detail. So we asked Gez Lemon of The Paciello Group, Juicy Studio and the Web Standards Project’s Accessibility Task Force to write us an overview that would help developers understand what ARIA is, why it’s important, and how they can use it right now to help users with disabilities.
This is the second in a series of articles written by R Blank giving practical advice on the business side of freelancing, including project management, contracts, budgeting and more. In this part he discusses budgeting, hot root vegetables and why working with new tech is similar to being a test pilot.
In this article Hallvord Steen provides a warning about browser sniffing and why it is such a bad thing, by examining a recent bug discovered in Opera relating to compatibility with the TinyMCE editor. He also suggests a fix to this problem, involving “bug detection”, a useful technique that can be applied to many other situations.
This is the first in a series of articles written by R Blank giving practical advice on the business side of freelancing, including project management, contracts, budgeting and more. In this part he discusses pricing.
Wanna add some polish to your site, the standards way? In this article Erik shows how you can save time and money on creating graphics and effects programmatically using SVG instead of doing them all manually using Photoshop.
In this article Christopher Schmitt explores a couple of great new CSS design properties available in CSS3 - text-shadow for creating drop shadows, and background-size for automatically resizing background images as the browser window changes size. Exciting stuff indeed!
Adding Microformats to your markup is great for adding semantic value, and then performing tasks like pulling out hCards and adding them to address books, but is that all there is to them? Certainly not! In this article, Brian Suda shares some ideas for doing so much more with them.
If you’re working in a web development team with developers alongside designers, and you want to give the designers an easy way to change the variable parts of the application without the risk of breaking things, an external configuration file is a great idea, and JSON (JavaScript Object Notation) is a perfect format in which to store this data. In this article, Gareth Rushgrove shows you how.
To really make a splash on the Web, video needs an open solution that can easily be integrated into web pages without the need for proprietary plugins. The HTML5 <video> element and Ogg Theora can provide this, and Opera is proud to announce an experimental build that suppports it. So read this article, and download and play with it today.
Blob Sallad is a fun little experiment put together to show some of the capabilities of the HTML5 canvas element, when combined with some JavaScript physics simulation. You can play with it at blobsallad.se, and read about how it works in this exclusive double-length article, written by its creator, Björn Lindberg.
