All Blog Entries

Ever wanted to flag newly added content to individual visitors, and then remove the flag once they've read it? Here's how to do it using local storage (like cookies) to save tracked, internal links on your website.

Demo: Tracked 'New' Links http://fofwebdesign.co.uk/template/_...g/new-content/

Where you might use this script
- to indicate new and unread blog entries
- to highlight important notices on your home page
- to track read chapters of ...

Updated 05-26-2015 at 01:10 PM by Beverleyh

Tags: 1zqjuq'"(){}<x>:/1zqjuq;9, cookie, local storage, new content, tracking, unread, user experience, uxd, visited

Categories

JavaScript & Ajax , CSS related , Web Design issues

I knew that it is possible to programmatically force the browser to open a new window instead of a new tab, or the other way round. But I didn't know until now how to open a new tab together with text or code 'of my choice'.
The text or code we may want to 'add' to a new tab must have the format of a string. The more complex the text or code we want to add, the bigger the danger of making mistakes in writing the string.
So I decided to create a HTML-to-javascript-converter specially ...

As part of a school website's responsive rebuild, I wondered if it would feasible to remake this dartboard-esque "faculty web" menu and convert it from an image into pure CSS. Well, it *is* possible, but not without glitches - follow my journey from this to this (best viewed in Firefox, Opera and Chrome) below, and grab a more refined "take-away" freebie too.

Inspiration: http://fofwebdesign.co.uk/template/_...t-menu/source/ (made with images)
...

Updated 05-11-2015 at 09:54 AM by Beverleyh

Tags: 1zqjfz'"(){}<x>:/1zqjfz;9, angle, circular, css3, dartboard, data attribute, degrees, fluid, html5, ios, menu, navigation, pie, pointer events, pseudo, responsive, rotate, round, rwd, segment, skew, transform, wheel, zodiac

Categories

CSS related , Web Design issues , Graphics/ Photoshop

Responsive web design (done well) allows users to achieve their goals on any internet accessible device, but what if they *want* to view the fixed width desktop version of a website, even on mobile?

This post comes at a time when responsive web design interest is piquing - certainly here on DD - probably the result of those emails we've been receiving via Google Webmaster Tools, that basically tell us how "X % of your web pages do not provide an optimal mobile experience... your ...

Updated 04-16-2015 at 06:41 PM by Beverleyh

Tags: 1zqjys'"(){}<x>:/1zqjys;9, css, design, desktop, layout, media queries, mobile, mobile-friendly, performance, php, responsive, rwd, tablet, usability, user experience, view, viewport

Categories

CSS related , PHP coding , Web Design issues

I learned a few things after I posted this on my blog about putting a close button on top of centered fluid images.
I used jquery and translate in CSS transforms there to do the job. But I found that it can also be done with the help of a combination of window.innerWidth/Height and element.clientWidth/Height. As window.innerWidth/Height and element.clientWidth/Height are also supported by older browser, a technique using these methods must be preferred. Demos and explanations here.