The 5 Vital Components Of A Website For Front End Web Developers

May 6, 2018
Courey

When it comes to web design in todays world there are a few components that can be seen as timeless and vital to building a website. Especially as a front end web developer it is essential to know these fundamental elements to portray what viewers are looking for. So what are they and is it a lot to remember?If you know a little bit about me, I strive to keep things simple and from my studies a common theme that transcends all areas no matter what field your in is that the "vital few" really boils down to about 3-10 things.It is my firm belief that the higher the numbers it gets harder to remember.So there are many things that can make up a site and enhance them, but there are these vital few that everyone looks for when they enter or visit a site.Rather should be aware of.There are 5 things I think every basic site should include, beginning with

1. Navigation

When you think of navigation I know the first thing I think of are the navigation links or menu of a website. As this is vital for a website this is not the only way to navigate through a web page. Front End developers are key to a websites design and with this it includes how viewers will navigate through the page.Some things to think about is what is the web page trying to convey and what is the overall objective of the site. With this in mind how will you as a Front End Web Developer create the flow or the navigation for viewers to navigate through.Do you have arrows to point how to scroll or click on specific buttons? Are there visual cues or affordance cues, objects that communicate how you should interact with them? People recognize familiar patterns within our world, so how does that translate to your site to help give direction.Maybe your trying to sell a product, or have them watch a video, or maybe you want them to read the latest article from your blog post. All this comes into play when creating the flow of navigation for your web site.The next point tells visitors who you are.

2. About Us

If I came to your site there is one thing that everybody will eventually ask, or thinking.Who are you, what do you do, or simply what are you all about?This is where you let the world know all about the intricacies about you or your company. Well maybe not everything but the ideas and what you find truly important. What is your site or company about, what do you do, what do you sell, or what are you trying to promote?It doesn't matter whether the site is your portfolio, an e-commerce, or your agency/studio. Everything has a story and people want to know what it is, if they find interest in it. Like I said before 65% of communication is storytelling. How are you telling the story to visitors and keeping compelling to peak their interest.People have come to your your site to find out something about you and this is the perfect opportunity where you get to tell them your story and how you got here. Going back to the first point, navigation, it is important that visitors can find this section fairly easy.Also this is where you get to tell your goals, your philosophies, or your mission. Your audience wants to know so they can connect with you.

3. Search

So the 3rd thing is– can the viewer find what they're looking for? A search field can help eliminate the stress of navigating through the entire site to find one specific thing they want. Unless your navigation through the site is up to par and on point : ).A search bar or magnifying glass icon, an example of an affordance cues, helps for viewers to find the search bar easier. Also large search fields make it easier for viewers to type out what there looking for.The search feature is good for repeat users. Let's say for example, you wrote a blog post and a visitor can't remember the exact name of it and it was a while since you wrote the post. The search feature helps to find the post due to keywords they can look for and PRESTO they have found exactly what they where looking for.Again I say, it goes back to simple navigation, it seems this feature is outweighing everything or is involved in everything you do to design your site. Take note*

4. Contact Info

Along with knowing who you are people would like to know how they can get in touch with you. Therefore a contact section or page plays a key role. Whether it be your email, phone, or even social links so they connect with you online.Social links are imperative in todays world. People want to know what you do and your social online presence speaks volume to this generation.If your a business, do you have a physical location? This is a good place to put your address as well. Even better, for quick access, have an email contact form on the site so they can contact you directly without leaving the page.I hate to say it but where lazy and we want things as easy as possible. People do not like going out their way if they don't feel it's necessary, so save them a few seconds and put up a contact form.

5. Footer

Last but not least is your footer. I know even as I say this the question comes to mind "the footer?". Yes, the footer. Not only is the footer one of the basic structures of a website, but the footer can act as a second navigation on the page.It can include links to info such as: sitemaps, privacy policies, and company info. Some of these elements are better placed in the footer since it may not look good presentation wise on the main navigation at the top of the page. Also the search feature can be placed here as well.Consider the footer as the "fine details of information". The footer can be the subtle feature that won't get in the way of the overall design of the site. However, do not neglect the design of your footer. remember to design with simplicity in mind and consistency with the design of the site.

The Wrap Up

So that about sums the vital few of what a site needs and what viewers usually expect when they see what a site or company's site has to offer.Of course there are so many elements that make up a web page, but these other features, that I will speak on in a later post, will only enhance your site. But these 5 things: navigation, about us, search field, contact info, and the footer, are your basics that make up a good site.The Pareto principle states that 80% of anything can be found in the 20%. These 5 things are the 20% of any website.So when your on your Front End journey remember these 5 vital few fundamentals when creating your next web page.

When your ready here's how I can help

Website Copy Template

Learn my step-by-step guide to writing content for any landing page. If you want to learn a simple way to market a product or service without feeling sleazy then follow this template as your intro to copywriting 101.
Get My Template