Final Flashcards

1
Q

What is the Internet?

A
A computer network consisting of a
worldwide network of computer
networks that use standardized
network protocols to facilitate data
transmission and exchange
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

Node

A
A point at which lines or pathways
intersect or branch; a central
connecting point
In computing, a piece of equipment,
such as a PC or peripheral, attached to
a network
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

The Internet

A

The Internet is a massive network of
networks, a networking infrastructure
that connects computers globally.

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

The World Wide Web

A

The Web is a way of accessing
information over the medium of the
Internet, an information sharing model
that is built on top of the Internet.

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

Internet vs Web

A
separate
but related things.
The Web is just one of the ways that
information can be disseminated over
the Internet but it is the one we are
focused on in this class.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Internet Access

1980s–Present

A
• Personal Computing
• Portable Computing
• Mobile Computing
• Ubiquitous Computing
• Artificial Intelligence
and Ambient Computing
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Personal Computers Progress

A
  • IBM 5150 (1981)
  • Apple PowerBook 540c (1993)
  • Apple iPhone (2007)
  • Chalayan dress (2007)
  • Arduino Uno (2010)
  • Apple Watch (2015)
  • AI and Ambient Computing
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Digital Revolution

Afterglow

A
Represents a shift from analog and
electronic technology to digital
These technological developments
build upon and continue to inform each
other today
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Digital Media
Modern vernacular
of 1s and 0s

A
On/Off
Electrical impulses (+5v / -5v)
• Single 0 or 1 = 1 “bit”
• A group of 8 bits = 1 “byte”
• 1 million bytes ≈ 1 “megabyte”
• 1,024 megabytes = 1 “gigabyte”
• 1,000 gigabytes = 1 “terabyte”
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Moore’s Law

A
The number of transistors that can be
placed inexpensively on an integrated
circuit doubles every two years.
The number of transistors is closely
connected to processor speed,
memory, etc.
Computer processor speed has
doubled approximately every two years
Moore’s Law seems to be plateauing
but held steady for the past 40 years.
Digital media is in a constant state of flux
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

open source

A

anyone is free to use it
usually free of charge
can be modified and redistributed

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

Operating Systems

A
Software that manages a computer’s
resources
Allocates resources among other
programs
Resources include the central
processing unit (CPU), computer
memory, file storage, input/output (I/O)
devices, and network connections
Runs indefinitely and terminates only
when the computer is turned off
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Operating Systems

Examples

A
DOS (Generic term)
Microsoft OS
Mac OS
Linux
iOS
Android
Symbian OS
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Operating Systems

History

A
First digital computers had no
operating systems
Ran one program at a time, which had
command of all system resources
A human operator would provide any
special resources needed
First operating systems were
developed in the mid-1950s
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Unix

A
Operating system by AT&T Bell Labs
Originally developed in 1969
Command line interface
Portable, multi-tasking, multi-user
Free distribution, open system
Servers, workstations, mobile devices
Basis of Linux and MacOS
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

Unix

Commands

A

tba

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

Chmod

chmod sets permissions

A
Every file and directory has nine
permissions associated with it
Files and directories have three types
of permissions (or none):
r (read)
w (write)
x (execute)
- (no permission)
The above permissions occur for each
of the following classes or users:
u (user/owner)
g (group)
o (other/world)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

Chmod

Files and folders

A
Standard file permission:
644
Owner can read and write file;
group can read file;
others can read file
Standard directory permission:
755
Owner can read, write and execute file;
group can read and execute file;
others can read and execute file

7 –> r w x
6 –> rw-
5 –> r-x
4 –> r–

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

HTML
HyperText
Markup Language

A
A language for describing Web pages
HTML is not a programming language,
it is a markup language
A markup language is a set of
markup tags
HTML uses markup tags to describe
Web pages
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

HTML

Early history key dates

A
1990: Original HTML specification
written by physicist, Tim Berners-Lee
for cross-referencing documents
1993: First text-based browser, Lynx,
released
1993: Mosaic browser released,
adding images, nested lists, forms
1994: First World Wide Web
conference held in Geneva
1994: Netscape is formed
1994: The World Wide Web
Consortium is formed, w3.org
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

HTML Tag

A
Keywords surrounded by angle
brackets, for example: 
HTML tags normally come in pairs, like
<h1> and </h1>
The first tag in a pair is the “start tag,”
the second tag is the “end tag”
Start and end tags are also called
“opening” and “closing” tags
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

HTML Element

A
Everything from the start tag to the end tag
Example:
<p>This is a paragraph.</p>
Start tag:
<p>
Element content:
This is a paragraph.
End tag:
</p>
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

Web Pages

A
HTML documents describe Web pages
Contain HTML tags in plain text
HTML documents are Web pages
Recommended plain text editors:
Atom and Brackets
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

Web Browsers

A
Render HTML Docs
Reads HTML documents and displays
them as Web pages
Web browsers do not display HTML
tags, but use them to interpret the
content of the page
Recommended browsers:
Firefox, Chrome, Safari, Edge
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
Q

html explained

A
tells browsers
that they are interpreting an HTML
document
Text between  and 
describes the Web page
Text between  and 
is displayed as the page title
Text between  and  is
the visible page content
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
26
Q

SFTP

A

SSH (Secure) File Transfer Protocol

Web pages are usually created
“locally” on a personal computer, then
uploaded to a web server
A web page is not publicly accessible
until it is published to a web server
An FTP client is used to transfer files
from a personal computer to a server
Fetch, WinSCP, and FileZilla are a few
good FTP client options
“Local” files are those on a personal
computer, “remote” files are those on a
web server
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
27
Q

HTML5

New standard for HTML

A
First version published in 2008
An official W3C recommendation as of
October 2014
• New Elements
• New Attributes
• Full CSS3 Support
• Video and Audio
• 2D/3D Graphics
• Web Applications
• Smartphone Apps
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
28
Q

CSS

A
Cascading Style Sheets
Defines a Web page’s appearance
CSS separates style and content
Consists of a plain text file with rules
for the display of HTML elements
Formatting includes fonts and colors
as well as layout and position
Can be created outside of your HTML
and applied to multiple Web pages
Well-formed HTML is important for
your CSS to work properly
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
29
Q

CSS History

A
Prior to CSS, Web pages were
commonly styled with HTML tags and
structured with tables
This was both tedious and inefficient
Nine different style sheet languages
were proposed, two were chosen as
the foundation
CSS Level 1 emerged as a W3C
Recommendation in December 1996
Browsers began to support CSS over
the next few years
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
30
Q

CSS Application

A
CSS can be applied in three different
ways to a Web page:
• In an external .css file
• In the  section of an HTML
document
• Inline with HTML code
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
31
Q

Style Construction

CSS Rule Set

A
Selector: Indicates which HTML
element will be formatted
Declaration block: Describes the
formatting to apply
Property/value pair: Specifies format
Style rules are separated by a
semicolon
h1 {
 color: green;
 background: yellow;
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
32
Q

Cascade

A
The principle of the “cascade” is
applied when style rules are in conflict
Three primary factors determine which
style rule wins out:
• Inheritance
• Specificity
• Location
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
33
Q

CSS3

A
Latest standard for CSS
CSS2 is best supported
CSS3 is still evolving but offers new
features for designers and developers
Modern browsers support many
aspects of CSS3
Backwards compatible with CSS2
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
34
Q

CSS Box Model

A
In a web page, every element is
rendered as a rectangular box.
This box includes the following,
changeable properties.
• Content
• Padding
• Border
• Margin
35
Q

CSS Box Model
Setting an Element’s
Width and Height

A
• auto (default)
Browser calculates the dimensions
• Length
Define the dimensions in pixels or ems
• %
Define the dimensions in percent of the
containing block (parent element)
• inherit
Specifies that the dimension should be
inherited from the parent element
36
Q

Page Layout using <div> tags</div>

A
The HTML <div> tag can be used to
give your page structure.
It has no specific meaning except to
outline a section of content.
The div tag is only used in the body
section of an HTML document.
Initially, this structure will not be visible
to the user.
Used in conjunction with CSS, we will
have more control over the form and
layout of web pages.</div>
37
Q

Page Layout

display Property CSS

A
Elements in HTML are primarily “inline”
or “block” elements.
• An inline element has floating content
on its left and right side.
• A block element fills the entire line,
and nothing is displayed on its left or
right side.
The CSS display property allows
you to specify the type of box used for
an HTML element.
38
Q

Page Layout

float Property

A
The CSS float property allows you to
position block elements inline
This means that any element, block or
inline, can be positioned alongside
another element
The CSS float property is one of the
main techniques of web page layout
39
Q

Photoshop

1987

A
Created by Thomas Knoll, then a PhD
student at the University of Michigan
Originally called “Display”
For displaying grayscale images,
scanned into a computer
Acquired by Adobe in 1988
Released as Photoshop 1.0 for
Macintosh in 1990
40
Q

Technological Basis

Bitmap/raster graphics

A
A grid of picture elements, “pixels,”
each of which contain color and
brightness information
Pixels can be changed individually or
as a group with program algorithms
Contrast vector graphics which
describe lines
Layer support introduced in version 3
(c. 1993)
41
Q

What is a GIF?
Graphics Interchange
Format

A
Bitmap image format
Introduced by CompuServe in 1987
Designed to minimize file size and
electronic transfer time
One of the first two image formats
commonly used on Web sites
42
Q

Technical Aspects

A
Color palette of up to 256 distinct
colors
Preserves transparency
Uses a compression algorithm to
reduce file size
Also supports sequential frame
animation
“Dithering” approximates a wider range of colors with a small color palette
43
Q

Photoshop Form

A
Photography
Illustration
Line and Shape
Texture
Color
Typography
Composition
44
Q

Photoshop Color

A

Hue
Value
Intensity

45
Q

Photoshop Typography

A
Font selection
Type size
Alignment
Letter spacing
Line spacing
Grammar
46
Q

Composition

A
Rhythm
Proportion
Structure
Variation
Balance
Boundary
Space
47
Q

Wireframing

A

Website wireframing allows you to plan the layout of your website
It is the process of making design decisions before they are implemented
Wireframing can range from a simple skeletal framework to a detailed mockup of each page
Spending time planning your site makes coding easier

48
Q

Wireframing

And Prototyping

A
• Think
• Design
• Implement
• Revise
This sequence can be looped through as necessary.
49
Q

Website Layout

CSS float property

A

Specifies whether or not an element should be positioned alongside of another element on a web page.

none (default)
Element is not floated, and will be displayed where it occurs in the text
left
Element floats to the left
right
Element floats to the right
The clear property removes a float from HTML elements.

50
Q

Website Layout

CSS position property

A
Specifies the type of positioning used
for an element on a web page.
static (default)
Elements render in order, as they
appear in the document flow
absolute
Element is positioned relative to its first
positioned (not static) parent element
fixed
Element is positioned relative to the
browser window
relative
Element is positioned relative to its
normal position
51
Q

Responsive Web Design

A

Mobile traffic is as relevant as desktop traffic now
We should build for the type of screens that will be used to access our sites
One way to do this is with alternate style sheets
Responsive web design uses “media queries” to figure out what resolution of device it’s being served on
Flexible images and fluid grids size correctly to fit the screen
Design for flexibility

52
Q

Media Queries

A
Features you can include in a query:
• width • height • device-width
• device-height • orientation
• aspect-ratio • device-aspect-ratio
• color • color-index • monochrome
• resolution • scan grid
Most of the above can be combined
with min- and max- prefixes
Most common are min-width and maxwidth
prefixes
Media queries can be used to load an
alternate style sheet or offer alternate
styles within an existing style sheet
53
Q

Media Query Syntax

A
Two possible values: only or not
only screens out older browsers from
reading the rest of the query
not negates the result: not screen
means everything except screen
type is the media type
feature: value
Enclosed by parentheses and
preceded by the word, and
Predefined media features
Multiple features and values can also be combined with and
54
Q

Bootstrap

A
Bootstrap is a front end framework for
developing responsive, mobile-first
projects on the Web
It contains HTML and CSS design
templates as well as optional
JavaScript extensions
Originally developed as an internal
toolkit for Twitter, the project was
released as open-source code in 2010
It has since become one of the most
popular front end Web frameworks and
is used by many different kinds of sites
55
Q

Front End

A
“Front end” Web development refers to
the elements of a website that a
person sees and interacts with
The languages most often employed in
front end web development are HTML,
CSS, and JavaScript
• HTML describes content
• CSS defines appearance
• JavaScript facilitates interaction
All of the above happen directly in the
Web browser
56
Q

Back End

A
“Back end” Web development refers to
the functionality of a website that is not
visible to a person
If you buy something online, you
interact with the front end of the store;
the transaction takes place on the back
end of a database on a Web server
The back end usually consists of a
server, an application, and a database
The languages most often employed in
back end web development are PHP,
Ruby, and Python
57
Q

Bootstrap

Layout and Design

A
The Bootstrap framework is responsive
with a mobile-first approach
It starts with a baseline of shared
styles and introduces more advanced
layout rules when screen size permits
Media queries are used to determine
screen size and apply different styles
accordingly
Bootstrap also offers a grid layout
system which organizes page content
into a series of rows and columns
58
Q

Bootstrap

Interactivity

A
Additional interactive components, or
“widgets,” can extend the behavioral
aspect of Bootstrap Web pages
Such interactivity would normally
require an understanding of JavaScript
to add to a website
Bootstrap simplifies this process by
providing several common widgets
including tabs, carousels, and tooltips
59
Q

Sound

A
Sound consists of pressure waves
moving through air
Without air, there is no sound
Our ears are sensitive to pressure
waves and transmit these signals to
the brain
60
Q

Sound Recording
Acoustic waves to
electrical waves

A
A microphone consists of a small
membrane that vibrates
Movements of the membrane are
translated into electrical signals
Higher pressure typically corresponds
to higher voltage
61
Q

Digital Audio

Analog to digital

A
An audio signal is an analog
(continuous) format
The electrical waves must be
converted to digital information for
computational processing
Digital recording is accomplished with
an analog-to-digital converter (ADC)
The ADC captures a snapshot of the
electric voltage on an audio line and
represents it as a digital number
Capturing the voltage thousands of
times per second creates a good
approximation of the original audio
62
Q

Digital Audio Playback

Digital to analog

A

All computers must give us analog signals to be useful
The screen converts digital information to light
The digital-to-analog converter (DAC) takes the sample and sets a certain voltage on the analog outputs to recreate the signal
This voltage is conveyed to the
speakers which create pressure waves in the air

63
Q

Audacity
Open-source
sound editing software

A
Free, open-source software that can
be altered and redistributed
Multilingual
Easy to use
Records live audio
Cuts, copies, splices and mixes
sounds together
Exports to different formats
(with appropriate plugin)
64
Q

HTML5 Audio and Video

A

HTML5 now supports audio and video natively in the web browser
For years, it was necessary to rely on a third party to deliver this kind of content
Now we can use the and tags
The and tags use the tag to specify one or more media resources

65
Q

jQuery Interaction

A
During the semester we have learned
to use HTML to build web pages and
CSS to style them.
The third layer of front-end web
development is interaction.
JavaScript is a programming language
for creating interactivity and
functionality in web browsers.
66
Q

jQuery

A

jQuery is a JavaScript framework that
makes it easier to achieve common JavaScript tasks
It is simpler to access elements using jQuery’s CSS-style selectors
jQuery takes many common tasks and wraps them inside “methods” that you can call with a single line of code
Furthermore, jQuery takes the guess work out of browser support, since it runs in legacy browsers as well

67
Q

jQuery

Features

A
  • HTML manipulation
  • CSS manipulation
  • HTML events
  • Effects and animation
68
Q

jQuery

And JavaScript

A

jQuery does not do anything that couldn’t be done with pure JavaScript
jQuery itself is just a JavaScript file
Its goal is for you to be able to do more with less code
With an introduction to jQuery, you will begin to get a sense of what can be done with JavaScript in general

69
Q

Forms

A
Web pages are good not just for
providing information to visitors, but
also gathering information from them.
The HTML  element is used to
define a form for getting user input.
A variety of form elements are used to
provide an interface for the input.
These form elements include text
fields, checkboxes, drop-down menus,
and buttons
70
Q

forms code

A

First name:

<br></br>
Last name:

<br></br>

71
Q

Forms

HTML

A
Forms always begin with the 
element.
The  element’s action
attribute specifies how the form will be
processed.
The  element is used for
various kinds of user input.
The  element’s type attribute
determines what kind of input is
received from users.
Each  element must also
have a name attribute and value in
order for the data to be sent.
72
Q

Forms

Validation

A
Before form data gets sent, it’s
important to validate the input.
• You may want to make certain form
fields required.
• You probably want to make sure that
certain fields are completed properly.
• You should also verify that malicious
code is not sent along with form input.
Form validation can be done clientside,
server-side, or both.
We will use a jQuery validation plugin
for simple client-side form validation.
73
Q

Forms

Processing

A
Normally, forms are sent to the server
to be processed.
This requires a server-side application
written in a back-end language.
Since server-side coding is beyond the
scope of this class, we will use a free
service that receives form data and
emails it to you.
Formspree is a project that allows us
to easily add forms to otherwise static
HTML pages.
74
Q

Domain Names

A

Domain names serve as a more memorable reference to Internet resources
Domain names are used to identify Internet Protocol (IP) addresses
An IP address is an identifier for a node—a computer or device on a network

75
Q

Domain Names

TLD

A
Every domain name has a suffix that
indicates which top level domain (TLD)
it belongs to
Top-level domains today are grouped
as follows:
• Generic top-level domains
• Country-code top-level domains
• Infrastructure top-level domain
• Sponsored top-level domain
76
Q

Domain Names

Generic TLDs

A
Generic top-level domains initially
consisted of:
GOV Government agencies
EDU Educational institutions
ORG Nonprofit organizations
MIL Military
COM Commercial business
NET Network organizations
Some of these, such as .com and .net,
are no longer restricted to their original
intended usage
More generic TLDs have since been
added and are being added today
77
Q

Domain Names

Selection

A
When you register a domain name,
you are not its owner, rather you have
the exclusive right to use it
Some factors to consider when
selecting a domain name:
• Relevance to site
• Communicability
• Availability
Here is a list of all domain name
registrars: www.internic.net/alpha.html
78
Q

Web Hosting

A

A Web hosting service allows
individuals and organizations to make their website accessible to others
The host usually provides storage space on a server as well as Internet connectivity
Theoretically, any computer can serve as a Web host, but it needs to always be on and implement measures for
security and stability

79
Q

Web Hosting

Selection

A
Web hosting costs anywhere from $5
per year to $40 per month, depending
on a variety of factors
• Disk space (more is better, but you
often don’t need more than a few GB)
• Bandwidth (data transfer)
• Up time (reliability)
• Overage: Would you rather be
charged extra or have a hard cap if
you reach your data limits?
80
Q

SEO
Search Engine
Optimization

A

Search engine optimization is the process of making your site easy for others to locate
The more thoughtfully and selectively you add keywords to your pages, the better your search rankings
There are several factors that help your website to rise in search results

81
Q

SEO

On-Page Techniques

A
On-page techniques are the methods
you can use to improve search results
for your site
This involves identifying and
implementing keywords in seven
particular places in your page
1. Page title
2. URL
3. Headings
4. Text
5. Link text
6. Image alt text
7. Page descriptions
82
Q

SEO

Off-Page Techniques

A
Search engines also look at the
number of other sites that link to yours
to determine search ranking
This is especially so when the content
of a referring site is similar to yours
It’s ideal when the words that appear in
links to your site also appear in the text
of the page that the site links to
Finally, as more people visit your site,
the search ranking will also improve
83
Q

Analytics

A
Once people start visiting your site, it’s
helpful to know!
Analytics tools allow you to observe
data about the traffic your site receives
This can include the following
information:
• Number of visits
• Geographic location of visitors
• Time spent on pages
• Referring web page
• Browser information
• Real-time activity