1. Web Design – The Basics

The truth is, it’s not that hard to learn how to write web pages and read the code used to create them; you certainly don’t have to be a “programmer.” Understanding HTML (Hypertext Mark-up Language) and CSS (Cascading Style Sheets) can help anyone who works with the web; designers can create more attractive and usable sites, website editors can create better content, marketers can communicate with their audience more effectively, and managers can commission better sites and get the best out of their teams. I’ve focused on the code you need to use 90% of the time and omitted the code that you would rarely see even if writing websites is your full time job. By the end of the book, if you come across the other 10% you will be able to Google it to find out what it means quickly and easily. I have also added practical information on topics I am commonly asked about, such as how to prepare images, audio and video for the web, how to approach the design and build of a new site, how to improve your rankings in search engines (SEO), and how to use Google Analytics to learn about visitors
to your site.

HOW PEOPLE ACCESS THE WEB.

Capture2
source: Duckett

 

Before we look at the code used to build websites it is important to know the
different ways which people access the web and clarify some terminology.

BROWSERS
People access the web using software called browsers, as you probably already
know, popular exampled include Firefox, Google Chrome, Internet Explorer, Safari
and Opera.

WEB SERVERS.
When you ask your browser for a web page, the request is sent across the
internet to a special computer called a web server which hosts the website.

DEVICES.
Phones, PCs, Laptops etc.

LANGUAGES

Web Design is usually carried out using HTML and CSS, they aren’t really programming languages per se, but if you’re new to coding you should understand how their basics.

1: HTML
We will spend the first lesson looking at how HTML is used to create web pages. You will see that you start by writing down the words you want to appear on your page. You then add tags or elements to the words so that the browser knows what is a heading, where a paragraph begins and ends, and so on. The rest of this section introduces the tags you have at your disposal to create web pages, grouped into chapters on: text, lists, links, images, tables, forms, video audio and flash, and miscellaneous elements. I should warn you that the examples in the first few lessons will not be exciting to look at, yet they are the foundation of every web page. The following sections on CSS will show you how to make your pages look a lot more interesting.

2: CSS
We start the next 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 properties you can use in your CSS rules. These properties generally fall into one of two
categories:
Presentation: How to control things like the color of text, the fonts you want to use and the size of those fonts, how to add background colors to pages (or parts of a page), and how to add background images.

Layout: How to control where the different elements are positioned on the screen. You will also learn several techniques that professionals use to make their pages more attractive.

Capture3
some sample HTML code and results

We’ll get started on some real coding in the next lesson, if you have any questions just let me know in the comments or follow me on Instagram and Twitter @Uzoezi_

 

 

Advertisements

2 thoughts on “1. Web Design – The Basics

  1. Com esse aprendizado, podemos advertir que junto baixa sucessivo das
    habilidades físicas, impacto condoimento envelhecimento
    contudo das doenças, macróbio tende a acompanhar alterando seus estilo de vida e também rotinas diárias por atividades no entanto corpo com afazeres bocadinho ativas, podendo fazer uma dedução no atuação, na aptidão
    motora, na celebridade com absorção, dentre comportamento no entanto desde arranjo,
    gerando processos desde auto-desvalorização, desânimo, hesitação, perda da fundamento, afastamento civil bem como a
    afastamento. http://www.ophthalmicusedequipment.com/

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s