Brainscape's Knowledge GenomeTM

Browse over 1 million classes created by top students, professors, publishers, and experts.


See full index

Web Technology > Exam > Flashcards

Exam Flashcards

1
Q

What is the web’s architecture?

A

client-server

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

List and define the Web Protocols.

A
  1. IP - Protocol that allows data to be chuncked into packets and sent to an IP address
  2. TCP - Underlying protocol ensureing data is reliably delivered
  3. HTTP - is used as the network protocol to define how messaged are formatted and transmitted
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What language is HTML?

A

HTML is a semantic language

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

Write an HTML comment.

A

<!-- HTML Comment -->

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

What makes up the project plan?

A
  1. Identify goals and scope of the project
  2. Identify the target audience
  3. Identify the type of web site
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

What is “creating a storyboard” about?

A

A storyboard is a sketch that outlines Web page components and links between web pages

Main steps:
* Identify compnents to include
* Sketch possible layouts and select one
* Map the relationships between web pages

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What is “creating a Hierarchy chat” about?

A

Map relationship between Web pages (aka Hierarchy Chart)
* Crucial when creating navigation system for the web site
* Include links between pages in the web site as well as external links

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Why is Accessibility important?

A

Including accessibility into web pages widens potential auidence

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

List and define the Link Types.

A
  • Relative Link: path/filename information needed to locate target document. The path is relative to the directory of the current web page
  • Absolute link: complete address of target document (URI)
  • Anchor link: is a link to a location in the current web page
    - Created using id attribute
    - id prceded by # in href value
  • Skip link: A link that targets an anchor at the start of the main page content and allows users to bypass navigation
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

What is a block level element?

A

A block level element will take up the full width of its parent element. It will start at the line of flow and then the line of flow will be moved to a position directly below the element and as far as the the left of screen as it can go.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What is an inline element?

A

An inline element starts at the line of flow. The line of flow is moved to the end of the element.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Name the parts of the Uniform Resource Identifier(URI)

A

Can’t’ upload images here so check desktop for answer

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

What are the two image types?

A
  • Vector
  • Bitmap
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

List and define the Image Formats

A
  1. JPG: optimized for many colors
    - Photographs
    - Variable Compression rates
  2. GIF: optimized for areas with defined borders, few colors
    - Line drawings
    - Supports transparent pixels (of a single color)
  3. PNG: Includes a full alpha channel for full transparency with gradients. PNG is a non patented replacement for GIF.
  4. SVG: no decrease in quality when scaled
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

What are the three image attributes?

A
  1. src
  2. alt
  3. title
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

What is the difference between HTML and CSS?

A
  • HTML is used to indicate the meaning of things (headings, paragraphs, etc.) but not to specify how they should appear.
  • Cascading Style Sheets (CSS) is a presentational language is used to specify how things appear.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

What is a CSS syntax?

A

A CSS syntax contains two main parts
1. Selector - points to the HTML elements/s you want to style
2. Declaration block - the declaration block contains one or more declaration separated by semicolons. Each declaration includes a CSS property name and a value, separated by a colon.

Example of a declaration is saved on my desktop

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

Write an CSS comment.

A

/* your comment */

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

External vs Embedded vs Inline style sheets

A
  1. Inline – CSS is the default style rules (closest to the element)
  2. Embedded – CSS is defined within a <style> tag in the head section of a document (further from the element)</style>
  3. External – CSS is defined with an separate file and linked, using a <link></link> tag, in the head section of a HTML document (futherest from the element)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

Explain the Box Model

A

The box model treats each HTML element as a box with some global properties to create space around the contents of a HTML element
* Margin
* Border
* Padding

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

Explain div and span

A

Div and span is a generic block level element with no presentational or semantic value. Its purpose is to allow us to group together a number of elements so as to treat them as a single entity.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

List and define the type of selectors.

A
  • Element/type selector:
    - applies to all HTML elements of a specific type, such as h1 elements
  • id selector:
    - applies to a single element having a specific unique id
  • class selector:
    - applies to all elements having a specific class attribute
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

Relative v Absolute measurement systems

A
  • Absolute length units are fixed and will always appear at that size.
  • Relative length units specify a length relative to another property.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

Ordered list vs Unordered list

A
  • An ordered list is a list in which items are numbered or lettered.
  • An unordered list is a list in which items have no specific order
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
Q

Name the list styles for ordered list

A
  • Decimal
  • Lower-roman
  • Upper-roman
  • lower-alpha
  • upper-alpha
  • None
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
26
Q

Name the list styles for unordered list

A
  • disc
  • circle
  • square
  • none
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
27
Q

Explain a description list

A

The default appearance is that each pair takes 2 lines:
*Term (name) on first line
*Description (value) indented on second line

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
28
Q

Explain Pseudo classes

A
  • A pseudo class is a keyword added to a selector the specifies a special state of the selected element. A pseudo class starts with a colon. Eg: visited.
  • The main example of this is for representing the states a button has when a mouse moves over a link, selects a link, comes back from the link and denotes a visited link. These are called anchor pseudo-classes.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
29
Q

What is Relative Positioning?

A

An element with position : relative; is positioned relative to its normal position in the line of flow.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
30
Q

What is Absolute Positioning?

A
  • An element with position : absolute; is positioned relative to its nearest positioned ancestor. If the element has no positioned ancestors then it uses the document body.
  • When positioned absolute, an item is no longer in the line of flow. And is positioned using the X, Y, Z coordinates assigned to it.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
31
Q

What is Fixed Positioning?

A
  • An element with position : fixed; is positioned relative to the viewport, which mean it always stays in the same location, even if the page is scrolled.
  • When positioned fixed, an item is no longer in the line of flow. And is positioned using the X, Y, Z coordinates assigned to it.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
32
Q

What is Float?

A

Floats can be useful to allow content to flow around a smaller floating element (like an image for an article), but if we want more precise control over the location of elements, we need to use positioning.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
33
Q

What is Clear?

A

The clear property specifies on which sides of an element floating elements are not allowed to float. Clear is a companion property to float. Wherever you use floats you will probably also be using a clear.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
34
Q

What is z-order?

A
  • When using positioning it is possible to stack overlapping items into the same space.
  • This is possible with the use of the z-index property
  • The plane in which the normal line of flow operates is at z-index : 0; A positive integer number represents a higher level coming out if the screen. A negative number represents a layer below the plane that contains the line of flow.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
35
Q

What is Multi-Column Layout?

A

You can use Relative or Absolute positioning to create multicolumn layouts that look and behave just like multicolumn layouts using the CSS float property

36
Q

List and define the HTML table elements.

A
  • <table>: start and end of table
  • <thead>: marks the header rows of a table
  • <tbody>: marks the rows that make up the body of the tbale
  • <tfoot>: marks footer rows of the table
  • <tr>: groups cells into rows
  • <th>: content of a header cell
  • <td>: content of a data cell
37
Q

Explain Colspan

A

The colspan attribute is used to span a cell across multiple columns.

38
Q

Explain Rowspan

A

The rowspan attribute is used to span a cell across multiple rows

39
Q

Explain Colgroup

A

The HTML <colgroup> element is a structural element which allows you to group columns.

40
Q

What is display: flex?

A

By defining the parent container to display: flex , we set up each child element of that container to be elements of the grid.

41
Q

What are the values for flex-direction?

A
  1. column - stack item vertically (top to bottom)
  2. column-reverse - stacks vertically (bottom top top)
  3. row - stacks items horizontally (left to right)
  4. row-reverse - stacks items horizontally (right to left)
42
Q

What are the values for flex-wrap?

A
  1. wrap - item will wrap if necessary
  2. nowrap - item will not wrap (default)
  3. warp-reverse - item will wrap is necessary but in reverse
43
Q

What are the values for justify-content?

A
  1. center - algin items fron the center of the container
  2. flex-start - aligns items from the beginning of the container
  3. flex-end - aligns items from the end of the container
  4. space-around - displays items with space before, between and after the lines
  5. space-between - displays items with space between the items.
44
Q

What are the values for align-items

A
  1. center - align items from the middle of the container
  2. flex-start - aligns items from the top of the container
  3. flex-end - aligns items at the bottom of the container
  4. stretch - stretches the items to fill the container (default)
  5. baseline - aligns items such that there text baselines align
45
Q

What is flex-grow?

A

Items can be assigned proportional widths with the flex-grow property

46
Q

What is responsive design?

A

Responsive Design allows a website to appear differently on different kinds of devices, for example: desktop, tablet, and mobile

47
Q

Write the code for Viewport Scaling

A

<meta name=‘viewport’ content=‘width=device-width, initial-scale=1.0’>

48
Q

What is Media Queries?

A

Wrap a style with the @media rule to define a breakpoint.

If you are designing mobile-first, define your mobile rules first, then create rules for each larger breakpoint in your design beneath these in your CSS file.

Example of the @media rule is saved on desktop

49
Q

Explain how to design a form (before coding)

A
  • Identify the types of information to collect
  • Create a logical flow for the user to follow
  • Use labels and legends to clearly identify the meaning of each Web form element
50
Q

List the form UI elements

A
  • A Web form is created using the HTML <form> </form> element
  • The HTML <fieldset> element groups fields in sections of the form
  • Text boxes are created using the HTML input type with value text
  • Text areas are created using HTML textarea elements
51
Q

What is a Dynamic Web?

A
  • Up to this point we have only built static web pages
  • What if we wanted the user to be able to search our site
  • How could the user login and enter information?
  • These features require a dynamic website
52
Q

What is templating languages?

A
  • We need a way to dynamically insert content into HTML
  • In modern web sites this is done using a templating language
  • It is called a templating language because we specify the HTML as a template, where the data will be filled in later
53
Q

What is programming languages

A

programming languages will perform the backend logic on websites the tasks that programming languages do include:
* Processing user login
* Performing database searches
* Adding, updating, and deleting database records

54
Q

What is PHP’s history?

A
  • PHP was developed by Rasmus Lerdorf in 1995
  • Initially it was primarily a templating language with a C-like syntax
  • Due to its simplicity it became very popular very quickly
  • As it became widely adopted PHP went through several major changes
  • PHP is currently at version 7.3 (December 2018)
  • Versions older than 7.1 are not actively supported.
55
Q

What are arithmetic operators?

A

Arithmetic operators are used with numeric values to perform common arithmetical operations, such asaddition, subtraction, multiplication, modulus etc.

56
Q

What are comparison operators?

A

Comparison operators are used to compare two values (number or string)

57
Q

What are logical operators?

A

Logical operators are used to combine conditional statements

58
Q

What are conditional statements?

A
  • Often, when you write code, you will want to perform different action for different conditions.
  • PHP provides a range of statements that allow us to evaluate a condition and proceed or not, based on a True or False evaluation of that condition.
59
Q

Associative vs Indexed Array

A
  • An indexed array is simply a list of values.
  • Associative array will be a list that features keys and values. You set a key with a value for example first_name would be a key and the key would have a value of Dylan
60
Q

What is a foreach loop?

A
  • The foreach loop is designed to loop through the contents of an array
  • Each time through the loop, the loop variable will contain the next element
    in the array
61
Q

What is a For Loop?

A

The for loop is used when you know in advance how many times a loop should be run.

62
Q

What is while loop?

A

loops through a block of code as long as the condition is true

63
Q

What is a Do while loop?

A

loops a block of code once and then repeats as long as the condition is true

64
Q

What are the differences between isset, empty and is_null

A
  • isset checks if the variable existes
  • empty checks if the variable is empty
  • is_null checks is the variable NULL
65
Q

What are the two types of database modern websites use?

A
  • Relational Database
  • NOSQL Database
66
Q

What are the differences between Relational databases and NoSQL databases

A
  • Relational databases are well established.
  • NoSQL can be difficult to query due to lack of joins and expressive query language.
  • However, NoSQL can be quick to get a prototype working.
  • Relational databases have a schema which leads to better design and code.
67
Q

How do you access data with PHP?

A
  • There are several ways to access the database
  • The preferred approach is to use PDO (PHP Data Objects)
68
Q

List and define the code to “include files”?

A
  • include - if the file is not found it will continue without error
  • require - File is required and an arror will be generated if not found
  • require_once - same as require except does not not add files if they already exists.
69
Q

Explain “calling functions”

A
  • Functions are a way for us to reuse blocks of code
  • Functions have: inputs and outputs
  • Inputs: We pass information into a function
  • Outputs: The outputs are the result or return value of a function
70
Q

What is SEO?

A
  • Search engine optimisation is a process of tailoring the structure and content of a Web page with search engines in mind
  • The goal of a search engine to provide links to content that the searcher thinks is trustworthy, reliable and an authority on the subject.

Two main benefits of SEO:
1. Increasing a site’s priority in search results
2. Giving Web applications useful semantic information about your site.

71
Q

What is the SEO algorithm?

A

A search engine algorithm is a procedure that examines a number of factors to decide the priority of search results. Some important factors for SEO are:

  • Mobile Friendliness
  • Domain Age, Url and Authority
  • Technical SEO
  • Keyword Phrases in page titles
  • Use headers to show content
    hierarchy
  • Meta Descriptions
  • Keyword Phrases in image alt
    tags
  • Using Schema Markup
    (including Microdata)
  • Secure and Accessible Website
  • Optimised Content
  • Social Signals
  • Links to your content on social
    networks.
  • Links
  • Inbound, outbound and internal
72
Q

What is indexable content?

A

To make a Web site search engine friendly depends on the content
* Even small adjustments to your content can improve the accuracy of indexing
* The title, heading, image, and linked text elements play important roles
* In particular, the content of the title element may be what the user sees in a set of search results and should clearly identify the content of the page.

73
Q

What is metadata?

A

You can add several types of code to your Web pages to provide information
specifically for search engines.

You can add metadata using the HTML <meta></meta> element
* Easy implementation
* You’ve already used meta to indicate the character encoding of your Web
documents Eg. <meta></meta>

<meta></meta>

or metadata is data about data. <meta></meta> tag content is not displayed in the
page but can be used by browsers and other services to get information about a
page.

74
Q

What is microdata?

A

While meta elements allow you to describe the overall content of the page, microdata
enables you to define keyword values for specific types of information on the page. This
allows search engines to better understand the information and provide better results.

75
Q

What is sitemap?

A

The relationships between pages on your site and their understandability to users is
important
- The site needs to be usable
- All links should be well organised and clear
It is also important that a search engine is able to find all of your Web site pages in
order to index them
- Search indexes should search all pages on the site
A sitemap is a file in a specific format that lists all the pages in a Web site. If the site
map only includes web page URL’s then a simple text file is required with a single
URL per line.
- This file may include URL’s for each page in your site.
- This file must be called: sitemap.txt
- This file must be encoded using utf-8

76
Q

What is robots.txt?

A

Bots, also known as crawlers, are programs that search engines use to index Web
pages automatically
* Bots look for files named robots.txt to indicate which files should not be
indexed (added to the search engine)
* Bots are not bound to have to follow the robots.txt suggestions.
* Note that you cannot rely on a robots.txt file to keep a document hidden.
If you want a page to be hidden from the outside world, you might instead
use a password-based system

77
Q

List and define the video codecs

A
  • H.264 (MPEG-4) - commercial use requires licensing and royalty payments
  • Theora - no licensing or royalty payments
  • VP8 - no licensing or royalty payments
78
Q

List and define audio codecs

A
  • AAC - no licensing or royalty payments for users
  • MP3 - no licensing or royalty payments for users
  • Vorbis - no licensing or royalty payments
79
Q

What is the source element?

A

Source elements allow you to provide multiple copies of the file in different formats

80
Q

What is the picture element?

A

An image can be added using a picture element to provide responsive specific images.

81
Q

Picture v img srcset

A
  • img srcset is about resolution switching. The images are the same just at different resolutions.
  • picture allows us to define completely different images (sizes, aspect ratios etc.) to be
    loaded at different responsive points.
82
Q

How do you add javascript to HTML?

A

We can define our scripts locally in the document or the script can by added from an external script file by using a “src” attribute of the 

 tag to define the location of the script file
83
Q

What is trigger events with event handlers?

A

An event is a user action defined for Web pages
An event can be linked to a script
An event handler is a HTML attribute that specifies a type of user action for an event
An event handler is used to indicate the code that should execute in response to a specific
type of user action

84
Q

What is creating a function (Javascript)?

A
  • As your javascript becomes more complex it is useful to group multiple lines of code into a
    bundle and give it a name.
  • You can then refer to the whole bundle with the name instead of having to type out all the individual lines of code each time that you want to use it
  • Javascript has functions which are bundles of individual lines of code that have been grouped together and given a name (function name)
85
Q

What is generate web content dynamically?

A
  • JavaScript can be used to reconfigure Web pages based on user activities or inputs
  • This is done by accessing, storing, manipulating, and writing values that have been supplied by the user

Web Technology (6 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2024 Bold Learning Solutions. Terms and Conditions