How to: Make sure your website’s code is compliant
Great design and relevant content comes together with proper coding With great design, comes great interoperability Online, every millisecond matters. Replacing bandwidth heavy elements like gradient backgrounds with CSS is the best way to trim your site’s load time. Visual elements such as rounded corners and gradient backgrounds have traditionally been done with some creative…
BY Justin Torres STAFF CONTRIBUTOR
Great design and relevant content comes together with proper coding
With great design, comes great interoperability
Online, every millisecond matters. Replacing bandwidth heavy elements like gradient backgrounds with CSS is the best way to trim your site’s load time.
Visual elements such as rounded corners and gradient backgrounds have traditionally been done with some creative image positioning, which is no longer necessary. The consortium responsible for publishing new CSS standards has worked on code alternatives to render effects like rounded corners and drop-down menus – image free.
Removing unnecessary graphics also makes maintenance easier: instead of using an image with static text for your forms, it’s more logical to create a button style so the effect can be reused with whatever text the button is supposed to display.
Clients and servers scratch each other’s back
Personal technology has advanced so far that developers will try to offload as much thinking as possible to a user’s Internet connected device. Caching your pages, pulling remote data and handling databases are all examples of backend processing and have to be coded in a server language like PHP.
The browser wars are still raging on
Browser vendors adapt CSS and HTML standards at their own discretion, and sometimes add unique property prefixes which are likely to change.
Let’s say you wanted to add a slight tilt to one of your images, a few browsers would recognize transform: rotate(7.5deg), but you would need to add -webkit-transform: rotate(7.5deg) to include Chrome/Safari and -ms-transform: rotate(7.5deg) to register on IE9.
While competition is great for web innovation, developing advanced features that work on the most devices means more time programming (likely by trial-and-error) necessary cross-browser support.
The developer’s dilemma
After the design stage and before the content is loaded, the programmer has to consider the technical capabilities of the site before structuring any of the HTML.
Trying to reach the largest audience usually involves browser hacks and workarounds that add significant development time. But this is not the right strategy. Following the latest CSS and HTML standards means for a rapid deployment and reduced maintenance in the future.
The web is full of wheels
Finding the right balance for the right audience
HTML pages themselves are a few kilobytes, but add up all of the files that make up the design and the end result can be several megabytes. This comparison may seem negligible, but every byte matters in a world of mobile data caps and hourly billing.
A poorly coded site can be slow, difficult to maintain, hurt your ranking with search engines and leave your site vulnerable to exploits. A sloppily written WordPress theme can be obsolete in 6 months. Everything from responsive design to banner slideshows have to be reviewed often to stay up-to-date and to evaluate new alternates that are constantly being released.
Code is written by humans, so like us, it evolves all time. Make sure your site is keeping up.
Have you wondered how videos get views? As you likely guessed, there is a process for YouTube’s recommendation engine.