There are 50 entries matching ‛CSS techniques’:
Most image replacement techniques work by displaying a background image of text and shifting the real text out of view which is fine unless you have images turned off. This can be addressed with some unobtrusive JavaScript.
There have been some great articles published recently on the accessibility of Ajax and DOM scripting.
Introducing Position is Everything and CSS Destory, a couple of CSS resources exploring bugs and extremes.
Here’s something that’s been playing on my mind recently. What role can CSS alone play in making websites accessible?
I’ve been playing around with ways of displaying images in variable width columns, particularly with images that are wider than their container. Please cast your eye over my experiments.
There’s a fabulous new design in the CSS Zen Garden which makes use of a clever transparent PNG effect.
Later this year I’ll be talking at Patterns Day. Jeremy asked me to weave responsive typography into his narrative of the day. How do I explain something as all-encompassing as typography within something so potentially granular as a design system?
I’m really pleased to finally announce the release of a brand new website, The Elements of Typographic Style Applied to the Web, or Web Typography for short.
Web Essentials 2004 looks to be an inspiring conference on Web standards, and a really good excuse to travel to Syndey late September/October. The conference will cover the key aspects of web standards: accessibility, markup (HTML/XHTML) and presentation (CSS). The…
Semantic HTML is just HTML 2.0 with some sensibly named divs
So far this year, my regular reads on the Web have covered techniques in all the disciplines required to create quality web sites. All the disciplines bar one, that is. What’s missing? The visual design; the look; the skin; the surface. While the folks I’ve been…
Thanks for your support. I don’t normally get political here at Clagnut, and even less often do I get angry and sweary, so I thought I’d show any new readers what I normally write about, by way of a top ten most visited posts this fortnight.
Judging by the latest SitePoint TechTimes, it seems Stuart Langridge has won the argument. SitePoint’s DHTML book will be published with HTML.
It’s twenty four years to the day since A List Part published John Allsopp’s seminal treatise A Dao of Web Design. But all this time on, we’re still making the same mistakes.
This year, SxSW Interactive is enabling attendees to vote for panels to be featured in the conference. I’m hoping to present a talk with Mark Boulton called Web Typography Sucks. The Panel Proposal Picker Round Two is now live, so get your votes in!
In December 2005 I launched the Elements of Typographic Style Applied to the Web, a practical guide to web typography using Robert Bringhurst’s book “The Elements of Typographic Style”. The site needs updating, so I’ve now open sourced it on Github.
Christina Wodtke has created Widgetopia, a collection UI elements, and discusses solving user interface problems – by best practice or common practice?
A free font has made it into MyFonts’s top ten list of best selling typefaces. There’s a lesson there somewhere.
Clearleft is doing a couple of public workshops at the end of January, here in Brighton. Andy Budd and Jeremy Keith will be training folk on CSS Mastery and Bulletproof Ajax respectively. Also check out Web Directions North conference.
Text for the screen is sized with CSS in terms of pixels, ems or keywords. Pixels is easy, keywords are well documented. That leaves ems. I will now attempt to show you how ems can be as quick and easy to use as pixels.
Semantically speaking, should we be using tables to lay out forms, or should we be using some other mark-up combined with CSS? There arguments for both, but I reckon the most flexible answer is hidden in HTML 2.
Pretty much the only forms of Western literature that don’t use hyphenation are children’s books and websites. Until now.
At Typ09, FontShop put together Webfonts Week, a series of interviews with leading type designers. There is universal support for webfonts now, even from those who were dead set against it a year ago.
This Friday, 24th October 2008, I’ll be presenting as part of Head, a three-day global web conference. My talk is entitled Facing up to Fonts in which I get to talk more about web typography for the first time in ages. Update: Win a ticket!
Well it’s the usual reason – so much stuff, so little time. There’s two projects, two books and then my arch nemesis pops up.
Web Accessibility: Web Standards and Regulatory Compliance is the full title of the latest book with my name on it. Published by Friends of Ed, it’s now gone to the printers and will be available sometime in July.
During these 10 days of mourning following the death of the Queen, wherever you look – on websites, billboards and shop windows – we are presented with a badly typeset date range: 1926 – 2022. Here’s how to do it correctly.
The font-stretch property was removed from CSS2 in the transition to CSS2.1. Unfortunately this leaves us with a rather gaping hole in overall font support.
In my previous post I extolled the virtues of Literata’s font optical sizing, in particular how it worked automatically in the browser. That is until the release of Safari 16 with macOS Ventura. Here’s how to work around the bug.
I’m giving a virtual seminar on using jQuery in interactive wireframes. As a UX designer, it’s the course I wish had been available to me a few years ago.
Laying down some thoughts about the differences between ACD and UCD and how they can gel together.
When inline images are displayed in box with -webkit-border-radius applied to it, the image is not cropped as expected. There is a simple workaround, at least for Safari.
There’s a different approach to web page layout which is gradually getting some traction. The idea is that the layout is changed to best accommodate the window size.
One by Joe Clark on screen-reader usability at a redesigned, standards-compliant e-commerce site. The other by Russ Weakley and Roger Hudson on the real world interpretation of HTML table mark-up by assistive devices.
I don’t know if it’s just me, or if something’s happened in the last few months, but I keep seeing faux bolds everywhere. The fix is tiny and simple, although frankly the mistake is pretty basic – there’s no excuse for it being so prevalent.
The Web Typography project continues to proceed, albeit at a glacial pace. One of the reasons for the slow progress is guidelines such as this: “verse quotations should be centered on the longest line”.
At the end my previous post, I said I’d settle for direct control over widows and orphans in text blocks. It turns out not to be quite as a simple as one might think, with lots of discussion over the years. I created an experiment to test a solution.
Every now and then I’m asked to help out the CSS Working Group, especially when typography is involved. Invariably it’s also a chance to learn, not just about upcoming CSS, but also new methods of collaboration and group decision making.
A bug in Chromium and Safari makes support of proper superscript and subscript characters problematic. See exactly why, and what you might be able to do about it.
When did we start using the ch unit to specify the maximum length for a line of text in CSS? To do so makes assumptions that don’t necessarily hold up, and there are more appropriate units to use. Also: was it my fault?
How thinking about the speed of a career can you help create a framework for professional development across any organisation.
Currently shipping in Chrome Canary, and thus soon to be in Blink-based browsers including Edge, is a relatively new CSS declaration which promises to virtually end typographic widows.
Earlier this week it was announced that WebKit now supports CSS @font-face rules. There has been a mixed reception in some quarters, but this leap forward (for that’s what it is) has to be a good thing.
Two weeks ago I was invited to Berlin for a CSS Working Group meeting. One afternoon was dedicated to resolving issues with the CSS Text and Font modules. Two resolutions in particular will affect the CSS we need to work with variable fonts.
A tale of how typesetting a beautiful poster led to an exploration and explanation of how manually kerning type on the web can be tricky, but also made to work across browsers.
The short answer is: quite a lot. The long answer covers some accessibility issues, some new CSS, some slightly older CSS, some high level colour theory, a bit about SVGs, and some typography finessing; all of which I’ll cover in this post.
Fixed versus liquid design is an emotive debate. Liquid layout seems more intuitive, appropriate and elegant but is not without issues. However many concerns can be addressed with little or no compromise.
The handling of widowed headings across pages in Apple Books is of particular concern. Since 1997, CSS has had properties to handle this, and yet browsers including Safari and Firefox still don’t support them – why not?
There’s more to the lives of many typefaces than just Bold and Regular, but almost no browsers follow the proper CSS 1 way of specifying Light, Semibold, Black and other weights. There is a workaround, but it’s nasty.
I’m extremely proud to say that two weeks ago Fontdeck opened its doors to the type-loving public. It’s been a long time in coming – too long I’d admit – but Fontdeck is now live and I’m hugely excited about what’s to come.