# iamsteve.me

> Tips and tutorials about the design and build of web interfaces. Through design and code tutorials focused on maintainable CSS, good typography and UI fundamentals by Steve McKinney.

## Best articles

- [How to use inline-block for layout](/blog/inline-block)
- [Maintainable critical and asynchronous CSS](/blog/critical-asynchronous-css)
- [Javascript without jQuery](/blog/javascript-without-jquery)
- [Images with srcset & picture](/blog/images-with-srcset-picture)
- [SVG reusability & animation](/blog/svg-reusability-animation)
- [Overcoming a couple of issues with SVG filter effects](/blog/overcoming-a-couple-of-issues-with-svg-filter-effects)
- [Manage text colour with ease](/blog/manage-text-colour-with-ease)
- [Using BrowserSync and Safari for testing your responsive website](/blog/using-browsersync-and-safari-for-testing-your-responsive-website)
- [Sass hints & tips revisited](/blog/sass-hints-tips-revisited)
- [Object fit for full viewport images with ease](/blog/object-fit-for-full-viewport-images-with-ease)
- [Opt in style](/blog/opt-in-style)
- [Adobe generator syntax ‘cheatsheet’](/blog/adobe-generator-syntax-cheatsheet)
- [Using Photoshop linked smart objects for more modular designs](/blog/using-photoshop-linked-smart-objects-for-more-modular-designs)
- [Typography for beginners: type scale, line height & lengths](/blog/type-scale-line-height-lengths)
- [Using webkit2png to generate responsive screenshots](/blog/using-webkit2png-to-generate-responsive-screenshots)
- [Using analytics again with simple analytics](/blog/using-analytics-again-with-simple-analytics)
- [Rules I follow when typesetting](/blog/rules-i-follow-when-typesetting)
- [Bento grid layout with CSS grid and container queries](/blog/bento-layout-css-grid)
- [About version 8](/blog/about-version-8)
- [About version 7](/blog/about-version-7)
- [The best ink trap typefaces for websites](/blog/the-best-ink-trap-typefaces-for-websites)
- [‘Atomic’ font size management with Sass](/blog/atomic-font-size-management-with-sass)
- [Tips for using colour effectively in web illustration](/blog/tips-for-using-colour-effectively-in-web-illustration)
- [Nice and easy lazy loading with lazysizes.js](/blog/nice-and-easy-lazy-loading-with-lazysizes-js)
- [A year in writing — 2017](/blog/a-year-in-writing-2017)
- [Illustrator quick tip: which stroke alignment?](/blog/illustrator-tip-which-stroke-alignment)
- [Search overlay with smooth reveal animation](/blog/search-overlay-with-smooth-reveal-animation)
- [Visual design tips you can apply immediately](/blog/visual-design-tips-you-can-apply-immediately)
- [Overcoming design roadblocks](/blog/overcoming-design-roadblocks)
- [Illustrator quick tip: export a colour palette quickly](/blog/illustrator-quick-tip-export-a-colour-palette-quickly)

## Categories

- [Design articles](/category/design)
- [Code articles](/category/code)
- [Typography articles](/category/typography)

## Optional

- [Full archive](/blog)
- [RSS feed](/feed.xml)
- [About](/about)