Scribd Logo
Upload

Welcome to Scribd!

  • Task 4

    Uploaded by

    api-320268028
    40 views11 pages
    The represents the markup language of the website so that the web browser understands that it is an html document. Making use of the in the head section creates a name on the tab of the page as seen below. Linking the html file to the css document to apply changes different elements of the website such as the whole page format as well as individual elements of the site.

    Original Description:

    Original Title

    task4

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The represents the markup language of the website so that the web browser understands that it is an html document. Making use of the in the head section creates a name on the tab of the page as seen below. Linking the html file to the css document to apply changes different elements of the website such as the whole page format as well as individual elements of the site.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    40 views11 pages

    Task 4

    Uploaded by

    api-320268028
    The represents the markup language of the website so that the web browser understands that it is an html document. Making use of the in the head section creates a name on the tab of the page as seen below. Linking the html file to the css document to apply changes different elements of the website such as the whole page format as well as individual elements of the site.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 11

    Task 4

    Issues presented by online validator

    Issues presented by online validator CSS

    Website Process

    The <!DOCTYPE html> represents the markup language of the website so that the
    web browser understands that it is an html document. In the head section we can
    see the use of the <meta charset=UTF-8> this refers to the Unicode
    Transformation Format-8 which is what type of data format the document is. Making
    use of the <title> in the header section creates a name on the tab of the page as
    seen below.

    I have also linked the html file to the css document to apply changes different
    elements of the website such as the whole page format as well as individual
    elements of the site.

    For the navigation menu I first created the navigation items in the html file linking
    each part of the menu to each separate section of the file to navigate through the
    one pager scrolling site. The href must be identical to link correctly with the spate
    sections. The css part of the navigation menu is very important to make this
    functional so I started off by removing the bullet points off the menu and started to
    add important code such as Display block, Float, padding background colour. These

    simple codes create the most important features of the menu bar such as blocking
    elements from sliding next to each other, making parts of the menu clickable ( Not
    just text) and change of colour when hovering over the menu.

    This was used to keep the header on top also known as sticky header.

    When it came to make the gallery I make a very simple way to view the images.
    This made no use of any css with just big images over the whole page set under
    each other that give an overall aesthetic view of the website and images.

    To make the submission form I started by putting all my content into a section and
    each part was put into Divs while having labels for each section and identifying
    what type of input the form is going to be (In this case Text). The proposal are of the
    submission form was set in a text area to have a larger space to enter text. Each
    part was also given a class to be linked to the css file while when whole submit ion
    form was also linked by class to css.

    Evaluation
    In this unit I have gained knowledge of working with html and css files and their
    coding as well as having a good understanding of different softwares and
    frameworks that help us enhance the quality of my work. A good example of a grid
    system being applied to our work is an exercise conducted in class with Ingrid 2.0 to
    create columns this helps ease intense coding and providing us with a responsive
    and reliable format for my work.

    Grid responsive to different sizes

    One of the important factors of this unit is the understanding of Html and css files. I
    have created exercises in class such as the personal blog and the V18 site to learn
    how these two files function and the code being implied. Below we can see some of
    the most important html5 and css3 implementations made in this unit.

    Adding important information in header

    In the header section we can see important html code being used such as the title
    seen at the tab on a webpage, linking to fonts and css.

    Navigation Bar
    Another important feature discussed in our unit is the navigation bar. This is made
    by first having a navigation bracket linking to a css file.

    These navigations where placed in a unordered (<ul>) list then each defined as a
    (<li>) list item while being linked (href) to different sections of the site.

    Coding is then applied in the css file. This will define the positioning of the
    navigation bar with the capability to specifically decide what happens when a user
    hovers over the navigation bar, spacing, colours, font and interactions. Below we
    can see the css file being linked to the navigation in the html.

    Images

    In my work images have been added into html files as part of my practice. I
    have tried creating images in different ways and manipulating it through html and
    css. I was able to easily manipulate certain part of the image through linking it to
    the css such as measurements in ( px / % ) as well as having borderers and
    experimenting with colors.
    Below we can see an example of images being put on the site through just html in
    my website development. This made the very large images look better full size in a
    one page website rather than having it in a form of gallery. Although I have tried
    making use of a gallery I have decided to make images on a large scale.
    Gallary

    Images where placed directly on top of each other in a section linked to a source
    with alt text (Left empty and made due to errors in html validator)

    This Unit has given us a good basic understanding of using html5, css3, frameworks
    and different software and apply effective coding techniques in our work.

    You might also like