What does Gutenberg bring to the future of WordPress? In this article, Leonardo Losoviz will analyze several implications of building sites through a component-based architecture and through Gutenberg (as the implementation), including what new functionalities it can deliver, how much better it can integrate with current website development trends, and what it means to the future of WordPress.
Read more…
Attribute selectors are magical. They can get you out of sticky problems, help you avoid adding classes and point out some problems in your code. But don’t worry, while attribute selectors are complex and powerful, they’re easy to learn and easy to utilize. In this article, John Rhea will discuss how they operate and give you some ideas about how to use them. By the end of this article, you’ll use them to run diagnostics on your site, fix otherwise unsolvable problems, and generate technologic experiences so advanced they feel like magic.
Read more…
Building websites is hard. Being user-focussed, having a progressive enhancement mindset, and thinking things through from the beginning can have a real impact on both the speed and quality of delivery. In this article, Shane Hudson is going to explore building a text box, in an exaggeration of situations many of us often find ourselves in. Hopefully, by the end of this article, you can all feel more emphatic to how the journey from start to finish is rarely linear.
Read more…
Developers conduct AB tests, accessibility audits, unit tests and cross-browser checks. Once you’ve solved a problem, you don’t want to repeat that effort. By building a reusable component library, we can continuously utilize past efforts and avoid revisiting already solved design and development challenges. In this article, Oliver Williams looks at augmenting HTML with components that have built-in functionality and styles. He’ll also show you how to make these custom elements reusable across projects using NPM.
Read more…
In this tutorial, you will build a sci-fi ID card for Avengers. Today, Kunal Sarkar will teach you Flexbox, Nested Flexbox, CSS animations, and a ton of other CSS techniques while building this interesting project. You will learn an effective way of making a full-page background, centering elements with Flexbox and auto margins, and see the basic usage of Flexbox and nested Flexboxes to make single dimension layouts. Let’s get started!
Read more…
It’s incredible to see how far web standards have come. Flash was one of the reasons a lot of folks started building websites. Flash was one of the reasons Simon Owen started building websites. It pioneered in a lot of areas, and this led to people creating amazing things with it. Over the years, it’s pushed the web forward a great deal. Adobe’s official announcement of dropping support of Flash, though, does raise concerns. Here are some of the groundbreaking things Flash could do back then, and how we can go about doing them today.
Read more…
Did you know that you can incorporate Vue into your project the same way that you would incorporate jQuery — with no build step necessary? Let’s cover some common use cases in jQuery and how we can switch them over to Vue, and why we’d even want to do so. In this article Sarah Drasner shows you that Vue is also a pretty nice abstraction for small sites that don’t need a lot of overhead. Due to Vue’s flexibility, it’s also easy to transition this code to a build step and component structures if you’d like to adopt a more complex structure over time. It’s actually pretty fun to try it out!
Read more…
In order to really know whether your work is any good, you need a higher level of principles that can be used as a measuring stick for implementing design. You need something that is removed from a specific language like CSS or an opinionated way of writing it. To bridge this gap, Tom Greever’s compiled nine principles of design implementation. This is a set of broad guidelines meant to preserve an underlying value. It can be used as a guide for someone working on implementation or as a tool to evaluate an existing project. To make it easier to follow along and see how each principle applies to a project, Tom will use a design mockup from one of his projects as the basis for this article.
Read more…
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? In this article Lea Verou will show 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…
In this article, Lea Verou explains what an HTML API is, why they’re useful, and which important lesson developers can learn from them. Keep reading to find out how to design a good one. You might be wondering, “All HTML and CSS authors know JavaScript, right?” Wrong. Take a look at the results of following poll.
Read more…
