Trent Walton

trentwalton.com · Personal blog · on HN since 2010

Trent Walton, a web designer, writes about responsive design, CSS, typography, and the craft of front-end development.

What HN saysHN commenters link it in discussions of web typography and scroll hijacking, and one points to a specific article on his site.
30HN people shared it
8linked it in comments
26stories submitted
141story points
11 years agolast shared
2010people per year2026

Most-shared posts

  1. 1
    Does "You are what you eat" apply to developing?
    3 people · 42 points · first shared 2011 · 8 comments on HN
  2. 2
    Scroll Hijacking
    3 people · 7 points · first shared 2013 · discussion on HN
  3. 3
    Hover on iPhone/iPad
    2 people · 47 points · first shared 2010 · 25 comments on HN
  4. 4
    CSS Mask-Image & Text
    2 people · 5 points · first shared 2011 · discussion on HN
  5. 5
    Unitasking
    2 people · 5 points · first shared 2011 · 1 comments on HN
  6. 6
    Future work defined by current work
    2 people · 3 points · first shared 2011 · discussion on HN
  7. 7
    Workspace
    2 people · 2 points · first shared 2011 · discussion on HN
  8. 8
    Flexible Foundations
    2 people · 2 points · first shared 2013 · discussion on HN
  9. 9
    Web Fonts I Look Forward To Using
    1 people · 4 points · first shared 2013 · discussion on HN
  10. 10
    Jiro, Sushi & Web Type
    1 people · 4 points · first shared 2013 · discussion on HN
  11. 11
    Reorganization
    1 people · 4 points · first shared 2013 · discussion on HN
  12. 12
    Safari Extension: Live CSS Editor
    1 people · 3 points · first shared 2010 · discussion on HN
  13. 13
    A New Microsoft.com
    1 people · 3 points · first shared 2012 · discussion on HN
  14. 14
    Device-Agnostic
    1 people · 2 points · first shared 2014 · 1 comments on HN
  15. 15
    CSS3 in transition [when to use css transitions]
    1 people · 1 points · first shared 2010 · discussion on HN

What HN people wrote when they linked it

Smudge · 2012-09-03
For most uses, fine-grained kerning is overkill. The following will work well enough in browsers that support it (Firefox often turns this on by default): text-rendering: optimizeLegibility; Scripts like Lettering.js are best for typographically interesting headers. Trent Walton (http://trentwalton.com) makes great use of this (of course, he's one of the creators of Lettering.js).
adregan · 2013-06-02
If you are really looking for some readability tips, might I suggest one? Via the incredibly influential, albeit dry, _The Elements of Typographic Style_ by Robert Bringhurst[1] concerning the "comfortable measure," which I find to be the most important aspect of readable text: > Anything from 45 to 75 characters is widely regarded as a satisfactory > length of line for a single-column page set in a serifed text face in a text size. > The 66-character line (counting both letters and spaces) is widely regarded as ideal. The measure on your site is around 99 characters and that's a bit large. The best way I've found to work on the character length involves a dead simple tip I appropriated from Trent Walton[2]. If you add an asterisk at the 66 character of a line, you can easily manipulate the font-size up and down (I prefer percentages on the body element and ems on the individual elements, and then fuss with the single percentage) until you achieve an appealing measure. [1] http://en.wikipedia.org/wiki/The_Elements_of_Typographic_Style [2]http://trentwalton.com/
bbx · 2015-07-03
Surprised by the inclusion of "CSS Scroll Snap Points": https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-snap-points-y It basically allows to do scroll hijacking [1] without any JavaScript, just like this: http://blog.gospodarets.com/demos/scroll-snap-full-screen/ [1]: http://trentwalton.com/2013/10/23/scroll-hijacking/
elou · 2013-02-24
Poorly implemented here, though a sound concept when done correctly. Information Architects (the creators of iA writer) shared an interesting post [1] on responsive typography that you may find interesting. One rational for having smaller text on small viewports, in addition to saving space, is to adjust for the distance that most readers view content on their phones from. We tend to hold our phones closer to our eyes, sit farther from our desktops, and hold tablets some distance in the middle. Having smaller text on a phone therefore accommodates that. Trent Walton wrote a useful post on the subject as well [2]. 1. http://informationarchitects.net/blog/responsive-typography-the-basics… 2. http://trentwalton.com/2012/06/19/fluid-type
nudge · 2011-02-19
For posterity, the url to the article itself (as opposed to the blog) is http://trentwalton.com/2011/01/26/you-are-what-you-eat/
WickyNilliams · 2013-01-22
I think you're slightly off with your conclusion of responsive web design. It doesn't aim to cater to people resizing their windows (that's just an added benefit), it aims to cater to all devices regardless of window size. Assuming we're still considering responsive design, if designed from a mobile-first perspective you'd be surprised how clean the code can be to deal with this. Start with minimal resources and most of your content stacked vertically so that it's lightweight and easy to consume on a touch device. Providing you've used relative units (ems in particular) you can scale up for larger screen with super simple media queries that just bump the font-size on body (e.g. body { font-size: 120%; }). You can find an awesome overview of this approach on Trent Walton's site [1]. Compare this with a hacky approach of doing desktop-first - you're loading assets (probably) unnecessarily, hiding chunks of markup to never be displayed, hammering your CSS to fit your desktop peg into a mobile hole. I know this doesn't cover everything, and any sufficiently complex site will require more than just bumping font-size, but honestly it doesn't have to be super difficult and full of horrible workarounds. Now with the resposnive vs. separate site debate, the way I've always thought of it is responsive site for web sites, separate sites for web apps. Apps are sufficiently complex, with enough interaction that they require fundamental changes in HTML, CSS and JS to adapt to touch…
10ren · 2010-07-09
x86 Pros: (all to do with windows I think. Are these what you were thinking? Did I miss any?) - windows software - windows drivers (probably less important for a netbook, but I sure wish my scanner and laser printer and wifi hotspots all worked with my eee PC's xandros). - windows itself is familiar, and people know their way around it. - Microsoft sells windows for OEM notebooks really cheap (like $20 I think). An astute move. - x86 also runs lots of linux binaries (and other OSes), but I don't think this is a big factor since you can recompile (and eg ubuntu has done this for ARM already), and it's not a selling point for the 95% of people who don't use linux. ARM Pros: - lower power consumption (but I believe the display is the main power drain at this point) - cheaper (but Intel mobile CPUs are priced competitively) - to combat "windows software": webapps seem to be used more than native apps these days (what % of your PC time is outside a browser? I myself am only outside a browser for compilation and vim). - to combat "windows drivers": a netbook is primarily mobile; and if it has 3G, it doesn't even need wifi compatibility. - to combat "windows familiarity": the browser is already familiar. If that works, the rest is of secondary importance - linux is cheaper than windows (though I'm not sure if that is true for special distributions with higher usability, eg. I'm sure xandros for the eee PC is sold for-profit). Overall, it seems to be in flux: platform…
ilovecomputers · 2010-03-26
Well actually, it's common in the printing business to have each article to be of a unique style. Take National Geographic for instance. One article has a different theme: http://www.valeriedaysings.com/wp-content/uploads/2008/08/national-geo… from another: http://www.simongarnier.com/images/wordpress/ft_hdr.5.jpg Well actually, those are title pages, but I've read those articles and I can attest that the different designs set a suitable mood for the topic at hand. I applaud web publishers for taking up this paradigm and applying what publishing graphic designers have been doing for some time. Of course with most methods of design, it depends if the occasion is suitable. Some online publications can do well with a consistent design: http://www.alistapart.com/ While others do well with differing designs, almost as if each posting of their articles is a treat for their readers: http://trentwalton.com/articles/ just like D.Curtis does, so good on him if he has inspired others to do the same.

Keyboard shortcuts

/Search
j kNext / previous blog
EnterOpen selected blog
vVisit the blog site
fFollow / unfollow
lSwitch grid / list view
dSwitch dark mode
g hHome
g pTop posts
g tTopics
g fFollowing
g lLiked
g yHistory
g qFAQ
EscBack / close