Chen Raz Requirements: 1. HTML5/CSS3 (I remind you that we have an agreement that you don't charge me extra for this) 2. Do not use the html element 3.

Slides:



Advertisements
Similar presentations
Support.ebsco.com EBSCOadmin Branding Tutorial. Welcome to the EBSCOadmin Skinning and Branding tutorial, where you will learn how to customize EBSCOhost.
Advertisements

Navigation Bars Level 2 Extended Certificate Unit B12 Doing Business Online.
Web Pages and Style Sheets Bert Wachsmuth. HTML versus XHTML XHTML is a stricter version of HTML: HTML + stricter rules = XHTML. XHTML Rule violations:
Microsoft Expression Web-Illustrated Unit L: Using Code Tools.
Media Queries Jeffery Davis CIT media is used to define different style rules for different media types and devices. Media queries.
Chapter 7 Using Advanced Cascading Style Sheets HTML5 & CSS 7 th Edition.
Tutorial EBSCOadmin Branding support.ebsco.com. To help you enhance the search experience for your users, EBSCO offers a number of custom branding options.
Start -> All Programs -> Classes -> Web Expressions -> Dreamweaver.
Creating Tables in a Web Site Using an External Style Sheet HTML5 & CSS 7 th Edition.
HTML. Goals How to use the Komodo editor HTML coding and testing Basic HTML tags List and Images Tables and Links At least 2 pages and navigation
 Experiment with the Design features to get the look you want for your presentation.  Most design templates will keep the design the same on all your.
Understanding HTML Style Sheets. What is a style?  A style is a rule that defines the appearance and position of text and graphics. It may define the.
© 2011 Delmar, Cengage Learning Chapter 2 Developing a Web Page.
CMS Wiki Pages CMS Pages, the only approved and supported website service for CMS employees, has been failing and an alternative needed to be implemented.
CIT 256 Organizing Large Websites: Divs, DW Templates Dr. Beryl Hoffman.
Tutorial 6 Creating Tables and CSS Layouts. Objectives Session 6.1 – Create a data table to display and organize data – Modify table properties and layout.
Creating A Simple Web Page. Step 1- Open Dreamweaver & Create A New Page (File New) and blank.
Adding an Inline Style Sheet Page without Inline Style Sheet Page with Inline Style Sheet.
HTML Concepts and Techniques Fourth Edition Project 8 Creating Style Sheets.
JQuery Page Slider. Our goal is to get to the functionality of the Panic Coda web site.Panic Coda web site.
Creating an Expression Web Site
Slide 1 Consider the page layouts for: Layout design – does it look balanced and even Size of box relative to its importance – the Heading (or title) of.
Chapter 18 Web Design April 16 th & 17 th. Content The most essential element of any Web page is the content Before you begin a Web page you want to know.
Creating A Site Using A Template In Dreamweaver CS6 Cakes R Us!
Chapter 2 Developing a Web Page. A web page is composed of two distinct sections: –The head content –The body Creating Head Content and Setting Page Properties.
How to Web Page with iModules First row of icons.
WELCOME EF 105 Spring EF 105 Computer Methods in Engineering Problem Solving Week 2: FrontPage Introduction to Software Use to create Web Pages.
Intro to Dreamweaver Web Design Section 7-1 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development I” Course.
Formatting TEXT AND Using CSS. Adobe Dreamweaver CS3 - Illustrated.
Computer Information Technology – Section 3-4. HTML – The Language of the Internet Objectives: The Student will: 1. Look at HTML 2. Understand the basic.
Part 3: Page Structure. Activity: Table of Contents (TOC) Create a table of contents that links to each of your previously built pages. Follow the directions.
Lesson 02 // Elements & Attributes. There are different types of elements, but the 2 most important ones are BLOCK and INLINE. Block elements flow from.
 HTML is hypertext markup language. It is a way for people to display their information with more complex pictures and text displays. Before HTML, messages.
Chapter 2 Web Page Design Mr. Gironda. Elements of a Web Page These are things that most web pages use.
The Care and Maintenance of J5 MAC New Look. Naming Conventions  Each graphic and include item is named by function_contract area_secondary identifier.
Use CSS to Implement a Reusable Design Selecting a Dreamweaver CSS Starter Layout is the easiest way to create a page with a CSS layout You can access.
5 different skills using Microsoft Office PowerPoint.
Principles of Web Design 6 th Edition Chapter 9 – Site Navigation.
HTML.
Things we’ve covered so far  Basic HTML  Some advanced tags i.e.  Styling using CSS  Background-color  Text  Changing the font on your site  Inserting.
Course created by Sarah Phillips BBCD Melbourne BAPDCOM Version 1 – April 2013.
Writing a Web Page. Using Frontpage FrontPage is a user-friendly WYSIWYG html editor. To begin, open the program and a new page. FrontPage is a user-friendly.
Sometimes home page banner does not appear,. Please check why.
Macromedia Dreamweaver 8 Revealed WEB PAGE DEVELOPING A.
HTML & CSS BasicsHTMLCSSQuizAnswers  The logo In this website(made of html and css Codes), you will learn some basics of How to use HTML and CSS codes.
1.Click on “Start” menu 2.Click on “ 1. Choose a different layout for your slide.
Font, Font Size, and Text Color. When you have a text box open you have access to the font, font size, and font color from the home screen under the section.
1 2/22/05CS120 The Information Era Chapter 4 Basic Web Page Construction TOPICS: Images and placing pages on the server.
Steps on making a Powerpoint. There are steps you have to take to be able to get your powerpoint done for example if you want to get a new slide and layout.
Creating Web Pages with Links, Images, and Embedded Style Sheets
Week 1: Write Story and Create Illustrations Week 2: Background, Font, Clip Art, Photos Week 3: Animations and Sound Week 4-5: Narration and Transitions.
Microsoft Expression Web - Illustrated Unit A: Getting Started With Microsoft Expression Web.
Elements & Attributes. There are different types of elements, but the 2 most important ones are BLOCK and INLINE. Block elements flow from top to bottom.
HTML LAYOUTS. CONTENTS Layouts Example Layout Using Element Example Using Table Example Output Summary Exercise.
Creating Web Pages in Word. Sharing Office Files Online Many Web pages are created using the HTML programming language. Web page editors are software.
>> CSS Layouts. Recall Properties of Box – Border (style, width, color) – Padding – Margin – Display – Background – Dimension Welcome Padding Area Border.
INTRODUCTION ABOUT DIV Most websites have put their content in multiple columns. Multiple columns are created by using or elements. The div element is.
Title of your site Title of your page Text and images arranged on the page in the design of your choice. Page 2 Page 3 Page 4 Page 5 Page 6 Page 7 Page.
Connecting From Home Editing at Home(You don’t have to.)
Tips for Inserting Graphs or Images Tips for Title/Headers Bar Color
Chapter 2 Developing a Web Page.
Your First & Last Name (Make sure you capitalize your first and last name!) Follow these instructions: 1. Center your name on the slide (use the “Centered”
[Poster Title] [Your name] abstract methods results background
 The home of the website have the logo of the punjab college.
Tips for Inserting Graphs or Images Tips for Title/Headers Bar Color
Slightly more CSS.
Computer communications
CMP Creating Your Personal and Small Business Web Sites
ANIMATION TEMPLATE FRANKIE CHEN 2015.
Multipage Sites.
Presentation transcript:

Chen Raz Requirements: 1. HTML5/CSS3 (I remind you that we have an agreement that you don't charge me extra for this) 2. Do not use the html element 3. Do not assign style without classes For example: css: #test span { color:#444 } html: test should be: css: #test.txt { color:#444 } html: test 4. Text that come from the CMS should be plain (no styles, classes and html tags except from ) 5. Responsive website (There is a mobile version for some of the pages) 6. The site width should stretch for any resolutions (from 1024 to 1920) 7. It should work also for IE 7 and higher with both states (computability view checked and unchecked)

Home Page The site width should stretch for any resolutions (from 1024 to 1920) The page contains 12 boxes. 1-Logo 2,3,4,5,7,9,12 – picture boxes that act as following: A random between all of them. Every sequence will blur one of the boxes. Roll over will remove the blur effect. Do not use the pictures as background. 8- Text that come from the CMS. should be plain (no styles, classes and html tags except from ) 10- contact form. The input[text] should be without text. I will implement it. Note: for the mobile version use the following: menu,1,8,10,social,credit. The rest of the element should not be displayed.

Sub Menu: There is only 2 level. Rolling over menu item will open the menu that will stretch width from 1 to 3 Add a nice animation effect when the menu go down or up – slider effect

123

About: This is a content page. The title should be H1 The text come from the CMS. It should be plain (no styles, classes and html tags except from ) Do not use the 4 pictures as background The text above the picture (if there is any) is part of the picture Note: There is a mobile version for this kind of page

H1 CMS

List Page: List Page that contains 6 elements. The title and the picture are links Clicking on the “more” button should open another 6 elements like the effect in the zangaru project (that you cut for us): Note: There is a mobile version for this kind of page (use the “more” button effect in this version also)

More Button

Contact: The text come from the CMS. It should be plain (no styles, classes and html tags except from ) The text above the picture (if there is any) is part of the picture In the mobile version there is no need to display the map

H1 CMS