This document provides an overview of various web development tools and technologies, including FTP, HTML, CSS, JavaScript, Flash, PHP, ASP, and content management systems. It discusses the purpose and basic usage of each tool. For example, it explains that FTP is used to transfer files between a local computer and web host, and that HTML is the underlying markup language that defines the structure and content of a web page. The document also provides learning resources and examples of text editors, FTP clients, and other tools.
Copy of the slides from the Advanced Web Development Workshop presented by Ed Bachta, Charlie Moad and Robert Stein of the Indianapolis Museum of Art during the Museums and the Web 2008 conference in Montreal
So, You Wanna Dev? Join the Team! - WordCamp Raleigh 2017 Evan Mullins
WP Dev/tools for beginners: ftp, git, svn, php, html, css, sass, js, jquery, IDEs, themes, child themes, the loop, hooks, APIs, CLI, agile, bootstrap, SEO, slack… etc.
We’ll discuss the language and various acronyms and buzzwords used by devs in this crash course introduction to the developer’s world. Overview of primary development processes and terms and what software is needed to play the game. We’ll cover what you need to go from zero to developer and hopefully how to have fun on the way.
An overview of web development essentials that will help you as a user experience designer to not only understand how to integrate designs with development components, but also to learn some tips on interacting effectively with developers.
Copy of the slides from the Advanced Web Development Workshop presented by Ed Bachta, Charlie Moad and Robert Stein of the Indianapolis Museum of Art during the Museums and the Web 2008 conference in Montreal
So, You Wanna Dev? Join the Team! - WordCamp Raleigh 2017 Evan Mullins
WP Dev/tools for beginners: ftp, git, svn, php, html, css, sass, js, jquery, IDEs, themes, child themes, the loop, hooks, APIs, CLI, agile, bootstrap, SEO, slack… etc.
We’ll discuss the language and various acronyms and buzzwords used by devs in this crash course introduction to the developer’s world. Overview of primary development processes and terms and what software is needed to play the game. We’ll cover what you need to go from zero to developer and hopefully how to have fun on the way.
An overview of web development essentials that will help you as a user experience designer to not only understand how to integrate designs with development components, but also to learn some tips on interacting effectively with developers.
PrettyFaces: SEO, Dynamic, Parameters, Bookmarks, Navigation for JSF / JSF2 (...Lincoln III
PrettyFaces: SEO, Dynamic Parameters, Bookmarks, and Navigation for JSF / JSF2 - As presented at JSFSummit2009 in Orlando Florida.
Why should we use PrettyFaces?
Intro to mobile web application developmentzonathen
Learn all the basics of web app development including bootstrap, handlebars templates, jquery and angularjs, as well as using hybrid app deployment on a phone.
As programmers, we concentrate so much on the server/backend side of things that we often forget to measure performance from the Client's viewpoint. This presentation describes a bunch of techniques that can be used to speed up our websites.
J2EE is already the perfect solution for complex business/enterprise systems, and JSF2.x is the perfect chance to reach out to the consumer and small business market. JSF is easier to use than it's ever been before, but small businesses have different needs than larger companies and corporations. PrettyFaces is for all projects, small and large; this presentation explains why "pretty, bookmark-able URLs" are important for client-facing applications, addressing SEO optimization, and creating clean, consistent, intuitive client interactions on the web.
I felt necessity of creating this brief slideshow, so as to help PHP Developer interns and communicating the intricacies of development with my clients easier. I thought the more deeply clients understood what really went into translating their ideas to web applications under the hood, the better it could translate to
exchange of design issues,
appreciation of development process intricacies, resulting delivery time & cost issues.
So I quickly put together information that I found on internet & have tried to make an attempt. Hope this helps other developers too... Your comments & critique are welcome in terms of improving & simplifying this slide show.
PrettyFaces: SEO, Dynamic, Parameters, Bookmarks, Navigation for JSF / JSF2 (...Lincoln III
PrettyFaces: SEO, Dynamic Parameters, Bookmarks, and Navigation for JSF / JSF2 - As presented at JSFSummit2009 in Orlando Florida.
Why should we use PrettyFaces?
Intro to mobile web application developmentzonathen
Learn all the basics of web app development including bootstrap, handlebars templates, jquery and angularjs, as well as using hybrid app deployment on a phone.
As programmers, we concentrate so much on the server/backend side of things that we often forget to measure performance from the Client's viewpoint. This presentation describes a bunch of techniques that can be used to speed up our websites.
J2EE is already the perfect solution for complex business/enterprise systems, and JSF2.x is the perfect chance to reach out to the consumer and small business market. JSF is easier to use than it's ever been before, but small businesses have different needs than larger companies and corporations. PrettyFaces is for all projects, small and large; this presentation explains why "pretty, bookmark-able URLs" are important for client-facing applications, addressing SEO optimization, and creating clean, consistent, intuitive client interactions on the web.
I felt necessity of creating this brief slideshow, so as to help PHP Developer interns and communicating the intricacies of development with my clients easier. I thought the more deeply clients understood what really went into translating their ideas to web applications under the hood, the better it could translate to
exchange of design issues,
appreciation of development process intricacies, resulting delivery time & cost issues.
So I quickly put together information that I found on internet & have tried to make an attempt. Hope this helps other developers too... Your comments & critique are welcome in terms of improving & simplifying this slide show.
Basics, Components, Design and Development of Web Application and Websites. Especially made for seminars and guest sessions for newbies in Web Development field.
STAENZ Academy
https://staenz.com/academy
The Art Pastor's Guide to Sabbath | Steve ThomasonSteve Thomason
What is the purpose of the Sabbath Law in the Torah. It is interesting to compare how the context of the law shifts from Exodus to Deuteronomy. Who gets to rest, and why?
Unit 8 - Information and Communication Technology (Paper I).pdfThiyagu K
This slides describes the basic concepts of ICT, basics of Email, Emerging Technology and Digital Initiatives in Education. This presentations aligns with the UGC Paper I syllabus.
2024.06.01 Introducing a competency framework for languag learning materials ...Sandy Millin
http://sandymillin.wordpress.com/iateflwebinar2024
Published classroom materials form the basis of syllabuses, drive teacher professional development, and have a potentially huge influence on learners, teachers and education systems. All teachers also create their own materials, whether a few sentences on a blackboard, a highly-structured fully-realised online course, or anything in between. Despite this, the knowledge and skills needed to create effective language learning materials are rarely part of teacher training, and are mostly learnt by trial and error.
Knowledge and skills frameworks, generally called competency frameworks, for ELT teachers, trainers and managers have existed for a few years now. However, until I created one for my MA dissertation, there wasn’t one drawing together what we need to know and do to be able to effectively produce language learning materials.
This webinar will introduce you to my framework, highlighting the key competencies I identified from my research. It will also show how anybody involved in language teaching (any language, not just English!), teacher training, managing schools or developing language learning materials can benefit from using the framework.
How to Make a Field invisible in Odoo 17Celine George
It is possible to hide or invisible some fields in odoo. Commonly using “invisible” attribute in the field definition to invisible the fields. This slide will show how to make a field invisible in odoo 17.
How to Create Map Views in the Odoo 17 ERPCeline George
The map views are useful for providing a geographical representation of data. They allow users to visualize and analyze the data in a more intuitive manner.
Model Attribute Check Company Auto PropertyCeline George
In Odoo, the multi-company feature allows you to manage multiple companies within a single Odoo database instance. Each company can have its own configurations while still sharing common resources such as products, customers, and suppliers.
Synthetic Fiber Construction in lab .pptxPavel ( NSTU)
Synthetic fiber production is a fascinating and complex field that blends chemistry, engineering, and environmental science. By understanding these aspects, students can gain a comprehensive view of synthetic fiber production, its impact on society and the environment, and the potential for future innovations. Synthetic fibers play a crucial role in modern society, impacting various aspects of daily life, industry, and the environment. ynthetic fibers are integral to modern life, offering a range of benefits from cost-effectiveness and versatility to innovative applications and performance characteristics. While they pose environmental challenges, ongoing research and development aim to create more sustainable and eco-friendly alternatives. Understanding the importance of synthetic fibers helps in appreciating their role in the economy, industry, and daily life, while also emphasizing the need for sustainable practices and innovation.
We all have good and bad thoughts from time to time and situation to situation. We are bombarded daily with spiraling thoughts(both negative and positive) creating all-consuming feel , making us difficult to manage with associated suffering. Good thoughts are like our Mob Signal (Positive thought) amidst noise(negative thought) in the atmosphere. Negative thoughts like noise outweigh positive thoughts. These thoughts often create unwanted confusion, trouble, stress and frustration in our mind as well as chaos in our physical world. Negative thoughts are also known as “distorted thinking”.
2. What We’ll Cover
FTP - why it should be the first tool in your web developer toolbox.
HTML basics, what's involved in writing it and understanding the
basic elements of a webpage.
Cascading Style Sheets (CSS) and how they control the
presentation of HTML.
Javascript and its role in user interaction, how it integrates and why
it matters.
Flash and what role it plays in presentation, interaction and the ups
and downs of using it.
PHP and ASP will be discussed in very general terms with an eye
toward use of dynamic pages and Content Management Systems.
3. But first, some background...
Basics of how the web works and how
your website fits into the big picture.
5. Host
User
Web
Page
Domain
Registry
DNR
IP address
00.00.00.00
ISP
Domain Name Registrars
HTTP request:
“www.sitename.com”
HTTP response
Database-driven website
PHP
Scripts
MySQL
Database
“LAMP”
• Linux
• Apache
• MySQL
• PHP
CMS – Content Management System
• WordPress
• Drupal
• Joomla
• many more
Advantages: Automation of navigation, easy to change overall site design (‘theme’)
Disadvantages: Speed / Server Load / Script conflicts (plugins)
6. FTP
FTP = File Transfer Protocol
This is the method you’ll use to move files to and from your host.
The better the tool integrates with your computer,
the easier it will be to publish your site changes.
There are web-based tools but I’ve found them inefficient.
Higher-end tools like Interarchy are blazing fast and support all the
special cases you’ll run into. ‘dot’ files being one of them.
Tight integration with your text editor can make editing easier.
Can be used to change file permissions.
7. Examples of FTP Programs
For Mac:
Interarchy
(http://nolobe.com/interarchy/)
Cyberduck
(http://cyberduck.ch/)
Transmit
(http://www.panic.com/transmit/)
For PC:
WS-FTP
(www.ipswitchft.com/)
FTP Explorer
(http://www.ftpx.com/)
Smart FTP
(http://www.smartftp.com/)
8. HOST
FTP in the scheme of things
HOST
Editor on local PC
Web
Page
F
T
P
Edit/Preview
within tool
Web
Page
F
T
P
Text editor / freestanding FTP Dreamweaver / IDE
Browser
View
http
9. GUI EDITORS - WYSIWYG
Dreamweaver
Beginners always seem to start with this. It’s a great tool.
The preview isn’t quite right, it’s slow, it’s big, it’s expensive.
Has a built-in FTP tool. Tight integration with Adobe CS.
FrontPage
Very common starting point on PC. Solid and serviceable.
Deep integration with Windows OS.
Plain-text editor
Cheap. Fast. Efficient. Reliable. Trustworthy. Multi-platform.
My choice – BBEdit for the Mac.
Downside: not quite as ‘helpful’ as GUI apps.
10. TEXT EDITORS
For Mac:
BBEdit
(http://www.barebones.com)
Text Wrangler
(http://www.barebones.com)
SubEthaEdit
(http://www.codingmonkeys.de/)
For PC:
NotePad++
(notepad-plus.sourceforge.net/)
Crimson (
www.crimsoneditor.com)
jEdit (http://www.jedit.org/)
11. HTML BASICS
HTML – Hyper Text Markup Language
HTML is a ‘markup’ language. It consists of TAGS: <b>This is bold</b> -
looks a lot like the pre-WYSIWYG wordprocessor ‘WordStar’. Browsers
interpret and ‘present’ the markup code.
Tags generally ‘open’ and ‘close’ – except for single-element tags like
<img>, <br> and <hr>.
Images and link paths can be ‘absolute’ or ‘relative’ – demo
For many years HTML page design was done using the <table> tag –
in the last decade CSS (Cascading Style Sheets) support in browsers has
improved to where object-oriented design techniques can be used,
separating design from content and allowing site-wide design changes
with minor edits.
12. HTML PAGE ELEMENTS
DOCTYPE – Rendering rules for HTML
HTML – Beginning of hypertext
HEAD – Title / Links / Scripts / Meta
BODY – The visible content of the page
15. CSS – CASCADING STYLESHEETS
Definitions of STYLES for HTML Elements
Rather than:
<p><font size=“3”>Doo Dah</font></p>
(as inline style)
<p style=“font-size:12px;”>Doo Dah</p>
(as line in stylesheet)
p { font-size:12px; }
Can also refer to DIVisions of a page.
(live demo)
17. Javascript
JavaScript is an object-oriented scripting language used to enable
programmatic access to objects within both the client application
and other applications. It is primarily used in the form of client-side
JavaScript, implemented as an integrated component of the web
browser, allowing the development of enhanced user interfaces and
dynamic websites.
- Wikipedia
18. JAVASCRIPT
Common uses:
• Form validation – check user input before submission
• Popups
• Hide/show page elements
• Image rollover swaps
Javascript can be placed in
• A command within a tag (MouseOver)
• The <head> portion of a document
• The <body> portion of a document
• An externally-referenced file
Frameworks – many commons functions are available as ‘frameworks’
19. FLASH
Flash allows the presentation of scalable, vector-based information.
It has numerous advantages but is not intended as a primary tool
for constructing general-purpose websites.
Here’s a few drawbacks:
• How do you bookmark your location? Not supported – all navigation is
absolute and programmatic.
• Requires an add-on to the browser. Largely supported but can be issue.
• Complex animations can run slowly on low-end machines, yielding low
framerates and jerky display.
Flash is a great tool to present an animated piece of content but care
should be taken to factor in user issues if the entire site will be built in it.
20. PHP and ASP – the dynamic duo
PHP – Hypertext Preprocessor – a
language designed to create HTML
using programming logic
ASP – Active Server Pages – the
Microsoft version of PHP.
21. Information Architecture
The blueprint that describes how
information is organized and structured.
The relative position of files and folders
The ‘concept’ behind your navigation
22. Product ...
Product 2
Home
About
Contact form
Products
Map
Staff list
Links
Products Order Form
about.html
contact.html
index.html
links.html
map.html
product_list.html
products (directory)
product1.html
product2.html
.
.
.
product-x.html
staff.html
store (directory)
order.html
validate.js
23. LEARNING RESOURCES
HTML Tutorial (http://www.w3schools.com/html/)
HTML Reference (http://www.w3schools.com/tags/)
HTML Validator (http://validator.w3.org/)
HTML Cheat Sheet (http://www.webmonkey.com/reference/HTML_Cheatsheet)
CSS Tutorial (http://www.w3schools.com/css/)
WestCiv CSS Guide (http://www.westciv.com/style_master/academy/css_tutorial/)
CSS Cheat Sheet (http://www.addedbytes.com/cheat-sheets/css-cheat-sheet/)
CSS Layouts Step-by-step (http://www.webreference.com/authoring/style/sheets/layout/advanced/)
Javascript Tutorial (http://www.w3schools.com/JS/default.asp)
24. TOOLS
4096 Color Wheel (http://www.ficml.org/jemimap/style/color/wheel.html
)
CSS Creator (http://www.csscreator.com/version2/pagelayout.php)
Layout-o-matic (http://www.inknoise.com/experimental/layoutomatic.php)
Little Boxes (http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html)
Entity Lookup (http://www.digitalmediaminute.com/reference/entity/index.php)
Stu Nicholls (http://www.cssplay.co.uk/)
Firebug (https://addons.mozilla.org/en-US/firefox/addon/1843)
25. CONTENT MANAGEMENT SYSTEMS
WordPress Blogging Community – set up a free blog and get used to
using WordPress in a controlled environment before ‘self-hosting’
(http://www.wordpress.com)
WordPress Developer Community – once you have your feet wet, get
your own domain name and host, then roll your own look feel
(http://www.wordpress.org)
Boulder Digital Arts courses on installing, managing and customizing
(http://www.boulderdigitalarts.com/training/details.asp?offering=216)
(http://www.boulderdigitalarts.com/training/details.asp?offering=217)
(http://www.boulderdigitalarts.com/training/details.asp?offering=235)
26. Q & A
M. Douglas Wray
http://www.macwebguru.com
macguiguru@spamcop.net