We now have a new search element in HTML. It should be used when adding any sort of search functionality within a website or web app. Its purpose is to provide the proper semantics for search functionality within the browser. In this post I’ll show you how to use it in a couple of common search scenarios. Ok, let’s get to it.
When it comes to incorporating irregular shaped text into web projects, we often end up using images. However, there may be a better way – using inline SVG and CSS to create dynamic, responsive, and accessible graphics directly within our HTML. In this post, we'll walk you through the process of achieving this, ensuring our designs are on point while maintaining accessibility and SEO friendliness.
HTML radio buttons are a staple of web forms, but their default appearance leaves much to be desired. In this blog post, we'll walk through one of my favorite methods to customize the look of radio buttons using CSS, creating a more user-friendly and visually appealing experience.
I was lucky enough to get the invite from Matt West, founder/organizer of CodeSLO, via my coworker @schwarty to give a presentation at the CodeSLO meetup "HTML and CSS - Part 3 - Modern Web Design" meet up. This was a good time. I got to get out and talk shop with a great group of people who were excited to learn about design and the role it plays on the web. My talk went a little over thirty minutes and covered the basic principles of good design: contrast, repetition, proximity, alignment, layout, typography, color, and more. For those that were unable to attend, feel free to take a look at the slides to see what you missed...
For those of us who are used to working with XHTML this is going to seem a little odd but, with HTML5, we no longer need to add a trailing slash on self closing tags like images and inputs.
With all of the great frameworks popping up it can be difficult to choose the "right" one. Besides doing some really great things, probably the two most popular frameworks [Twitter Bootstrap](http://getbootstrap.com/2.3.2/) and [Zurb Foundation](http://foundation.zurb.com/), can be a little overreaching at times when it comes to theming them. You may find that you have to overwrite and undo many styles to make them look unique. This is where web developer [James South's](https://twitter.com/James_M_South) [Responsive Boilerplate](http://responsivebp.com/) may prove to be that "right" one.
CSS provides us with a handful of pseudo classes that are specific to HTML5 forms. They allow us to create forms that are easier to fill out by highlighting fields that are required, optional, valid, invalid, etc.
With HTML5 we have been given new input types (email, tel, url, number, etc.) and built in browser validation to validate them. This is great but you may want to disable this validation if you want to test your server side validation, use custom validation, or something else.
AngularJS is a newer JavaScript framework geared towards the creation and maintenance of single page web applications. It is considered to be a “toolset for building the framework most suited to your application development” meaning that, for the most part, you can choose the elements that you want to use and swap out those that you don’t want with other libraries/frameworks of your choice. It is built and maintained by Google and is open source with an MIT license.
The HTML5 mark tag was created in order to highlight text within a document that is relative to another context. This is perfect for highlighting the search term in a list of results.
Have you ever wanted to automatically place the cursor in a field when the page is rendered? I know I have.
Anyone who's ever had to create HTML emails knows that it sucks. You have to write old, crappy, code and inline style everything. You have to use tables because more modern float layouts just don't work consistently across the bagillion email clients that are out there. Overall, I would say that they are probably my least favorite part of the Job. But, they don't have to be. Thanks to the great folks at [ZURB](http://zurb.com/) we can hit the ground running when developing HTML emails.