Students
Students get a Tuts+ subscription for just $45! Hurry limited offer.
Advertisement

Typography

  • Icon Design
    New Course: Mastering Icon Fonts on the WebIcon fonts
    48 shares
    Let’s say you’re building a website that uses lots of icons. How would you implement those on the web? As image files? They worked fine in the past, but not any more; not with retina displays and responsive websites. Icon fonts are the way to go, and in this course you’ll learn all there is to know about them: what they are, how to use them, and how to make your own.Read More…
  • Icon Design
    Mastering Icon Fonts on the Web: Open AssignmentWistia
    77 shares
    It’s time for another open assignment! Instead of learning something by following a number of steps, I’m going to get you to complete a task.Read More…
  • Typography
    The Complete Beginner’s Guide to Chinese FontsPink
    770 shares
    How many glyphs are there in a Chinese font set? Does Chinese have “serifs” and “sans-serifs”? What is the Helvetica of the Chinese font world? We’ll answer all these questions and more as we cannonball into the deep end of East Asian typography.Read More…
  • Typography
    Hand Lettering for Responsive Web DesignPerfect
    389 shares
    In this tutorial we’ll talk about best practices for hand lettering in responsive web design, including branding, scalability, legibility and implementation. Read More…
  • Typography
    The Lazy Person’s Guide to Responsive TypographyPreview
    239 shares
    Typography is arguably the most important part of any website’s design. A huge header on a blank white page might look like a minimalist’s dream come true, but what happens when we start start shrinking our page for smaller and smaller devices?Read More…
  • CSS
    7 CSS Units You Might Not Know AboutRuler
    1517 shares
    Today, I'm going to introduce you to some CSS tools you might not have known about before. These tools are each units of measurement, like pixels or ems, but it’s quite possible that you’ve never heard of them! Let’s dive in.Read More…
  • Adobe Photoshop
    Designing a Web App UI Kit‏ in Adobe PhotoshopWeb app ui kit preview
    410 shares
    Style guide driven development offers a hugely flexible approach to modern web design. In this tutorial I'll walk you through designing a UI (user interface) kit, whilst also explaining the decision-making that will keep our UI kit consistent and reusable.Read More…
  • Typography
    Tips to Help You Properly Mix Text With ImageryLorem
    292 shares
    In this article, we will discuss five different aspects of placing text over images that will help you properly mix copy and imagery.Read More…
  • Typography
    Improving Web Typography for Visually Impaired UsersGlasses
    148 shares
    We in the web industry often create for the majority, making our work tolerable for those in the minority. That isn't good enough. In this article we're going to examine ways to improve the typographic experience for visually impaired users on the web.Read More…
  • UI Design
    Designing an Elegant Blog Layout in PhotoshopBlog design 400px
    392 shares
    In this tutorial I am going to show you how to create a simple, elegant blog layout in Photoshop. We'll use a strong image above the fold (wherever that may be) with some straightforward messaging, followed by very clean and elegant typography.Read More…
  • Typography
    Getting the Hang of Hanging PunctuationGrand motel text effect
    432 shares
    Hanging Punctuation is a powerful typographic tool for creating optically aligned bodies of text. Unfortunately, it has been largely forgotten on the web... until now. We’ll take a look at the value of hanging punctuation and how you can partially implement it using a little JavaScript and a CSS rule which has been around for years.Read More…
  • Sublime Text
    Simple Visual Enhancements for Better Coding in Sublime TextSublime thumb
    625 shares
    Sublime Text offers thousands of extensions and settings to make a personalized code editor available for everyone. Right now, I’m going to show you some settings, plugins, themes, and color schemes to help make the coding experience more visually appealing. This won't just make your screen prettier, it'll make you a better coder!Read More…
Advertisement
Advertisement