HTML Flashcards
(14 cards)
What does a doctype do?
declares what type of html version the page is using.
How do you serve a page with content in multiple languages?
use the language attribute to declare the language the content is in
What kind of things must you be wary of when designing or developing for multilingual sites?
How the user will choose their language, will it be defaulted, in url etc. Text in images, size of text, length of sentences
What are data- attributes good for?
data attributes let you store data that shouldn’t primarily be visible to the user. This data can be accessed and used with for example JavaScript.
Consider HTML5 as an open web platform. What are the building blocks of HTML5?
local storage of data on the users device which can help with load times. Also provides good optimization and usage of the computer hardware to perform better.
xhtml?
xhtml is a stricter version of html which enforces good practices
Describe the difference between a cookie, sessionStorage and localStorage.
Session storage like the name suggests is for a specific session whilst using the site, data is removed when you close the tab. cookies persist throughout and will remain even after the tab is closed. The amount of data that can be stored is significantly lower but it is used every time you access the website. it is also stored locally on the computer and it can have a set expiry for when it is removed. localStorage is similar to cookies but it can hold larger amounts of data and doesn’t need to be sent back to the server with every http request. client sided.
Describe the difference between , and
.
Defer scripts are activated after the html has finished loading. Async scripts happen at the same time as the html loading meaning it can happen before the html has finished loading. the regular script runs but stops any html loading during the script running, and once the script finishes, the html resumes loading.
Why is it generally a good idea to position CSS s between and JS s just before
You want the style sheet to be loaded earlier for progressive loading, if you were to put it at the bottom, you may get un-styled content showing before the style sheet is loaded or some browsers may not even change the style if the content has already been loaded. the script is placed before the body tags because the default script tag will pause html loading whilst the script is loading. If the script tag is placed after the html will have already been loaded and displayed to the user. some exceptions are when you want the script to interact with the page like writing text which should be avoided.
What is progressive rendering?
this is where the rendering of the page is done in an order to optimize loading times. For example loading the style sheet before the content. can also be used to prioritize certain areas such as loading the main content before the images, or the content that is in the view port before the rest to give a better loading experience.
Why you would use a srcset attribute in an image tag? Explain the process the browser uses when evaluating the content of this attribute.
srcset lets you display different images depending on the size available. This allows you to display smaller images on devices with a smaller screen size or viewport. This essentially creates responsive images which will display based on the size of the page or device
Have you used different HTML templating languages before?
I know of html templating languages but I have not used them, I have used other templating languages such as vue.js in conjunction with Laravel but not directly html templating languages. I know that they simplify the creation of html content so you don’t have to repeat the same code and it greatly reduces the amount of code typed.
What is the difference between canvas and svg?
SVG is a vector which has good scalability options, meanwhile canvas is set, it’s like creating an image, if you increase the size of the vector it’ll retain its quality however the canvas won’t. SVG = shapes canvas = painting
What are empty elements in HTML ?
empty tags are html elementals that don’t have an end tag, for example if u had a paragraph tag it would be <p>, image,link,break etc</p>
