Group items tagged

Three specifications that we’ll likely find ourselves using in the future are: “Flexbox4,” “Regions5,” “Grid Layout6.”

Magic numbers in CSS are best avoided.

We need fewer of these HTML containers and more CSS virtual container classes that we can apply to different elements as needed. In other words, instead of this… <div id="container"> <div>Content here</div> <div>Content here</div> <div>Content here</div> </div> … we need more of this: <div class="container">Content here</div> <div class="container">Content here</div> <div class="container">Content here</div>

According to IDC, mobile web browsing will soon eclipse desktop browsing in the U.S. and worldwide. This consumption of mobile content isn’t just happening on the go; 93% of people are now using their mobile devices to browse the Web from their homes, according to a study from Google.

The main development methodology behind responsive design is the use of media query functionality in CSS3. Media queries target not only certain device types (e.g., Android vs. iPhone), but actually inspect the physical characteristics of the device that renders the page. For example, the code below “asks” the device if its max horizontal resolution is equal to 480px: <link rel="stylesheet" type="text/css", media="screen and (max-device-width: 480px)", href="http://uxmag.com/iphone.css" /> If it is 480px, the device will load iphone.css. If not, the link is ignored. You can also include media queries in CSS as part of an @media rule:

a responsive design approach does not involve putting all of your content in front of the reader. Responsive design is about putting the right content in users’ hands according to the context of their interaction.

The average top 1,000 web page is 1575 KB.

Page growth is a major reason why we keep finding, quarter after quarter, that pages are getting slower. And faster networks are not a cure-all for the challenges of page bloat.

According to Akamai’s most recent quarterly State of the Internet report, the global average connection speed among the top 50 internet-using countries is 3.3 Mbps — a 5.2% increase over the previous quarter. But when we’re seeing year-over-year page growth ranging from 45-50%, it’s easy to see that the gap is widening.

Google’s launch partner for this service is Forbes, but others can implement these recommendations by just adding a single line of code to their mobile sites.

These recommendations, Sternberg told me, are based on social recommendations on the site from your friends on Google+ (only if you are signed in, of course), what the story you just read was about, the story’s author and some of Google’s “secret sauce.”

The new Google+-based recommendations, interestingly, only appear once a reader slides back up on a page. This, Google’s analytics show, is a pretty good indicator that a user has finished reading a post (even if there is still more text left on the page). The recommendation widget then slides up from the bottom and one extra click brings up more relevant items for the page. The other option is to show the widget after a user scrolls past a configurable CSS entity.

The new laptop, which Apple unveiled last week, already has Web designers and developers trying to figure out how they're going to create sites and Web apps that look good on the new machine without leaving the rest of the Web's population behind.

One of the key advantages of these high-resolution displays is their crisp, highly readable rendering of text. That particular buck stops with the Web browsers, which are much more varied on the desktop than on mobile devices. Naturally, Safari supports retina-friendly text, but Chrome is still working on it, and other browsers will presumably follow.

For image-heavy sites, swapping out higher-resolution images can have a substantial impact on page load, which in turn affects user experience and even search engine rankings. 

In 2014, the mobile Web will die. That’s right, that bastardized version of the normal Web will crawl into a shallow grave and leave us all in peace. No more websites crippled with horrible “mobile.yourawfulwebsite.com” URLs. No more reading janky websites that display way too much fine print or omit crucial features when viewed on your smartphone or tablet. 

The mobile Web will die because the companies that make the engines it ran upon are killing their mobile browsers and replacing them with fully functional versions that run on any device. In 2014, these browsers will be updated to put the final nail in its coffin. In turn, developers will continue to build websites that can work across any screen size. Responsive design (what we do at ReadWrite to make the site look pretty everywhere) will continue to grow in 2014 as people realize that their old websites are losing them a lot of traffic from mobile devices.

Location-based consumer apps didn't let me down; as predicted, they remained stagnant this year. Foursquare and its kindred just are not hot anymore, even if Foursquare did just raise a funding round this week.