Sei sulla pagina 1di 7

Unit 59 Assignment 1 Web authoring

Terminology
Authoring This is the creation of the site. You can do this
using Dreamweaver, which is a program that
lets you program and joins all the media
platforms, such as videos, pictures, text,
navigation etc, to create a website. One
example of this is http://www.weebly.com/uk/
- this is a website that helps you easily create a
free website, with features like drag and drops
you can add Basic, Structure, Media,
Commerce and More, which are shown in
the screenshots to the right. This is an example
this is my portfolio site. This contains all my
pages, subpages, buttons, pictures, documents,

Sites
A site is a collection of pages edited by the owner. Sites
includes pages such as a homepage; with the title and
an introduction to the site, contents; sometimes this is
included on the homepage but can also be a list of
subpages on another page, actual page; a page with the
things/information/medias on it that you want. For

of a site;
work from college, I have added
titles etc.

example, Cheadle & Marple College site has an intranet, the screenshot to the right is the homepage
with the contents at the bottom. If I click on one of those squares it will take me to another page which
could possibly have other page sit will take me to another page
which could possibly have other page attached to it.
Moodle when I click on this it brings me to a page which has a
lot of links on it, which I
can then click on which
would take me to
another page.
Mail when I click on this it doesnt take me to a page, it just
brings up a window showing me my emails.
Youtube when I click on this it also doesnt take me to page
on the site, it opens a new tab on the browser and takes me to the youtube home page.
Uploading -

File transfer protocol (FTP) This starts with the browser, which
is the client. They send a request
that goes to the web servers asking
for a webpage, they then make a
copy and send it back. This is how
you get published.
The purpose of a FTP/FileZilla
program is to copy files from your
computer and copies them to the server. To get on to this they have to type a username and password
so that not just anyone can get on to it. The webserver allows you to read only while its on the server,
whereas FTP/FileZilla allows you to read and write on your files that are on the server.
If someone wants to see a webpage they send a request to the server and they send the required
webpages back to the browser so the user can see it.
Web Page
Web page construction
To create a website there is 3 easy steps (according to http://websitesetup.org/).
1. Pick a website building platform. A platform is a
site that helps you create your own site easily and
its accessible to everyone. The screenshot to the
right shows the top three most popular website
building platforms in 2015. Number one was Word
Press with 50.07%. number two was Durpal with
17.07%. Number three with 6.44% is Joomla.

2. Choose a domain name and website hosting for


your website. A domain name is the website
name, for example Youtube.com. You will need
to choose a suitable name for your website.
hosting is a service that connects your site to the
internet. This costs but not too much so it is
affordable.
3. Set up your website. Make a layout for your site, this
will the themed throughout out all your pages. Then
add the pages, content and medias onto your page to
bulk and finish it.
Text
<U> underlines </U>
<EM> italic </EM>
<STRONG> bold </STRONG>
<P> new paragraph </P>
<BR> break before the new text </BR>
<SUB> aligns the text at the bottom of the line </SUB>
<SUP> aligns the text to the top of the line </SUP>
<DEL> text with a line through it </DEL>
<!-- text does not show up when shown online
Fonts
To change the font you have to do this below
<h1 style="font-family:verdana">heading</h1>
<p style="font-family:courier">paragraph.</p>
Colour
There are 140 names of colours, all codded with a hex. For
example

Aqua #00FFFF
Coral #FF7F50
Blue Violet #9A2BE2
Crimson #DC143C

<BODY BGCOLOR="#FFFFFF"
TEXT="#000000" LINK="#33FFFF"
VLINK="#330066" ALINK="#330066">

<BODY BGCOLOR="#FFFFFF"
TEXT="#000000" LINK="#33FFFF"
VLINK="#330066" ALINK="#330066">
This is what would be shown.
</BODY>
There are also different types of groups of colours such as Groups, Names, Shades and
Values.

Images
To change the image you need to know the image name so that you can type it.
<BODY BACKGROUND="bgimage.gif">
<BODY IMAGE="bgimage.gif">
Tables

Here is the original table.

In this one, an extra column has been added. I have done this by adding
o <tr>
o
<td>James</td>
o
<td>Wilson</td>
o
<td>82</td>
o </tr>

In the next one, it has a border. I have done this by adding


o <table border="1" style="width:100%">

In this one, it has a thicker border and is smaller. I have done this by adding
o <table border="5" style="width:50%">

This one has a different border. I added


o table, th, td {
o
border: 1px solid black;
o
border-collapse: collapse;
o }

This one has a blue border instead of a black one and it is thicker.
o table, th, td {
o
border: 3px solid blue;

o
o

border-collapse: collapse;
}

Hyperlinks

Here is the website example.


o <p><a href="http://www.w3schools.com/html/">Visit our HTML tutorial</a></p>

Here I have changed the hyperlink and the website it goes to.
o <p><a href="https://www.youtube.com/?gl=GB&hl=en-GB">visit the worlds biggest
video website</a></p>

Metadata
The is a set of data that gives you more information about another set of data.
HTML & XHTML
HTML (HyperText Markup Language) HyperText is something that lets you navigate around the web by clicking on hyperlinks which then
takes you to the next page. Hyper just means that it isnt linear, which means that the site doesnt
have to do things in a particular order. Markup is mark texts as a certain type inside of HTML tag.
HTML is a language which has codded words and syntax like a lot of other languages. This is something
that helps aid the creation of websites. These websites can be seen by anyone that is connected to
the internet. It consists of short codes typed but the site author into a text-file which are called tags.
The text/tag is then saved as a html file, so you can view it through a browser.
XHTML (Extensible HyperText Markup Language) -

This is almost identical to HTML. XHTML is there to describe documents. There are important points
for XHTML. Such as

At the start, write a DOCTYPE declaration.


Everything has to be in lowercase only.
Close all XHTML tags properly.
All tags have to be nested properly.
Quote all the attribute values.
Forbid attribute minimization.
Replace the name attribute with the id attribute.
Deprecate the language attribute of the script tag.

Cascading style sheets:


Nature of cascading style sheets (CSS) This is used to describe the presentation of a document written in a markup language.
Features of CSS Pros:

Create one style sheet and then link all the pages you want to carry that style to the style
sheet.
When you make changes to the style sheet, the changes apply to all pages which are linked to
the style sheet.
Pages have a unified design, changes are less time-consuming, AND all those visually appealing
pages are accessible to users browsing with screen readers.

Cons:

Currently, no two browsers interpret CSSs the same. The World Wide Web Consortium is
working on this with strong recommendations to all web developers, but for now we must
work within these confines.
There are also two levels of CSS CSS1 and CSS2. CSS1 is the simpler of the two and will yield
the best results to date in the browsers. CSS2 has a lot more attributes for elements, but the
syntax and language has not changed. Not all the attributes in CSS2 are supported, and what
is supported varies by browser.

How to use CSS There are 3 ways to insert a style sheet;


External, internal and inline. With an
external you can change the look of the
whole website just by changing one file.
Each page is linked. The internal lets you change a single page
as they are not linked. The inline style can be used to apply a
unique style for a single element.
Inline

External

Internal

Potrebbero piacerti anche