Posts

Showing posts from February, 2018

Task 5 - Make CNN.com Layout

Image
Last Updated On: Mar. 9, 2024 Title : Create CNN Layout using CSS/HTML (do not use Bootstrap) Rename your file to <section name>--<student reg. number as per std id card>--<student-name>.html and upload the file. Define CSS as internal and for images, use images URLs. Create  cnn.com layout, overall look & feel should be same e.g. paddings, borders, colors, margins, font family, hover effects, font-size, section headings etc. of different widgets. You don't need to use all content and images to make as-is website, select a few news text and images as sample and feel free to use them in different sections, repeatedly. You must write all CSS and HTML by your own, do not copy CSS styles from CNN website. Take care of following points: Navigation bar and logo placement. Make all horizontal sections e.g. 3 columns of different widths, 3 columns of same width, 4 columns section (same and different width, both), "In Case You Missed It" section, foote
12 comments
Read more

Task 4 - Styling Forms

Image
Updated on: Mar. 4, 2024 This is Lab Task to practice basic CSS properties. Save below code in form.html file and define CSS styles in head section such that the form shall look as per attached image i.e. form.png. Do not use 'br' tag for spacing but use margins etc. Try to keep the code size minumum to create required user interface (UI), so use selectors most effectively to achieve this target. Style guideline image is also attached i.e. form-help.png, please use it to decide what CSS properties shall be applied on which 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"
Post a Comment
Read more

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.
Post a Comment
Read more

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
Post a Comment
Read more

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
Post a Comment
Read more