At mark-making* we are aware that sometimes the industry jargon gets the better of us. However, we also know that hiding in amongst the jargon are some genuinely useful technical terms.
So, for your information, we have compiled a series of web glossary blog posts, a bluffer’s guide, if you will. Starting at the server end of things and working forwards towards the bits of a website that the user actually sees, our developers have picked out and explained some terms that might come up in meetings, or get dropped into emails.
Part II is made up of terms to do with front-end development. We’ll talk about the construction of the site and the way it looks – mark-up, presentation and styling.
(If you missed part I, you can catch it here.)
When loading a web page, a computer receives a lot of data detailing visual instructions about how the page is supposed to look. Rendering is how a computer makes graphics, after running the code that contains these instructions. A simple and very common example is a web browser window after it has run a CSS file.
Different browsers have different rendering engines, this means they carry out rendering in slightly different ways whilst aiming for the same final result. Sometimes the same rendering result across all browsers is easily achievable, and sometimes it is more complicated.
‘Cross-browser’ compatibility testing is carried out so to ensure that the website will work in more than one browser. The bulk of internet surfing is carried out in browsers like Chrome, Safari, Firefox, and Internet Explorer in its various versions. Part of the challenge in web development is building a site that will work and look good consistently across all the desired browsers. Fallbacks are provided for anything that is unsupported.
System fonts are those that come pre-installed as standard on operating systems. Microsoft includes Arial and Times New Roman in its Windows operating systems; Apple includes Helvetica and Palatino on its operating systems.
It used to be the case that fonts used on the web were pretty much limited to system fonts. If a certain company logo used a font that was different or unusual, it would have to be turned into an image, which is bad because text in images cannot be crawled as plain text, therefore earch engines can’t ‘understand’ it. Now with the huge range of web fonts available, we don’t have this worry any more. Web fonts are those which are not available on an operating system, but instead are retrieved from a web server.
Designing a web page to be responsive most commonly entails designing it to work and look good whatever the size of the screen it is being viewed on. More complex applications include taking into account the colour-count of the device in question, and the pixel density of the screen.
iframe (in line frame)
Externally embedded content is placed in an iframe and can only be modified at source (e.g. an embedded YouTube video).
Your browser cache stores some information from the websites you visit. The next time you visit a site, your browser will check the cache for any information. The information stored in the cache helps the page to load more quickly. You may need to clear your browser’s cache in order to view the most recent version of a web page.
Ajax requests make updates to a page without reloading the whole thing. It can be faster because you’re only requesting a certain segment of information. The most common examples include ecommerce carts that auto-update, and Facebook comments.
A few languages to note…
CSS is the acronym for ‘cascading stylesheets’. It is a coding language that describes the presentation and formatting of a web page.
And to finish
Stay with us – some file formats.
- GIF – A file in graphics interchange format is an animated image, often characterised by a frame-by-frame motion. GIF is a ‘lossy’ format: when uploaded, it will be compressed and could lose clarity and quality. GIF can only support 256 colours (which isn’t that many), and so is not such a great format for demonstrating subtle shifts in colour. GIFs can be transparent, too.
- PNG – Portable network graphic is a ‘lossless’ image format. It won’t be compressed, and therefore won’t lose quality. It’s commonly used for transparency purposes.
- SWF – Stands for small web format. It is usually a container file for Flash animation files inserted into HTML documents.
- JPG – Named for those who developed it [Joint Photographic Experts Group], JPG is also lossy. It’s a compressible image format that reduces file size without compromising quality. JPG is best used for photos.
Phew! Made it.
We hope we’ve cleared up a few terms related to the graphics and visuals on a website. If you have any questions, leave us a comment and we’ll answer as soon as we can!
See you next time for part III, a detailed look at words related to digital projects and everyday content management.