Wednesday, 28 February 2018

Web Design

Week 1:

In the first session we were shown the basics of web media, what is it and how it works. I learnt that six media characteristics (strengths) of the web are:

-many-to-many networking
-multimedia
-database
-automation
-live and/or time-shifted
-location-independent and/or device-independent

No single characteristic is unique to the web, but the web is the only single medium to incorporate all six.

                                           

                                            Simple diagram of how the internet works: 




HTML is the standard markup language for creating Web pages.

-HTML stands for Hyper Text Markup Language
- HTML describes the structure of Web pages using markup
- HTML elements are the building blocks of HTML pages
- HTML elements are represented by tags
- HTML tags label pieces of content such as "heading", "paragraph", "table", and so on
- Browsers do not display the HTML tags, but use them to render the content of the page


                    HTML Tags HTML tags are element names surrounded by angle brackets:

                                         <tagname> content goes here... </tagname> 

                                     HTML tags normally come in pairs like <p> and </p>

                                                    

- The first tag in a pair is the start tag, the second tag is the end tag
- The end tag is written like the start tag, but with a forward slash inserted before the tag name

                                                     
                                                       HTML page structure:
                                 
                                    


-HTML headings are defined with the <h1> to <h6> tags.
-HTML paragraphs are defined with the <p> tags.
- HTML links are defined with the <a> tag.

                                                   
                                         


At the end of the session we were set a homework task to create a hotglue page using all of our knowledge gained from the lesson.




Week 2:

On the second and final week of Web Design, out hotglue pages were due. Considering I only had minimal knowledge of how to use hotglue and how to code I was happy with the outcome of my page.  https://gio123.hotglue.me

Later in the session we were taught other codes including how to add background colours and change fonts that would help make our hotglue pages look better in the future.



                                         

New coding information learnt from the session:

- CSS stands for Cascading Style Sheets
- CSS describes how HTML elements are to be displayed on screen, paper, or in other media
- CSS saves a lot of work. It can control the layout of multiple web pages all at once
- External stylesheets are stored in CSS files


- The element selector selects elements based on the element name.
- You can select all <p>  elements on a page like this (in this case, all <p>
elements will be center-aligned, with a red text color)







Comments are used to explain the code, and may help when you edit the source code at a later date.

Comments are ignored by browsers.

A CSS comment starts with/* and ends with */


There are three ways of inserting a style sheet:

-External style sheet
- Internal style sheet, method used by hotglue
- Inline style

The CSS background properties are used to define the background effects for elements. CSS background properties:

-background-color
- background-image
- background-repeat
- background-attachment
- Background-position


     
                                               
                                           
                                                    (Experimenting with background images)


     
                                                     
         

                                                (experimenting with colout, text and images)

No comments:

Post a Comment