HTML, or Hypertext Markup Language, is the language used for documents designed to be displayed on web. They are made up of codes that, when received by a web browser, are returned and rendered as web pages.
The World Wide Consortium is the international organization that sets the standards for the world wide web. They have recently release the latest evolution for HTML coding and it is called HTML5.
HTML5 features a new and effective way to classify web contents. They are called semantic elements.
How it works is that elements are wrapped around tags that indicate what they are, rather than how they may appear in the browser.
This website used this feature. Tags such as <nav>, <section>, <div>, and <strong> are used in some of the elements to make the information in each page as presentable as possible.
Take a look at the HTML codes below which was used to build the navigation bar used in this web page:
<nav>
<ul>
<li><a href="services.html">SERVICES</a>
<li><a href="blog">BLOG</a>
<li><a href="about.html">ABOUT</a>
<li><a href="index.html">INDEX</a>
<ul>
<nav>
CSS, or Cascading Style Sheet, brings life to plain HTML pages. It is the language used to style and lay out web pages, specifically the font size, color, image size, spacing between contents, or add animation and many other decorative features.
This website used simple CSS tricks to make it appealing to the user's eyes. Elements such as font style, size, and color were carefully coded in CSS to ensure easy readability. Special effects such as opacity transition during mouse hover on buttons were also an added feature of each web page. Images were adjusted using simple codes, while the navigation bar layout was created using complex tags, alongside a few scripts from Javascript. The contact form in the home page was also made using HTML and CSS.
While CSS can be complex, the most sophisticated web styles are made using a very simple string of CSS codes, combined with other programming languages. With CSS, the possibilities are endless.
Amazing, isn't it? The image on the background moves slowly as you scroll up and down the page. It's called the parallax effect, which is becoming more and more popular in modern websites.
For new web developers, this would look hard to code, but it is actually very easy. With the use of Javascript and JQuery, this effect is only made of less than 10 lines of codes. That is how powerful HTML, CSS, and Javascript when combined.
Javascript is the industry standard in creating interactive web pages, alongside CSS and Javascript.
Like any other scripting language, Javascript uses codes to generate function. Simple scripts produces sophisticated effects and functions, but more complex string of codes can make a website powerful.
Take a look at the navigation bar on this website. A few codes were used to make it pop down of the screen when the page is scrolled. Simple effect, but it gives the web page a professional feel.
Aside from Javascript, there are other languages to support web development. Bootstrap, a free and open-source framework, offers responsive features and mobile optimized styles. JQuery, also a free frameowrk, allows developers to write Javascripts easily.
Search Engine Optimization or SEO, is the process of increasing traffic to your website thereby improving online visibility and presence.
This is done by making certain changes to your website design and content to make your website more attractive to search engines. These include improving the quality of your content, making your title tag more relevant, adding meta description, adding <alt> tags to your images, and improving sub headings. Remember that search engines review your website and rank it according to your content.