Glossary

As with anything of a technical nature, understanding the terminology associated with HTML, CSS, and front-end web development is incredibly helpful.

General Terms

Breakpoint
The screen size at which a particular media query becomes active in a responsive design.
Browser
An application which allows users to fetch and view websites. Behind the scenes, this is achieved by looking up domain names on the DNS system, connecting to a server, downloading requested web content (code files) from the server, and rendering it into a viewable website.
DNS
The internet's system for matching a human-readable domain name typed into a browser to the numeric IP Address of a server, where a given website's files are stored.
Domain Name
The human-friendly address of a website; the address that is typed into the browser. The browser sends this address to DNS in order to be forwarded to the appropriate server at the IP address associated with the domain name.
Fluid Design
Web pages and elements of web pages that stretch and squash to fit the available space. Unstyled web pages are fluid by default.
Git
A popular version control protocol. Allows users to keep track of changes made to code and to return to previous versions if necessary.
Github
A popular website that offers hosting and management of git repositories.
IP
The address of a computer or server on the internet. A browser must obtain this address from DNS in order to communicate with a server and download site files to display.
Responsive Design
Web pages that change their layout or other styles based on the media (screen size, orientation, device type) on which it is displayed. Makes use of media queries in CSS to define how and in what context specific CSS should be used.
Semantic Code
Refers to HTML code which properly utilizes elements according to their meaning. It is code that describes the content rather than using elements simply based on their appearance.
Server
A specialized computer that stores website files and content and makes them accessible on the internet.
Separation of Concerns
This is the concept that a webpage's content and style should be kept separate in the code. HTML should determine content, and style / presentation should be left to CSS. This methodology was developed to make sites easier to maintain, re-theme, and parse.
Syntax
The parts of a code language and their proper order to make a valid statement. Just as in English statements are made of words and symbols which must come in a certain order to convey a particular meaning, so too must statements in code languages be properly constructed to achieve a desired effect.
Viewport
The visible area of a web page in a browser window. Viewport dimensions vary with different device screen sizes, orientation, and window scaling.

HTML Terms

Attribute
Additional information that can be added to some HTML elements to provide additional configuration or behavior in the browser. Attributes are written inside the brackets of an element's tag (or opening tag) and consist of either the attribute name paired with a value or just the attribute name for binary attributes. E.g. <img src="file.jpg">, where "src" is the name of the attribute and "file.jpg" is it's value.
Browser
An application / software used for viewing and interacting with websites. Browsers use take a given domain name, reach out to DNS to indicate the IP Address of the associated server, then download the code files for the webpage from the server. Then the files are read to render the webpage as described by the code. Finally, the browser continues watching for user interaction and responds as the code instructs.
Element
A discrete piece of code in HTML that defines specific content, such as text, media, etcetera. An element typically includes an opening tag, and may include attributes, and a closing tag (if it is not a self-closing element).
HTML
An abbreviation for HyperText Markup Language. It is the most basic language for websites and defines the meaning and structure of content on a web page.
Self-Closing Element
Any element that does not require a separate closing tag in addition to the opening tag. For example: <img src="">, which stands alone, as opposed to <strong>text</strong>, which requires the closing tag after the text.
Server
A special computer for storing code files and other web content. Browsers must connect to a server and download that content to render a website.
Tag
The written code associated with an element. Usually consists of the name of the element (or sometime an abbreviation) placed between arrow brackets, e.g. <section>

CSS Terms

CSS
A code language for defining the visual and presentational style of a webpage. CSS code looks for matching pieces of HTML and declaring specific rules for their presentation.
Declaration / Rule
A property / value pair that defines the style for one aspect of the selected element. E.g. padding: 2rem, where padding is the property and 2rem is the value.
Declaration Block
A chunk of CSS that includes one or more selectors associated with one or more rules (property / value pairs).
Property
Identifies which feature a CSS declaration will affect. A property is paired with a valid value to declare that a specific style should be used. Together, the property / value pair are called a rule or declaration. Examples of properties might include color, font-size, or margin.
Selector
Indicates the particular HTML content to be styled by a given CSS declaration block. Can a be a type of element, a class or ID, or various other more complex methods of identifying particular HTML.
Stylesheet
Another word for the CSS file associated with a web page.
Value
The specified setting for a given CSS property in a declaration. Each property has its own set of associated valid values. Depending on the property, a value might be numeric (400), a measurement (5px), a color (#efefef), a keyword (italic), etcetera.