辅导USFP ITA程序写作HTML，CSS编程程序

”

辅导USFP ITA作业、写作HTML，CSS编程语言作业、辅导HTML，CSS课程作业
USFP ITA Software for Business Winter Semester 2019
Topic 4: Business Website
Weighting: 20%
Due Date: Thursday 7th November 2019
Using Adobe Dreamweaver, your task is to edit and format the given website template
Demonstrate your understanding of HTML and CSS, by changing the template to suit
your given business using your own words, colours, images and video
Demonstrate your understanding of your fictional business and its target audience
through your company logo and choice of colour scheme, images and promotional video
REQUIRED WEBSITE CONTENT
Completed
1. Choose a colour scheme to suit your given business
httpss://www.canva.com/learn/100-color-combinations
2.Using Adobe Illustrator, create a vector graphic of a logo suited to your given business
Logo size=200px X 200px
3.Using Adobe Photoshop, create a products montage image
Montage image size = 800px X 500px
To Be Completed
4.Using Google advanced search, find copyright free images suited to your given business
9 images of the products/services your business sells
4 generic images (to show the nature of your business in the website slider gallery)
1 generic feature image (showing a focal point of your business)
Save the TASL (Title, Author, Source, Licence) attribution details for each product image
5.Using Adobe Photoshop, crop all images to the pixel sizes given below (this may mean
changing the physical size or aspect ratio of the image – or changing the composition of the
image to focus on a portion of the image, while removing any distraction)
9 product images size = 400px X 300px
4 generic slider gallery images size = 900px X 400px
6. Using Adobe Photoshop, create a feature image which includes text
Generic feature image size = 800px X 500px
Remove the background from the image
Add a text layer
Type the word products using Upper Case
Format the text
Re-order the layers to position the text behind the image
Position the image and text to create a balanced composition
For example:
7.Note
Export all edited images for web as PNG24
Images must be captioned using lower case, no spaces
Save edited images to the images folder located in your project folder
8. Write the words for your given business
Short written business description or mission statement
Captions for website slider gallery images
Product names for all products
9. Create a promotional video
Mobile video of yourself describing your business and mission statement
Upload video to your public YouTube channel
Copy YouTube embed code for video
PROJECT GUIDELINES
Download the web template folder from Study Smart (found under Topic 4)
Unzip the folder
Rename the folder using your preferred English name, followed by your student number
(no capital letters, no spaces)
Store this folder in your student folder (do not save it on the desktop or store on a USB)
Important
Remember: style changes in the ita.css file must be made 3 times (beneath each breakpoint
for each device display)
Remember: style changes in the slider.css file are only made once
Remember: style changes in the form.css file are only made once
Remember: alttext must be written for every image
Step 1:
HTML
Change the browser tab title to your given business name
3
Add your company name in the header
Insert 4 slider images to generically showcase your business
Change slider captions to reflect your business
CSS
Change the websites background according to your colour scheme
Change the text colour of your company name according to your colour scheme
Change the text colour of the slider image captions according to your colour scheme
Step 2:
HTML
Insert the feature montage image
Change the paragraph text to reflect your business mission statement
Insert your business logo image
CSS
Change the background colour of themontage imagebox according to your colour
scheme
Change the background colour of theabout usbox according to your colour scheme
Change the about us heading text colour
Change the paragraph text colour
Step 3:
HTML
Insert the feature image
4
CSS
Change the background colour of thefeature image boxaccording to your colour
scheme
Adjust the image position to sit just outside of the background box (as shown above)
Step 4:
HTML
Copy and paste the code for thecolumnsto create a page with 9 columns
Replace the images with your own business products/services images
Add the product name to each image
Insert attribution and copyright anchor tags for all product images
CSS
Copy and paste the selectors to create 9 columns beneath eachbreak-point
Change the text colour of the header and the product names, according to your colour
scheme
Step 5:
HTML
Copy and paste the embed code for your YouTube video
5
CSS
Change the text colour of the video title according to your colour scheme
Change the text colour forContact Usaccording to your colour scheme
Change the coloured fields in theContact Ussubmit form according to your colour
scheme
Change the colour of theSubmitbutton according to your colour scheme
Change the web page footer background colour according to your colour scheme
SUBMIT YOUR PROJECT
Your website project folder must be named using your English name that is used for roll
call, followed by your student number(no capital letters, no spaces).
Zip (compress) your website project folder
Submit the zip folder to Study Smart
The submission link can be found underAssessment Revision
The submission link will close at 11:55pm on Thursday 7th November 2019