the book I'm using as a reference for this reading It has been written with two very different types of people in mind:
- Those who want to learn how to design and build websites from scratch
- Anyone who has a website (that may be built using a content management system, blogging software, or an e-commerce platform) and wants more control over the appearance of their pages
- HTML:
- CSS
the start this section with a chapter that explains how CSS uses rules to enable you to control the styling and layout of web pages. We then go on to look at the wide variety of CSS properties you can use in your CSS rules.
- Practical it ends up with some helpful information that will assist you in building better websites.
In the browser window you can see a web page that features exactly the same content as the Word document you met on the page 18. To describe the structure of a web page, we add code to the words we want to appear on the page.
You can see the HTML code for this page below. Don't worry about what the code means yet. We start to look at it in more detail on the next page. Note that the HTML code is in blue, and the text you see on screen is in black.
Many long articles have sub-headings so to help you follow the structure of what is being written. There may even be sub-sub-headings (or lower-level headings).
- Specifying different versions of HTML
- Identifying and grouping elements
- Comments, meta information and iframes
This chapter, focuses on some helpful topics that are not easily grouped together. You will learn about:
- The different versions of HTML and how to indicate which version you are using
- How to add comments to your code
- Global attributes, which are attributes that can be used on any element, including the class and id attributes
- Elements that are used to group together parts of the page where no other element is suitable
- How to embed a page within a page using iframes
- How to add information about the web page using the meta> element
- Adding characters such as angled brackets and copyright symbols
- HTML5 layout elements
- How old browsers understand new elements
- Styling HTML5 layout elements with CSS
They are covered here (rather than with the other HTML elements you met earlier in the book) because you'll find it easier to understand how they can be used now that you have seen how CSS can control the layout a page. These new elements are going to play an important part in creating layouts going forward. In this chapter you will see:
- The new HTML5 layout elements and their uses
- How they offer helpful alternatives to the element
- How to ensure older browsers recognize these elements As with all HTML5 and CSS3 content, its usage is still subject to change but it is already widely being used by web developers and it is likely that you will want to use them.
HTML5 introduces a new set of elements that allow you to divide up the of a page. The names of these elements indicate the kind of content you will find in them. They are still subject to change, but that has not stopped many web page authors using them already.
It looks at who might be visiting your site and how to ensure the pages feature the information those visitors need. It also covers some key aspects of design theory to help you create professional looking sites. In this chapter,we will look at:
- How to understand the audience your site may attract and what information they will expect to find on it
- How to organize information so that visitors can find what they are looking for
- Design theory for presenting information in a way that helps visitors achieve their goals
- Design tips to help you create more attractive and professional sites
Your content and design should be influenced by the goals of your users. To help determine why people are coming to your website, there are two basic categories of questions you can ask:
- The first attempts to discover the underlying motivations for why visitors come to the site.
- The second examines the specific goals of the visitors. These are the triggers making them come to the site now.
- Are they looking for general entertainment or do they need to achieve a specific goal?
- If there is a specific goal, is it a personal or professional one?
- Do they see spending time on this activity as essential or a luxury?
- Do they want general information / research (such as background on a topic / company), or are they after something specific (such as a particular fact or information on a product)?
- Are they already familiar with the service or product that you offer or do they need to be introduced to it?
- Are they looking for time sensitive information, such as the latest news or updates on a particular topic?
need to become familiar with some key concepts in computer programming. They will be covered in three sections:
To write a script, you need to first state your goal and then list the tasks that need to be completed in order to achieve it.
1. DEFINE THE GOAL First, you need to define the task you want to achieve. You can think of this as a puzzle for the computer to solve.
2. DESIGN THE SCRIPT To design a script you split the goal out into a series of tasks that are going to be involved in solving this puzzle. This can be represented using a flowchart. You can then write down individual steps that the computer needs to perform in order to complete each individual task (and any information it needs to perform the task), rather like writing a recipe that it can follow.
3. CODE EACH STEP Each of the steps needs to be written in a programming language that the compu ter understands. In our case, this is JavaScript. As tempting as it can be to start coding straight away, it pays to spend time designing your script before you start writing it.
Every step for every task shown in a flowchart needs to be written in a language the computer can understand and follow. In this book, we are focussing on the JavaScript language and how it is used in web browsers. Just like learning any new language, you need to get to grips with the:
- Vocabulary: The words that computers understand
- Syntax: How you put those words together to create instructions computers can follow.