Glossary of Web Design & Development Terminology

Ever experienced a GIF that made you ROFL? Do you know the difference between CSS and a CMS? Unsure if you’re ‘clearing your cache’ the right way? WYSIWYG  – um what!?

I know what you’re thinking. Web designers all around are guilty for living in their own world of geek speak and designer tongue. Never fear though – dealing with a Brisbane web design company doesn’t have to be a crazy attempt to communicate with the space people. In fact it can be far from it.

A crucial part of a web designer’s job is to make the communication between us and you ultra simple. No confusion, no fluff, which means, minimising the geek speak! Sometimes though we just can’t avoid it, so to avoid any confusion, here is a list of common design and development terms & their meanings. Hold on!

BROWSER – Is what you are viewing this article in right now! Tada! Primarily used to access the inter web, the most common browsers used are:

Different web browser icons - web design & development
Different web browser icons – web design & development

 

Designers everywhere have a love hate with browsers. Every browser is different in the way it displays things, and only some of them will support the latest coding techniques. To ensure the BEST web experience, do yourself a favour and keep your browser updated – this way you wont be missing out on any of the cool stuff.

DOMAIN NAME – Put simply, a domain name is the address of your website on the Internet. (google.com.au) Domain names are essential for any website, and come in a huge range of extensions specific to your country. Australian extensions include: .com and .com.au

URL – Standing for Uniform Resource Location, a URL is the global address of a web page and looks like this: http://www.domainname.com.au/. A URL will include your domain name after http://www. You will find the URL (or web address) in the address bar at the top of your browser…

WEB HOSTING – Think of web hosting as a ‘parking space for your website on the Internet. Depending on your website requirements, web hosting will vary from customer to customer but all in all – it’s the same thing. Domain name + web hosting go hand in hand and you can’t have a website without these 2 love birds.

CACHE – Remember how browsers save a copy of previously viewed sites? Well, the computer stores them in a folder called the ‘cache’ . Not to be confused with cash – or we would all have pockets full

REFRESH – Been told to ‘refresh the page’ before? If not then you must be all over this one like white on rice. Go you. Browsers are designed to download previously viewed webpages and save them on your computer. This means when you view a page for the second time, it loads quicker. The problem with this though is; you may find that what you are seeing isn’t the most recent update of the site. If in doubt hit refresh!

Refreshing your browser is as simple as pushing a few keys on your keyboard:
Windows: ctrl + F5
Mac/Apple: Apple + R or command + R

SCREEN SHOT – Is a way of taking a quick snap shot, photo or picture of your computer screen. These are very handy when you are trying to show your designer an issue with your site – instead of trying to explain the issue, you can take a screenshot & email it to them! Screen shots are your best friend, go and give it a try…

Windows: alt + Prt Scr (Print Screen)
Mac/Apple: command + shift + 3 (takes picture of entire screen)
Mac/Apple: command + shift + 4 + select area (takes picture of select area)

PROTOTYPE – You may already be familiar with this as part of the Media Heroes process. A web prototype is a visual and interactive look at what we imagine your website will look like. It enables your designer to gain feedback from you to get the visual aesthetics spot on before going ahead & coding the nuts & bolts of it within the web development process.

FAVICON – This little guy is super cool. His name is the ‘Favicon’ . A visual graphic used as your website icon, shortcut icon and bookmark icon. When you visit a website, the favicon will display next to the web address or in the top left of the tab. Cool Huh!

NAVIGATION – Your designer may have asked you this before: “Is there any other pages you would like in your navigation” – what they’re referring to is your website’s menu! The most common place for your navigation is at the top of the page. It allows for your users to access any page in your site from 1 central location. Also referred to as: Nav, Menu, Main Menu

HEADER – Yup. You guessed it, the header is the very top of your website & contains all the important things like:

  • Navigation
  • Contact numbers
  • Company slogan
  • Social media links
  • Shopping cart & Items
  • Anything else your designer feels is super important

FOOTER – Much like the ‘header’, the footer is placed at the foot or bottom of your site and contains much of the same information with the addition of:

  • License numbers
  • ABN numbers
  • Accreditations
  • Copyright declaration
  • Terms & Conditions
  • Any other links or relevant information

The footer is great for a long scrolling website as users can easily get around the site using the nav at the bottom saving them from scrolling back to the top.

CAPTCHA – True to its name, a ‘captcha’ catches all the baddies coming through to your email inbox from your website form! By having a code that requires user input, it is an effective method to stop spam bots sending you ‘fake’ enquiries. We recommend that all website forms have a captcha. A captcha commonly looks like this:

Captcha codes - web design & development
Captcha codes – web design & development

 

BREADCRUMB – You remember the story of Hansel & Gretel don’t you? In this case breadcrumbs aren’t bread, but navigational elements that act as a trail through each sub page you have travelled to the page you are currently on. Breadcrumbs commonly look something like this…
Home >  Shop > Footwear > Boots > Black

SITEMAP – Sitemap means website map. Is a list of pages in your site that is accessible to crawlers or users. Sitemaps generally come in 2 types of formats…

HTML Sitemap: Designed for the user, typically styled like the rest of your website. This page is super handy when users are trying to find a certain page or content within the site.

XML Sitemap: Is a structured format for SEO. It tells the Search Engines about the pages in your site, their importance to each other, and how often they are updated. Search Engines love sitemaps!

404 – Ever stumbled across this before? A ‘404 Error’ basically means that the page you have tried to view can’t be found on the site. Reasons could be that the link is wrong or the page has been recently removed. 404 Error pages don’t need to be boring and dull, they can be really creative to emote fun out of a simple error. Like this 404 page from ONMedia:

Custom 404 error pages - web design & development
Custom 404 error pages – web design & development

 

The default alternative is something along these lines….

 

I know which one I would prefer to land on…

Standard 404 error page - web design & development
Standard 404 error page – web design & development

 

.JPG – .JPG also referred to as .JPEG is the most common file format for photographs and images. JPGs are great for the web because they can be optimised; meaning the file size can be reduced while still retaining good visual quality.

.GIF – Another popular image format for the web. .GIFs are commonly used for images that have a very limited and solid colour pallet. Because of the small file type – depending on the image, your designer may opt to use .GIF over a .JPG.

HTML – HyperText Markup Language, is the main language for making web pages display inside browsers. HTML is the basic fundamentals & building blocks of a web page. It is sometimes referred to as ‘the website code’ if speaking to a designer, much of which will look like this:

HTML code - web design & development
HTML code – web design & development

 

HTML & CSS together work like magic.

CSS – CSS stands for Cascading Style Sheet and makes up the style of your website. It controls the colours, the layout, the fonts, the text size, the positioning and alignment, and is all contained within 1 single file. Making changes to the CSS is very easy for your web designer – depending on how extravagant your requests are

Throughout the years we have seen different versions of CSS come about, right now we are deviling in CSS3 which has a lot of rad features to your typical CSS. Things like animation, rounded corners, and drop shadows have never been easier!

CROSS BROWSER TESTING – Ask any designer about cross browser testing, and watch them squirm. When any website is built, it must be tested across multiple browsers (IE, Mozilla, Chrome, Safari) to ensure people viewing it on those browsers can view the site at its best. Cross Browser testing is an absolute MUST for any website and is a skill most valued in Brisbane web designers 😉

W3C – W3C simply stands for The World Wide Web Consortium (W3C). Having a website that is W3C Compliant means that the written code has passed the standards set out by the W3C group – It is correct, compliant, and of standard!
Refer to my earlier article on W3C for more information here

SEOSearch Engine Optimisation is the very specialised process of pushing the visibility of your website onto the search engines search results. In other words – being found on Google! SEO is a very powerful and effective Internet marketing strategy. When implemented the right way it can achieve powerful outcomes for your business.

Because of the competitive nature of the inter web and the specialist area that is SEO jump on over to our specialist SEO page to find out the basics about this amazing discipline.

CMS – Content Management System – is a web application designed to make edits and maintenance of your website content super easy. CMS’s hold a rightful place in the industry, however there is a time and place for them – your web designer will know when it is appropriate or not. The beauty is you don’t need to be a designer or developer to get around it, just some simple training from your web hero should see you right.

ACTIVITY FEED (FROM FB, TWITTER) –  Updates from your social media account that feed onto your website are called ‘Activity Feeds’ . These keep your web users updated and engaged and acts as a pathway in joining the 2 channels together. If you have a website and a social media account, we strongly suggest linking them up with an activity feed.

RSS – RSS stands for Really Simple Syndication or Rich Site Summary and is used to automatically update subscribers of new content or news published by the author. By subscribing to a blogs RSS feed, you no longer need to keep re-visiting a website for new updates, you will automatically be notified of them from the comfort of your own browser. How intuitive 😉

PHP – In it’s simplest form, PHP is a coding language used to add functionality to any website that HTML cannot achieve alone. PHP can interact with MySQL databases meaning your site can be as dynamic or complex as you need it to be. PHP is the domain of your web development Brisbane team and where the functional magic happens. The possibilities are truly endless!

ASP and ASPX – Developed by the guys over at Microsoft, ASP.NET is a server side web application framework designed for web development to produce dynamic pages.

BLOG – A blog is quite simply a discussion or informational section of a website that consists of entries (also called posts) arranged in chronological order with the most recent entry appearing at the top. Including features like comments and links to increase the user interaction blogs are great for business owners to inform, advise and grown an audience. Google loves a good blog!

WORDPRESS – Is a type of CMS – the chosen choice of our heroes! Depending on how wordpress has been used with your site, it provides a super easy way for you to edit and manage your website content, or parts of it.

The possibilities of wordpress are endless; being open source means the code is readily available to anyone who wants to tinker with it, making it extremely customisable to suit your imagination. Lets not go there though; I will leave that to the developers

PLUGIN – Generally Plugins refer to additional features and functionality that can be ‘plugged in’ or ‘installed’ into existing software. At Media Heroes we typically use plugins alongside word press. This lets us create anything imaginable!

EXTENSION – In web terms, the extension indicates the type of file it is. For example, the extension .JPG is an image file. The extension. DOCX is typically a word document. In web design and development there are many different file extensions we use on a daily. Here are some of the most common ones ( .GIF, .JPG, .PNG, .PDF, .PSD, .DOCX, .CSS, .HTML, .PHP, .JS )

MYSQL – MySQL is the world’s most popular choice of databases used in web applications. It is generally linked up to your blog, or ecommerce store. Typically the database contains ‘data’ which can be pulled through to your website creating a powerful and reliable dynamic environment. Ask any Brisbane web developer and their eyes light up with what’s possible with MYSQL, so be warned!

OPEN SOURCE – In production and development, open source means that the source code of the software is freely available and can be modified, customized and re-distrusted. By letting anyone who is interested in modifying the source code, the software generally becomes more useful and error free. WordPress is a great example of open source software – the growth, support and documentation provided by dedicated WordPress Developers world wide is astonishing.

RESPONSIVE DESIGN – A responsive website is a website which responds to its environment. Desktops, Laptops, Tablets, & Smart Phones are no problems for responsive sites, they will simply adapt themselves to fit! We love a good responsive site in the office – Refer to my earlier article on Responsive & Mobile Websites here

MOBILE WEBSITES – A mobile website is a separate entity of your site that is sitting on a different url (eg: mobile.abc.net.au). Its true to say that mobile users require a completely different experience than desktop users; this is where mobile sites become super handy.

Mobile sites are generally stripped back to show only relevant information people on the go need at their thumb tips – less text, larger headings, clear call to action buttons, directions & maps to business locations & click to call phone numbers.

ECOMMERCE WEBSITE – Ecommerce referrers to businesses and consumers buying and selling products online. The majority of ecommerce websites on the Internet are retail stores selling products directly to the public.

MAGENTO – An open source ecommerce platform used to provide customers with a flexible and powerful online store. Coming packed with an intuitive admin area, Magento allows store owners to take full control of their stock and manage payments and orders online.  Magento is perfect for big online stores and is powerful enough to configure/group products in a variety of ways based on colour, price, size and so on. Depending on your requirements, Magento is the chosen choice of eCommerce platforms here at Media Heroes, with some expert training from our Magento expert you can be running your own online business in no time! Note – Magento isn’t for the faint hearted 😉

JIGO – Meet the baby brother to Magento. Jigo or Jigo Store is a ecommerce plugin for WordPress for customers who want to run a small online business or product catalogue. Stock, orders and Payments can be managed by the store owner. Payment options include: PayPal, PayPal Pro, Bank Transfers, Or payment on pickup!

SSL – SSL stands for Secure Socket Layer and is a security blanket between servers and browsers to handle secure online transactions from your ecommerce store. You can typically tell that the page is secure by the web address. Rather than http:// the url will be https:// . A SSL certificate may be recommended to you by your web hero depending on your store needs.

SIMPLE PRODUCTS – With Magento, there are a few different types of products you can set up. Simple products generally refer to a product within your store that has a single configuration – a one size fits all type scenario. This could include items such as…

  • Small Lamp (8”)
  • Large Lamp (20”)
  • Bat Man Figurine (6”)

CONFIGURABLE PRODUCTS – Configurable Products in Magento are for products which are available in a variety of options. For example your online store might offer sneakers in 3 styles (low cut, mid cut, high top) and 3 different colours (black, white, grey) and 2 types of material (canvas, leather). Configurable products such as these are more complex than simple products but are fantastic for more larger web stores that need these additional options available to shoppers.

Wooooo! How’d you find that?! Feeling a bit Heroic?

That was just touching on the surface of everyday terms here at Media Heroes. Julian, our digital copy ninja has put together a nifty little dictionary of Digital Marketing terms which covers all things from Facebook to Email Marketing to Conversion rates and all the juicy bits in between.