Menu Search
Jump to the content X X
Smashing Conf San Francisco

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf San Francisco, dedicated to smart front-end techniques and design patterns.

Posts Tagged ‘HTML’.

We are pleased to present below all posts tagged with ‘HTML’.

Case Study The Evolution Of The BEM Methodology

This case study is about the evolution of the BEM, a methodology that enables team members to collaborate and communicate ideas using a unified language that consists of simple yet powerful terms: blocks, elements, modifiers.

The History Of The BEM Methodology

Learn about the challenges that a big company faces when gradually building an entire ecosystem of services with an ever-growing team of developers.

Read more...

Maintainable Code Using White Space For Readability In HTML And CSS

Right up front, I’ll offer some simple advice: In production, your code should be as performance-friendly as possible. This means, Gzip’ing, concatenating and minifying as many assets as possible, thus serving the smallest possible files and the least number of files.

Using White Space For Readability In HTML And CSS

I don’t think anyone would argue that these suggestions aren’t best practices (even if we don’t implement them in every project). Now that we’ve got that out of the way, how can we use white space in development code to ensure that our files are as readable and maintainable as possible?

Read more...

From The Server To The Client Client-Side Templating

Using templates in the browser is becoming more and more widespread. Moving application logic from the server to the client, and the increasing usage of MVC-like patterns (model–view–controller) inspired templates to embrace the browser.

Client-Side Templating

This used to be a server-side only affair, but templates are actually very powerful and expressive in client-side development as well. In general, leveraging templates is a great way to separate markup and logic in views, and to maximize code reusability and maintainability. With a syntax close to the desired output (i.e. HTML), you have a clear and fast way to get things done.

Read more...

Opinion Column The Road To Reusable HTML Components

A few weeks ago, I dug up an old article that I wrote for Smashing Magazine, “When One Word Is More Meaningful Than a Thousand.” While I stand firmly behind all of the HTML development principles I listed back then, the article lacked one important thing: hands-on examples.

The Road To Reusable HTML Components

Sure enough, the theory behind component-based HTML is interesting in its own right, but without a few illustrative examples, it’s all very dry and abstract. Not that HTML enthusiasts should shy away from that (on the contrary, I would say), but there’s nothing like a good example to clear up some of the finer points of a concept.

Read more...

Resolution Independence Towards A Retina Web

With the recent announcement and release of the Retina Macbook Pro, Apple has brought double-density screens to all of the product categories in its current lineup, significantly paving the way for the next wave of display standards.

Towards A Retina Web

While the fourth-generation iPhone gave us a taste of the “non-Retina” Web in 2010, we had to wait for the third-generation iPad to fully realize how fuzzy and outdated our Web graphics and content images are.

Read more...

Classes? Where We’re Going, We Don’t Need Classes!

Classes, classes, classes everywhere. What if we don’t need CSS classes at all? What if we stopped worrying about how many classes we’re using and what we should be calling them and just finished with them once and for all? It would be no revelation to you to say that HTML elements can be styled without recourse to the class attribute, but have you considered the multitude of benefits that come from forgoing classes altogether.

Classes? Where We're Going, We Don't Need Classes!

In this article, we’ll demonstrate that the class is as antiquated and inappropriate for styling as the table is for layout, and that omitting them can discipline us to create more usable, reusable content. I appreciate that this is a contentious subject; I’ll meet you in the comments.

Read more...

Useful jQuery Function Demos For Your Projects

Every aspiring web developer should know about the power of JavaScript and how it can be used effectively to enhance the ways in which see and interact with web pages. Fortunately, to help us be more productive we can use the power of JavaScript Libraries and this article we will take a good look at jQuery in action.

50 jQuery Function Demos for Aspiring Web Developers

In a nutshell, jQuery is a leading JavaScript Library that can perform wonders with your web pages and makes your web development life much easier and more enjoyable. The rise in popularity of jQuery since its arrival in 2006 has seen an estimated over 24 million websites (50% of the 10,000 most visited websites) currently reaping the benefits and as Google Trends suggests it's the popular JavaScript Library of choice.

Read more...

Develop A One-Of-A-Kind CSS / JS-Based Game Portfolio

A portfolio is a must-have for any designer or developer who wants to stake their claim on the Web. It should be as unique as possible, and with a bit of HTML, CSS and JavaScript, you could have a one-of-a-kind portfolio that capably represents you to potential clients.

Develop A One-Of-A-Kind CSS/JS-Based Game Portfolio

Before getting down to business, let’s talk about portfolios. A portfolio is a great tool for Web designers and developers to show off their skills. As with any project, spend some time learning to develop a portfolio and doing a little research on what’s going on in the Web design industry, so that the portfolio presents you as an up to date, innovative and inspiring person. All the while, keep in mind that going with the flow isn’t necessarily the best way to stand out from the crowd.

Read more...

How To Build A Real-Time Commenting System

The Web has become increasingly interactive over the years. This trend is set to continue with the next generation of applications driven by the real-time Web. Adding real-time functionality to an application can result in a more interactive and engaging user experience.

How To Build A Real-Time Commenting System

However, setting up and maintaining the server-side real-time components can be an unwanted distraction. But don't worry, there is a solution.

Read more...

↑ Back to top