Author: Jon Penland

Jon is a freelance writer, travel enthusiast, husband and father. He writes about web technologies such as WordPress, HTML, and CSS.
  • Logical Tags

    (adsbygoogle = window.adsbygoogle || []).push({}); Note: this article is presented for historical value only Logical tags are now often referred… Read More...
  • How to Create a Newspaper-Style Column Layout

    How to create a newspaper or magazine style column layout using the CSS columns property. This tutorial includes examples of how to implement all CSS columns properties including count, width, gap, rule, span, and fill.
  • How to Create Responsive Menus with CSS

    Tutorial on creating fully responsive vertical and horizontal navigation menus including responsive drop down menus that open on click without requiring any JavaScript.
  • How to Create Simple Image Transformations

    Image transformations are a common feature of modern web design. This tutorial will teach you how to use CSS to transform an image when a website visitor hovers over it.
  • Form Styling and Design

    Learn how to design and style a form to make the best use of the available space and produce an attractive visual design.
  • Form Usability and Accessibility

    In this tutorial, learn how to make forms that are accessible and usable by implementing proper design principles and HTML features such as the tabindex attribute and label element.
  • Getting Started With Forms

    Learn how to use text, email, phone, radio button, checkbox, submit, date, and text area form elements in this tutorial as we create the front end of a reservation request form for a fictional hotel.
  • Fonts and Web Typography

    A complete reference to font stacks, web fonts, and web typography. Learn how to design and set the presentation of text on your website.

    In this section we'll talk about setting the fonts in your page: maki

  • HTML Document Meta

    The head element of an HTML document contains instructions for web crawlers and browsers about how to understand, index, and display your website. In this tutorial you'll learn about the most important pieces to include in the head element and the proper syntax for each.
  • The Rules of ALT

    Every image element on a webpage should include a text alternative as a fallback for visitors who aren't able to view the image as well as those using screen readers. Craft text alternatives properly by following these guidelines.