Behind the Curtain: HTML and CSS
Behind every website is what seems like an indecipherable mess of numbers, letters, and punctuation arranged in arcane passages. If you’re not a web developer, it can be intimidating to get even the lightest grasp of what’s going on. Luckily, with content management systems like Global Reach’s SiteViz, you don’t need to know a lick of code.
But certainly it can’t hurt to take a peek behind the curtain! So what is going on back there?
A programming language is a system for communicating instructions to a computer. Each programming language has different purposes, capabilities, and limitations. Most websites employ multiple programming languages to accomplish different tasks.
We’re going to go over the basics of the two most common front-end programming languages, HTML and CSS.
HTML (HyperText Markup Language)
Of all the web programming languages, this is the one you’ll most likely recognize. It looks like this:
<a href="http://www.globalreach.com">Visit us at Global Reach!</a>
HTML is responsible for content. Each element on a website – a paragraph of text, links, tables, an image, or a heading – is defined with HTML. Web browsers like Google Chrome or Internet Explorer see HTML code and present it on screen in a basic style.
When you enter content into a SiteViz page, you are using a visual editor to create HTML elements. (Have a peek by clicking on the 'Source' button in the text editor. You’ll see your content wrapped in HTML tags.)
But plain HTML is so boring! That’s where CSS comes in.
CSS (Cascading Style Sheets)
Color, font, patterns, animations, layout – all of this is controlled with CSS. CSS allows us to tell the browser, “Whenever you see an HTML element in this context, make it look like this.” Behind the scenes of a SiteViz website are a set of CSS files that, among other things, tell the left navigation menu to be on the left, give the page background a color and texture, and change how links behave when you hover over them. Nearly everything about your website’s look and layout is defined with CSS.
CSS looks like this:
padding: 8px 10px;
Because the CSS happens behind the scenes of your SiteViz website, it isn’t easily found, but you might be using CSS without knowing it! SiteViz allows you to create your own custom styles to re-use over and over with the click of a button. When you create a custom style, you’re creating a CSS rule.
There’s So Much More
The power of content management systems like SiteViz is their ability to manage an abundance of information and display it dynamically; this requires more complex programming languages than just HTML and CSS. The great thing about web development is that there’s always more to learn and the technology is always changing. That’s why we love what we do!
So even though we take care of all the code for you, we hope understanding the basic concepts behind HTML and CSS will make working with SiteViz all the more a breeze.