Posts

Showing posts from February, 2018

Task 5 - Make CNN.com Layout (1st Assignment)

Image
Article Updated On: Jan. 15, 2021 Assignment No . 1 Title : Create CNN Layout using CSS/HTML (do not use Bootstrap) Total Marks : 10 Before you submit, r eplace your images' src attribute to online image URLs e.g. use images from CNN/or any other website. If you have written CSS in external file, move it to head section inside style tag. Rename your file to <student-registeration-number>-<student-name>.html. When I open your HTML file in my browser, it must load all images and apply CSS properly, any mistake of putting CSS or image URLs incorrectly would result into marks deduction. So must test before uploading. Create  cnn.com layout, overall look & feel must be same e.g. paddings, borders, colors, margins, font family, hover effects, font-size, section headings, achor font etc, etc. of different widgets. You don't need to use all content and images to make as-is website, select a few news and images and use them in different sections, repeatedly. You m

Task 4 - Styling Forms

Image
The form.html code is given below, define styles in head section such that the form should look as per attached form.png. Do not use 'br' element. Try to use minimum styles to achieve the required interface, use all type of selectors i.e. element name, class and id. Style help image is also attached. The form-help.png shall help you deciding what specific style to apply on different page elements. <!doctype html> <html> <head> <style> /* define all styles here */ </style> </head> <body> <div id="container"> <h1> Student Registration Form </h1> <form method="GET" action="register.jsp"> <div class="userinput"> <label> First Name </label> <input type="text" name="firstName" value="" /> </div> <div class="userinput"> <label> Last Name </label> <

Task 3 - New Input Types, Embed Audio/Video and Use iframe

3.1  Create an Employee Registration Form with basic attributes e.g. name, gender, email, street address, city and country, etc. Choose appropriate input type for each field.  HTML5 introduced some new input types e.g. datetime, range, email, url, search, tel, color, etc. Update form by adding moew fields that make use of new input types. Also explore and make use of some attributes of input fields e.g. required, placeholder, value, etc.

Task 2 - Explore Website Statistics and Create a Blog

2.1 See Website Statistics Open https://www.similarweb.com and see statistics of different websites. You must understand following parameters / type of data: Engagement: Total Visit (per month), page views per visit, average visit duration, bounce rate, etc. Traffic by Country Traffic Sources (Direct, Referral, Search, Social, Display)  Competitors & Similar Sites 2.2 Create a Blog Now a days, many people make living by blogging on topics that other people want to read or search at search engines. Some users publish content not for purpose of earning but just to share their knowledge, inspirations or creations with others. Blogging is a process of publishing content on our personal website (such website is called a blog). As web technologies student, you must know how to create a blog and how to publish contents on your blog. So, follow below given steps: Visit http://blogger.com . Login with your gmail account and create a blog. You only need to enter blog title

Task 1 - HTML Basics

1.1  Make a web page i.e. about-me.html about yourself with following information: Describe yourself very briefly using maximum 3 lines, use 'p' tag. Write your name as heading using 'h1' tag, on top of the page. In small braces, write the meaning of your name. Add your picture using 'img' tag, set width to 300px, under 'alt' attribute write your name. You may choose any reasonable picture from your PC or web URL (if you don't have yours). Using 'ol' tag, list at least three things that you stand for or what makes you passionate. Things that you would love doing in your life (irrespective of the financial reward). Using 'ul', list at least your 4 MAJOR skills that you believe you are very good at: programming, story telling, designing, telling jokes, making friends, making enemies, or whatever you think ...  Use two 'h2' level headings for 'Matriculation or O/Levels' or "Intermediate / A-Levels". Wri