Archives for Usability

Remove default text styles from SharePoint 2010 dropdowns

In my article on custom rich-text-editor (RTE) styles in SharePoint 2010, I noted that while it’s easy to add styles, or to wipe out all the default styles and replace them with your own, it’s not easy to modify the list of default styles — Remove a few but keep most of them. Indeed, the simplest way to do that is to copy all of the default styles into your custom RTE stylesheet, assign them a new prefix, and then delete the ones you don’t want. This is both time-consuming in development and code-heavy on the client side — nearly
Read More

Responsive design and server-side code

Update This post has been completely re-written to describe a better way of making server-side code responsive. Instead of posting the variable through Ajax, it uses GET to load a fully-responsive page. A few code tweaks make the technique both user- and search-engine friendly. Update 2: In screensize.php, changed window.location.href = $sizeurl; to window.location.replace($sizeurl); to fix back-button issue in IE. Introduction Responsive design — where the display of a web page responds to the size of the screen or browser window being used to view it — is awesome. It lets designers adjust the display of their website so it’s
Read More

Responsive, CSS-only faux tables

Tables are mildly responsive — the individual cells can resize as necessary. But they aren’t fully responsive without Javascript: You can’t take two TDs that are next to each other and suddenly have them stack, as that requires changing the HTML structure of the table. But you *can* do it with divs that are made to *look* like a table. See the demo here. HTML <div class="table-wrap">     <div class="row-wrap">         <div class="left-td"></div>         <div class="right-td"></div>         <div class="clear"></div>     </div> </div> Note how we’re using divs to mimic a table’s “table -> tr -> td” structure.
Read More