Should Front-End Developers Only Learn HTML?

It seems that some people have this idea that front-end development is easy. Truth be told, it is just as difficult in some ways as back-end development. True – a front-end developer generally does not need to make API calls or need to get information out of a database and all that wonderful stuff. But does that mean that a front-end developer should only learn HTML? 

Not at all. There is far more to front-end development than just HTML. So, what should a front-end developer learn?

Of course, a front-end developer has to learn HTML. HTML is the basic structure of every webpage. It is the basis for the styles that are created in CSS. If you do not use HTML your website will be a mass of text with no structure to it. Think about creating an MS Word document. If you do not use the various editing tools like headings, paragraphs, bold, italics and all the rest your document is generally very difficult to read and does not scan well at all. HTML is just like those editing tools in Word – only more flexible and there are far more tags than tools. 

Essentially, with Bootstrap and a good understanding of HTML, you can build a responsive website. It will be fairly bland, but you can do it. Of course, then you need to jazz it up a bit with styles.

So, once you have managed to learn HTML, it is time to learn how to make that HTML look really good. This is where CSS comes into the picture. CSS makes us of the tags and classes in HTML to apply a specific look to them. You can change colour, alignment, size, background colours and all kinds of other things with just a couple of lines of code. The fewer lines the better, of course. 

Once you have CSS down and you understand how the various nesting options with HTML relate to CSS it is time to learn SASS or LESS (or both if you have the inclination). LESS and SASS are pre-compiled versions of CSS. They allow you to declare and use variables. It is far easier to do nested styles when using SASS or LESS. If you set up your LESS or SASS files correctly you can change the entire colour scheme or base sizes of a site by adjusting a couple of variables and running the stylesheet through a compiler. This makes editing and modifying styles a lot easier and far faster.

When your mission to learn HTML and CSS is done and you can create amazing looking websites, it is time to look into something a little more complex. jQuery or JavaScript allow you to make changes to your code on a dynamic and interactive basis. You can apply styles or insert code based on the actions of the user. A button that is clicked can open a modal or expand a menu. Content can be made to animate and flow into or out of the page based on where the user is on the page.

The user experience is a major part of front-end development. It is no good creating a beautiful website that is simply not usable. Learning UX starts with learning about how people interpret certain signals and where they tend to look on a page so that you know where to put the elements that are most important. 

It is about ensuring that you offer the user the best possible experience and direct their attention where you want it to go. A good user experience will lead to a better conversion rate.

It is not easy to build a website if you have no concept of design and layout. A good thing for a front-end developer to learn is web design. This is not for everyone. Design is a fairly creative process and not all developers are creative – they are simply too logical to be able to see and feel the colours and fonts and layouts. If you are creative, take the time to learn graphic design, even if it is just the basics.

If you are not the creative type, then at the very least learn to use the most common design software. This is usually Photoshop and Illustrator. At least you will be able to get a design from the designer and open it and be able to get the right sizes, fonts and colours for your development.

So you see, a front-end developer does not need to only learn HTML. There is a great deal more to it than just structure.