JavaScript Week 1

David Andrew Bille

How do you ensure that your website design or web application is accessible and user-friendly?

Using semantic HTML to improve SEO makes it easier for more people to find your page. Responsive websites are a MUST. Include HTML markup to improve readability for screen readers and other visually impaired users. Design for improved speed, minimize excessive code — users expect site that loads in 2 seconds or less. Page layout should also flow well. Users read in both the F and Z patterns. It is important to make clickable elements stand out, so that users know how to easily navigate the page. Be clear and concise, use visual hierarchy to direct them where they need to go, and use call to action. Finally, it is important to make sure your site is viewable on a wide variety of browsers.

What are your favorite features of HTML5, and how have you implemented them in your front end development projects?

We don’t often do this, because it’s not good practice, but I like the flexibility of HTML5 in that you can also do your JS or CSS right within the HTML document. Not practical, but very useful for educational purposes, or when brand new to HTML. It is simple to use and easy to understand, providing instant feedback to new code, allowing it to be picked up and learned relatively quickly. SVG is also a very useful tool in saving space while still being able to display graphics. I have not implemented any of the above features into any of my front end projects to this point.

How do you structure your CSS and JavaScript to make it easier for other developers to work with?

In both HTML and CSS, it is important to have effective use of comments. I personally comment every new section of my HTML markup to help better communicate sections, and specific wrapped areas to more easily find parent and children elements. I do this with CSS as well, often styling a parent and its children with CSS that is grouped together so that another user can find out just which parts of my code are styling different parts of the page. HTML can also use semantic code…ie. <nav> <header> <main> <aside> <article> <footer> allow a developer to easily identify which part of the page the current code is expected to be found.

What’s your process for addressing browser-specific rendering problems? Do you find that a certain browser is more challenging to work with than others?

Some of the most basic things you can do are ensuring that the <!DOCTYPE html> tag is the first line inf your HTML markup and ensuring to perform a CSS reset in the first few lines of your stylesheet. It is important to build your website as simply, and with as little extra code as possible to reduce the likelihood of including features that may not be supported in older browsers. Once the page is made, the best thing you can do is to load the page and check functionality in a variety of different browsers across a multitude of screen sizes and device types.

What is the difference between == and === ?

== allows you to compare differet data types of the same value and return a ‘true’ value, while === does not. For example number 5 and string ‘5’ would be returned as the same value for == comparative operator, while === would return false, or not the same value.

What is the value of foo? var foo = 10 + ‘20’;

With concatenation, 10 is added to the string ‘20’, not the numeric value. The answer in this case will be foo = 1020. Had ‘20’ been 20, not a string but a number, the answer would then have been foo = 30.

Describe what a terminal application is?

A terminal application is basically the main application that is able to run all other functionalities of a computer. It is simply text based, and allows for the manipulation of files, folders and general point of communications between the user and PC.

What is the ternary operator?

Ternary operators are used as shorthand for if/else statements. They are not as easy to read, but the small amount of code used can be ideal when writing simple, single line pieces of JavaScript. Using the ? and : symbols to replace the verbiage of if and else. ‘?’ replaces the “if” and ‘:’ replaces the “odd” in the code below:

const completChores();

if (true) {return ‘Go out and play’;}
else {return ‘Get to work!’;}

is the same as:

completeChores === true ? return ‘Go out and play’ : return ‘Get to work!’;

For longer, complex pieces of JS, it is easier to use if and else statements as they are easier to read.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade