HTML, CSS, PHP & JavaScript – The Website Designing

Pillar of Website Designing

Software engineering has always been said to be both art and science conglomerated together. The evolution of computers has seen the development of a large number of programming languages. There are loads of web programming languages that can be confusing especially to the newbies. If you are a newbie then you do not have worry as this article will tell you the languages you need to build good looking and powerful websites.

HTML & CSS

HTML stands for Hyper Text Markup Language. It is a language that is responsible for outputting content on your browser. By content, think of those images, links, buttons, texts and forms you usually displayed by the browser. In simple terms, HTML is the primary mother tongue of all browsers.

 

Now that the content is in place courtesy of HTML, it won’t look that pleasing to eye and this is where CSS comes in. CSS stands for Cascaded Style Sheets-it is the language used to style your web pages in the way that can appeal surfers. The heart of all graphic design aspects of a web design is the way you will play around with your CSS code. You can manipulate your texts, image styles and anything HTML with this powerful styling language. It is not a standalone language in the sense it works with HTML pages meaning that you will need to link your CSS files to your HTML files.  There are three popular ways to do this:

 

1. Linking a Separate CSS to a Separate File

   This is actually the most common way of attaching CSS rules to your HTML code. In this method, you will need to write CSS code in a separate file and save the file in your server with an extension .CSS. You will then attach the two files by a simple line of code in your header section of your HTML file.

   <link rel=”stylesheet” type=”text/css” href=”mystyles.css” media=”screen” />

   You will just have to ensure the correct path in your “href”. If your file is in another folder say “myfolder”, your path in the “href” will be myfolder/ mystyles.css.

2. Embedding CSS in your HTML

   You can also add CSS files directly to your HTML files by inserting the rules in the header tag. This can be done using the style tag in the head section of the HTML code.

   <style>
   //Your CSS code will go in here…
   </style>

   This technique can however lead to slow browsing experience as the CSS files will have to be downloaded every time someone visits a page.

3. Inline CSS

   In this method, CSS files are added to HTML elements. To do this, you will simply add style values to HTML elements. An example is given below:

   <h2 style=”color:red;background:black;”>This is a red heading with a black background</h2>

   This method will however produce code bloated with a mixture of HTML and CSS code that might give you a maintenance headache.

 

JavaScript

JavaScript is a web programming language that manipulates the behavior of web pages. JavaScript is not the same thing as Java. In fact the only similarity is that it is object oriented but other than that JavaScript is lightweight and less complex than Java. It is a language interpreted by the browser engine implying that it is a client side language. With this language, you can:·

• Make your pages responsive.
• Validate web form data.
• Create Cookies.
• Create fast client-side applications.

JavaScript is embedded in HTML pages or better still you can use javascript libraries like JQeury.

 

PHP

PHP is has grown to be a major language of web given that it is the language used to communicate with the server. It’s is mainly used in scripting web pages by embedding the code in HTML files. If you are looking to design database driven websites, then PHP is the language to accomplish that perfectly. PHP application design can be a bit tricky but luckily there are some PHP frameworks like Codeigniter, Laravel, CakePHP, Zend etc that make things a bit easy for you. The harsh truth though is that you will still have to learn coding in PHP before moving into frameworks.

 

What you need to Use PHP, CSS, HTML and JavaScript

If you are a starter  then you might be wondering how you will start making websites with these languages. It’s pretty straightforward-with the following tools, you are good to go:

• An Editor
  You will need a good editor to help in highlighting and debugging code. There are lots of good editing tools out there depending on the platform you are running. For windows and Mac users a tool like Adobe Dreamweaver will work well. If you are running a Linux computer, you could use Emacs or download Gedit.
• A Local Server
  The other thing you will need is a local server to test and debug websites in your PC. Xampp is good for this purpose. But other options like Wampp server is also great depending on your preferences.  In conclusion, keep in mind that web development is very dynamic thus you will have to keep up pace with its evolution if you are to remain competitive. Otherwise, web design and development is fun and it’s bound to get more interesting in future!

 

 Hattan Media  provides state of the art complete range of web design services.