Web designing & web development! BATRA COMPUTER CENTRE

28
WEB DESIGNING & WEB DEVELOPMENT BATRA COMPUTER CENTRE Website: info.batracomputercentre.com Ph. No.: 9729666670, 01714000670

Transcript of Web designing & web development! BATRA COMPUTER CENTRE

WEB DESIGNING

& WEB DEVELOPMENT

BATRA COMPUTER CENTRE

Website: info.batracomputercentre.com Ph. No.: 9729666670, 01714000670

INTRODUCTION TO WEB DESIGNING

Web design is the visual aesthetics and page layout of a website. It goes hand-in-hand with web development in the creation of a static website or dynamic web application.Even if you don’t consider yourself a creative person, it’s still a good idea to learn web design. No matter whether you want to make static websites or dynamic web applications, design is an important part of the process. The design is the first thing people notice when they arrive on a website, and if it’s not good enough, they’ll leave. You don’t want to create a site that frustrates people, do you?

INTRODUCTION TO WEB DEVELOPMENT

Web programming, also known as web development, is the creation of dynamic web applications. Examples of web applications are social networking sites like Facebook or e-commerce sites like Amazon.The good news is that learning web development is not that hard!In fact, many argue it’s the best form of coding for beginners to learn. It’s easy to set up, you get instant results and there’s plenty of online training available.

WHAT IS WEB DESIGNING

Web design is a process of conceptualizing, planning, and building a collection of electronic files that determine the layout, colors, text styles, structure, graphics, images, and use of interactive features that deliver pages to your site visitors. Professional Web design helps to make your business appear credible online.

When you're ready to build a website, you have several options. If you are not familiar with HTML programming language and Web design applications, there are a number of other options for creating your Web design:

1.Hire a professional website design expert to create and build a unique Web site.

2.Create your own website design using off-the-shelf software such as FrontPage or Dreamweaver. (These software packages do require technical expertise.)

3.Use online website design tools with pre-set and/or customizable Web design templates to customize with your company colors, graphics and text.

The degree of customization included in your website design will determine the speed and cost of getting your site up and running.

CREATING EFFECTIVE

WEBSITE BY APPLYING

KEY VISUAL ELEMENT

Page layout is the part of graphic design that deals in the arrangement of visual elements on a page. It generally involves organizational principles of composition to achieve specific communication objectives.The high-level page layout involves deciding on the overall arrangement of text and images, and possibly on the size or shape of the medium. It requires intelligence, sentience, and creativity, and is informed by culture, psychology, and what the document authors and editors wish to communicate and emphasize. Low-level pagination and typesetting are more mechanical processes. Given certain parameters - boundaries of text areas, the typeface, font size, and justification preference can be done in a straightforward way. Until desktop publishing became dominant, these processes were still done by people, but in modern publishing they are almost always automated. The result might be published as-is (as for a residential phone book interior) or might be tweaked by a graphic designer (as for a highly polished, expensive publication).Beginning from early illuminated pages in hand-copied books of the Middle Ages and proceeding down to intricate modern magazine and catalog layouts, proper page design has long been a consideration in printed material. With print media, elements usually consist of type (text), images (pictures), and occasionally place-holder graphics for elements that are not printed with ink such as die/laser cutting, foil stamping or blind embossing.

Color is one of the most obvious elements of

design, for both the user and the designer. It

can stand alone, as a background, or be

applied to other elements, like lines, shapes,

textures or typography. Color creates a mood

within the piece and tells a story about the brand. Every

color says something different, and combinations can alter

that impression further.

Graphics (from Greek γραφικός 'graphikos', 'something written' e.g. autograph) are visual images or designs on some surface, such as a wall, canvas, screen, paper, or stone to inform, illustrate, or entertain. In contemporary usage it includes: pictorial representation of data, as in computer-aided design and manufacture, in typesetting and the graphic arts, and in educational and recreational software. Images that are generated by a computer are called computer graphics.Examples are photographs, drawings, Line art, graphs, diagrams, typography, numbers, symbols, geometric designs, maps , engineering drawings, or other images. Graphics often combine text, illustration, and color. Graphic design may consist of the deliberate selection, creation, or arrangement of typography alone, as in a brochure, flyer, poster, web site, or book without any other element. Clarity or effective communication may be the objective, association with other cultural elements may be sought, or merely, the creation of a distinctive style.Graphics can be functional or artistic. The latter can be a recorded version, such as a photograph, or an interpretation by a scientist to highlight essential features, or an artist, in which case the distinction with imaginary graphics may become blurred.

There are many ways to categorize and subcategorize type. This overview discusses the seven major historical categories that build on one another. Serif fonts comprise four of these categories: humanist, old style, transitional, and modern. Italics, first designed in the 1500s, have evolved to become part of a font ‘family’ and were at one time a separate category. They were initially designed as independent fonts to be used in small pocket books where space was limited. They were not embraced as text fonts, but were considered valuable for adding emphasis within a roman text and so became part of the set of options and extensions a font possessed. The trajectory of use is the opposite for the sans serif category. Sans serif fonts have historically been used for display only, but in the 20th century, they became associated with the modern aesthetic of clean and simple presentation and have now become very popular for text-block design. Egyptian or slab serif fonts can be used as either display or text depending on the characteristic of the font design.

Texture is a visual and a tactile quality that designers work with. Texture is used both in composition and also on the printed substrate or media space. Designers create textures for their projects with anything at hand. A texture can be made with typography, generated in raster or vector software like Photoshop or Adobe Illustrator, or by using a camera and capturing elements in the material world.Using texture thoughtfully will enhance a visual experience and amplify the context for the content. Often adding texture adds visual complexity and a bit of visceral depth to a two-dimensional design project. It can also tie one piece of design to another, or become a defining element of a brand or a series of communications.

Is Your Website

User Friendly?

Usability is an essential goal of any website, and

usable navigation is something every website

needs. It determines where users are led and

how they interact with the website. Without

usable navigation, content becomes all but

useless. Menus need to be simple enough for

the user to understand, but also contain the

elements necessary to guide the user through t

he website — with some creativity and good design thrown in.

Browser compatibility is the capability or flexibility of a website, web application, script or HTML design to function on different web browsers available in the market. 

The benefit of creating a website with browser computability is that it improves a website's reach and cuts down on loss in performance. Browser compatibility also can be described as the potential of a web browser to efficiently display the HTML code and carry out the scripts on web pages.

Web accessibility refers to the inclusive practice of removing barriers that prevent interaction with, or access to websites, by people with disabilities. When sites are correctly designed, developed and edited, all users have equal access to information and functionality.

The concept of a well-formed document allows for a better understanding of the fundamental construction of XML. It helps to clarify XML beyond the typical sense of it. For example, while most XML Document Type Definitions utilize left and right angle brackets as content delimiters, strictly speaking this is not a necessity (though a delimiter should be terse and concise). The left and right angle bracket codes are a convention, albeit clear and distinctive, not an absolute requirement.

Keep yourself updated

by knowing the different

web designing trends

Responsive web design (RWD) is a web development approach that creates dynamic changes to the appearance of a website, depending on the screen size and orientation of the device being used to view it. RWD is one approach to the problem of designing for the multitude of devices available to customers, ranging from tiny phones to huge desktop monitors.RWD uses so-called breakpoints to determine how the layout of a site will appear: one design is used above a breakpoint and another design is applied below that breakpoint. The breakpoints are commonly based on the width of the browser.

Fixed Header is the header that is always visible to users even the user scrolls down. It uses the fixed-position in CSS.There a lot of websites nowadays that use a fixed header, such as gmail or Facebook. When you've logged into Facebook you scroll down you still see the header with the search bar and some other functions at the top. Similar functionality exists in gmail, but not in yahoo mail.The benefit of a fixed header is that if the user need to use a function they can easily jump to the header without the need to scroll up, as would be required for a non-fixed header. However, if there is more content then users might lose some space because the header occupies some permanent screen real-estate. Also using fixed position CSS is not easy to do and so if you implement incorrectly the page can render incorrectly due to Fixed Position.

Large backgrounds make a very impressive visual impact on websites. A web designer has the possibility to play with different design variables that are usually used by photographers, such as depth of field or focus. The background does not have to be just photos, but also any other large illustration or even video.

Definition and purpose. Flat design is a style of

Interface design emphasizing minimum use of

stylistic elements that give the illusion of three

dimensions (such as the use of drop shadows,

gradients or textures) and is focused on a

minimalist use of simple elements, typography

and flat colors.

Typography is the design and use of typefaces as a means of communication. It is considered to have begun with Gutenberg and the development of moveable type. But typography has its roots in handwritten letterforms. Typography encompasses everything from calligraphy through digital type and type on Web pages. It also includes type designers who create new letterforms as well as designers and calligraphers who use the letters as part of their designs.Typography uses typefaces and the whitespace around and through them to create a whole design.

Information design is the practice of

presenting information in a way that fosters efficient

and effective understanding of it. The term has come

to be used specifically for graphic design for

displaying information effectively, rather than just

attractively or for artistic expression.

A one page website is simply a single page website that uses

only one HTML page. When clicking on navigation links, the user

scrolls down the page or jumps to that particular content's

section. The website may use JavaScript, Query, CSS3, or Ajax

to accomplish this movement.

Parallax scrolling is a technique in computer

graphics and web design, where background

images move by the camera slower than foreground

images, creating an illusion of depth in a 2D scene

and adding to the immersion.

15 SCO, Dayal Bagh,Near Hanuman Mandir,Ambala Cantt-133001HARYANA

Ph. No.: 9729666670, 0171-4000670

Website : www.batracomputercentre.com Email ID: [email protected]