reading-notes

Structure web pages with HTML

An introduction to wireframing

Wireframing is a practice used by UX designers which allows them to define and plan the information hierarchy of their design for a website, app, or product. This process focuses on how the designer or client wants the user to process information on a site, based on the user research already performed by the UX design team.

Wireframes drawn with paper and a pencil, or at a whiteboard, have the advantage of looking and being very easy to change, which can help tremendously in early conversations about your website or product.
With the help of paper-prototypes, you can test with end users at every stage of ideation and design. Changes at these stages are much easier—and therefore cheaper—than changes deemed necessary after coding is under way.
Switching later to software (after initially hand-drawing your wireframe) allows you to keep track of more detailed decisions.

HTML (Hypertext Markup Language)

is the code that is used to structure a web page and its content. For example, content could be structured within a set of paragraphs, a list of bulleted points, or using images and data tables.

The main parts of its element are as follows:

1.The opening tag: This consists of the name of the element (in this case, p), wrapped in opening and closing angle brackets. This states where the element begins or starts to take effect — in this case where the paragraph begins. 2.The closing tag: This is the same as the opening tag, except that it includes a forward slash before the element name. This states where the element ends — in this case where the paragraph ends. Failing to add a closing tag is one of the standard beginner errors and can lead to strange results. 3.The content: This is the content of the element, which in this case, is just text. 4.The element: The opening tag, the closing tag, and the content together comprise the element. example it can be self closed tag in some cases |tag | usage| | ———– | ———– | |< h >|Headings| |< p >|paragraph| |< ul >|lists| |< a herf=”” >|link| |< img src=”” >|image|