Menu Search
Jump to the content X X
Smashing Conf Barcelona

You know, we use ad-blockers as well. 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. our upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.

“Why We Didn’t Use A Framework” (Case Study)

When we set out to build MeetSpace (a video conferencing app for distributed teams), we had a familiar decision to make: What's our tech stack going to be? We gathered our requirements, reviewed our team's skillset and ultimately decided to use vanilla JavaScript and to avoid a front-end framework.

“Why We Didn’t Use A Framework” (A Case Study)

Using this approach, we were able to create an incredibly fast and light web application that is also less work to maintain over time. The average page load on MeetSpace has just 1 uncached request and is 2 KB to download, and the page is ready within 200 milliseconds. Let's take a look at what went into this decision and how we achieved these results.

Read more...

Introducing Mavo: Create Web Apps Entirely By Writing HTML!

Have you ever wanted to make a website that non-technical folks can edit right in the browser? Or have you ever wanted to make a website that presents an editable collection of items (e.g. your portfolio)? Or simply upload images to a website you made, right from the browser?

Introducing Mavo: Create Web Apps Entirely By Writing HTML!

Well, what if I told you, that you can do these things (and more!), just with HTML and CSS? No programming code to write, no servers to manage. You can make any element editable and saveable just by adding one HTML attribute to it. In fact, you can store your data locally in the browser, on Github, on Dropbox, or any other service just by changing an HTML attribute.

Read more...

Advertise with us!

Fluid Responsive Typography With CSS Poly Fluid Sizing

Fluid layouts have been a normal part of front-end development for years. The idea of fluid typography, however, is relatively new and has yet to be fully explored. Up until now, most developers' idea of fluid typography is simply using Viewport units maybe with some minimum and maximum sizes.

Fluid Responsive Typography With CSS Poly Fluid Sizing

In this article, we are going to take it to another level. We are going to examine how to create scalable, fluid typography across multiple breakpoints and predefined font sizes using well-supported browser features and some basic algebra. The best part is that you can automate it all by using Sass.

Read more...

Web Development Reading List #182: IPFS Wikipedia, New Webpack CLI, And CSS Grid Breakout

When did you take your last vacation? For many of us, it was probably a long time ago. However, since quite a while, I stumble across more and more stories about companies that take unusual steps vacation-wise. Companies giving their employees a day off each week in summer or going on vacation together as a team building event instead of traveling somewhere just to work.

Web Development Reading List 182

But while there’s a new generation building their dream work environments, a lot of people still suffer from very bad working conditions. They work long hours and are discriminated or harassed by colleagues or their managers. And just this week, I heard that many company owners are desperate because “Generation Y” doesn’t want to work long hours anymore.

Read more...

How To Create Native Cross-Platform Apps With Fuse

Fuse is a toolkit for creating apps that run on both iOS and Android devices. It enables you to create apps using UX Markup, an XML-based language. But unlike the components in React Native and NativeScript, Fuse is not only used to describe the UI and layout; you can also use it to add effects and animation.

How To Create Native Cross-Platform Apps With Fuse

Styles are described by adding attributes such as Color and Margin to the various elements. Business logic is written using JavaScript. Later on, we’ll see how all of these components are combined to build a truly native app.

Read more...

An Abridged Cartoon Introduction To WebAssembly

There's a lot of hype about WebAssembly in JavaScript circles today. People talk about how blazingly fast it is, and how it's going to revolutionize web development. But most conversations don't go into the details of why it's fast. In this article, I want to help you understand what exactly it is about WebAssembly that makes it fast.

An Abridged Cartoon Introduction To WebAssembly

But first, what is it? WebAssembly is a way of taking code written in programming languages other than JavaScript and running that code in the browser.

Read more...

Basic Patterns For Mobile Navigation: Pros And Cons

Once someone starts using your app, they need to know where to go and how to get there at any point. Good navigation is a vehicle that takes users where they want to go. But establishing good navigation is a challenge on mobile due to the limitations of the small screen and the need to prioritize content over chrome.

Basic Patterns For Mobile Navigation: Pros And Cons

Different navigation patterns have been devised to solve this challenge in different ways, but they all suffer from a variety of usability problems. In this article, we’ll examine five basic navigation patterns for mobile apps and describe the strengths and weaknesses of each of them. If you’d like to add some patterns and spice up your designs, you can download and test Adobe XD for free and get started right away.

Read more...

Intrusive Interstitials: Guidelines To Avoiding Google’s Penalty

In 2015, Google announced that mobile searches surpassed desktop searches in at least 10 countries. 56% of traffic on major websites comes from mobile. In light of this, Google’s decision to improve the mobile user experience by various means, such as AMP pages and a dedicated mobile index, comes across as a sound business move.

Intrusive Interstitials: Guidelines To Avoiding Google's Penalty

More than half of the 2 trillion searches Google processes each year come from mobile devices. Mobile devices have changed the way we approach search, ushering in new types of habits such as local search, voice search and more. These consumer habits have greatly affected the way search engine providers think about user search intent.

Read more...

From Idea To Development: How To Write Mobile Application Requirements That Work

Why write requirements? Well, let's imagine you want to produce a mobile app, but you don’t have the programming skills. So, you find a developer who can build the app for you, and you describe the idea to him. Surprisingly, when he showcases the app for the first time, you see that it is not exactly what you want. Why? Because you didn’t provide enough detail when describing the idea.

From Idea To Development: How To Write Mobile Application Requirements That Work

To prevent this from happening, you need to formalize the idea, shape it into something less vague. The best way to do that is to write a requirements document and share it with the developer. A requirements document describes how you see the result of the development process, thus making sure that you and the developer are on the same page.

Read more...

Web Development Reading List #181: Mass Deployments, Prepack, And Accessible Smart Cities

In a world between building accessible interfaces, optimizing the experiences for users, and big businesses profiting from this, we need to find a way to use our knowledge meaningfully. When we read that even the engineers who built it don’t know how their autonomous car algorithm works or that the biggest library of books that mankind ever saw is in the hand of one single company and not accessible to anyone, we might lose our faith in what we do as developers.

Web Development Reading List 181

But then, on the other hand, we stumble across stories about accessible smart cities or about companies that embrace full honesty in their culture. There are amazing examples of how we can pursue meaningful work and build a better future. Let’s not let negative news get us down, but let’s embrace them as a reason to change for the better instead.

Read more...

Finding Inspiration In The Little Things Around Us

Can you believe it is May already? Time flies! Here in Belgium, spring has arrived and has brought along its bright colors, the delicate odours of blooming flowers, as well as the cheerful chirping of birds. I try to soak it all in as this is my favorite time of the year.

Finding Inspiration In The Little Things Around Us

On a related note, if we only looked closer, we would find gems of inspiration in the things around us. For me, nature is my personal and biggest gem. What's yours?

Read more...

From Small CSS Tricks To Great Design Mysteries: SmashingConf Barcelona 2017

In the brave new responsive web, previously established techniques are getting revised and abandoned. Design workflow changes. Front-end solutions adapt. Performance optimizations get refined and creative, holistic design thinking is required more than ever. It isn't easy to keep up with all those changes, and that's where our community conferences come into place. To the early-bird-tickets →.

SmashingConf Barcelona 2017

In Barcelona, we'll explore new front-end challenges, UX strategies and design patterns that you can apply to your work right away. No fluff, no theory: just hands-on, practical and on point — things that worked well in real-life projects, with talks and workshops by practitioners from the industry.

Read more...

↑ Back to top