Reasons You Should Know a Little HTML and CSS

From MakeUseOf, stored for class



You’ve heard over and over that everyone should learn to code. Alright already! But as a student going into a not tech field, why in the world should you get into coding?

Even a little knowledge of HTML and CSS can make a big difference in your career. And learning tech isn‘t just for the production assistants and print designers of the world — whether you‘re a small business owner, a sales manager, an event coordinator or even a magician, you can benefit from some HTML and CSS chops.

Sound too good to be true? It‘s not, and I‘ll give you nine examples to prove it.

But, first, let‘s review what exactly HTML and CSS are. The short and sweet version is: HTML and CSS are the foundations of the web. HTML — HyperText Markup Language — is the language used to tell your web browser what each part of a website is. So, using HTML, you can define headers, paragraphs, links, images, and more, so your browser knows how to structure the web page you‘re looking at.

CSS — Cascading Style Sheets — is the language that gives those web pages their look and formatting. In other words, CSS is what you use to make sites look nice with fancy fonts, rich colors, gorgeous backgrounds, and even slick animations and 3D effects.

Easy, right? But you‘re probably still wondering: How am I supposed to use these coding languages in my job? Well, here are just a few of the amazing things you can achieve with just a few lines of these easy-to-learn languages. Trust me — your boss or potential employer will be impressed, your colleagues will be happy and you may be well on your way to a more fulfilling and lucrative career.

Here are nine things you will be able to do with your HTML and CSS skills:

1. Design an awesome email for your customers

Email is turning out to be one of the best online marketing tools out there. And you can make an email that your customers will actually look forward to getting by organizing and styling it using the HTML and CSS editors available with most email marketing services.

2. Create a stunning corporate newsletter

Now that you‘ve impressed with those gorgeous emails, take it to the next level with a newsletter template. HTML and CSS will be your secret weapons once again as you lay out and customize the template to fit right in with your corporate brand and style.

3. Tweak your company‘s WordPress site

A surprisingly high percentage of corporate websites are built on WordPress. And this is good news for you when you know some HTML and CSS, because you can use them to add content and make changes to your company‘s site. That means no more waiting around for your overworked web team to update the office calendar!

4. Teach your colleague (or boss!) some code

Speaking of overworked co-workers, how about sharing the HTML and CSS love with your colleagues (or even your supervisor)? Then everyone on your team will be able to update and improve the website, emails and newsletters. Ahh, the joy of delegation!

5. Make your technical team adore you

The developers in your working life will thank you if you understand even a hint of HTML and CSS. You‘ll know how to tell them what needs to be changed on the company site (instead of referring to everything as a "whatchamacallit“ or "thingamajig“ as well as be more aware of the limits and possibilities they face every day.

6. Show off your skills with a perfectly-tuned Tumblr blog

Want to leave that adoring team behind and turn your passion into your profession? It‘s easy enough to set up a Tumblr blog to show off that side hustle you‘ve been working on. If you want to send a dazzling display of your freelance photography or graphic design work to that agency that‘s hiring, you can! Just a bit of HTML and CSS can take a Tumblr template from so-so to stunning.

7. Build a professional resume site — from scratch!

Go beyond just a Tumblr blog and really show some initiative by coding your own online presence from start to finish. It might sound daunting, but it‘s actually surprisingly easy to create a simple but great-looking site with basic HTML and CSS. And, boy, will you knock the socks off potential employers when you tell them you did it all on your own!

8. Take your design skills to the next level

So you‘re already a Photoshop wizard, and you can even create some impressive website mockups. Well, get some HTML and CSS under your belt, and you‘ll be able to turn those mockups into actual sites. You can become the “unicorn“ (a designer who can code) every company is looking for right now.

9. Start learning more — and earning more!

Like I said at the start, HTML and CSS are the foundation of the web. So, they‘re also the foundation for taking your tech skills to the next level. Having a handle on the fundamentals will make learning another programming language (like JavaScript, Ruby or PHP) a whole lot easier. And the more you know, the more job opportunities will open up for you.

CSS TOOLBOX: 20+ Tools For Working With CSS

CSS TOOLBOX: 20+ Tools For Working With CSS
Have you always been reliant on others’ templates for your blog or website? You’d like to customize them, but you’re just not sure how? Perhaps it’s time to finally wrestle with the secrets of CSS. This collection of CSS-related links should be a good start – from basic tutorials to advanced tools, it’s all here.

456 berea st

456 Berea Street – Numerous guides and tutorials on advanced CSS tricks. – Tool to help you clean up your CSS and optimize it. – A CSS code formatter and optimizer, but stresses it is not a validator.

CSS Tweak

CSS Tweak – Just as the name implies, upload your CSS and you can tweak it on the go.

css-ref – A tool for practicing your CSS skills or writing an actual layout. – Will create a page with up to three columns and header & footer.

CSSDrive Compressor

CSSDrive Compressor – A utility to compress your CSS saving you drive space, bandwidth and loading times.

CSSFly – An in-browser CSS editor that can also do HTML. – A tool for compressing your CSS code and allowing the file to load faster.

CSS Pagemaker

CSS Pagemaker – A simple CSS pagemaker wizard with easy fill-in-the-blank questions.

CSS Redundancy Checker

CSS Redundancy Checker – Enter URLs to let the site check for redundant calls and repetitive code.

CSS Rollover Generator

CSS Rollover Generator – Create rollover images using nothing but CSS.

CSS Superdouche

CSS Superdouche – Enter the URL of your CSS file, the site checks it, cleans it up, and gives you new CSS you can paste back in to your site.

css tidy

CSSTidy – A Sourceforge project of a CSS optimizer and parser.

em calculator

Em Calculator – A Javascript based tool for making scalable CSS design based on Em units to work easier with text size.


Layout-o-matic – A tool for helping you generate simple page layouts with several column variations.

List-u-Like CSS Generator

List-u-Like CSS Generator – Lets you create cross-browser, list based navigation bars with ease by defining all the parameters and the site generates it for you. – Generate HTML and CSS images and code with rounded corners and gradients.

Sky CSS Tool

Sky CSS Tool – All you need is a JavaScript enabled browser and you can create your new CSS page in-browser.

Spify Corners 2

Spiffy Corners – An easy to use site that generates a colored box in CSS code with rounded corners with the specs you request. – A CSS and XHTML generator to help you wrap text around an image.

YAML Builder

YAML Builder – An in-browser HTML/CSS coder with a real-time preview of how the page will look.