Professional Documents
Culture Documents
Unit 19-Assignment 1
Rollover Buttons: This is a
Before
Navigation Bar: Is a section of the website that displays links to other pages on the
website. A
navigation bar is a
main part of a
website template
this is usually placed
near to the top of the
website and should
generally stand out
as it is a main piece of navigation for
you as a user to find what it is that
you are looking for and also have full
control of the website as you can
view any page you want as well as return to the home page when you want to. And it is vital
for that reason as it helps the user to find what it is they are looking for quickly. Both of the
Animation
Animated gifs: Which stands for Graphic interchange format file.
This is a graphic image on a website that moves or a specialized
banner where the letters get bigger. An animated gif is a bunch of
images presented in a certain order and then makes the image
look as if it is moving. It is also looped and therefore constantly
playing and it appears that documents
never finishes arriving. They are
frequently used especially in website
banners. However neither of my chosen
websites have gifs on them there are
some valid reasons as of why, this can be because of that they
take a while to load and if the user is using a smartphone they may
not work correctly and then resulting in the website possible not
working correctly or to its full potential. The gifs that I have used as
example of what a website could use just to make it more visually
attractive and can also be shown to present what the merchandise looks like and also for the
sales of a certain player e.g. showing one of their most memorable moments.
Stimulus
Client Brief: I have been approached by a marketing agency that is wanting to sell some
leisure products in the future and they have asked me to create a website that will help
promote and sell their products. The client has stated that they want their website to be
highly engaging, appropriately presented and suitable for a certain target audience. It also
needs to be easy to navigate and logical so the customer will be able to find the product with
ease and effortlessly. I need to have a welcoming opening screen to my website ae it will
make people want to browse the products to offer. I will also have to do some market
research to so that I will have an idea of what other company's websites look like that are
selling/ promoting similar products, this will also help give me an inside look on what kind of
look the client is wanting me to achieve as this is very important to attract the target
audience seen as the home page of the website is what the viewer is going to see first off
the client wants it to look appropriate for what is being sold. as well as what is going to
appeal to the target audience, and seen as the target audience is hockey fans of the
Washington caps, it will be more fitting to promote the sales of the more popular players
jerseyse.g. the fans favourite's.
Own Brief: I will be looking at existing websites which target audience is the same as my
own websites and the reason for this is I will be seeing what ideas they have used and also
come up with so that I can get the best looking site on my first time around. I want a very
simple but professional looking site that tell you all the information you need straight away so
that the costumer does not have to go looking for what they need. I will focus on new
products and special deals on the front page as this will appeal to my wide range target
audience, which will be men and women and possibly young adults that all love one thing,
Ice Hockey and The Washington Capitals with that being my target audience it does mean
that I will need to engage with all ages this will help to bring more people to view my website.
Image Resolution: This is the amount of detail an image has. The image resolution changes when
you stretch an image for example when
you stretch an image to make it bugger
the pixels are going to become bigger
and clearer to see. The intensity of the
pixels and how clear you can see them
can also be at fault of the colour, if you
use colours that are bright such as red,
blue and yellow instead of a light tone pixel, this might also show a bright level of illuminations of a
pixel. However if you use bright colours and your image has a high resolution then the sharper your
image will appear as the more shades of a colour will be represented by very small pixels. As each
pixel has its own colour. The pixels will only have other pixels around it with a similar shade. The
brightness will also be the same in a pixel and will not change like a gradient. Above to the right is an
image that shows the more that you zoom in the more blurry/pixelated it will get.
Raster images
With a raster image pixilation occurs when you zoom
into the picture. Raster images or in other words
bitmap are digital images that are created or captured
e.g. photo. A raster is a grid of X and Y coordinates that
are displayed in a space an example of this is threedimensional images. An example of a Bitmap image is
displayed on the right. A raster image file is able to
identify which of these coordinates to illuminate in
monochrome or colour value. The raster file is
sometimes referred to as a bitmap this is because it
contains information that is mapped directly onto the display grid. A raster file is normally larger
than a vector graphic image file. It is also hard to modify your raster file without the loss of some
information, however there are now software tools that allow you to convert a raster file into a
vector file for refinement and changes. Raster images are used in programmes such as Photoshop
etc. Example of types of raster files are: JPEG, TIFF, BMP and GIF files.
JPEG: Stands for Joint Photographic Experts Group, it can store more colour that a GIF but it does
normally result in the loss of quality. JEPEG are often used for images e.g. on the web.
TIFF: Stands for Tagged Image Format. This is a format for storing grey-scale image data. It is the
standard format for scanned images as well as exporting grey-scale images on Microsoft windows
and OS operating systems.
Vector Images
Vector Images are not made up of pixels. Vector graphics are made up of shapes, these are defined
by a start and end point as well as other points, curves and angles. The path can be a triangle, a
square or a curved shape. These paths can be used to create a
simple or complex drawing/ diagram. Paths are also used to
define the characters of specific typefaces. Because vector- based
images are not made up of a specific number of pixels/dots they
are able to be scaled to a larger size and not lose image quality or
end up being able to see the pixels. Unlike a raster image where if
you zoom in to much the image will very clearly become
pixelated. However when a vector image is zoomed in on the
edges of the image will stay clean and smooth. This comparison is
shown on the right. This is what makes Vector graphics ideal for
logos, than can be small enough to be put on something like a
business card or big enough to be shown on a full scale billboard.
The common types of Vector graphics are Adobe illustrator, ESP
files and Macromedia freehand. Flash animations also use vector
graphics, as they scale better and take up less space than a
bitmap image.
Bit Depth
Bit Depth refers to the colour information that is stored in the image. The higher the bit depth is
the more colour that can be stored. A simple image that is 1 bit image is only able to show two
colour and these are black and white. This is because
the 1 bit is only able to store one of two values, 0
which is white and 1 which is black. Whereas an 8 bit
image has the possibility to store 256 possible colours
and a 16 bit image can display around 16 million
colours. As well as the images resolution the bit depth
determines the size of the image. As the bit depth
goes up so does the size of the image as well as the
colour information that has to be stored in each pixel
in the whole image. Its not just the image that has a
bit depth it is also your display. You are able to change
the bit depth of your monitor by changing the display
properties.
True Colour: is the specification of the colour of a pixel. 24- bit value is
genrally what we see displyed on are screens. This allows a possibility of
up to around 16,777,216 possible colours. However many displys today
only support a 8-bit colour value only allowing there to be around 256
possibel colours. The number of bits that are used to define a pixels
shade of colour is its bit-de pth. True colour is known as 24-bit colour.
There are some new colours display systems offer 32-bit colour mode. Extra byte, called the alpha
channel, this is used for control and special effects information.
Image Capture
To capture an image you will need some sort of device to
do so this can be a smartphone, scanner or camera etc. the
better quality of pixels/ higher resolution your device has
the better quality the picture you take will be. Resolution is
the amount of detail that is in each picture when it is
captured, this i9s measured in megapixels the higher the
resolution the better the quality however the sharpness of
the image will depend on the optics of the lens that is
being used. However there is now computer software that
can improve the quality of your pictures even if the devise
that you took the picture on was not that good. Each
devise that you use will have some kind of internal storage
this is generally some form of SD card , the higher quality
of your pictures the more storage that will be needed as
there are more pixels to each photograph to be stored.
One transferred to a computer and put in file storage, it is likely that automatically they will be put
into some kind of order whether this is chronological in date of when taken or size. These are the
most popular resolutions:
Technology has change's and so has the way we control are visual information. Digital cameras have
adapted over the past 20 years. Today cameras dont have to be taken to get there images
developed as they are now digitally processed aromatically and we are now able to store are images
Optimising
Optimising is used for webpages when the image is too large and it needs to be resized, so that it
is then suitable for that webpage. Using the format file JPEG as the base file as it keeps the same
high quality but you are able to reduce the size. So that it is the right size and can be easily
sent/received and downloaded as well as it still being high quality and looking good. If you were to
just leave the original image and not change it e.g. the quality or size then what could happen is
when people visit your webpage and the
website takes to long for the image to
load because of the image size being too
big then you may lose visitors as people
are not very patience. However in order
for the page to load faster the image will
need to be reduced so that the website
loads quicker. There are software tool
that allows you to reduce the size of an
image and not lose any of its quality like
Adobe Fireworks.
File reduction is when the size and quality
is lowered on an image so that the file
size is smaller. When you make a change to the image such as colour or tone then the editor will
have to make a decision on whether to reduce the size of the image or the quality this will affect the
amount of colour that is used in the image. However if the image is just used for the internet then it
doesnt really matter as the resolution on a computer screen is much lower than the resolution need
to print a large scale image. The resolution of a computer screen is usually 72 pixels per inch and the
image that are on the internet are also normally set at 72 ppi, this is so that the graphics of the