The reality is that you can choose to create a site using the tools available or by getting into the nuts and bolts of programming languages and services. Regardless, there are a number of basic things every web developer should be aware of regardless of what level of complexity you choose to use. Ironically, many of the more important things are simple, yet overlooked!
Thing 1: How to Pick a Common Sense Name
Common sense should be used when naming your web site. This not only includes titles and pages on your site, but more importantly, the name of your domain. While quirky, fun names can sometimes work, they can also fail if they don't have some connection to what your site is trying to accomplish. Additionally, odd spellings or misspelling of words in a domain name can cause you to lose a lot of traffic. You are better off picking something easy to remember and easy to spell than something that is quirky with odd letters or dashes. If people can't remember or find your domain because of an odd name, then everything else you do is pointless!
Thing 2: How to Optimize Images
Web sites are loaded with images and graphics of various sizes and types. While bandwidth is getting larger and throughput is faster for many people, it is still important to make sure you don't use excessively large image files. For example, many cameras can now take images that are at 4K resolutions; however, most people are not browsing sites on 4K monitors, nor do they need large resolution images. Reducing the size and resolution of images to what is good enough will help your web site load faster, which can in turn result in better SEO rankings. There are numerous free tools available for optimizing sites. The article, So You Want to Optimize Your Images, here on HTMLGoodies shows one such free tool.
Thing 3: Understand What SEO Entails
If you are building a web site for yourself, then understanding what SEO is and what it can do is not important. You can move on! If you are building a site that you want others to find, then you should have a basic understanding of SEO, which stands for Search Engine Optimization. SEO is a process of creating a web site that is optimized for pages to be found and ranked within the search engines. There are a number of simple SEO topics, some of which overlap with the things mentioned in this article.
You can get a quick list and overview of SEO in the article So You Want to Do SEO on Your Site…. In this article, you learn about using clear HTML, setting up proper titles and headings, including meta data, backlinking, and much more! All of which are simple to include as you build a web site.
Thing 4: Understanding Layout Concepts
Years ago, site pages contained primarily flat pages with text and images much like a magazine article. Things evolve with time, and web sites are no exception!
When laying out your web site, you should take into consideration concepts such a scrolling, being reactive to different browser widths, and even printing.
As an example, scrolling up and down is common, and people are not generally bothered if they have to scroll down a page. However, scrolling left and right to read content on a page can quickly irritate someone trying to read an article. As such, avoiding horizontal scrolling is important. Having said that, on mobile devices, swiping right or left to scroll through a slideshow does make sense, especially if your layout includes visual cues that such scrolling can happen.
In building modern web sites, responsive designs have become the standard. These are designs that adapt based on the user and the device on which content is to be viewed, which leads to the next Thing!
Thing 5: Understanding Platform Differences
Understanding that a web site can be viewed from different platforms is critical. In today's crazy world, people are using desktop computers, tablets, phones, and other devices to access the web. While you can choose to ignore this variety, the more your site responds and displays content that fits the device, the better the user experience will be for those coming to your site. A better user experience should result in higher engagement and higher return visits.
A big area to watch for in this regard is, again, your images. If you are using wide images on your site, these might not translate efficiently and effectively on smaller mobile devices such as phones. Similarly, while a desktop system can often display a three-column layout without issue and in a pleasing manner, this is rarely the case on a mobile phone. If you are building a web site, you need to keep this in mind from the beginning of your site planning!
Thing 6: Know the Popular Browsers
Just as you need to keep various devices in mind when designing and building web sites, you also need to be aware of the most common browsers. While it would be nice to assume that all popular browsers operate the same, it simply isn't true. The easiest thing to do is to simply review your site on each of the popular browsers. This would include Firefox, Microsoft Edge, Chrome and Safari, at a minimum.
Thing 7: Know Basic Testing
The last three things lead to Thing 7, which is that you need to know basic testing strategies. More importantly, you need to actually do a bit of basic testing! This doesn't have to be complicated. While you can do complicated, formalized testing, most people unfortunately don't. At a minimum, there are a few things you can, and should always do.
First, you should simply make sure your web site loads and displays. You should open your browser on a system other than your own and load each page to make sure they work. You should also click each link you have included to make sure they work and go where you expect. You should perform this on each of the major browsers (Thing 6) as well as make sure your pages load cleanly on various platforms (Thing 5).
Thing 8: Know How HTML Works
While there are many tools available that let you create web sites without ever looking at code, understanding HTML will enable you to better address issues that come up with your web site. HTML is an easy-to-understand mark-up language. As such, by knowing what the common tags are and how they work, you will be able to better understand how your site is being displayed and what could potentially be the issue if something is displayed oddly.
Thing 10: Understand Copyright Rules
Just because you find something on the Web does not mean you can copy and use it on your own site.
Images, text, and even layouts can be copyrighted. If you copy an article from another site, you could not only be plagiarizing, but you could also be violating another person's copyright. This can lead to legal action and fines against you. Copying images is where many people run into trouble. Images are generally copyrighted and require not only licensing, but often a payment of royalties to use. Images such as logos, popular characters, and product names can also be considered intellectual property of companies and the creators. Using them without proper permissions can be illegal. As such, you need to pay attention to licensing and make sure you are using any content you get from other sites in a responsible, legal manner.
These are ten basic things you should know and understand regardless of your level of involvement with building web sites. Whenever there is a list created like this, many people will disagree with some of the items listed and others will say there are other items that are more important that should have been included! This is my list based on decades of working with popular web sites such as HTMLGoodies, Developer.com, and CodeGuru. If you have your own ideas of what should have been included, or what should not have been included, feel free to post a comment and share with the rest of us!