Web Development best practices
-
Upload
fadwa-gmiden -
Category
Technology
-
view
158 -
download
5
Transcript of Web Development best practices
Tunisian WebDev 2016Tunisian WebDev 2016
Web development
best practices
What do we keep missing?
1
Tunisian WebDev 2016Tunisian WebDev 2016
I am Fadwa Gmiden, but call me Daddou.
And I’m a maniac .
Ohayou
2
Tunisian WebDev 2016
#WebDevelopment
{
3
Tunisian WebDev 20164
Tunisian WebDev 2016
.Rules:nth-child(1)
{
Organization: Without it you’ll be lost, maybe worst...
5
}
Tunisian WebDev 2016
Workspace
6
Tunisian WebDev 2016
Code...
7
Tunisian WebDev 2016
The 10 Commandments of Code
DRY: Don’t repeat yourself
Write short Methods
Naming
One Class (Method), one Responsibility
Keep code organized
Test, test, test
Refractor
Comment the right number
Document your work
Code Reviews
8
Tunisian WebDev 2016
Those commands are your LIFE insurance
Always code as if the person who end-up maintaining your code is a violent psychopath who knows where you live…
Someone in the internet called JOSE
9
Tunisian WebDev 201610
Tunisian WebDev 2016
.Rules:nth-child(2)
{
Communication: You cannot not communicate. Every behaviour is kind of communication
[...], it is not possible not to communicate.
Paul Watzlawick, First Axiom of communication
}
11
Tunisian WebDev 2016
Communication Jobs
Communicate with your client...
Communicate with “users”...
Communicate with technologies...12
Tunisian WebDev 2016
5 W’s
� What Problem we’re solving?
� Why Does it solve the problem?
� Who Is the audience?
� Where Can we improve?
� How Can we build it?
13
Tunisian WebDev 201614
Tunisian WebDev 2016
.Rules:nth-child(3)
{
Technology choiceWeb apps are living things. It’s not as easy as handing the work to the
client and be done with it. This mindset is unrealistic and counterproductive.
15
}
Tunisian WebDev 2016
Raw, Platform, or Framework
16
Budget
needs
audience quantity
Frequencyproblem
evolution
Tunisian WebDev 201617
Tunisian WebDev 2016
.Rules:nth-child(4)
{
Design ConceptGood Design is problem solving… Jeffrey Veen
18
}
Tunisian WebDev 2016
Design Components
UX
UI
Graphic Design
19
Tunisian WebDev 2016
20
Paper & Pencil, Sketchy sketch
Sketching ideas
Wireframes lo-fi
Prototype hi-fi
Mockup hi-fi
Tunisian WebDev 201621
Less is more,
and simple means
one single core idea
Tunisian WebDev 2016
SEOhuh!?
22
Tunisian WebDev 2016
Things to keep in mind
� Phone, phone, phone…
� Typography
� Grids
� Accessibility
� Colors
� Content
� …23
Tunisian WebDev 2016
Do
Less is more
Visual for the eyes, but don’t forget the rest...
Think of details
24
Don’t
Be subjective...
Concentrate in research and forget the actual work…
Use Comic-sans Font at any cost
Tunisian WebDev 201625
Tunisian WebDev 201626
Tunisian WebDev 2016
.Rules:nth-child(5)
{
Authentic Design
27
}
Tunisian WebDev 2016
COPYCAT DESIGN
No!
No!!
Don’t even think a blink about it!
28
Tunisian WebDev 2016
} /*End*/
29
Tunisian WebDev 2016
*{Be Updated;}
30
Tunisian WebDev 2016
Ressources
52 weeks of UX
Refactoring
Icons & graphics from Slides Carnival
http://uxdesignweekly.com/
All the sites/blogs mentioned before...
31
Tunisian WebDev 2016
In the end...
Don’t forget about and
32
Tunisian WebDev 2016
Thanks
Any questions are welcome.
Email: [email protected]
LinkedIn: https://tn.linkedin.com/in/fadwagmiden
33