Skip to content. Adrian Roselli Consultant, Writer, Speaker

All Posts Tagged: css

My Slides from Accessibility Camp NYC

If the embedded slides are not working, you can get to them directly at SlideShare. There is also a video of my talk (and all the other talks) available, or you can watch it below: Errata Note that I adjusted slide 89 before I posted it to SlideShare, thanks to…

Posted:

Tags: accessibility, ARIA, css, design, html, slides, speaking, standards, usability, UX, W3C, WAI, WCAG

Web Design Myths

Net Magazine asked followers on Twitter to submit any web design myths they wanted busted: Got a web design myth you want busted? Let us know and we'll print the best tweets in the mag!— net magazine (@netmag) September 16, 2015 I took this to mean web development, not just…

Posted:

Tags: accessibility, browser, Chrome, css, design, html, mobile, print, rant, SEO, standards, usability, UX

Source Order Matters

A picture of my strawberry, balsamic, black pepper sorbet, which makes sense later in the post and because my blueberry sorbet didn’t come out so well. CSS is providing newer and more complex methods of laying out your pages. Given the multiple form factors a responsive site has to support,…

Posted:

Tags: accessibility, css, html, standards, usability, UX

Show/Hide Script-Free (Which Means CSS Only)

There are many ways to hide and show content with a click (or tap or poke or key-press or …). Many of them have JavaScript under the hood and nearly all of them have dependencies on third-party libraries and/or CDNs. This may be fine when you already have to load…

Posted:

Tags: accessibility, css, JavaScript, usability, UX

CSS and System Fonts

This weekend I read a post about techniques to get Apple’s new San Francisco font into your CSS. Since San Francisco is only just being added to iOS and OS X, it can be a bit tricky to get hold of it in Safari. What struck me was the use…

Posted:

Tags: Apple, browser, css, fonts, mobile, Safari, standards, usability, UX, WHCM

Obligatory Redesign Post

Screen shots showing four of the states of the menu of which I am so proud but which has questionable usability, as opposed to the h1 style, which is unquestionably unusable. Note that one of those screen shots is really a view of the printed page, where the menu is…

Posted:

Tags: accessibility, ARIA, css, design, html, mobile, standards, touch, usability, WHCM

Slides: Selfish Accessibility for Avega Group

The slides and video from my talk (a little background). Selfish Accessibility by Adrian Roselli. Insider seminar at Avega Group. pic.twitter.com/EPeTxcACpl— Vera Olsson (@en_surkova) March 19, 2015

Posted:

Tags: accessibility, ARIA, css, html, slides, speaking, standards, usability, UX, W3C, WAI, WCAG

ACE! Conference Slides: Selfish Accessibility

In addition to the slides, I’ve embedded video of my talk and way too many tweets after that. Video Impressing everyone on the internet, Paul Klipp has already gotten videos from ACE! posted less than 24 hours after the event ended. That’s impressive. I understand his tactic is to upload…

Posted:

Tags: accessibility, ARIA, css, html, slides, speaking, standards, usability, UX, W3C, WAI, WCAG

Booster Conference Slides: Making Your Site Printable

I’ll fill this up with notes and other content later, but in the meantime here are the slides from my talk this morning: I’ve written a bunch of handy stuff on print styles, here are some links (or you can see all posts tagged print on my blog) along with…

Posted:

Tags: css, print, slides, speaking, standards, usability, UX

Using Bookmarklets on Mobile

Viewing comments on Medium (first image), then being prompted to login in order to view comment replies (second image). Both images are current version of Chrome on Android. This is a follow-up to my post CSS Bookmarklets for Testing and Fixing. While surfing Medium the other day I chose to…

Posted:

Tags: browser, css, standards

CSS Bookmarklets for Testing and Fixing

Animated image showing the Pinterest site and its infuriating blocking overlay, which is removed with the bookmarklet below. I regularly have to test sites in development, review some third-party site, or just use a site in my day-to-day time wasting (and banking) rituals. I’ve relied on viewing the page’s source…

Posted:

Tags: accessibility, ARIA, browser, css, html, standards, W3C

Announcing My Ring Warmer App

Animation showing the Ring Warmer in action. If you have to wear a ring, then perhaps you have experienced the discomfort of putting a cold ring on your finger (maybe in the morning in a cold house). I decided that I could do something about that using the only tool…

Posted:

Tags: apps, css, html, JavaScript, mobile, touch

Search icon Used in the search form as a button. Search icon Used in the search form as a button. Information icon Lower-case 'i' in a circle. Checkmark icon Symbol showing a checkmark. Alert icon Exclamation mark within a triangle.