Skip to main content
General WebWeb DesignWeb Development

The A-Z of Web Design

By 3 February 2016No Comments
web design a-z

Web design is a complicated business with quite a lot of jargon. It can be confusing for us mere non-designer mortals. But that’s why I have put together a simple A-Z of all those words that may crop up in a conversation for all things web design. Say goodbye to awkward nods at impossible words and going home to fill search engines with “define (insert horrid technical word here)”. Let’s be honest, we’ve all been there.

A is for accessibility.

Accessibility determines whether or not a web design is easy for users to navigate to. It is imperative that web designs can be viewed from various platforms and devices as well as an array of search engines and referral sites.

B is for browser.

What the web design will be viewed in. Every browser is different from Chrome and Safari to Firefox and Mozilla. Therefore, it is important to remember that web designs have to be compatible with all of these. Reading up on the specifications of each widely used browser will provide the information and criteria a design has to fulfil in order to be accessible across the board.

C is for content management system (CMS).

A content management system is where a web design, as well as updated content, can be inputted. Although not compulsory they are handy if people with little coding knowledge are going to be updating the website constantly as they all have a rather simple user interface. Some examples are WordPress, Drupal and Sitecore.

D is for domain.

A domain is the URL name at which a website is accessible through and what potential users will type into their search bar to access it. For example, our domain is The best domains are made more searchable by having a shorter and more relevant URL.

E is for elastic layout.

A web design layout that allows a design to be viewed based on the users’ preferences for font size on a browser. The larger the font size preference the larger the resolution of the web design will be. Larger or smaller, the web design will always adapt to what the users’ preferences are.

F is for fold.

This represents the invisible line that sits between the top of your page and the rest of your page which is only accessible if you scroll down. There is an ancient myth that important pieces of information should only be above this invisible line. However, we busted that myth wide open when we spoke about how to optimise user experience.

G is for graphic design.

Graphic design comes hand in hand with web design. After all, every website needs exciting visuals that can inspire users and generate engagement. That’s where the graphics come in. Graphics can be anything from logos and micro-interactions to header images and clip-art.

H is for HTML.

The language that is used to create web designs. Of course, there are many tools that you can use instead of hard coding HTML but this is where the basis of web design was formed. HTML can be used for many projects large and small, complex and simple. A few things for beginners to try out would be page titles, paragraph layouts, list layouts and table layouts.

I is for inline style.

This is a form of HTML that can be applied to one line of code. For instance, if the style of one line of text on a website was different from another, this is because inline styling has been included in the HTML as part of the CSS. As inline styles are applied to one line of HTML they override any other CSS that has been implemented into the code.

J is for JavaScript.

Similar to HTML JavaScript is a coding language that helps designers and developers alike create a website.  JavaScript is primarily used to create interactive effects within a web design.  It adds functionality to a web page which allows it to respond to actions of users.

K is for keywords.

Keywords represent what search terms the website wants to potential rank for on search engines. However, the website owner has complete control over this. It is important that the keywords chosen are relevant to the business and brand.

L is for liquid layout.

Also known as a fluid layout a liquid layout is similar to the elastic layout however it takes the users percentage preferences into consideration instead of font.

M is for metadata.

A set of data that describes and gives information about other data. In this situation, the metadata would be describing the web page. This includes page meta-descriptions and meta-tags which helps bots and search engines crawl the site to determine how it should rank in search results. They also help describe the page to potential users.

N is for navigation.

This includes everything that comes along with menus, sitemaps and how users can navigate through a web design. The best web designs have a simple yet effective navigation that doesn’t confuse the users or disrupt their flows. For example we’ve put together some websites with the best navigation here.

O is for objectivity.

Web designs should always be produced without the influence of personal opinions. What one person doesn’t like about a design may actually benefit the target audience of the proposed website. Feelings and personal taste should always be put aside so that the true purpose of the brief can be fulfilled.

P is for plugin.

Plugins are a great way to optimise web designs and their functionality without having extensive knowledge of coding. The term plugin is used in the CMS WordPress, however, other platforms have their own equivalent. For instance: Joomla has extensions and Drupal has modules.

Q is for quality.

Every website needs to be of a high quality. If it doesn’t blow a user away likely chance is that they will not return. Web designs need to amp up the quality if they are expecting amped up traffic figures and conversion statistics. When it comes to web design quality trumps quantity every time.

R is for responsive.

Everyone knows the importance of responsive design and how it affects a website’s visibility. For a web design to be fully accessible it needs to have a responsive design. Remember, responsive is not just mobile; it adapts and shapes itself to fit the users’ browser and/or device.

S is for SEO.

Search engine optimisation. Ultimately this is what determines a website’s visibility within search engines like Google, Bing and Yahoo.

T is for typography.

Typography is a large element of web design and contributes to an even larger section of a web page. It should be based on the personality of the brand or business and be an extension of the design itself. Using it well can utilise a design by a great amount, you can learn more about how to do that here.

U is for usability.

How easy is the website to use? How easy is it to navigate through the web design? Is the web design responsive?  These are defining questions when it comes to the usability of a web design. Having greater usability is a huge advantage and is a well-researched way to combat high bounce and exit rates.

V is for validity.

Whether or not a website is valid depends on a variety of factors such as the organisation of design, comprehensible layout and overall reliability. Validity is a determining factor when it comes to the quality of a website too.

W is for web standards.

Similar to quality however a lot more official and legal. Web standards are the formal, non-propriety technical specifications that define and describe aspects of the World Wide Web. Without these, the internet which hosts every website in the world would certainly be in disarray.

X is for XHTML.

Almost identical to HTML, XHTML reproduces, subsets and extends the latest version of HTML (HTML 4.0). XHTML, however, has a set of rules and conformities that the code has to adhere to. This allows the code to be readily processed for the most up to date browsers and the browsers of the future.

Y is for Yahoo website builder.

And how a web design shouldn’t be like this. A bespoke website powered by code or CMS based templates are always more powerful than what this tool produces. However it has taught many designers about the biggest web design mistakes. It isn’t updated anymore either. Steer clear.

Z is for the Zurb framework.

Zurb frameworks are a selection of codes which can be customised to create various elements for websites. Think of them as coded templates. Anything can be created with Zurb framework from buttons to contact forms. However coding knowledge is still required to customise them.

That’s the end of our A-Z but stay tuned for more web design and web development posts in the future!

Until next time, happy designing!




Leave a Reply