Hard Costs of Third-Party Scripts - daverupert.com
Dave looks at the real costs of third party scripts and their impact on your site. He covers off issues including DNS lookups, CPU work, Network Connectivity, Battery impacts and a few more.
article  performance  331  newslettered 
yesterday
Negative Grid Lines in CSS Grid
Negative grid lines in CSS can be a valuable tools when you want to always go to the extreme for your grid placement, but when your grid structure might change fro time to time.
newslettered  331  tutorial  grid  layout 
yesterday
Understanding the difference between grid-template and grid-auto
With all the new properties related to CSS Grid Layout, one of the distinctions that always confused Ire was the difference between the grid-template-* and grid-auto-* properties.... so she wrote about it and now you don't need to be confused.
newslettered  331  tutorial  layout  grid 
yesterday
Fancy Border Radius Generator
Generate some cool objects with this 8 point border radius tool
rwd331  tools 
yesterday
AddyOsmani.com - Start Performance Budgeting
If you're building a web experience and want to stay fast, a performance budget can be critical. For success, embrace performance budgets and learn to live within them. Network & CPU limits on mobile can require asking hard questions like, "what is really important to my users?"
article  performance  331  newslettered 
yesterday
Lazy Loading Images with Vue.js
If you're building an app using Vue.js you can take advantage of the Intersection Observer and serve your images in a lazy fashion using Directives
newslettered  331  tutorial  performance  javascript  images 
yesterday
The #1 Photoshop, Lightroom, and Photography Tutorials Website Online
I was lucky enough to meet Aaron Nace while I was at the Max conference who turns out to be a really big deal in the Photoshop community. If you're looking to up your Photoshop skills then Aaron has a whole bunch of free tutorials to get you going (and his paid stuff is even better).
newslettered  331  tutorials 
yesterday
What You Missed from Sneaks at MAX 2018 | Adobe Blog
This year at SNEAKS they made a huge splash! Sneaks is the part of the Max conference where the development teams for the products build something they think will make a difference to the users. This year my favourites were Brush Bounty, a brush effect that can paint animations directly into your artwork (and even be controlled by live data... imagine your art work having rain when the weather is rainy...), Fantastic Fold which allows you to drop artwork on a folded piece of paper and work out the positioning for you, and Moving Stills which take a 2D image and make them almost appear 3d video.
article  adobe  331  newslettered 
yesterday
Adobe augmented reality (AR) software
Adobe have a new internal product that is in early access at the moment called Project Aero. They've partnered with Apple to help try and bring the power of AR into the hands of creators like you and I. I've been working on an AR experience along side the Solar System notebooks we produce, I'm hoping this can help make it easier to create.
article  adobe  tools  331  newslettered 
yesterday
Introducing Voice Prototyping in Adobe XD
Adobe XD is quickly becoming the ultimate visual design and prototyping tool. Sketch had a huge head start on XD, but it is catching up fast and has taken huge leaps and bounds towards leading with the addition of Voice prototyping available now. With voice being one of the largest growing areas, as designers we need to consider how we're going to deliver on this new medium.
article  adobe  331  newslettered 
yesterday
I have resigned as the WordPress accessibility team lead. Here is why. - Rian Rietveld
For those of you that have accessibility requirements and are using Wordpress as your content creation tool there's some bad news on the Gutenberg front.
article  331  newslettered 
yesterday
CSS Border-Radius Can Do That? | IO 9elements
When you use eight values specifying border-radius in CSS, you can create organic looking shapes. WOW.
newslettered  331  tutorial 
2 days ago
Typekit is Adobe Fonts
No more sync limits. Just activate all the fonts you need. You’ve already paid for them with your Creative Cloud plan.
To bring Typekit under the same branded roof as Adobe it has now been renamed Adobe Fonts (with a spiffy new website too). It's not just a name change either, now there are
- No more sync limits. Just activate all the fonts you need. You’ve already paid for them with your Creative Cloud plan.
- No more web font pageview and domain limits.
- No more “web-only” fonts. All the fonts in our library are available for use on both the web and on the desktop.
article  adobe  font  331  newslettered 
2 days ago
CSS Layout cookbook - CSS: Cascading Style Sheets | MDN
The CSS layout cookbook aims to bring together recipes for common layout patterns, things you might need to implement in your own sites.
newslettered  330  tutorial 
8 days ago
Microsoft Edge web platform features status and roadmap - Microsoft Edge Development
As of Edge buildnumber 17763+ Microsoft edge is now supporting the WebP image format (along with Chrome and Opera.... come on Firefox and Safari!)
newslettered  news  330  article 
8 days ago
Why don’t we add a <lovely> element to HTML?
Bruce explains why it's always going to be difficult to expand on the existing HTML elements. I especially like the example of how <img> and <picture> were developed in a way to make them easier to incorporate into browsers by introducing minimal changes.
newslettered  news  330  article 
8 days ago
How to stop using console.log() and start using your browser’s debugger
I'm not afraid to say that I'm terrible at writing JavaScript. Anything I do is usually riddled with console.log to help me understand where I've inevitably gone wrong. After reading this though, I don't have to use it anymore.
newslettered  news  330  tutorial 
8 days ago
Creating horizontal scrolling containers the right way [CSS Grid]
How the flexibility of CSS Grid can help implement a horizontal scrolling component while dealing with some of the pitfalls that comes with it
newslettered  news  330  tutorial  grids 
8 days ago
World Mental Health Day: Apps for a Changing World
Wednesday was World Mental Health Day and this article lists a series of apps that might help you with aspects of mental health. If you're fortunate enough not to suffer from mental health, I'm sure that one of your friends likely do (even if you don't realise). Share the ones you like, it might just help someone you love.
newslettered  330  resource 
8 days ago
sitespeed.io 7.5
Ten years on from its first edition Site Speed is releasing version 7.5. This is my favourite free-to-use performance monitoring tool.
newslettered  330  resource 
8 days ago
The Way We Talk About CSS
CSS now has some amazing layout capabilities that we can take advantage of, and while you're sitting there thinking "Yeah, Grid and Flex is great" that's not what I mean. Let Rachel open your eyes to new ways to think (and talk) about CSS.
newslettered  news  330  headline 
8 days ago
MODALZ MODALZ MODALZ
Are modals the new carousel? Or the new accordion? I kind like them, but not when I see them within the first 5 seconds of visiting your website unless I've chosen to click on something to view (looking at your popup subscription boxes).
newslettered  news  330  article 
8 days ago
Sass Selectors: To Nest Or Not To Nest? | Brad Frost
Do you nest your selectors when writing Sass? I used to nest them because.... well I'm not sure. For me it made sense when I was writing it to keep it all wrapped up together, but was it also partially because it was awesome that I _could_? I don't mind the Option 2 approach, but what I don't like is Option 2 when people leave off the & and add specificity to the CSS. Grrr.
newslettered  news  330  article 
8 days ago
The FAQ as Advice Column · An A List Apart Article
I love this for two reasons. 1) I can't stand accordions used on a web page. I'm not being dogmatic about them either, I'll even admit that a carousel can be put to good use.... but an accordion is where I draw the line; and 2) I agree that a FAQ is a holding ground for valuable content that you should have included within the actual website content. BUT, it's great for common questions that are posed by people... sometimes people work better reading through a question and answer statement rather than the troves of paragraphs that someone has cleverly crated but forgotten the point of actually informing the user.

Phew.
newslettered  330  article  headline  news 
8 days ago
Use Cases For Flexbox
In this final article of the series, Rachel wraps up by taking a look at some of the common uses for Flexbox. What should we use Flexbox for, and what it is not so good at?
newslettered  329  tutorial  flexbox 
15 days ago
SuperTinyIcons
A whole lot of commonly used icons (social media, apps etc) all done in SVG and all super tiny so you save on bytes and get paid in performance
rwd329  resource  design  svg 
15 days ago
Notes on prototyping
Some great notes from Ben, especially around why a prototype is not the same as a proof of concept.
newslettered  news  329  article 
15 days ago
Survival Tips For Women In Tech
Twenty four tips on how to survive as a woman in tech. Pro tip, everyone should read these and make sure they're not an issue at your own workplace.
newslettered  news  329  article 
15 days ago
You Don't Need WordPress
It seems you don't need Wordpress to create a website, but the downside is that you need to keep it on Google Doc's instead. It's certainly a different approach, and might just be the thing you're looking for.
rwd329  tools  blog 
15 days ago
Content and Design Are Inseparable Work Partners
Jared Spool recounts a usability test which shows why content is such an important aspect of the design process.
newslettered  news  329  article 
15 days ago
Preventing a Grid Blowout | CSS-Tricks
Chris takes a look at how to declare grid columns that have an unknown size of content. While text will wrap fine, images can blow out the column if not properly max-width'd. But what about things like <pre> tags? Well, Chris has an answer for that too.
newslettered  329  tutorial  grid 
15 days ago
Contribute to MDN and help it grow
MDN is reaching out to see if anyone who benefits from their amazing docs, and I certainly know that I do, would like to contribute and support the project with actual dollars. If I think about the amount of times it's helped me with my work, it's a bargain!
rwd329  introduction 
15 days ago
Am I Responsive?
Growing up in Australia it was ironic that Web Directions that became the first ever web conference I went to.... but a version that they ran in London. In the two years we spent back in Australia I made it to their Web Directions in Sydney and had the most amazing time. Check out their new site, and if you're in Australia... get yourself along to one of John's events.
rwd329  feature-site 
15 days ago
Introducing the Button element
Andy's satirical poke and the preference some of us have over using <div>'s when there are other elements, semanticaly correct, staring us in the face.
newslettered  329  article 
15 days ago
How I remember CSS Grid properties | Zell Liew
Zell takes us through how he constructs Grids and remembers their properties.
newslettered  329  tutorial  grid 
15 days ago
Designing With Code
How you go from working on Sketch and Photoshop and into the browser... a happy accident.
newslettered  328  article 
22 days ago
Picular
Picular is a rocket fast primary color generator using Google’s image search. If you ever needed the perfect yellow hex code from a banana, this is the tool for you.
tools  design  328  newslettered 
22 days ago
What is Modular CSS?
A really great overview of the history and journey of Modular CSS. This week I added our feature site from last week to the RWD site and pointed out their use of Atomic CSS. I'm not a fan of that approach, but after reading this is certainly can make some sense in certain scenarios.
newslettered  328  article  modular  news 
22 days ago
How to Build a Low-tech Website?
I love the idea of a low powered web page and a solar powered server. Looking at this example it wouldn't be out of the ordinary that this is the kind of resource that we'll need when colonising Mars. The web would be a valuable resource, but I envisage it being more like the earlier days of the web than today's giant pages.
newslettered  328  article  news 
22 days ago
Don't use empty or low content for your design system grid examples
I was listening to this podcast the other day and it was really interesting to hear how different columns would behave in different situations depending on the content and rules applied to them. At the moment I think we're all in experimenting road right now while we find which works the best way for our designs
newslettered  328  tutorial  article  news 
22 days ago
Having fun with link hover effects | CSS-Tricks
Some really fun options with link hover effects.
newslettered  328  tutorial 
22 days ago
Building the New Scotch.io Animated SVG Logo ― Scotch
The new scotch logo is animated and responsive, built with SVG and CSS and a wonderful example of how we should never take seemingly simple things like logo's for granted.
newslettered  328  tutorial 
22 days ago
Lazy Loading Images – The Complete Guide
Lazy loading defers the loading of resources on the page as long as they are not needed. Instead of loading these resources as soon as the page loads, which is what normally happens, we defer the load of these resources to a later time when they are actually needed.
newslettered  328  tutorial  images  javascript  news 
22 days ago
T-Writer Demo
T-Writer.js is a native typewriter-effect library, designed to be:
Fast
Easy to use
Fully-featured
Dependency-free
plugin  328  newslettered 
22 days ago
Flickity - touchable, responsive, carousel
Usually I’m against carousels, but that isn’t to say the carousel isn’t without it’s place in a great web design. If you’re building a photo slide show, or you have an e-commerce store to feature products, or you want to provide a multi-step on boarding experience then a responsive touch carousel is a great fit.
tool  328  newslettered 
22 days ago
Preparing a conference talk
Jeremy is easily in the top five speakers I have seen on stage not just because of the quality content he delivers, but the _way_ in which his talks come together. In this post Jeremy maps out his process to delivering talks starting with scribbling on paper and down to the final slides and practicing before the day.
newslettered  328  tutorial  news 
23 days ago
Flickity
Touch, responsive, flickable carousels
slider  javascript  carousel  tool  plugin  328  newslettered 
24 days ago
Shopify AR powered by 3D Warehouse
Shopify are getting in early with introducing the ability for you to create AR versions of your products for people to see through their mobile.
article  327  newslettered 
29 days ago
Vapid: an intentionally simple CMS
Vapid is an intentionally simple content management system built on the idea that you can create a custom dashboard without ever leaving the HTML.
tools  327  newslettered 
29 days ago
Breaking the Deadlock Between User Experience and Developer Experience
What to do when better UX actually makes it worse for your users?
article  327  newslettered 
29 days ago
A framework for web performance
We're looking at new areas we should be focusing on for 2019 and web performance is something that is high on that list. Jeremy has been doing workshops with Clearleft clients recently and come up with this framework for you to use. Thanks Jeremy!
article  327  newslettered 
29 days ago
Introducing Bing AMP viewer and Bing AMP cache
Bing is now providing it's own AMP Cache on bing-amp.com and is rolling out the news carousel and amp stories atop their mobile search results as well. This makes me nervous, and I'm not sure if it's because I'm an old man on the web front lawn, or it's a bad idea.
article  327  newslettered 
29 days ago
What's best for users
Winston Hearn has a great piece that came from a discussion around some of the latest AMP (bashing) articles. As a member of the Vox Media team he is well aware of the need for a great performing site as well as gaining revenue on that site. It offers a great balanced overview of the situation.
article  327  newslettered 
29 days ago
Revamp.
Ethan, once again, eloquently covers off the latest situation with the AMP project moving to an open governance model. I agree that it is great to see that more people from outside of Google will have a seat at the table to help shape the future of the specification.
article  327  newslettered 
29 days ago
On using tracking scripts | justmarkup
Should you use tracking scripts? Have you gone a benefits/costs analysis? Michael has and it tells us what most of us already know but probably don't want to admit.
article  327  newslettered 
29 days ago
Hinting at a better web at State of the Browser 2018 | Christian Heilmann
A great overview of the State of the Browser from Christian. We were proud to be one of their supporters this year, the work the London Web Standards team does is amazing
article  327  newslettered 
29 days ago
Mozilla Mixed Reality
Firefox Reality serves you the very best immersive games, videos, environments and experiences from around the web.
rwd327  resources 
29 days ago
Yeti Hand Pagination
This reminds me of the Yeti from Foundation. Very cool pagination transition.
rwd327  codepen 
29 days ago
Color Leap - History's Palettes
Take a leap through time and see the colors of history (and then copy them to your clipboard).
rwd327  resource 
29 days ago
Trusting the Process
Web projects are hard! One of the best ways to ensure that everyone is on the same page is through a SoW or Statement of Work. Karah unveils their approach to this project saving approach.
article  327  newslettered 
29 days ago
Trashy.css - The throwaway CSS library with no class
a CSS "library" that styles tags directly — as opposed to using class names as style hooks — to help people become more familiar with how to use semantic HTML.
tools  327  newslettered 
29 days ago
Refresh CSS Bookmarklet v2 | Lea Verou
Sometimes when you're on a page on your local site and you've pushed some changes to your CSS you want to see it without having to reload the whole page again. This little bookmarklet will refresh all the Stylesheets on the current page.
tools  327  newslettered 
29 days ago
CSS SpeciFISHity – Standardista
If you don't like batman, try some fish
rwd326  resource 
5 weeks ago
The "Developer Experience" Bait-and-Switch | Infrequently Noted
"JavaScript is the web’s CO2. We need some of it, but too much puts the entire ecosystem at risk." - Fine words from Alex Russel
performance  news  article  headline  newslettered  326 
5 weeks ago
Removing jQuery from GitHub.com frontend
Github has been working over the past couple of years phasing out jQuery bit by bit. If you're looking to do the same with your own projects they had a great approach.
article  jquery  326  newslettered 
5 weeks ago
Batificity
Based on the results of the little CSS test this week, here are a couple of ways to learn about specificity (which I still struggle to pronouce)
rwd326  resource 
5 weeks ago
CodeZen – Zenify your Source Code
This is a great little tool that will create images of your code in a number of different predefined styles. You can switch between a number of languages too including HTML, CSS, JS, Sass, Python, C, PHP, Markdown and more. The images for the CSS test above was done using this tool
rwd326  tools  presentation  generator 
5 weeks ago
Project Explorer
A CLI tool to create an annotated tree visualization of any project
newslettered  326  tools 
5 weeks ago
Improving Client-Side Performance
A cracking list of suggestions from TJ Fogarty about how to get the most out of your site when it comes to performance when launching or reviewing a website
tutorial  newsed  newslettered  326 
5 weeks ago
Color Cycling with Workers
Dave goes ol' school game graphics with the new Paravel homepage and, as usual, he does a great job at teaching us how to do something similar.
newslettered  326  tutorial 
5 weeks ago
‎WebXR Viewer on the App Store
A browser developed by Mozilla for the iPhone designed purely to test out the new WebXR experiences. What can you build?
newslettered  326  tools 
5 weeks ago
New API to Bring Augmented Reality to the Web
The next big design change following Responsive Design will be the arrival of WebXR and how we move our sites into Augmented and Virtual environments. The team at Mozilla are doing a wonderful job, and in the coming months FF nightly will let you test these out based on the spec's being developed today
article  326  newslettered 
5 weeks ago
« earlier      

Copy this bookmark:



description:


tags: