John Cox

Blogs · @wyome · Now · Shelf

Interesting

5 Things to Consider When Designing Your Mobile App

This piece outlines five essential considerations for designing mobile applications: first deciding whether a native app or mobile website better suits your goals, then accounting for the specific contexts where users will engage with the app, designing scalable interfaces for varying screen sizes across devices, adhering to platform-specific UI conventions to ensure familiarity and consistency, and prioritizing touch-friendly design with accessible button placement and visual feedback. The guide emphasizes that mobile design differs fundamentally from web or desktop design, and successful apps require thoughtful decisions about these factors before and during development.

Permalink

siiimple: a minimalist css gallery

Siiimple is a curated design gallery that has been collecting over 1,080 minimalist websites since 2008, organized across more than 50 categories ranging from architecture and portfolios to e-commerce and editorial projects. Each featured site exemplifies principles of clean typography, ample white space, and intentional design choices stripped of unnecessary elements. It serves as both inspiration and a resource for understanding what contemporary minimalist web design looks like in practice across different industries.

Permalink

10 Reasons Not to Copy Amazon | Get Elastic Ecommerce Blog

Copying Amazon's design and business practices is risky because Amazon operates under fundamentally different conditions—massive scale, diverse customer base, complex marketplace model, efficient logistics, and deep pockets for experimentation—that make its strategies unsuitable for most retailers. The article argues that Amazon's apparent success often masks poor user experience that only loyal customers tolerate, and that design decisions Amazon makes for business reasons (like removing reassuring text to free up page space) get mistakenly adopted as best practices. Rather than benchmarking against Amazon, retailers should test their own site elements against their specific customers and business model.

Permalink

Non Hover | Trent Walton

Written in 2010, this piece argues that hover states—interactive elements triggered by mouse movement—are fundamentally incompatible with the rapidly expanding touchscreen market and should be eliminated from web design rather than adapted to work on both devices. The author contends that designers should prioritize "multi-touch first" approaches, avoiding hidden content and relying instead on visible action items, tap-to-reveal mechanics, or native app experiences, treating hover effects only as optional enhancements for desktop users.

Permalink

CSS Media Queries & Using Available Space | CSS-Tricks

CSS media queries allow you to apply different styles based on browser dimensions and device characteristics, enabling subtle design adjustments rather than complete layout overhauls. The tutorial demonstrates how to write media query syntax both in external stylesheets and within CSS files using the @media rule, showing how to combine conditions with logical operators like "and" (required) and commas (or). A practical example shows how a sidebar email list can progressively display more information—from just links, to icons, to "Email:" labels, to full email addresses in parentheses—as the browser window widens, using CSS pseudo-elements and data attributes to change presentation without modifying HTML.

Permalink

How to create a stunning and smooth popup using jQuery | yensdesign - Tutorials, Web Design and Coding

This tutorial demonstrates how to build a modal popup window using jQuery with HTML and CSS, featuring smooth fade-in/fade-out animations, automatic centering, and multiple closure options (pressing Escape, clicking outside the popup, or clicking an X button). The example uses a status variable to track whether the popup is open or closed, and jQuery event handlers to trigger the loading, disabling, and centering functions when users interact with the page.

Permalink

Profiling MySQL Queries with phpMyAdmin: New Premium Tutorial | Nettuts+

This is a marketing page for a premium tutorial on MySQL profiling using phpMyAdmin, aimed at developers who want to optimize database queries. The instructor promises to teach practical techniques including how to use MySQL's query log, interpret EXPLAIN output, and understand JOIN operations—bridging the gap between beginners and advanced users. The tutorial is part of a broader premium membership service costing $19/month that provides access to tutorials across multiple design and development sites.

Permalink

Screenr - Create screencasts and screen recordings the easy way

This is a marketing page for Articulate 360, an AI-powered learning and development platform that helps organizations create, distribute, and measure workplace training at scale. The platform combines instructional design principles with AI tools to transform existing materials like decks and documents into interactive training experiences, supporting features like multi-language translation, custom AI avatars, and analytics to track training effectiveness. It's positioned as an all-in-one solution that consolidates fragmented training tools and integrates with existing business systems across HR, sales, support, and other departments.

Permalink

Internet Super Hero » Blog Archive » PHP: Client side caching for all MySQL extensions

This article introduces a C-based mysqlnd plugin that adds query result caching to PHP's MySQL extensions (ext/mysql, ext/mysqli, PDO_MySQL) without modifying existing APIs, operating transparently as a middleware layer between applications and the database server. Cached results can be stored in multiple backends (memory, APC, Memcache, SQLite) with configurable TTL-based invalidation, and includes a "slam defense" mechanism to prevent database overload when popular cache entries expire simultaneously. The plugin avoids the serialization overhead of PHP-based caching solutions by intercepting and replaying raw wire data at the driver level, though it only works with buffered queries and relies on SQL comments to control which queries are cached.

Permalink

A List Apart: Articles: Taking Advantage of HTML5 and CSS3 with Modernizr

This article explains how to use Modernizr, a feature-detection JavaScript library, to build websites that gracefully support varying levels of HTML5 and CSS3 capabilities across different browsers. Rather than relying on outdated browser-sniffing techniques, Modernizr detects specific browser capabilities and adds corresponding classes to the HTML element, allowing developers to write conditional CSS rules that apply enhancements only when browsers support them. The article demonstrates practical applications including using custom fonts, CSS columns with float fallbacks, rounded corners, box shadows, and 3D animations—showing how progressive enhancement enables modern features in capable browsers while maintaining usable experiences in older ones.

Permalink

Mensch -- A coding font

Apple's Snow Leopard introduced Menlo, a modified version of the Linux font DejaVu Sans Mono, as its new monospace typeface. The author, dissatisfied with several design choices in Menlo (particularly the slashed zero and the oddly-proportioned lowercase L), used FontForge to create a custom variant called "Mensch" with about a dozen tweaks including a circular zero, friendlier punctuation marks, larger angle brackets, and improved letter distinctiveness. The modifications maintain the open-source spirit of the original Bitstream Vera license while optimizing the font for code readability and aesthetic preference.

Permalink

HTML5Rocks - Home

This is a hub page from Google's Chrome team that organizes learning resources for web developers across multiple topic areas including performance, accessibility, payment processing, and progressive web apps, with links to courses, blog posts, and guides designed to help developers build fast, secure, and inclusive websites.

Permalink

Stop Forking with CSS3

This article argues that CSS3 vendor prefixes (-webkit-, -moz-, etc.) are a return to the forked code practices that plagued JavaScript development in the 1990s, creating unnecessarily complex and brittle stylesheets. The author introduces eCSStender, a JavaScript library that allows developers to write clean, prefix-free CSS while the library's extensions handle browser compatibility translation behind the scenes, keeping stylesheets maintainable. Beyond polyfilling, eCSStender also serves as a platform for experimenting with proposed CSS features before they're standardized, potentially helping the CSS Working Group evaluate ideas more quickly.

Permalink