07-01-25
CONCEPTS OF DIFFERENT CONTROLS USED IN WEB PAGES: Concepts of
CSS (Cascading Style Sheets):
CSS is a stylesheet language that is used to describe the presentation of a
document written in HTML. It allows web developers to control the layout,
style, and appearance of HTML elements on a web page. Here are some
key concepts of CSS:
1. Selectors:
Selectors are patterns used to select and style HTML elements. They
can be based on element names, classes, IDs, attributes, and more.
Example: h1 selects all <h1> elements, .class selects all elements
with a specific class, #id selects an element with a specific ID.
2. Properties:
Properties define the style aspects that you want to apply to
selected elements. They include properties like color, font-size,
margin, padding, etc.
Example: color: blue;, font-size: 16px;, margin-top: 10px;.
3. Values:
Values are assigned to properties and define how the style should
be applied. For example, blue can be a value for the color property,
and 16px can be a value for the font-size property.
4. Selectors and Declarations:
CSS rules consist of selectors and declarations. Selectors determine
which elements to style, and declarations set the style properties.
Example:
CSS
h1 { color : blue; font-size : 24px ; }
5. Box Model:
The box model describes how elements are represented in terms of
content, padding, border, and margin. It influences the layout and
spacing of elements on a page.
6. Layout:
CSS provides tools for creating different layout models, including
flexbox and grid, which allow for more sophisticated and responsive
page layouts.
7. Responsive Design:
CSS allows for the creation of responsive designs that adapt to
different screen sizes and devices. Media queries are often used to
apply styles based on characteristics like screen width.
08-01-2025
Applying CSS to HTML:
You can apply CSS to HTML in various ways:
1. Inline Styles:
Apply styles directly to an HTML element using the style attribute.
Example: <p style="color: red; font-size: 18px;">This is a red
paragraph.</p>.
2. Internal Styles:
Include CSS within the HTML document using the <style> tag in the
document's <head> section.
Example:
html
<!DOCTYPE html> <html> <head> <style> p { color: blue; font-size: 16px; }
</style> </head> <body> <p> This is a blue paragraph. </p> </body>
</html>
3. External Styles:
Link to an external CSS file using the <link> tag in the <head>
section.
Example:
html
<!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css"
href="[Link]"> </head> <body> <p> This paragraph is styled using an
external CSS file. </p> </body> </html>
4. Selectors:
Use different types of selectors (element selectors, class selectors,
ID selectors) to target specific HTML elements and apply styles
accordingly.
Example:
css
p { color : green; } .highlight { background-color : yellow; } #header { font-
size : 24px ; }
Remember that the "cascading" in CSS refers to the way styles are
applied, with styles from different sources (inline, internal, external) being
combined and resolved based on specificity and inheritance. This allows
for a flexible and modular approach to styling web pages.
09-01-2025
INTRODUCTION TO OPEN SOURCE CMS :
Content Management System (CMS) can be defined as a tool or software program containing a set of
interrelated programs used for creating and managing different digital or online content. Some famous examples
of CMS software are Joomla, Drupal, WordPress, TYPO3, etc. The typical use of CMSes are in two areas:
1. Enterprise Content Management (ECM) and
2. Web Content Management (WCM)
A content management system is composed of two major components. These are:
A content management application (CMA) is a graphical user interface that allows its users to create,
delete, modify, and publish content even without the knowledge of HTML or other programming
languages that are necessary to create web pages.
A content delivery application (CDA) is responsible for the back-end services. It manages as well as
delivers content after framed in the CMA.
FEATURES OF CMS
User Management: This permits the management of user information like the roles of different users
allotted to work simultaneously, such as creating or deleting the user, change the username, password,
and other related information.
Theme System: This allows us to modify the site view as well as functionality using stylesheets,
images, and templates.
Extending Plugins: Different plugins are offered, which gives custom functionalities and features to
create the CMS site.
Search Engine Optimization: It is embedded with a lot of search engine optimization (SEO) tools
making content SEO more straightforward.
Media Management: is used for managing the media files and folder, with uploading media contents
easy and effortless.
Multilingual: Translation of the language, as preferred by the user, is possible through CMS.
Advantages of Content Management System
Most of the CMS is open source and is available for free.
Easy and quick uploading of media files can be done.
Several SEO tools make on-site SEO simpler.
Easy customization is possible as per the need of the user.
It can modify CSS files as per the design needed by the user.
Many templates and plugins are available for free. Customization of plugins is also possible.
Content editing is also more comfortable as it uses the WYSIWYG editor.
Disadvantages of Content Management System
CMS software needs a time-to-time update, and hence the user needs to look out for an updated
version.
The use of different plugins can make your website heavy and challenging to run.
CMS hosting is quite expansive.
PHP knowledge is required to modify or change the WordPress website.
10-01-2025
WEB AUTHORING TOOLS:
Web authoring tools are used to create Web content, and cover a wide range of software programs you can
download to your computer or access online. The World Wide Web Consortium, or W3, issues guidelines for
web authoring tools that create a basic industry standard for web accessibility.
"Authoring tools" covers any software is used to write the web, from enterprise content management systems
(CMSs) through to microblogging mobile apps, whether web-based, non-web-based or a combination.
Examples include:
web page authoring tools (e.g., WYSIWYG HTML editors)
software for directly editing source code or markup
software for converting to web content technologies (e.g., "Save as HTML" features in office suites)
integrated development environments (e.g., for web application development)
software that generates web content on the basis of templates, scripts, command-line input or "wizard"-
type processes
software for rapidly updating portions of web pages (e.g., blogging, wikis, online forums)
software for live collaboration over the web
software for updating social media profiles, microblogging, and photo and video sharing
software for generating/managing entire web sites (e.g., content management systems, courseware tools,
content aggregators)
email clients that send messages in web content technologies
multimedia authoring tools
debugging tools for web content
software for creating mobile web applications
scripting libraries
web application frameworks, IDEs and SDKs
KompoZer is a web site editor. It is free and you can download a copy for the Mac, Windows or Linux
environments.
FRONT PAGE: a program for developing and maintaining web sites.
CONCEPT OF GOOD WEB PAGE DESIGN ING TECHNIQUES:
WEBSITE PURPOSE. Your website needs to accommodate the needs of the user. ...
SIMPLICITY. Simplicity is the best way to go when considering the user experience and the usability of your
website. ...
NAVIGATION. ...
VISUAL HIERARCHY. ...
CONTENT. ...
GRID BASED LAYOUT. ...
LOAD TIME.
MOBILE FRIENDLY